Level Select Menu

Help & Support
1

Hey I was wondering what would be the best way to list out every scene in the project then display it on a scrollport? Please keep in mind that when I click on the entry I want to open up that scene.

2

If you create buttons with the same names as your scenes, you can do something like below when the button is clicked.

this.app.scenes.changeScene(this.entity.name);
3

I have an entire script for this using buttons if you need, I can give it to you.

4

that would be great

5

yes but i would want the scenes to be automatically displayed instead of me having to input every level when I make one

1 Like
6

As far as I know there is currently no way to get the scenes of the project.

7

Yeah, as Albertos said, I’m not sure that’s possible as the of this time. In the script I have you use input for buttons, select the scene and then that button will take you to that specific scene.

8

dang that sucks, But thanks

1 Like
9

If you still want it please let me know.

10

it would be nice to have for the futre

11

Here it is then:

var SceneManager = pc.createScript('sceneManager');

SceneManager.attributes.add('startScene', {
    type: 'string',
    title: 'Start Scene',
    description: 'The name of the first scene to load'
});
//Assumes the Scene name containing the Scene Manager is 'Init'
SceneManager.prototype.currentScene = 'Init';
//Declaring the Previous scene as empty from the start. Updated to 'Previous' on loading of this.startScene
SceneManager.prototype.previousScene = "";

// initialize code called once per entity
SceneManager.prototype.initialize = function() {
    
    var app = this.app;
    this.changingScene = false;
    this.manager = this.entity;
    //Grab the Scene Manager and load the this.startScene
    this.initStart(this.manager);
    //Firing the 'changeScene' event with the name of the scene as an argument will trigger a scene change
    app.on('changeScene', this.changeScene, this);
    
};

SceneManager.prototype.changeScene = function(targetscene) {
    if(!this.changingScene) {
        this.changingScene = true;
        var oldHierarchy = this.app.root.findByName('Root');

        if(targetscene === 'Previous') {

            if(this.previousScene === 'Init') {
                console.error('Unable to load Previous Scene - Previous Scene is initialization. Refresh and try visiting some other scenes first');
            }

            else {
                oldHierarchy.removeChild(this.manager);

                this.loadStart(this.previousScene.name, function(newHierarchy) {

                    newHierarchy.addChild(this.manager);

                    oldHierarchy.destroy();
                    this.changingScene = false;
                }.bind(this));
            }
        }


        else {

            oldHierarchy.removeChild(this.manager);

            this.loadStart(targetscene, function(newHierarchy) {

                newHierarchy.addChild(this.manager);

                oldHierarchy.destroy();
                this.changingScene = false;
            }.bind(this)); 
        }
    }
    
    else {
        
    }

};

SceneManager.prototype.initStart = function(manager) {
    
    var oldHierarchy = this.app.root.findByName('Root');
    
    oldHierarchy.removeChild(manager);
    
    this.loadStart(this.startScene, function(newHierarchy) {
        newHierarchy.addChild(this.manager);
        
        oldHierarchy.destroy();
          
    }.bind(this));
    
};

SceneManager.prototype.loadStart = function(name, callback) {   
    var sceneRegObj = this.app.scenes.find(name);
    var self = this;
    
    //load the scenes entity hierarchy
    this.app.scenes.loadSceneHierarchy(sceneRegObj.url, function(err, parent){
            if(!err){
                self.app.scenes.loadSceneSettings(sceneRegObj, function (err, scene) {
                    if (!err) {
                        self.previousScene = self.currentScene;
                        self.currentScene = sceneRegObj;
                        callback(parent);
                    } else {
                        console.error(err);
                    }
                });

            } else {
                console.error (err);
            }
        });
};

// SceneManager.prototype.postInitialize = function() {

// };

// swap method called for script hot-reloading
// inherit your script state here
// SceneManager.prototype.swap = function(old) { };

// to learn more about script anatomy, please read:
// http://developer.playcanvas.com/en/user-manual/scripting/
12

You can also check the PlayCanvas example project.

In the example project the new changeScene API is used, which makes it much easier to change your scene.

https://playcanvas.com/project/924351/overview/switch-full-scene-example

You can find more information on the page below.

https://developer.playcanvas.com/en/user-manual/packs/loading-scenes

13

thanks bro!

1 Like
14

No problem! Glad I could help.

15

I wasn’t aware you can find all scenes of the project using SceneRegistry.

const sceneItems = this.app.scenes;
for (let i = 0; i < sceneItems.length; ++i) {
    console.log(sceneItems[i].name);
}
1 Like
16

ill see if I can implement this later
thanks

1 Like