✨ Add entrance aniamtion to cards on rebus

src/elements/earth/rebus/game/RebusGame.js

@@ -46,9 +46,9 @@ class RebusGame extends Object2D
             newCard.isAnswer = this.levelData.optionCards[j].answer;
             newCard.setPosition((i + 1) * (1920 / 4), 3 * (1080 / 4));
             newCard.connect("selected", this, "_onCardSelected");
-            this.addChild(newCard)
+            this.addChild(newCard);
         }
-
+        
         for (let i = 0; i < this.levelData.questionCards.length; i++)
         {
             var newCard = new RebusQuestionCard("OptionCard" + i);
@@ -56,7 +56,7 @@ class RebusGame extends Object2D
             newCard.thumb = AssetHandler.getTextureByName(this.levelData.questionCards[i].name);
             newCard.imgName = this.levelData.questionCards[i].name;
             newCard.setPosition((i + 1) * (1920 / (this.levelData.questionCards.length + 1)), 1080 / 4);
-            this.addChild(newCard)
+            this.addChild(newCard);
         }
 
         this.addChild(new RebusGameVisualEffects("GameVisualEffects"));

src/elements/earth/rebus/game/RebusOptionCard.js

@@ -31,6 +31,10 @@ class RebusOptionCard extends Object2D
     mouseOver = false;
     mousePress = false;
 
+    tweenStarted = false;
+    tween = null;
+    timer = null;
+
     _initSignals()
     {
         this.addSignal("selected");
@@ -50,10 +54,25 @@ class RebusOptionCard extends Object2D
         this.addChild(area);
 
         this.addChild(new RebusCardVisualEffect("CardVfx"));
+
+        this.tween = new Tween("Tween");
+        this.tween.interpolateProperty(this, "scale", PROPERTY_TYPE.VECTOR2, Vector2.ZERO(), Vector2.ONE(), 1, TRANS_TYPE.ELASTIC, EASE_TYPE.OUT);
+        this.addChild(this.tween);
+
+        this.timer = new Timer("Timer", 1, false, true);
+        this.timer.connect("timeout", this, "_onTimerTimeout");
+        this.addChild(this.timer);
     }
 
     _update(delta)
     {
+        if (this.visible && !this.tweenStarted)
+        {
+            this.timer.start();
+            this.tween.startAll();
+            this.tweenStarted = true;
+        }
+
         if (this.selectable && this.mouseOver)
         {
             if (InputHandler.mouseIsClicked)
@@ -108,4 +127,9 @@ class RebusOptionCard extends Object2D
     {
         this.mouseOver = false;
     }
+
+    _onTimerTimeout()
+    {
+        this.tween.stopAll();
+    }
 }

src/elements/earth/rebus/game/RebusQuestionCard.js

@@ -25,6 +25,7 @@ class RebusQuestionCard extends Object2D
     imgName = "";
 
     fillColor = new Color(200, 200, 200);
+    tween = null;
 
     _setup()
     {
@@ -33,10 +34,22 @@ class RebusQuestionCard extends Object2D
         sprite.height = 250;
         sprite.setPosition(0, -75);
         this.addChild(sprite);
+        this.scale = Vector2.ZERO();
+
+        this.tween = new Tween("Tween");
+        this.tween.interpolateProperty(this, "scale", PROPERTY_TYPE.VECTOR2, Vector2.ZERO(), Vector2.ONE(), 1, TRANS_TYPE.ELASTIC, EASE_TYPE.OUT);
+        this.addChild(this.tween);
+    }
+
+    start()
+    {
+        this.tween.startAll();
     }
 
     _draw(delta, db)
     {
+        if (this.visible) this.tween.startAll();
+
         db.strokeWeight(10);
         db.rectMode(CENTER);
         db.fill(this.fillColor.getP5Color());

src/elements/earth/rebus/tutorial/RebusTutorial.js

@@ -104,9 +104,9 @@ class RebusTutorial extends Object2D
             case 5:
                 for (let i = 0; i < this.optionCards.length; i++)
                     this.optionCards[i].show();
-                this.timer.start(1);
-            case 6:
                 this.timer.start(2);
+            case 6:
+                this.timer.start(3);
                 break;
         }
     }