Fixed "on" and "hover" layers being in back of children objects
This commit is contained in:
parent
69a65b0735
commit
a2e40d2b91
2
TODO.md
2
TODO.md
|
@ -24,8 +24,6 @@ Map/story
|
||||||
Character sheet
|
Character sheet
|
||||||
---------------
|
---------------
|
||||||
|
|
||||||
* Fix the hover/on not working on fleet members
|
|
||||||
* Improve tooltip content
|
|
||||||
* Replace the close icon by a validation icon in creation view
|
* Replace the close icon by a validation icon in creation view
|
||||||
* Allow to change/buy ship model
|
* Allow to change/buy ship model
|
||||||
* Allow to rename a personality (in creation view only)
|
* Allow to rename a personality (in creation view only)
|
||||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 474 B |
Binary file not shown.
Before Width: | Height: | Size: 474 B After Width: | Height: | Size: 5.8 KiB |
|
@ -23,6 +23,26 @@
|
||||||
enable-background="new">
|
enable-background="new">
|
||||||
<defs
|
<defs
|
||||||
id="defs6038">
|
id="defs6038">
|
||||||
|
<linearGradient
|
||||||
|
inkscape:collect="always"
|
||||||
|
id="linearGradient5133">
|
||||||
|
<stop
|
||||||
|
style="stop-color:#3b526d;stop-opacity:1"
|
||||||
|
offset="0"
|
||||||
|
id="stop5129" />
|
||||||
|
<stop
|
||||||
|
id="stop5137"
|
||||||
|
offset="0.14413227"
|
||||||
|
style="stop-color:#8d9bac;stop-opacity:1" />
|
||||||
|
<stop
|
||||||
|
style="stop-color:#4d5e74;stop-opacity:0.14509805"
|
||||||
|
offset="0.50630873"
|
||||||
|
id="stop5464" />
|
||||||
|
<stop
|
||||||
|
style="stop-color:#b8bbbf;stop-opacity:0;"
|
||||||
|
offset="1"
|
||||||
|
id="stop5131" />
|
||||||
|
</linearGradient>
|
||||||
<linearGradient
|
<linearGradient
|
||||||
id="linearGradient4877"
|
id="linearGradient4877"
|
||||||
inkscape:collect="always">
|
inkscape:collect="always">
|
||||||
|
@ -791,19 +811,6 @@
|
||||||
result="composite2"
|
result="composite2"
|
||||||
id="feComposite15041" />
|
id="feComposite15041" />
|
||||||
</filter>
|
</filter>
|
||||||
<filter
|
|
||||||
inkscape:collect="always"
|
|
||||||
style="color-interpolation-filters:sRGB"
|
|
||||||
id="filter5187"
|
|
||||||
x="-0.0612"
|
|
||||||
width="1.1224"
|
|
||||||
y="-0.0612"
|
|
||||||
height="1.1224">
|
|
||||||
<feGaussianBlur
|
|
||||||
inkscape:collect="always"
|
|
||||||
stdDeviation="2.8930907"
|
|
||||||
id="feGaussianBlur5189" />
|
|
||||||
</filter>
|
|
||||||
<marker
|
<marker
|
||||||
id="Arrow2Sstart"
|
id="Arrow2Sstart"
|
||||||
inkscape:isstock="true"
|
inkscape:isstock="true"
|
||||||
|
@ -870,6 +877,29 @@
|
||||||
result="composite2"
|
result="composite2"
|
||||||
id="feComposite13787-2" />
|
id="feComposite13787-2" />
|
||||||
</filter>
|
</filter>
|
||||||
|
<linearGradient
|
||||||
|
inkscape:collect="always"
|
||||||
|
xlink:href="#linearGradient5133"
|
||||||
|
id="linearGradient5135"
|
||||||
|
x1="369.46329"
|
||||||
|
y1="828.38304"
|
||||||
|
x2="398.45467"
|
||||||
|
y2="828.38304"
|
||||||
|
gradientUnits="userSpaceOnUse"
|
||||||
|
gradientTransform="translate(-0.39187887,1.866899)" />
|
||||||
|
<filter
|
||||||
|
inkscape:collect="always"
|
||||||
|
style="color-interpolation-filters:sRGB"
|
||||||
|
id="filter5460"
|
||||||
|
x="-0.0336"
|
||||||
|
width="1.0672"
|
||||||
|
y="-0.0336"
|
||||||
|
height="1.0672">
|
||||||
|
<feGaussianBlur
|
||||||
|
inkscape:collect="always"
|
||||||
|
stdDeviation="1.848"
|
||||||
|
id="feGaussianBlur5462" />
|
||||||
|
</filter>
|
||||||
</defs>
|
</defs>
|
||||||
<sodipodi:namedview
|
<sodipodi:namedview
|
||||||
id="base"
|
id="base"
|
||||||
|
@ -878,11 +908,11 @@
|
||||||
borderopacity="1.0"
|
borderopacity="1.0"
|
||||||
inkscape:pageopacity="0"
|
inkscape:pageopacity="0"
|
||||||
inkscape:pageshadow="2"
|
inkscape:pageshadow="2"
|
||||||
inkscape:zoom="0.5"
|
inkscape:zoom="0.99999999"
|
||||||
inkscape:cx="984.86575"
|
inkscape:cx="431.75594"
|
||||||
inkscape:cy="573.79438"
|
inkscape:cy="487.22659"
|
||||||
inkscape:document-units="px"
|
inkscape:document-units="px"
|
||||||
inkscape:current-layer="layer4"
|
inkscape:current-layer="layer1"
|
||||||
showgrid="false"
|
showgrid="false"
|
||||||
units="px"
|
units="px"
|
||||||
showborder="true"
|
showborder="true"
|
||||||
|
@ -1643,7 +1673,7 @@
|
||||||
height="128"
|
height="128"
|
||||||
x="230"
|
x="230"
|
||||||
y="766.25"
|
y="766.25"
|
||||||
inkscape:export-filename="/home/michael/workspace/perso/spacetac/graphics/exported/character/portrait-on.png"
|
inkscape:export-filename="/home/michael/workspace/perso/spacetac/graphics/exported/character/portrait-hover.png"
|
||||||
inkscape:export-xdpi="96"
|
inkscape:export-xdpi="96"
|
||||||
inkscape:export-ydpi="96" />
|
inkscape:export-ydpi="96" />
|
||||||
<text
|
<text
|
||||||
|
@ -1668,16 +1698,6 @@
|
||||||
x="731.63831"
|
x="731.63831"
|
||||||
y="65.749977"
|
y="65.749977"
|
||||||
style="font-size:21.33333397px;fill:#a0afc3;fill-opacity:1">Actions</tspan></text>
|
style="font-size:21.33333397px;fill:#a0afc3;fill-opacity:1">Actions</tspan></text>
|
||||||
<rect
|
|
||||||
inkscape:export-ydpi="96"
|
|
||||||
inkscape:export-xdpi="96"
|
|
||||||
inkscape:export-filename="/home/michael/workspace/perso/spacetac/graphics/exported/character/portrait-hover.png"
|
|
||||||
y="773.52264"
|
|
||||||
x="378.34415"
|
|
||||||
height="113.45454"
|
|
||||||
width="113.45454"
|
|
||||||
id="rect4873"
|
|
||||||
style="opacity:0.67099998;fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:3.54500008;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;filter:url(#filter5187)" />
|
|
||||||
<rect
|
<rect
|
||||||
inkscape:export-ydpi="96"
|
inkscape:export-ydpi="96"
|
||||||
inkscape:export-xdpi="96"
|
inkscape:export-xdpi="96"
|
||||||
|
@ -1688,6 +1708,70 @@
|
||||||
width="128"
|
width="128"
|
||||||
id="rect4875"
|
id="rect4875"
|
||||||
style="fill:none;fill-rule:evenodd;stroke:#4d5156;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.45319148" />
|
style="fill:none;fill-rule:evenodd;stroke:#4d5156;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.45319148" />
|
||||||
|
<g
|
||||||
|
id="g5262"
|
||||||
|
inkscape:export-filename="/home/michael/workspace/perso/spacetac/graphics/exported/character/portrait-on.png"
|
||||||
|
inkscape:export-xdpi="96"
|
||||||
|
inkscape:export-ydpi="96">
|
||||||
|
<use
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
xlink:href="#g5157"
|
||||||
|
id="use5266"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
transform="matrix(0.93560606,0,0,0.93560606,28.015962,53.463064)"
|
||||||
|
style="opacity:0.61699997;filter:url(#filter5460)" />
|
||||||
|
<g
|
||||||
|
id="g5157">
|
||||||
|
<path
|
||||||
|
style="fill:url(#linearGradient5135);fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||||
|
d="m 369.07141,784.11122 4.35793,0.19749 24.63345,9.34845 v 73.18556 l -24.89158,9.61022 -4.0998,-0.0643 z"
|
||||||
|
id="rect5126"
|
||||||
|
inkscape:connector-curvature="0"
|
||||||
|
sodipodi:nodetypes="ccccccc" />
|
||||||
|
<use
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
xlink:href="#rect5126"
|
||||||
|
id="use5147"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
transform="matrix(-1,0,0,1,870.14282,0)" />
|
||||||
|
<use
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
xlink:href="#rect5126"
|
||||||
|
id="use5149"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
transform="rotate(90,435.07142,830.24994)" />
|
||||||
|
<use
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
xlink:href="#rect5126"
|
||||||
|
id="use5151"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
transform="rotate(-90,435.07141,830.24993)" />
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<use
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
xlink:href="#g5262"
|
||||||
|
id="use5474"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
transform="translate(141.0715,1.9072266e-5)" />
|
||||||
|
<use
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
xlink:href="#rect13891"
|
||||||
|
id="use5476"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
transform="translate(282.14291,-5.0927734e-5)" />
|
||||||
</g>
|
</g>
|
||||||
<g
|
<g
|
||||||
inkscape:groupmode="layer"
|
inkscape:groupmode="layer"
|
||||||
|
|
Before Width: | Height: | Size: 95 KiB After Width: | Height: | Size: 98 KiB |
|
@ -14,7 +14,6 @@ module TK.SpaceTac.UI {
|
||||||
button.anchor.set(0.5);
|
button.anchor.set(0.5);
|
||||||
|
|
||||||
builder.in(button, builder => {
|
builder.in(button, builder => {
|
||||||
// FIXME Under hover/on
|
|
||||||
let portrait = builder.image(`ship-${this.ship.model.code}-portrait`, 0, 0, true);
|
let portrait = builder.image(`ship-${this.ship.model.code}-portrait`, 0, 0, true);
|
||||||
portrait.scale.set(0.5);
|
portrait.scale.set(0.5);
|
||||||
});
|
});
|
||||||
|
|
|
@ -256,7 +256,7 @@ module TK.SpaceTac.UI {
|
||||||
|
|
||||||
let builder = this.builder.in(this.group_portraits);
|
let builder = this.builder.in(this.group_portraits);
|
||||||
fleet.ships.forEach((ship, idx) => {
|
fleet.ships.forEach((ship, idx) => {
|
||||||
let button: UIButton
|
let button: UIButton;
|
||||||
button = new CharacterPortrait(ship).draw(builder, 64 + idx * 140, 64, () => {
|
button = new CharacterPortrait(ship).draw(builder, 64 + idx * 140, 64, () => {
|
||||||
if (button) {
|
if (button) {
|
||||||
builder.select(button);
|
builder.select(button);
|
||||||
|
@ -267,6 +267,10 @@ module TK.SpaceTac.UI {
|
||||||
this.refreshUpgrades();
|
this.refreshUpgrades();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if (ship == this.ship) {
|
||||||
|
builder.switch(button, true);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -122,6 +122,14 @@ module TK.SpaceTac.UI {
|
||||||
private add(child: UIText | UIImage | UIButton | UIContainer): void {
|
private add(child: UIText | UIImage | UIButton | UIContainer): void {
|
||||||
if (this.parent instanceof Phaser.Group) {
|
if (this.parent instanceof Phaser.Group) {
|
||||||
this.parent.add(child);
|
this.parent.add(child);
|
||||||
|
} else if (this.parent instanceof Phaser.Button) {
|
||||||
|
// Protect the "on" and "hover" layers
|
||||||
|
let layer = first(this.parent.children, child => child instanceof Phaser.Image && (child.name == "*on*" || child.name == "*hover*"));
|
||||||
|
if (layer) {
|
||||||
|
this.parent.addChildAt(child, this.parent.getChildIndex(layer));
|
||||||
|
} else {
|
||||||
|
this.parent.addChild(child);
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
this.parent.addChild(child);
|
this.parent.addChild(child);
|
||||||
}
|
}
|
||||||
|
@ -208,6 +216,7 @@ module TK.SpaceTac.UI {
|
||||||
let on_info = this.view.getImageInfo(options.on_name || (name + "-on"));
|
let on_info = this.view.getImageInfo(options.on_name || (name + "-on"));
|
||||||
if (on_info.exists) {
|
if (on_info.exists) {
|
||||||
on_mask = new Phaser.Image(this.game, 0, 0, on_info.key, on_info.frame);
|
on_mask = new Phaser.Image(this.game, 0, 0, on_info.key, on_info.frame);
|
||||||
|
on_mask.name = "*on*";
|
||||||
on_mask.visible = false;
|
on_mask.visible = false;
|
||||||
result.addChild(on_mask);
|
result.addChild(on_mask);
|
||||||
}
|
}
|
||||||
|
@ -227,6 +236,7 @@ module TK.SpaceTac.UI {
|
||||||
let hover_mask: Phaser.Image | null = null;
|
let hover_mask: Phaser.Image | null = null;
|
||||||
if (hover_info.exists) {
|
if (hover_info.exists) {
|
||||||
hover_mask = new Phaser.Image(this.game, 0, 0, hover_info.key, hover_info.frame);
|
hover_mask = new Phaser.Image(this.game, 0, 0, hover_info.key, hover_info.frame);
|
||||||
|
hover_mask.name = "*hover*";
|
||||||
hover_mask.visible = false;
|
hover_mask.visible = false;
|
||||||
result.addChild(hover_mask);
|
result.addChild(hover_mask);
|
||||||
}
|
}
|
||||||
|
@ -252,8 +262,7 @@ module TK.SpaceTac.UI {
|
||||||
() => {
|
() => {
|
||||||
if (onclick) {
|
if (onclick) {
|
||||||
onclick();
|
onclick();
|
||||||
}
|
} else if (onoffcallback) {
|
||||||
if (onoffcallback) {
|
|
||||||
this.switch(result, !onstatus);
|
this.switch(result, !onstatus);
|
||||||
}
|
}
|
||||||
}, 100);
|
}, 100);
|
||||||
|
|
|
@ -147,7 +147,7 @@ module TK.SpaceTac.UI {
|
||||||
if (!(background.width && background.data.bg_bounds && UITools.compareRects(background.data.bg_bounds, bounds))) {
|
if (!(background.width && background.data.bg_bounds && UITools.compareRects(background.data.bg_bounds, bounds))) {
|
||||||
background.clear();
|
background.clear();
|
||||||
background.lineStyle(2, 0x404450);
|
background.lineStyle(2, 0x404450);
|
||||||
background.beginFill(0x202225, 0.9);
|
background.beginFill(0x202225);
|
||||||
background.drawRect(x, y, width, height);
|
background.drawRect(x, y, width, height);
|
||||||
background.endFill();
|
background.endFill();
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue