diff --git a/res/ui/building_icons/wireless_display.png b/res/ui/building_icons/wireless_display.png index 56548fde..2b2b5777 100644 Binary files a/res/ui/building_icons/wireless_display.png and b/res/ui/building_icons/wireless_display.png differ diff --git a/res/ui/building_tutorials/wireless_display-remote_control.png b/res/ui/building_tutorials/wireless_display-remote_control.png index 3048c9e3..0a629957 100644 Binary files a/res/ui/building_tutorials/wireless_display-remote_control.png and b/res/ui/building_tutorials/wireless_display-remote_control.png differ diff --git a/res/ui/building_tutorials/wireless_display.png b/res/ui/building_tutorials/wireless_display.png index 3048c9e3..2aa3595d 100644 Binary files a/res/ui/building_tutorials/wireless_display.png and b/res/ui/building_tutorials/wireless_display.png differ diff --git a/res_raw/sprites/blueprints/wireless_display-remote_control.png b/res_raw/sprites/blueprints/wireless_display-remote_control.png index f07d0276..304ad1af 100644 Binary files a/res_raw/sprites/blueprints/wireless_display-remote_control.png and b/res_raw/sprites/blueprints/wireless_display-remote_control.png differ diff --git a/res_raw/sprites/blueprints/wireless_display.png b/res_raw/sprites/blueprints/wireless_display.png index bb0319f2..20c4948e 100644 Binary files a/res_raw/sprites/blueprints/wireless_display.png and b/res_raw/sprites/blueprints/wireless_display.png differ diff --git a/res_raw/sprites/buildings/wireless_display-remote_control.png b/res_raw/sprites/buildings/wireless_display-remote_control.png index 86f15008..26e8dbd4 100644 Binary files a/res_raw/sprites/buildings/wireless_display-remote_control.png and b/res_raw/sprites/buildings/wireless_display-remote_control.png differ diff --git a/res_raw/sprites/buildings/wireless_display.png b/res_raw/sprites/buildings/wireless_display.png index ec7b95d9..0533d513 100644 Binary files a/res_raw/sprites/buildings/wireless_display.png and b/res_raw/sprites/buildings/wireless_display.png differ diff --git a/src/js/core/sprites.js b/src/js/core/sprites.js index 1019d8f7..f3b464f0 100644 --- a/src/js/core/sprites.js +++ b/src/js/core/sprites.js @@ -123,11 +123,11 @@ export class AtlasSprite extends BaseSprite { * @param {DrawParameters} parameters * @param {number} x * @param {number} y - * @param {number} size + * @param {number} size_x * @param {boolean=} clipping */ - drawCachedCentered(parameters, x, y, size, clipping = true) { - this.drawCached(parameters, x - size / 2, y - size / 2, size, size, clipping); + drawCachedCentered(parameters, x, y, size_x, clipping = true) { + this.drawCached(parameters, x - size_x / 2, y - size_x / 2, size_x, size_x, clipping); } /** diff --git a/src/js/game/buildings/wireless_display.js b/src/js/game/buildings/wireless_display.js index f0779ff5..93a1bb54 100644 --- a/src/js/game/buildings/wireless_display.js +++ b/src/js/game/buildings/wireless_display.js @@ -31,7 +31,7 @@ export class MetaWirelessDisplayBuilding extends MetaBuilding { * @param {GameRoot} root */ getIsUnlocked(root) { - return true //root.hubGoals.isRewardUnlocked(enumHubGoalRewards.reward_display); + return root.hubGoals.isRewardUnlocked(enumHubGoalRewards.reward_display); } /** diff --git a/src/js/game/hud/parts/mass_selector.js b/src/js/game/hud/parts/mass_selector.js index 08a11769..c6e03e2f 100644 --- a/src/js/game/hud/parts/mass_selector.js +++ b/src/js/game/hud/parts/mass_selector.js @@ -14,6 +14,7 @@ import { KEYMAPPINGS } from "../../key_action_mapper"; import { THEME } from "../../theme"; import { enumHubGoalRewards } from "../../tutorial_goals"; import { Blueprint } from "../../blueprint"; +import { drawRotatedSprite } from "../../../core/draw_utils"; const logger = createLogger("hud/mass_selector"); @@ -304,16 +305,9 @@ export class HUDMassSelector extends BaseHUDPart { renderedUids.add(uid); const staticComp = contents.components.StaticMapEntity; - const bounds = staticComp.getTileSpaceBounds(); - parameters.context.beginRoundedRect( - bounds.x * globalConfig.tileSize + boundsBorder, - bounds.y * globalConfig.tileSize + boundsBorder, - bounds.w * globalConfig.tileSize - 2 * boundsBorder, - bounds.h * globalConfig.tileSize - 2 * boundsBorder, - 2 - ); - parameters.context.fill(); + staticComp.drawSpriteOnBoundsClipped(parameters, staticComp.getBlueprintSprite(), 0); } + parameters.context.globalAlpha = 1; } } } @@ -322,15 +316,8 @@ export class HUDMassSelector extends BaseHUDPart { this.selectedUids.forEach(uid => { const entity = this.root.entityMgr.findByUid(uid); const staticComp = entity.components.StaticMapEntity; - const bounds = staticComp.getTileSpaceBounds(); - parameters.context.beginRoundedRect( - bounds.x * globalConfig.tileSize + boundsBorder, - bounds.y * globalConfig.tileSize + boundsBorder, - bounds.w * globalConfig.tileSize - 2 * boundsBorder, - bounds.h * globalConfig.tileSize - 2 * boundsBorder, - 2 - ); - parameters.context.fill(); + + staticComp.drawSpriteOnBoundsClipped(parameters, staticComp.getBlueprintSprite(), 0); }); } } diff --git a/src/js/game/hud/parts/wires_toolbar.js b/src/js/game/hud/parts/wires_toolbar.js index 5141bbeb..f5d0c5a3 100644 --- a/src/js/game/hud/parts/wires_toolbar.js +++ b/src/js/game/hud/parts/wires_toolbar.js @@ -11,6 +11,7 @@ import { MetaComparatorBuilding } from "../../buildings/comparator"; import { MetaReaderBuilding } from "../../buildings/reader"; import { MetaFilterBuilding } from "../../buildings/filter"; import { MetaDisplayBuilding } from "../../buildings/display"; +import { MetaWirelessDisplayBuilding } from "../../buildings/wireless_display"; import { MetaStorageBuilding } from "../../buildings/storage"; export class HUDWiresToolbar extends HUDBaseToolbar { @@ -32,6 +33,7 @@ export class HUDWiresToolbar extends HUDBaseToolbar { MetaLeverBuilding, MetaFilterBuilding, MetaDisplayBuilding, + MetaWirelessDisplayBuilding, ], visibilityCondition: () => !this.root.camera.getIsMapOverlayActive() && this.root.currentLayer === "wires", diff --git a/src/js/game/systems/wireless_display.js b/src/js/game/systems/wireless_display.js index 53ed572a..25e83d6c 100644 --- a/src/js/game/systems/wireless_display.js +++ b/src/js/game/systems/wireless_display.js @@ -14,6 +14,7 @@ import { fillInLinkIntoTranslation } from "../../core/utils"; import { T } from "../../translations"; import { Entity } from "../entity"; import { WirelessCodeComponent } from "../components/wireless_code"; +import { THEME} from "../theme"; export class WirelessDisplaySystem extends GameSystemWithFilter { constructor(root) { @@ -47,6 +48,7 @@ export class WirelessDisplaySystem extends GameSystemWithFilter { } this.entityCount = this.allEntities.length; } + const mousePos = this.root.app.mousePosition; } /** @@ -159,6 +161,48 @@ export class WirelessDisplaySystem extends GameSystemWithFilter { } } + /** + * Computes the color below the current tile + * @returns {number} + */ + computeColorBelowTile() { + const mousePosition = this.root.app.mousePosition; + if (!mousePosition) { + // Not on screen + return null; + } + + const worldPos = this.root.camera.screenToWorld(mousePosition); + const tile = worldPos.toTileSpace(); + const contents = this.root.map.getTileContent(tile, "regular"); + + if (contents && contents.components.WirelessDisplay) { + // We hovered a lower layer, show the color there + if (contents && contents.components.WirelessCode && contents.components.WirelessCode.wireless_code) { + return contents.components.WirelessCode.wireless_code; + } + } + + return null; + } + + /** + * Draws Text Storked + * @param {string} text + * @param {number} y + * @param {number} x + * @param {number=} width + */ + drawStroked(ctx, text, x, y, width = undefined) { + ctx.font = '15px Sans-serif'; + ctx.strokeStyle = 'black'; + ctx.lineWidth = 1; + ctx.miterLimit=2 + ctx.strokeText(text, x, y, width); + ctx.fillStyle = 'white'; + ctx.fillText(text, x, y, width); + } + /** * Draws a given chunk * @param {import("../../core/draw_utils").DrawParameters} parameters @@ -168,42 +212,57 @@ export class WirelessDisplaySystem extends GameSystemWithFilter { const contents = chunk.containedEntitiesByLayer.regular; for (let i = 0; i < contents.length; ++i) { const entity_a = contents[i]; - if (entity_a && !entity_a.components.WiredPins && entity_a.components.WirelessDisplay && entity_a.components.WirelessCode) { - const entity_b = this.wirelessMachineList[entity_a.components.WirelessCode["wireless_code"]]; - if (entity_b) { - if (!this.allEntities.includes(entity_b)) { - this.wirelessMachineList[entity_b] = undefined; - return; - } - const origin = entity_a.components.StaticMapEntity.origin; - const pinsComp = entity_b.components.WiredPins; - const network = pinsComp.slots[0].linkedNetwork; - - if (!network) { - continue; - } - - const value = this.getDisplayItem(network.currentValue); - - if (!value) { - continue; - } - - if (value.getItemType()) { - if (value.getItemType() === "color") { - this.displaySprites[/** @type {ColorItem} */ (value).color].drawCachedCentered( - parameters, - (origin.x + 0.5) * globalConfig.tileSize, - (origin.y + 0.5) * globalConfig.tileSize, - globalConfig.tileSize - ); - } else if (value.getItemType() === "shape") { - value.drawItemCenteredClipped( - (origin.x + 0.5) * globalConfig.tileSize, - (origin.y + 0.5) * globalConfig.tileSize, - parameters, - 30 - ); + if (entity_a && entity_a.components.WirelessDisplay) { + const below = this.computeColorBelowTile(); + if (below) { + // We have something below our tile + const mousePosition = this.root.app.mousePosition; + const worldPos = this.root.camera.screenToWorld(mousePosition); + const tile = worldPos.toTileSpace().toWorldSpace(); + + this.drawStroked(parameters.context, below.toString(), worldPos.x + 5, worldPos.y + 5) + parameters.context.strokeStyle = THEME.map.colorBlindPickerTile; + parameters.context.beginPath(); + parameters.context.rect(tile.x, tile.y, globalConfig.tileSize, globalConfig.tileSize); + parameters.context.stroke(); + } + if (!entity_a.components.WiredPins) { + const entity_b = this.wirelessMachineList[entity_a.components.WirelessCode["wireless_code"]]; + if (entity_b) { + if (!this.allEntities.includes(entity_b)) { + this.wirelessMachineList[entity_b] = undefined; + return; + } + const origin = entity_a.components.StaticMapEntity.origin; + const pinsComp = entity_b.components.WiredPins; + const network = pinsComp.slots[0].linkedNetwork; + + if (!network) { + continue; + } + + const value = this.getDisplayItem(network.currentValue); + + if (!value) { + continue; + } + + if (value.getItemType()) { + if (value.getItemType() === "color") { + this.displaySprites[/** @type {ColorItem} */ (value).color].drawCachedCentered( + parameters, + (origin.x + 0.5) * globalConfig.tileSize, + (origin.y + 0.5) * globalConfig.tileSize, + globalConfig.tileSize + ); + } else if (value.getItemType() === "shape") { + value.drawItemCenteredClipped( + (origin.x + 0.5) * globalConfig.tileSize, + (origin.y + 0.5) * globalConfig.tileSize, + parameters, + 30 + ); + } } } } diff --git a/translations/base-en.yaml b/translations/base-en.yaml index 269f5478..b66a19c5 100644 --- a/translations/base-en.yaml +++ b/translations/base-en.yaml @@ -706,10 +706,10 @@ buildings: wireless_display: default: name: &wireless_display Wireless Display - description: Connect a signal to show it on the display - It can be a shape, color or boolean. + description: Connect to a channel and if channel connects, it receives the signal coming from Remote Control - Signal can be a shape, color or boolean. remote_control: - name: OR Gate - description: Emits a boolean "1" if one of the inputs is truthy. (Truthy means shape, color or boolean "1") + name: Remote Control + description: Connect to a channel and if channel connects, it emits signal to Wireless Control - Signal can be a shape, color or boolean. reader: default: