// create a scene
var scene = new THREE.Scene();

// displayPanels() displays three panels with different texture-mapped images
// of floral scenes - the input is an array of THREE.Texture objects

function displayPanels (textures) {
    // plane geometry with texture-mapped floral image for central panel
    var planeGeom = new THREE.PlaneGeometry(10,10);
    var planeMat = new THREE.MeshBasicMaterial( {color: 0xffffff,
                                                 map: textures[0]} );
    var planeMesh = new THREE.Mesh(planeGeom, planeMat);
    scene.add(planeMesh);

    // map the second image onto the right panel
    var planeGeomR = new THREE.PlaneGeometry(10,10);
    var planeMatR = new THREE.MeshBasicMaterial( {color: 0xffffff,
                                              map: textures[1]} );
    var planeMeshR = new THREE.Mesh(planeGeomR, planeMatR);
    var dist = 5*Math.cos(Math.PI/4);
    planeMeshR.position.set(5+dist, 0, dist);
    planeMeshR.rotation.y = -Math.PI/4;
    scene.add(planeMeshR);

    // map the third image onto the left panel
    var planeGeomL = new THREE.PlaneGeometry(10,10);
    var planeMatL = new THREE.MeshBasicMaterial( {color: 0xffffff,
                                              map: textures[2]} );
    var planeMeshL = new THREE.Mesh(planeGeomR, planeMatL);
    planeMeshL.position.set(-5-dist, 0, dist);
    planeMeshL.rotation.y = Math.PI/4;
    scene.add(planeMeshL);

    TW.render();    // render the scene
}

var renderer = new THREE.WebGLRenderer();

TW.mainInit(renderer,scene);

var state = TW.cameraSetup(renderer,
                           scene,
                           {minx: -8, maxx: 8,
                            miny: -5, maxy: 5,
                            minz: 0, maxz: 8});

// using the TW.loadTextures() function, load three images (stored in the same
// folder as this webpage), and when all of the images are loaded, invoke the
// anonymous function callback with an input array of THREE.Texture objects

TW.loadTextures(["https://s3-us-west-2.amazonaws.com/s.cdpn.io/2999896/relaxation.jpg", "https://s3-us-west-2.amazonaws.com/s.cdpn.io/2999896/flower1.jpg", "https://s3-us-west-2.amazonaws.com/s.cdpn.io/2999896/flower2.jpg"],
            function (textures) {
                displayPanels(textures);
            } );