Add wires tutorial

src/js/game/hud/parts/interactive_tutorial.js

@@ -8,6 +8,8 @@ import { cachebust } from "../../../core/cachebust";
 import { T } from "../../../translations";
 import { enumItemProcessorTypes, ItemProcessorComponent } from "../../components/item_processor";
 import { ShapeItem } from "../../items/shape_item";
+import { WireComponent } from "../../components/wire";
+import { LeverComponent } from "../../components/lever";
 
 const tutorialsByLevel = [
     // Level 1
@@ -15,16 +17,13 @@ const tutorialsByLevel = [
         // 1.1. place an extractor
         {
             id: "1_1_extractor",
-            condition: /** @param {GameRoot} root */ root => {
+            condition: /** @param {GameRoot} root */ root =>
-                return root.entityMgr.getAllWithComponent(MinerComponent).length === 0;
+                root.entityMgr.getAllWithComponent(MinerComponent).length === 0,
-            },
         },
         // 1.2. connect to hub
         {
             id: "1_2_conveyor",
-            condition: /** @param {GameRoot} root */ root => {
+            condition: /** @param {GameRoot} root */ root => root.hubGoals.getCurrentGoalDelivered() === 0,
-                return root.hubGoals.getCurrentGoalDelivered() === 0;
-            },
         },
         // 1.3 wait for completion
         {
@@ -37,48 +36,38 @@ const tutorialsByLevel = [
         // 2.1 place a cutter
         {
             id: "2_1_place_cutter",
-            condition: /** @param {GameRoot} root */ root => {
+            condition: /** @param {GameRoot} root */ root =>
-                return (
                 root.entityMgr
                     .getAllWithComponent(ItemProcessorComponent)
-                        .filter(e => e.components.ItemProcessor.type === enumItemProcessorTypes.cutter)
+                    .filter(e => e.components.ItemProcessor.type === enumItemProcessorTypes.cutter).length ===
-                        .length === 0
+                0,
-                );
-            },
         },
         // 2.2 place trash
         {
             id: "2_2_place_trash",
-            condition: /** @param {GameRoot} root */ root => {
+            condition: /** @param {GameRoot} root */ root =>
-                return (
                 root.entityMgr
                     .getAllWithComponent(ItemProcessorComponent)
-                        .filter(e => e.components.ItemProcessor.type === enumItemProcessorTypes.trash)
+                    .filter(e => e.components.ItemProcessor.type === enumItemProcessorTypes.trash).length ===
-                        .length === 0
+                0,
-                );
-            },
         },
         // 2.3 place more cutters
         {
             id: "2_3_more_cutters",
-            condition: /** @param {GameRoot} root */ root => {
+            condition: /** @param {GameRoot} root */ root =>
-                return (
                 root.entityMgr
                     .getAllWithComponent(ItemProcessorComponent)
-                        .filter(e => e.components.ItemProcessor.type === enumItemProcessorTypes.cutter)
+                    .filter(e => e.components.ItemProcessor.type === enumItemProcessorTypes.cutter).length <
-                        .length < 3
+                3,
-                );
-            },
         },
     ],
 
-    // Level 2
+    // Level 3
     [
         // 3.1. rectangles
         {
             id: "3_1_rectangles",
-            condition: /** @param {GameRoot} root */ root => {
+            condition: /** @param {GameRoot} root */ root =>
-                return (
                 // 4 miners placed above rectangles and 10 delivered
                 root.hubGoals.getCurrentGoalDelivered() < 10 ||
                 root.entityMgr.getAllWithComponent(MinerComponent).filter(entity => {
@@ -89,9 +78,59 @@ const tutorialsByLevel = [
                         return shape === "RuRuRuRu";
                     }
                     return false;
-                    }).length < 4
+                }).length < 4,
-                );
         },
+    ],
+
+    [], // Level 4
+    [], // Level 5
+    [], // Level 6
+    [], // Level 7
+    [], // Level 8
+    [], // Level 9
+    [], // Level 10
+    [], // Level 11
+    [], // Level 12
+    [], // Level 13
+    [], // Level 14
+    [], // Level 15
+    [], // Level 16
+    [], // Level 17
+    [], // Level 18
+    [], // Level 19
+    [], // Level 20
+
+    // Level 21
+    [
+        // 21.1 place quad painter
+        {
+            id: "21_1_place_quad_painter",
+            condition: /** @param {GameRoot} root */ root =>
+                root.entityMgr
+                    .getAllWithComponent(ItemProcessorComponent)
+                    .filter(e => e.components.ItemProcessor.type === enumItemProcessorTypes.painterQuad)
+                    .length === 0,
+        },
+
+        // 21.2 switch to wires layer
+        {
+            id: "21_2_switch_to_wires",
+            condition: /** @param {GameRoot} root */ root =>
+                root.entityMgr.getAllWithComponent(WireComponent).length < 5,
+        },
+
+        // 21.3 place button
+        {
+            id: "21_3_place_button",
+            condition: /** @param {GameRoot} root */ root =>
+                root.entityMgr.getAllWithComponent(LeverComponent).length === 0,
+        },
+
+        // 21.4 activate button
+        {
+            id: "21_4_press_button",
+            condition: /** @param {GameRoot} root */ root =>
+                root.entityMgr.getAllWithComponent(LeverComponent).some(e => !e.components.Lever.toggled),
         },
     ],
 ];

src/js/profile/application_settings.js

@@ -676,6 +676,10 @@ export class ApplicationSettings extends ReadWriteProxy {
 
         if (data.version < 30) {
             data.settings.mapResourcesScale = 0.5;
+
+            // Re-enable hints as well
+            data.settings.offerHints = true;
+
             data.version = 30;
         }
 

translations/base-en.yaml

@@ -430,6 +430,20 @@ ingame:
                 Now let's extract some rectangles! <strong>Build 4 extractors</strong> and connect them to the hub.<br><br>
                 PS: Hold <strong>SHIFT</strong> while dragging a belt to activate the belt planner!
 
+            21_1_place_quad_painter: >-
+                Place the <strong>quad painter</strong> and get some <strong>circles</strong>, <strong>white</strong> and <strong>red</strong> color!
+
+            21_2_switch_to_wires: >-
+                Switch to the wires layer by pressing <strong>E</strong>!<br><br>
+                Then <strong>connect all four inputs</strong> of the painter with cables!
+
+            21_3_place_button: >-
+                Awesome! Now place a <strong>Switch</strong> and connect it with wires!
+
+            21_4_press_button: >-
+                Press the switch to make it <strong>emit a truthy signal</strong> and thus activate the painter.<br><br>
+                PS: You don't have to connect all inputs! Try wiring only two.
+
     # Connected miners
     connectedMiners:
         one_miner: 1 Extractor
@@ -791,7 +805,8 @@ storyRewards:
         desc: >-
             You just unlocked the <strong>Wires Layer</strong>: It is a separate layer on top of the regular layer and introduces a lot of new mechanics!<br><br>
             For the beginning I unlocked you the <strong>Quad Painter</strong> - Connect the slots you would like to paint with on the wires layer!<br><br>
-            To switch to the wires layer, press <strong>E</strong>.
+            To switch to the wires layer, press <strong>E</strong>. <br><br>
+            PS: <strong>Enable hints</strong> in the settings to activate the wires tutorial!
 
     reward_filter:
         title: >-