# Can't figure out how I can change the scene

**URL:** <https://phaser.discourse.group/t/cant-figure-out-how-i-can-change-the-scene/5141>\
**Category:** Phaser 3\
**Created:** [February 11, 2020, 6:18pm UTC](https://phaser.discourse.group/t/cant-figure-out-how-i-can-change-the-scene/5141 "2020-02-11T18:18:19Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![xbelanch](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/xbelanch/32/2765_2.png) [@xbelanch](https://phaser.discourse.group/u/xbelanch)\
**Post date:** [February 11, 2020, 6:18pm UTC](https://phaser.discourse.group/t/cant-figure-out-how-i-can-change-the-scene/5141/1 "2020-02-11T18:18:20Z")

</div>

Working on a simple code, I have troubles to get working the change of a scene by clicking on a simple image. Let me show you the sample code:

```javascript
// Scene for testing purpose
class Home extends Phaser.Scene {
  constructor(){
    super('home');
  }
  
  create(){
    let t = this;
    t.addIconApps();
  }

  // --- Home Screen Apps
  addIconApps(){
    let t = this;
    t.clockIconApp = new IconApp(this, 32, 32, 'clock');
  }
}

class IconApp extends Phaser.GameObjects.Image {
  constructor(scene, x, y, sprite) {
    super(scene, x, y, sprite);
    this.setInteractive();
    this.setOrigin(0);
    this.setAlpha(0.5);
    this.init();
    this.scene.add.existing(this);
  }

  init(){
    let t = this;
    // --- Open App
    t.on('pointerdown', t.clicked);
  }

  clicked(scene){
    let t = this;
    t.scene.start('AnotherScene');
  }
}

```

Debugging this, the console raises this error: “t.scene.start is not a function”.

What am I doing wrong?

---

<div class="post-metadata">

**Author:** ![snowbillr](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/snowbillr/32/332_2.png) [@snowbillr](https://phaser.discourse.group/u/snowbillr)\
**Post date:** [February 11, 2020, 6:34pm UTC](https://phaser.discourse.group/t/cant-figure-out-how-i-can-change-the-scene/5141/2 "2020-02-11T18:34:13Z")

</div>

You try to start the new scene from within your `Phaser.GameObjects.Image` class. So when you say `this.scene.start`, `this` refers to the `Image` instance.

The `start` method only exists on the `SceneManager` class, but the `scene` property on the image refers to the actual `Scene` class that the image was added to.

Does that make sense?

---

<div class="post-metadata">

**Author:** ![xbelanch](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/xbelanch/32/2765_2.png) [@xbelanch](https://phaser.discourse.group/u/xbelanch)\
**Post date:** [February 11, 2020, 6:48pm UTC](https://phaser.discourse.group/t/cant-figure-out-how-i-can-change-the-scene/5141/3 "2020-02-11T18:48:00Z")

</div>

Yep, it makes sense. So I need to put the interactive method ‘on’ outside the extended class Image, isn’t?

```javascript
t.clockIconApp = new IconApp(this, 32, 32, 'clock');
t.clockIconApp.on('pointerdown', function(e) { t.scene.start('boot'); });

```

btw, is there a way to encapsulate this interaction inside the extended class?

---

<div class="post-metadata">

**Author:** ![snowbillr](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/snowbillr/32/332_2.png) [@snowbillr](https://phaser.discourse.group/u/snowbillr)\
**Post date:** [February 11, 2020, 8:35pm UTC](https://phaser.discourse.group/t/cant-figure-out-how-i-can-change-the-scene/5141/4 "2020-02-11T20:35:34Z")

</div>

Sure is!

The `start` method lives on the `scene` property of your `Scene`. That’s why `this.scene.start` works when `this` refers to your scene.

When you’re in your extended `Image` class, the `this.scene` property is your `Scene`. So since you’ve got a reference to your scene from within your image class, you can take it one step further and access all of the Scene’s properties from that reference: `this.scene.scene.start`

---

<div class="post-metadata">

**Author:** ![xbelanch](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/xbelanch/32/2765_2.png) [@xbelanch](https://phaser.discourse.group/u/xbelanch)\
**Post date:** [February 12, 2020, 9:16am UTC](https://phaser.discourse.group/t/cant-figure-out-how-i-can-change-the-scene/5141/5 "2020-02-12T09:16:35Z")

</div>

It works! Thank you for your time and knowledge.