# Add Controls to App created with Editor 2020

**URL:** <https://discourse.threejs.org/t/add-controls-to-app-created-with-editor-2020/15327>\
**Category:** Questions\
**Tags:** editor\
**Created:** [May 18, 2020, 8:55pm UTC](https://discourse.threejs.org/t/add-controls-to-app-created-with-editor-2020/15327 "2020-05-18T20:55:27Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Lday](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lday/32/10898_2.png) [@Lday](https://discourse.threejs.org/u/Lday)\
**Post date:** [May 18, 2020, 8:55pm UTC](https://discourse.threejs.org/t/add-controls-to-app-created-with-editor-2020/15327/1 "2020-05-18T20:55:27Z")

</div>

Hello Again,

I spent the last week doing research trying to figure out how to add controls ( I’m using orbit in the example) to an app published from the editor. In my .js library, I have included OrbitControls.js. I have followed the in-editor solutions suggested in previous threads on this topic with no success. I have also tried adding

var controls = new THREE.OrbitControls( camera, renderer.domElement );

after

this.setCamera( loader.parse( json.camera )  
);

in my app.js and that made the screen load black instead of just not working. aside from these additions I have not appended the editor files in any way, and this project is literally just a rotating cube for test purposes. Does anyone have any suggestions for resources I might scour to figure this out?

Thanks,  
M

idex.html below:

```
<head>

    <title></title>

    <meta charset="utf-8">

    <meta name="generator" content="Three.js Editor">

    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">

    <style>

        body {

            font-family: sans-serif;

            font-size: 11px;

            background-color: #000;

            margin: 0px;

            overflow: hidden;

        }

    </style>

</head>

<body ontouchstart="">

    <script src="./js/HelioWebXRPolyfill.js"></script>

    <script src="./js/OrbitControls.js"></script>

    <script type="module">

        import * as THREE from './js/three.module.js';

        import { APP } from './js/app.js';

        import { VRButton } from './js/VRButton.js';

        window.THREE = THREE; // Used by APP Scripts.

        window.VRButton = VRButton; // Used by APP Scripts.

        var loader = new THREE.FileLoader();

        loader.load( 'app.json', function ( text ) {

            var player = new APP.Player();

            player.load( JSON.parse( text ) );

            player.setSize( window.innerWidth, window.innerHeight );

            player.play();

            

            document.body.appendChild( player.dom );

            window.addEventListener( 'resize', function () {

                player.setSize( window.innerWidth, window.innerHeight );

            } );

            

        } );

        controls = new THREE.OrbitControls( camera, renderer.domElement );

    

    </script>

</body>

```

---

<div class="post-metadata">

**Author:** ![nikMashine](https://avatars.discourse-cdn.com/v4/letter/n/dec6dc/32.png) [@nikMashine](https://discourse.threejs.org/u/nikMashine)\
**Post date:** [December 19, 2020, 10:36pm UTC](https://discourse.threejs.org/t/add-controls-to-app-created-with-editor-2020/15327/2 "2020-12-19T22:36:54Z")

</div>

Same question on my end.

Did you figure a solution? Curious to learn about.  
n.
