alois/OpenFrontIO
1
0
Fork 0
mirror of https://github.com/openfrontio/OpenFrontIO.git synced 2026-06-21 11:10:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

add disabled icon to radial menu

Browse Source
This commit is contained in:
evanpelle
2024-10-06 13:05:42 -07:00
parent ec032bb758
commit 59036d0b1e
4 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
TODO.txt
+4 -2
View File
@@ -156,8 +156,10 @@
* BUG: center button should be disabled select island DONE 10/2/2024
* BUG: boat icon appears when click inland DONE 10/2/2024
* Auto deploy to dev on commit DONE 10/2/2024
* add emoji button
* make disabled icon crossed out icon
* add emoji button DONE 10/4/2024
* make disabled icon crossed out icon DONE 10/6/2024
* disable select on mobile
* disable double tap on mobile
* donate troops button
* Make fake humans spawn by their country
* BUG: double tap zooms on mobile
resources/countries.txt
+4
View File
@@ -0,0 +1,4 @@
clicked cell Cell[375,272] USA
clicked cell Cell[372,136] Canada
clicked cell Cell[375,374] Mexico
clicked cell Cell[500,378] Cuba
resources/images/DisabledIcon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.3 KiB

src/client/graphics/layers/RadialMenu.ts
+6 -6
View File
@@ -14,6 +14,7 @@ import boatIcon from '../../../../resources/images/BoatIconWhite.png';
import swordIcon from '../../../../resources/images/SwordIconWhite.png';
import targetIcon from '../../../../resources/images/TargetIconWhite.png';
import emojiIcon from '../../../../resources/images/EmojiIconWhite.png';
import disabledIcon from '../../../../resources/images/DisabledIcon.png';
enum Slot {
@@ -29,10 +30,10 @@ export class RadialMenu implements Layer {
private menuElement: d3.Selection<HTMLDivElement, unknown, null, undefined>;
private isVisible: boolean = false;
private readonly menuItems = new Map([
[Slot.Alliance, {name: "alliance", disabled: true, action: () => { }, color: null, icon: null, defaultIcon: allianceIcon}],
[Slot.Boat, {name: "boat", disabled: true, action: () => { }, color: null, icon: null, defaultIcon: boatIcon}],
[Slot.Target, {name: "target", disabled: true, action: () => { }, defaultIcon: targetIcon}],
[Slot.Emoji, {name: "emoji", disabled: true, action: () => { }, defaultIcon: emojiIcon}],
[Slot.Alliance, {name: "alliance", disabled: true, action: () => { }, color: null, icon: null}],
[Slot.Boat, {name: "boat", disabled: true, action: () => { }, color: null, icon: null}],
[Slot.Target, {name: "target", disabled: true, action: () => { }}],
[Slot.Emoji, {name: "emoji", disabled: true, action: () => { }}],
]);
private readonly menuSize = 190;
@@ -243,7 +244,6 @@ export class RadialMenu implements Layer {
this.renderCenterButton(false)
for (const item of this.menuItems.values()) {
item.disabled = true
item.icon = item.defaultIcon
this.updateMenuItemState(item)
}
@@ -427,7 +427,7 @@ export class RadialMenu implements Layer {
.style('opacity', item.disabled ? 0.5 : 1);
this.menuElement.select(`image[data-name="${item.name}"]`)
.attr('xlink:href', item.icon || item.defaultIcon)
.attr('xlink:href', item.disabled ? disabledIcon : item.icon)
.attr('fill', item.disabled ? '#999999' : 'white');
}