diff --git a/client/src/components/vbox.stash.jsx b/client/src/components/vbox.stash.jsx index cec94686..0e737627 100644 --- a/client/src/components/vbox.stash.jsx +++ b/client/src/components/vbox.stash.jsx @@ -9,7 +9,7 @@ const buttons = require('./buttons'); const { removeTier } = require('../utils'); const addState = connect( - ({ itemUnequip, vboxHighlight, vboxSelected }) => ({ itemUnequip, vboxHighlight, vboxSelected })); + ({ itemUnequip, vboxHighlight, vboxSelected, tutorial }) => ({ itemUnequip, vboxHighlight, vboxSelected, tutorial })); class stashElement extends preact.Component { shouldComponentUpdate(newProps) { @@ -23,6 +23,7 @@ class stashElement extends preact.Component { if (newProps.itemUnequip !== this.props.itemUnequip) return true; if (newProps.vboxHighlight !== this.props.vboxHighlight) return true; if (newProps.vboxSelected !== this.props.vboxSelected) return true; + if (newProps.tutorial !== this.props.tutorial) return true; return false; } @@ -39,6 +40,7 @@ class stashElement extends preact.Component { itemUnequip, vboxHighlight, vboxSelected, + tutorial, } = props; const { storeSelect, stashSelect } = vboxSelected; @@ -95,7 +97,7 @@ class stashElement extends preact.Component { : `${border} ${notValidCombo ? 'fade' : ''}`; const invObject = shapes[v] ? shapes[v]() : v; - + const tutorialDisable = tutorial === 1; return ( diff --git a/client/src/tutorial.utils.jsx b/client/src/tutorial.utils.jsx index 90c0ded5..e8bc0578 100644 --- a/client/src/tutorial.utils.jsx +++ b/client/src/tutorial.utils.jsx @@ -116,9 +116,7 @@ function tutorialStage(tutorial, clearTutorial, instance) { return (
This is the VBOX Phase tutorial.
-In the VBOX Phase you customise your constructs' skills and specialisations.
-Colours are used to create powerful combinations with base items.
+This is the VBOX Phase where you customise your team.
Buy the two colours from the store to continue.
You start the game with the base Attack skill item.
-Highlight the Attack and the two colours then click combine
+You start the game with the Attack base skill item.
+Create powerful combinations by combining colours with base items.
+Select all three items to combine.
The first construct on your team is {constructOne}.
Skill items can be equipped to your constructs to be used in the combat phase.
- Click your new skill from the stash.
- Once selected click the flashing SKILL slot or the construct img to equip the skill.
Select your new skill from the stash and then click the flashing SKILL slot or the construct image to equip.
); } @@ -162,11 +160,10 @@ function tutorialStage(tutorial, clearTutorial, instance) { return (Equipping specialisation items will increase the stats of your constructs.
-These can also be combined with colours for further specialisation.
- Click the specialisation item in the stash.
- Once selected click the flashing SPEC slot to equip the specialisation.
PRO TIP: while selecting an item in the shop, click on your construct to buy and equip in one step.
+ Specialisation items increase the stats of your constructs.
+ They can be combined further with colours to optimise your team strategy.
Slect the item in the stash, once selected click the flashing SPEC slot to equip.
+PRO TIP: While selecting an item in the shop, click on your construct to buy and equip in one step.
You have now created a construct with an upgraded skill and base spec.
-The goal is to create three powerful constructs for combat.
- Equip your other constructs {constructTwo} and {constructThree} with the Attack skill.
+
Equip your other constructs {constructTwo} and {constructThree} with skills.
Ensure each construct has a single skill to continue.
PRO TIP: Select a skill or spec on a construct and click another construct to swap it.