Further take on logic wires

res_raw/atlas.tps

@@ -256,6 +256,8 @@
             <key type="filename">sprites/buildings/rotater.png</key>
             <key type="filename">sprites/buildings/trash.png</key>
             <key type="filename">sprites/misc/wires_overlay_tile.png</key>
+            <key type="filename">sprites/wires/logical_acceptor.png</key>
+            <key type="filename">sprites/wires/logical_ejector.png</key>
             <struct type="IndividualSpriteSettings">
                 <key>pivotPoint</key>
                 <point_f>0.5,0.5</point_f>
@@ -354,9 +356,15 @@
             <key type="filename">sprites/blueprints/belt_left.png</key>
             <key type="filename">sprites/blueprints/belt_right.png</key>
             <key type="filename">sprites/blueprints/belt_top.png</key>
+            <key type="filename">sprites/blueprints/wire-split.png</key>
+            <key type="filename">sprites/blueprints/wire-turn.png</key>
+            <key type="filename">sprites/blueprints/wire.png</key>
             <key type="filename">sprites/buildings/belt_left.png</key>
             <key type="filename">sprites/buildings/belt_right.png</key>
             <key type="filename">sprites/buildings/belt_top.png</key>
+            <key type="filename">sprites/buildings/wire-split.png</key>
+            <key type="filename">sprites/buildings/wire-turn.png</key>
+            <key type="filename">sprites/buildings/wire.png</key>
             <struct type="IndividualSpriteSettings">
                 <key>pivotPoint</key>
                 <point_f>0.5,0.5</point_f>
@@ -513,9 +521,6 @@
             </struct>
             <key type="filename">sprites/debug/acceptor_slot.png</key>
             <key type="filename">sprites/debug/ejector_slot.png</key>
-            <key type="filename">sprites/map_overview/belt_forward.png</key>
-            <key type="filename">sprites/map_overview/belt_left.png</key>
-            <key type="filename">sprites/map_overview/belt_right.png</key>
             <key type="filename">sprites/misc/hub_direction_indicator.png</key>
             <key type="filename">sprites/misc/waypoint.png</key>
             <struct type="IndividualSpriteSettings">

src/css/icons.scss

@@ -1,4 +1,4 @@
-$buildings: belt, cutter, miner, mixer, painter, rotater, splitter, stacker, trash, underground_belt;
+$buildings: belt, cutter, miner, mixer, painter, rotater, splitter, stacker, trash, underground_belt, wire;
 
 @each $building in $buildings {
     [data-icon="building_icons/#{$building}.png"] {

src/js/game/buildings/belt_base.js

@@ -9,7 +9,7 @@ import { GameRoot } from "../root";
 
 export const arrayBeltVariantToRotation = [enumDirection.top, enumDirection.left, enumDirection.right];
 
-const overlayMatrices = {
+export const beltOverlayMatrices = {
     [enumDirection.top]: {
         0: [0, 1, 0, 0, 1, 0, 0, 1, 0],
         90: [0, 0, 0, 1, 1, 1, 0, 0, 0],
@@ -75,7 +75,7 @@ export class MetaBeltBaseBuilding extends MetaBuilding {
      * @param {Entity} entity
      */
     getSpecialOverlayRenderMatrix(rotation, rotationVariant, variant, entity) {
-        return overlayMatrices[entity.components.Belt.direction][rotation];
+        return beltOverlayMatrices[entity.components.Belt.direction][rotation];
     }
 
     /**

src/js/game/buildings/hub.js

@@ -54,7 +54,7 @@ export class MetaHubBuilding extends MetaBuilding {
             new WiredPinsComponent({
                 slots: [
                     {
-                        pos: new Vector(0, 0),
+                        pos: new Vector(3, 0),
                         type: enumPinSlotType.logicalEjector,
                         direction: enumDirection.top,
                     },

src/js/game/buildings/underground_belt.js

@@ -29,17 +29,17 @@ const overlayMatrices = [
     // Sender
     {
         0: [1, 1, 1, 0, 1, 0, 0, 1, 0],
-        90: [0, 0, 0, 1, 1, 1, 0, 0, 0],
-        180: [0, 1, 0, 0, 1, 0, 0, 1, 0],
-        270: [0, 0, 0, 1, 1, 1, 0, 0, 0],
+        90: [0, 0, 1, 1, 1, 1, 0, 0, 1],
+        180: [0, 1, 0, 0, 1, 0, 1, 1, 1],
+        270: [1, 0, 0, 1, 1, 1, 1, 0, 0],
     },
 
     // Receiver
     {
         0: [0, 1, 0, 0, 1, 0, 1, 1, 1],
-        90: [0, 1, 0, 1, 1, 0, 0, 0, 0],
-        180: [0, 1, 0, 0, 1, 1, 0, 0, 0],
-        270: [0, 0, 0, 0, 1, 1, 0, 1, 0],
+        90: [1, 0, 0, 1, 1, 1, 1, 0, 0],
+        180: [1, 1, 1, 0, 1, 0, 0, 1, 0],
+        270: [0, 0, 1, 1, 1, 1, 0, 0, 1],
     },
 ];
 

src/js/game/buildings/wire.js

@@ -0,0 +1,111 @@
+import { Vector } from "../../core/vector";
+import { SOUNDS } from "../../platform/sound";
+import { enumWireType, WireComponent } from "../components/wire";
+import { Entity } from "../entity";
+import { MetaBuilding } from "../meta_building";
+import { enumLayer, GameRoot } from "../root";
+import { beltOverlayMatrices } from "./belt_base";
+
+export const arrayWireRotationVariantToType = [enumWireType.regular, enumWireType.turn, enumWireType.split];
+
+export const wireOverlayMatrices = {
+    [enumWireType.regular]: {
+        0: [0, 1, 0, 0, 1, 0, 0, 1, 0],
+        90: [0, 0, 0, 1, 1, 1, 0, 0, 0],
+        180: [0, 1, 0, 0, 1, 0, 0, 1, 0],
+        270: [0, 0, 0, 1, 1, 1, 0, 0, 0],
+    },
+
+    [enumWireType.split]: {
+        0: [0, 0, 0, 1, 1, 1, 0, 1, 0],
+        90: [0, 1, 0, 1, 1, 0, 0, 1, 0],
+        180: [0, 1, 0, 1, 1, 1, 0, 0, 0],
+        270: [0, 1, 0, 0, 1, 1, 0, 1, 0],
+    },
+
+    [enumWireType.turn]: {
+        0: [0, 0, 0, 0, 1, 1, 0, 1, 0],
+        90: [0, 0, 0, 1, 1, 0, 0, 1, 0],
+        180: [0, 1, 0, 1, 1, 0, 0, 0, 0],
+        270: [0, 1, 0, 0, 1, 1, 0, 0, 0],
+    },
+};
+
+export class MetaWireBuilding extends MetaBuilding {
+    constructor() {
+        super("wire");
+    }
+
+    getHasDirectionLockAvailable() {
+        return true;
+    }
+
+    getSilhouetteColor() {
+        return "#25fff2";
+    }
+
+    getDimensions() {
+        return new Vector(1, 1);
+    }
+
+    getStayInPlacementMode() {
+        return true;
+    }
+
+    getPlacementSound() {
+        return SOUNDS.placeBelt;
+    }
+
+    getRotateAutomaticallyWhilePlacing() {
+        return true;
+    }
+
+    getLayer() {
+        return enumLayer.wires;
+    }
+
+    getSprite() {
+        return null;
+    }
+
+    getIsReplaceable() {
+        return true;
+    }
+
+    /**
+     * @param {GameRoot} root
+     */
+    getIsUnlocked(root) {
+        // @todo
+        return G_IS_DEV;
+    }
+
+    /**
+     * Creates the entity at the given location
+     * @param {Entity} entity
+     */
+    setupEntityComponents(entity) {
+        // @todo
+        entity.addComponent(new WireComponent({}));
+    }
+
+    /**
+     *
+     * @param {Entity} entity
+     * @param {number} rotationVariant
+     */
+    updateVariants(entity, rotationVariant) {
+        entity.components.Wire.type = arrayWireRotationVariantToType[rotationVariant];
+    }
+
+    /**
+     *
+     * @param {number} rotation
+     * @param {number} rotationVariant
+     * @param {string} variant
+     * @param {Entity} entity
+     */
+    getSpecialOverlayRenderMatrix(rotation, rotationVariant, variant, entity) {
+        return wireOverlayMatrices[entity.components.Wire.type][rotation];
+    }
+}

src/js/game/component_registry.js

@@ -10,6 +10,7 @@ import { HubComponent } from "./components/hub";
 import { StorageComponent } from "./components/storage";
 import { WiredPinsComponent } from "./components/wired_pins";
 import { BeltUnderlaysComponent } from "./components/belt_underlays";
+import { WireComponent } from "./components/wire";
 
 export function initComponentRegistry() {
     gComponentRegistry.register(StaticMapEntityComponent);
@@ -23,6 +24,7 @@ export function initComponentRegistry() {
     gComponentRegistry.register(StorageComponent);
     gComponentRegistry.register(WiredPinsComponent);
     gComponentRegistry.register(BeltUnderlaysComponent);
+    gComponentRegistry.register(WireComponent);
 
     // IMPORTANT ^^^^^ UPDATE ENTITY COMPONENT STORAGE AFTERWARDS
 

src/js/game/components/wire.js

@@ -0,0 +1,27 @@
+import { Component } from "../component";
+
+/** @enum {string} */
+export const enumWireType = {
+    regular: "regular",
+    turn: "turn",
+    split: "split",
+};
+
+export class WireComponent extends Component {
+    static getId() {
+        return "Wire";
+    }
+
+    duplicateWithoutContents() {
+        return new WireComponent({ type: this.type });
+    }
+
+    /**
+     * @param {object} param0
+     * @param {enumWireType?} param0.type
+     */
+    constructor({ type = enumWireType.regular }) {
+        super();
+        this.type = type;
+    }
+}

src/js/game/components/wired_pins.js

@@ -4,10 +4,6 @@ import { types } from "../../savegame/serialization";
 
 /** @enum {string} */
 export const enumPinSlotType = {
-    positiveEnergyEjector: "positiveEnergyEjector",
-    negativeEnergyEjector: "negativeEnergyEjector",
-    positiveEnergyAcceptor: "positiveEnergyAcceptor",
-    negativeEnergyAcceptor: "negativeEnergyAcceptor",
     logicalEjector: "logicalEjector",
     logicalAcceptor: "logicalAcceptor",
 };

src/js/game/core.js

@@ -394,8 +394,10 @@ export class GameCore {
         // Main rendering order
         // -----
 
-        // BG / Map Resources / Belt Backgrounds
-        if (!this.root.camera.getIsMapOverlayActive()) {
+        if (this.root.camera.getIsMapOverlayActive()) {
+            // Map overview
+            root.map.drawOverlay(params);
+        } else {
             root.map.drawBackground(params);
 
             // Underlays for splitters / balancers
@@ -419,16 +421,14 @@ export class GameCore {
 
             // Green wires overlay
             root.hud.parts.wiresOverlay.draw(params);
-        } else {
-            root.map.drawOverlay(params);
-        }
 
-        if (this.root.currentLayer === enumLayer.wires && !this.root.camera.getIsMapOverlayActive()) {
-            // Static map entities
-            root.map.drawWiresForegroundLayer(params);
+            if (this.root.currentLayer === enumLayer.wires) {
+                // Static map entities
+                root.map.drawWiresForegroundLayer(params);
 
-            // pins
-            systems.wiredPins.draw(params);
+                // pins
+                systems.wiredPins.draw(params);
+            }
         }
 
         if (G_IS_DEV) {

src/js/game/entity_components.js

@@ -10,6 +10,7 @@ import { StaticMapEntityComponent } from "./components/static_map_entity";
 import { StorageComponent } from "./components/storage";
 import { UndergroundBeltComponent } from "./components/underground_belt";
 import { WiredPinsComponent } from "./components/wired_pins";
+import { WireComponent } from "./components/wire";
 /* typehints:end */
 
 /**
@@ -53,6 +54,9 @@ export class EntityComponentStorage {
         /** @type {BeltUnderlaysComponent} */
         this.BeltUnderlays;
 
+        /** @type {WireComponent} */
+        this.Wire;
+
         /* typehints:end */
     }
 }

src/js/game/game_system_manager.js

@@ -15,6 +15,7 @@ import { ItemAcceptorSystem } from "./systems/item_acceptor";
 import { StorageSystem } from "./systems/storage";
 import { WiredPinsSystem } from "./systems/wired_pins";
 import { BeltUnderlaysSystem } from "./systems/belt_underlays";
+import { WireSystem } from "./systems/wire";
 
 const logger = createLogger("game_system_manager");
 
@@ -64,6 +65,9 @@ export class GameSystemManager {
             /** @type {BeltUnderlaysSystem} */
             beltUnderlays: null,
 
+            /** @type {WireSystem} */
+            wire: null,
+
             /* typehints:end */
         };
         this.systemUpdateOrder = [];
@@ -109,6 +113,8 @@ export class GameSystemManager {
         // then would be invalid
         add("itemAcceptor", ItemAcceptorSystem);
 
+        add("wire", WireSystem);
+
         logger.log("📦 There are", this.systemUpdateOrder.length, "game systems");
     }
 

src/js/game/hud/parts/wires_toolbar.js

@@ -1,7 +1,8 @@
 import { enumLayer } from "../../root";
 import { HUDBaseToolbar } from "./base_toolbar";
+import { MetaWireBuilding } from "../../buildings/wire";
 
-const supportedBuildings = [];
+const supportedBuildings = [MetaWireBuilding];
 
 export class HUDWiresToolbar extends HUDBaseToolbar {
     constructor(root) {

src/js/game/key_action_mapper.js

@@ -54,6 +54,8 @@ export const KEYMAPPINGS = {
         mixer: { keyCode: key("8") },
         painter: { keyCode: key("9") },
         trash: { keyCode: key("0") },
+
+        wire: { keyCode: key("1") },
     },
 
     placement: {

src/js/game/map_chunk_view.js

@@ -75,15 +75,17 @@ export class MapChunkView extends MapChunk {
         parameters.context.drawImage(sprite, this.x * dims, this.y * dims, dims, dims);
         parameters.context.imageSmoothingEnabled = true;
 
-        for (let i = 0; i < this.patches.length; ++i) {
-            const patch = this.patches[i];
+        if (this.root.currentLayer === enumLayer.regular) {
+            for (let i = 0; i < this.patches.length; ++i) {
+                const patch = this.patches[i];
 
-            patch.item.draw(
-                this.x * dims + patch.pos.x * globalConfig.tileSize,
-                this.y * dims + patch.pos.y * globalConfig.tileSize,
-                parameters,
-                Math.min(80, 30 / parameters.zoomLevel)
-            );
+                patch.item.draw(
+                    this.x * dims + patch.pos.x * globalConfig.tileSize,
+                    this.y * dims + patch.pos.y * globalConfig.tileSize,
+                    parameters,
+                    Math.min(80, 30 / parameters.zoomLevel)
+                );
+            }
         }
     }
 
@@ -179,6 +181,54 @@ export class MapChunkView extends MapChunk {
 
             context.fillStyle = THEME.map.wires.overlayColor;
             context.fillRect(0, 0, w, h);
+
+            for (let x = 0; x < globalConfig.mapChunkSize; ++x) {
+                const wiresArray = this.wireContents[x];
+                for (let y = 0; y < globalConfig.mapChunkSize; ++y) {
+                    const content = wiresArray[y];
+                    if (!content) {
+                        continue;
+                    }
+                    const staticComp = content.components.StaticMapEntity;
+                    const data = getBuildingDataFromCode(staticComp.code);
+                    const metaBuilding = data.metaInstance;
+
+                    const overlayMatrix = metaBuilding.getSpecialOverlayRenderMatrix(
+                        staticComp.rotation,
+                        data.rotationVariant,
+                        data.variant,
+                        content
+                    );
+
+                    context.fillStyle = metaBuilding.getSilhouetteColor();
+                    if (overlayMatrix) {
+                        for (let dx = 0; dx < 3; ++dx) {
+                            for (let dy = 0; dy < 3; ++dy) {
+                                const isFilled = overlayMatrix[dx + dy * 3];
+                                if (isFilled) {
+                                    context.fillRect(
+                                        x * CHUNK_OVERLAY_RES + dx,
+                                        y * CHUNK_OVERLAY_RES + dy,
+                                        1,
+                                        1
+                                    );
+                                }
+                            }
+                        }
+
+                        continue;
+                    } else {
+                        context.fillRect(
+                            x * CHUNK_OVERLAY_RES,
+                            y * CHUNK_OVERLAY_RES,
+                            CHUNK_OVERLAY_RES,
+                            CHUNK_OVERLAY_RES
+                        );
+
+                        continue;
+                    }
+                }
+            }
         }
     }
 
@@ -188,6 +238,7 @@ export class MapChunkView extends MapChunk {
      */
     drawWiresForegroundLayer(parameters) {
         const systems = this.root.systemMgr.systems;
+        systems.wire.drawChunk(parameters, this);
         systems.staticMapEntities.drawWiresChunk(parameters, this);
     }
 }

src/js/game/meta_building_registry.js

@@ -12,6 +12,7 @@ import { enumSplitterVariants, MetaSplitterBuilding } from "./buildings/splitter
 import { MetaStackerBuilding } from "./buildings/stacker";
 import { enumTrashVariants, MetaTrashBuilding } from "./buildings/trash";
 import { enumUndergroundBeltVariants, MetaUndergroundBeltBuilding } from "./buildings/underground_belt";
+import { MetaWireBuilding } from "./buildings/wire";
 import { gBuildingVariants, registerBuildingVariant } from "./building_codes";
 import { defaultBuildingVariant } from "./meta_building";
 
@@ -29,6 +30,7 @@ export function initMetaBuildingRegistry() {
     gMetaBuildingRegistry.register(MetaBeltBuilding);
     gMetaBuildingRegistry.register(MetaUndergroundBeltBuilding);
     gMetaBuildingRegistry.register(MetaHubBuilding);
+    gMetaBuildingRegistry.register(MetaWireBuilding);
 
     // Belt
     registerBuildingVariant(1, MetaBeltBaseBuilding, defaultBuildingVariant, 0);
@@ -78,6 +80,11 @@ export function initMetaBuildingRegistry() {
     // Hub
     registerBuildingVariant(26, MetaHubBuilding);
 
+    // Wire
+    registerBuildingVariant(27, MetaWireBuilding, defaultBuildingVariant, 0);
+    registerBuildingVariant(28, MetaWireBuilding, defaultBuildingVariant, 1);
+    registerBuildingVariant(29, MetaWireBuilding, defaultBuildingVariant, 2);
+
     // Propagate instances
     for (const key in gBuildingVariants) {
         gBuildingVariants[key].metaInstance = gMetaBuildingRegistry.findByClass(

src/js/game/systems/belt.js

@@ -33,15 +33,6 @@ export class BeltSystem extends GameSystemWithFilter {
             [enumDirection.right]: Loader.getSprite("sprites/belt/right_0.png"),
         };
 
-        /**
-         * @type {Object.<enumDirection, Array<AtlasSprite>>}
-         */
-        this.wireSprites = {
-            [enumDirection.top]: Loader.getSprite("sprites/buildings/wire_top.png"),
-            [enumDirection.left]: Loader.getSprite("sprites/buildings/wire_left.png"),
-            [enumDirection.right]: Loader.getSprite("sprites/buildings/wire_right.png"),
-        };
-
         /**
          * @type {Object.<enumDirection, Array<AtlasSprite>>}
          */
@@ -485,10 +476,6 @@ export class BeltSystem extends GameSystemWithFilter {
      * @param {MapChunkView} chunk
      */
     drawChunk(parameters, chunk) {
-        if (parameters.zoomLevel < globalConfig.mapChunkOverviewMinZoom) {
-            return;
-        }
-
         // Limit speed to avoid belts going backwards
         const speedMultiplier = Math.min(this.root.hubGoals.getBeltBaseSpeed(), 10);
 
@@ -511,7 +498,6 @@ export class BeltSystem extends GameSystemWithFilter {
                 }
             }
         }
-        1;
     }
 
     /**

src/js/game/systems/map_resources.js

@@ -10,8 +10,6 @@ export class MapResourcesSystem extends GameSystem {
      * @param {MapChunkView} chunk
      */
     drawChunk(parameters, chunk) {
-        const renderItems = parameters.zoomLevel >= globalConfig.mapChunkOverviewMinZoom;
-
         parameters.context.globalAlpha = 0.5;
 
         const layer = chunk.lowerLayer;
@@ -37,31 +35,14 @@ export class MapResourcesSystem extends GameSystem {
 
                     parameters.context.fillStyle = lowerItem.getBackgroundColorAsResource();
                     parameters.context.fillRect(worldX, worldY, globalConfig.tileSize, globalConfig.tileSize);
-                    if (renderItems) {
-                        lowerItem.draw(
-                            worldX + globalConfig.halfTileSize,
-                            worldY + globalConfig.halfTileSize,
-                            parameters
-                        );
-                    }
+                    lowerItem.draw(
+                        worldX + globalConfig.halfTileSize,
+                        worldY + globalConfig.halfTileSize,
+                        parameters
+                    );
                 }
             }
         }
         parameters.context.globalAlpha = 1;
-
-        if (!renderItems) {
-            // Render patches instead
-            const patches = chunk.patches;
-            for (let i = 0; i < patches.length; ++i) {
-                const { pos, item, size } = patches[i];
-
-                item.draw(
-                    (chunk.tileX + pos.x + 0.5) * globalConfig.tileSize,
-                    (chunk.tileY + pos.y + 0.5) * globalConfig.tileSize,
-                    parameters,
-                    80
-                );
-            }
-        }
     }
 }

src/js/game/systems/static_map_entity.js

@@ -1,19 +1,11 @@
 import { globalConfig } from "../../core/config";
 import { DrawParameters } from "../../core/draw_parameters";
-import { Loader } from "../../core/loader";
-import { enumDirection } from "../../core/vector";
 import { GameSystem } from "../game_system";
 import { MapChunkView } from "../map_chunk_view";
 
 export class StaticMapEntitySystem extends GameSystem {
     constructor(root) {
         super(root);
-
-        this.beltOverviewSprites = {
-            [enumDirection.top]: Loader.getSprite("sprites/map_overview/belt_forward.png"),
-            [enumDirection.right]: Loader.getSprite("sprites/map_overview/belt_right.png"),
-            [enumDirection.left]: Loader.getSprite("sprites/map_overview/belt_left.png"),
-        };
     }
 
     /**
@@ -26,8 +18,6 @@ export class StaticMapEntitySystem extends GameSystem {
             return;
         }
 
-        const drawOutlinesOnly = parameters.zoomLevel < globalConfig.mapChunkOverviewMinZoom;
-
         const drawnUids = new Set();
 
         const contents = chunk.contents;
@@ -41,26 +31,10 @@ export class StaticMapEntitySystem extends GameSystem {
                     }
                     drawnUids.add(entity.uid);
                     const staticComp = entity.components.StaticMapEntity;
-                    if (drawOutlinesOnly) {
-                        const rect = staticComp.getTileSpaceBounds();
-                        parameters.context.fillStyle = staticComp.getSilhouetteColor() || "#aaa";
-                        const beltComp = entity.components.Belt;
-                        if (beltComp) {
-                            const sprite = this.beltOverviewSprites[beltComp.direction];
-                            staticComp.drawSpriteOnFullEntityBounds(parameters, sprite, 0);
-                        } else {
-                            parameters.context.fillRect(
-                                rect.x * globalConfig.tileSize,
-                                rect.y * globalConfig.tileSize,
-                                rect.w * globalConfig.tileSize,
-                                rect.h * globalConfig.tileSize
-                            );
-                        }
-                    } else {
-                        const sprite = staticComp.getSprite();
-                        if (sprite) {
-                            staticComp.drawSpriteOnFullEntityBounds(parameters, sprite, 2);
-                        }
+
+                    const sprite = staticComp.getSprite();
+                    if (sprite) {
+                        staticComp.drawSpriteOnFullEntityBounds(parameters, sprite, 2);
                     }
                 }
             }

src/js/game/systems/wire.js

@@ -0,0 +1,36 @@
+import { GameSystemWithFilter } from "../game_system_with_filter";
+import { WireComponent, enumWireType } from "../components/wire";
+import { MapChunkView } from "../map_chunk_view";
+import { globalConfig } from "../../core/config";
+import { Loader } from "../../core/loader";
+
+export class WireSystem extends GameSystemWithFilter {
+    constructor(root) {
+        super(root, [WireComponent]);
+
+        this.wireSprites = {
+            [enumWireType.regular]: Loader.getSprite("sprites/buildings/wire.png"),
+            [enumWireType.turn]: Loader.getSprite("sprites/buildings/wire-turn.png"),
+            [enumWireType.split]: Loader.getSprite("sprites/buildings/wire-split.png"),
+        };
+    }
+
+    /**
+     * Draws a given chunk
+     * @param {import("../../core/draw_utils").DrawParameters} parameters
+     * @param {MapChunkView} chunk
+     */
+    drawChunk(parameters, chunk) {
+        const contents = chunk.wireContents;
+        for (let y = 0; y < globalConfig.mapChunkSize; ++y) {
+            for (let x = 0; x < globalConfig.mapChunkSize; ++x) {
+                const entity = contents[x][y];
+                if (entity && entity.components.Wire) {
+                    const wireType = entity.components.Wire.type;
+                    const sprite = this.wireSprites[wireType];
+                    entity.components.StaticMapEntity.drawSpriteOnFullEntityBounds(parameters, sprite, 0);
+                }
+            }
+        }
+    }
+}

src/js/game/systems/wired_pins.js

@@ -14,8 +14,8 @@ export class WiredPinsSystem extends GameSystemWithFilter {
         super(root, [WiredPinsComponent]);
 
         this.pinSprites = {
-            [enumPinSlotType.logicalEjector]: Loader.getSprite("sprites/wires/pin_negative_eject.png"),
-            [enumPinSlotType.logicalAcceptor]: Loader.getSprite("sprites/wires/pin_negative_accept.png"),
+            [enumPinSlotType.logicalEjector]: Loader.getSprite("sprites/wires/logical_ejector.png"),
+            [enumPinSlotType.logicalAcceptor]: Loader.getSprite("sprites/wires/logical_acceptor.png"),
         };
 
         this.root.signals.prePlacementCheck.add(this.prePlacementCheck, this);

translations/base-en.yaml

@@ -537,6 +537,19 @@ buildings:
             name: Storage
             description: Stores excess items, up to a given capacity. Can be used as an overflow gate.
 
+    wire:
+        default:
+            name: &wire Wire
+            description: &wire_desc Allows to connect logical components and can transfer items, colors or boolean signals.
+
+        turn:
+            name: *wire
+            description: &wire_desc
+
+        split:
+            name: *wire
+            description: &wire_desc
+
 storyRewards:
     # Those are the rewards gained from completing the store
     reward_cutter_and_trash:
@@ -802,6 +815,7 @@ keybindings:
         mixer: *mixer
         painter: *painter
         trash: *trash
+        wire: *wire
 
         pipette: Pipette
         rotateWhilePlacing: Rotate