# Phaser Coding Tips 4 Revisited: Cloud Platforms

**URL:** <https://phaser.discourse.group/t/phaser-coding-tips-4-revisited-cloud-platforms/11529>\
**Category:** Examples\
**Created:** [April 14, 2022, 3:01pm UTC](https://phaser.discourse.group/t/phaser-coding-tips-4-revisited-cloud-platforms/11529 "2022-04-14T15:01:00Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![cedarcantab](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/cedarcantab/32/6120_2.png) [@cedarcantab](https://phaser.discourse.group/u/cedarcantab)\
**Post date:** [April 14, 2022, 3:01pm UTC](https://phaser.discourse.group/t/phaser-coding-tips-4-revisited-cloud-platforms/11529/1 "2022-04-14T15:01:00Z")

</div>

![image](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/7/77c9ba7c4ba8a91f87323f74527ff3f4e8b58483.png)

Following on from my revisit of Phaser Coding Tips 3, I thought I would quickly work through Coding Tips 4 (original Phaser 2 tutorial available [here](http://phaser.io/tutorials/coding-tips-004)) which is about making Mr Dude ride cloud platforms that move along predetermined motion paths using chained tweens. Contrary to my own expectations I ended up spending hours trying to get chained tweens to work. I did also learn a few new tricks by working through the original Phaser 2 example code by the great Richard Davey. My learnings are documented in my blog [here](https://cedarcantab.wixsite.com/website-1/post/phaser-coding-tips-4-cloud-platforms-revisited) - there might be something useful for those exploring chained tween motion paths. My Phaser 3 conversion of the original tutorial example is available below.  
https://codepen.io/cedarcantab/embed/preview/YzYZEgN?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=YzYZEgN

Question for Senpai programmers;  
To recreate the chained tween motion paths of the original Phaser 2 example, I ended up creating a convoluted method to read the relative values for the x and y coordinates, whereas I had expected the following to work:

```javascript
 var tweenX = this.tweens.timeline({
      targets: cloud1,
      tweens: [
        {x: "+=200", ease: "Linear", duration: 2000},
        {x: "-=200", ease: "Linear", duration: 2000},
        {x: "-=200", ease: "Linear", duration: 2000},
        {x: "+=200", ease: "Linear", duration: 2000},
      ],
      loop: -1
    });
    var tweenY = this.tweens.timeline({
      targets: cloud1,
      tweens: [
        {y: "-=200", ease: "Sine.easeIn", duration: 2000},
        {y: "-=200", ease: "Sine.easeOut", duration: 2000},
        {y: "+=200", ease: "Sine.easeIn", duration: 2000},
        {y: "+=200", ease: "Sine.easeOut", duration: 2000}
      ],
      loop: -1
    });

```

But after the first loop, the cloud goes haywire…maybe I’m missing something simple…advice would be appreciated - the “non-working” code is here:  
https://codepen.io/cedarcantab/embed/preview/eYyPBOo?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=eYyPBOo

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [April 14, 2022, 4:49pm UTC](https://phaser.discourse.group/t/phaser-coding-tips-4-revisited-cloud-platforms/11529/2 "2022-04-14T16:49:24Z")

</div>

I think that’s a timeline bug.

---

<div class="post-metadata">

**Author:** ![cedarcantab](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/cedarcantab/32/6120_2.png) [@cedarcantab](https://phaser.discourse.group/u/cedarcantab)\
**Post date:** [April 18, 2022, 1:25pm UTC](https://phaser.discourse.group/t/phaser-coding-tips-4-revisited-cloud-platforms/11529/3 "2022-04-18T13:25:07Z")

</div>

Thanks for confirming Samme!
