3d-interface/js/l3d/apps/prototype/interactive/main.js

L3D.DB.disable();

// Let's be sure we avoid using global variables
var onWindowResize = (function() {

L3D.ProgressiveLoader.onFinished = function() {

    if (coins.length === 0 || coins[0].mesh === undefined) {
        setTimeout(L3D.ProgressiveLoader.onFinished, 500);
        return;
    }

    for (var i = 0; i < coins.length; i++) {
        coins[i].mesh.visible = true;
    }

    if (initMainScene !== L3D.initSponza)
        loadingCanvas.clear();

    L3D.DB.enable();
    camera1.reset();
};

// Disable scrolling
window.onscroll = function () { window.scrollTo(0, 0); };

window.onload = main;

var stats;
var renderer, scene, container;
var clickableObjects = [];
var recommendations, objectClicker;
var previewer;
var camera1;
var coins = [];
var previousTime;
var pointer;
var startCanvas;
var loadingCanvas;

// window.onbeforeunload = function() {
//
//     if (initMainScene !== L3D.initPeach && initMainScene !== L3D.initSponza && !($('#next').is(":visible"))) {
//
//         return 'Warning : you are going to leave the page and abort the current test !';
//
//     }
//
// };

var nextPage = '/prototype/play';

Coin.onCoinGot = function(coin) {
    if (coin === 6) {
        setTimeout(function() { setNextButton(nextPage); }, 60*1000);
    } else if (coin === 8) {
        setNextButton(nextPage);
    }
};

function main() {

    // Main container that holds everything
    container = document.getElementById('container');

    // Initialization
    initThreeElements();
    initCanvases();
    initModels();
    initListeners();

    appendTo(container)(stats, Coin, startCanvas, pointer, previewer, /*loadingCanvas,*/ renderer);
    // appendTo(container)(startCanvas, pointer, previewer, renderer);

    // Set the good size of cameras
    onWindowResize();

    Coin.update(true);

    if (initMainScene !== L3D.initSponza)
        loadingCanvas.render();

    if (locked !== undefined && locked)
        startCanvas.render();

    // Some config
    if (initMainScene !== L3D.initPeach && initMainScene !== L3D.initSponza)
        setInterval(function() {logfps(stats.getFps());}, 500);
    else
        L3D.DB.disable();

    // startCanvas.render(L3D.StartCanvas.Black);

    // Bind previewer to renderer (for fixed option)
    function bind() {
        if (document.pointerLockElement || document.mozPointerLockElement || document.webkitPointerLockElement) {
            // Lock event
            previewer.fixed = true;
        } else {
            // Unlock event
            previewer.fixed = false;
        }
    }
    document.addEventListener('pointerlockchange', bind);
    document.addEventListener('mozpointerlockchange', bind);
    document.addEventListener('webkitpointerlockchange', bind);

    // Start rendering
    setInterval(render, 20);

}

function initThreeElements() {

    // Initialize scene
    scene = new THREE.Scene();
    renderer = new THREE.WebGLRenderer({alpha:true, antialias:true});
    renderer.setClearColor(0x87ceeb);

    var loader = new THREE.OBJLoader();

    loader.load(
        '/static/data/coin/Coin.obj',
        function(object) {
            object.traverse(function (mesh) {
                if (mesh instanceof THREE.Mesh) {
                    mesh.scale.set(0.01,0.01,0.01);
                    mesh.material.color.setHex(0xffff00);
                    mesh.geometry.computeVertexNormals();
                    mesh.raycastable = true;
                    mesh.position.copy(new THREE.Vector3(-23.85237224023958,12.30017484578007,2.883526209796364));
                    scene.add(mesh);

                    newMesh = mesh.clone();
                    newMesh.position.copy(new THREE.Vector3(-8.225753727064939,11.932703941399415,8.637544772060489));
                    scene.add(newMesh);

                    newMesh.position.copy(new THREE.Vector3(18.198980821370327,2.5219742652442885,10.741621475827422));
                    scene.add(newMesh);

                }
            });
        }
    );

    // Initialize pointer camera
    camera1 = new L3D.PointerCamera(
        50,
        containerSize.width() / containerSize.height(),
        0.01, 100000, renderer, container
    );

    // Get default param for camera lock
    document.getElementById('lock').checked = window.locked;
    camera1.shouldLock = window.locked;
    camera1.onPointerLockChange();

}

function initCanvases() {

    // Initialize previewer
    previewer = new L3D.Previewer(renderer, scene);
    previewer.domElement.style.position ="absolute";
    previewer.domElement.style.cssFloat = 'top-left';

    // Initialize stats counter
    stats = new Stats();
    stats.setMode(0);
    stats.domElement.style.position = 'absolute';
    stats.domElement.style.cssFloat = "top-left";

    // Initialize pointer for pointer lock
    pointer = new L3D.MousePointer(camera1);

    // Init start canvas
    startCanvas = new L3D.StartCanvas(camera1);

    if (initMainScene !== L3D.initSponza)
        loadingCanvas = new L3D.LoadingCanvas();
}

function initModels() {

    // Init recommendations
    recommendations = initMainScene(camera1, scene, coins, clickableObjects);

    // init clickable objects
    var i;
    for (i = 0; i < coins.length; i++)
        clickableObjects.push(coins[i]);

    for (i =0; i < recommendations.length; i++)
        clickableObjects.push(recommendations[i]);

}

function initListeners() {

    // Add listeners
    window.addEventListener('resize', onWindowResize, false);

    // HTML Bootstrap buttons
    buttonManager = new ButtonManager(camera1, recommendations, previewer);

    // Object clicker for hover and clicking recommendations
    objectClicker = new L3D.ObjectClicker(
        renderer,
        camera1,
        clickableObjects,
        objectClickerOnHover(camera1, previewer, recommendations, container), // Create onHover function
        objectClickerOnClick(camera1, buttonManager, recommendations, coins), // Create onClick function
        container
    );

}

function render() {

    // Stats for render
    stats.begin();

    objectClicker.update();

    // Update recommendations (set raycastable if shown)
    recommendations.map(function(reco) {
        if (reco instanceof Recommendation) {
            reco.traverse(function(elt) {
                elt.visible = elt.raycastable = buttonManager.showArrows;
            });
        }
    });

    // Update coins
    coins.forEach(function(coin) { coin.update(); });

    // Update main camera
    var currentTime = Date.now() - previousTime;
    camera1.update(isNaN(currentTime) ? 20 : currentTime);
    previousTime = Date.now();

    Coin.update();

    // Update the recommendations
    recommendations.map(function(reco) { reco.update(camera1);});

    // Set current position of camera
    camera1.look();

    var left = 0, bottom = 0, width = containerSize.width(), height = containerSize.height();
    renderer.setScissor(left, bottom, width, height);
    renderer.enableScissorTest(true);
    renderer.setViewport(left, bottom, width, height);
    renderer.render(scene, camera1);

    // Remove borders of preview
    previewer.clear();

    // Hide arrows in recommendation
    recommendations.map(function(reco) { if (reco instanceof Recommendation) hide(reco); });

    // Update transparent elements
    THREEx.Transparency.update(camera1);

    // Render preview
    previewer.render(containerSize.width(), containerSize.height());

    // Finish stats
    stats.end();

}

function onWindowResize() {

    resizeElements(renderer, container, previewer, Coin, pointer, startCanvas, loadingCanvas);

    recommendations.forEach(function(reco) {
        resetCameraAspect(reco.camera, containerSize.width(), containerSize.height());
    });

    render();

}

// onWindowResize will be the only global function
return onWindowResize;

})();