content/hifi-content/liv/Production/AvatarSwitchingOverlays/zoneEnterShowAvatarOptions.js

//
// zoneEnterShowAvatarOptions.js
//
// Created by Liv Erickson on 09/18/18
// Copyright 2018 High Fidelity, Inc. 
//
// Distributed under the Apache License, Version 2.0
// 

(function () {
    var arrowLeft;
    var arrowRight;
    var textOverlay;
    var activePhilip;
    var activePeter;

    var activeIndex = 0;

    var overlays = new Array();

    var canPress = true;
    var TIMEOUT = 500;

    var AVATAR_POSITION_LEFT = { x: 99.8518, y: 0.1629, z: 31.611 };
    var AVATAR_POSITION_RIGHT = { x: 99.4553, y: 0.1629, z: 31.6159 };


    var PLATFORM_ENUM =
    {
        0: 'AltSpace',
        1: 'RecRoom',
        2: 'Facebook',
        3: 'High Fidelity',
        4: 'VR Chat'
    };

    var BASE_AVATAR_ROTATION = Quat.fromVec3Degrees({ x: 0, y: 180, z: 0 });

    var AVATAR_FST_URLS = {
        'peter': {
            'AltSpace': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/peter_rubin/socialAvatar/Altspace_Peter.fst',
                'dimensions': { x: 0.4561, y: 0.4522, z: 0.0735 }
            },
            'RecRoom': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/peter_rubin/socialAvatar/RecRoom_Peter.fst',
                'dimensions': { x: 0.3352, y: 0.2167, z: 0.0837 }
            },
            'Facebook': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/peter_rubin/socialAvatar/FaceBook_Peter.fst',
                'dimensions': { x: 0.3812, y: 0.2134, z: 0.0811 }
            },
            'High Fidelity': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/peter_rubin/peter_rubin.fst',
                'dimensions': { x: 0.4291, y: 0.4383, z: 0.0959 }
            },
            'VR Chat': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/Simpson/fst/Chalmers.fst',
                'dimensions': { x: 0.4530, y: 0.4294, z: 0.1221 }
            }
        },
        'philip': {
            'AltSpace': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/peter_rubin/socialAvatar/Altspace_Philip.fst',
                'dimensions': { x: 0.4561, y: 0.4522, z: 0.0735 }
            },
            'RecRoom': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/peter_rubin/socialAvatar/RecRoom_Philip.fst',
                'dimensions': { x: 0.3352, y: 0.2167, z: 0.0837 }
            },
            'Facebook': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/peter_rubin/socialAvatar/FaceBook_Philip.fst',
                'dimensions': { x: 0.3812, y: 0.2134, z: 0.0811 }
            },
            'High Fidelity': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/doob/philip_rosedale/newFST/philip_rosedale_Final2.fst',
                'dimensions': { x: 0.4291, y: 0.4383, z: 0.0959 }
            },
            'VR Chat': {
                'url': 'https://hifi-content.s3.amazonaws.com/jimi/avatar/Niconico/Jene_5.fst',
                'dimensions': { x: 0.2313, y: 0.3881, z: 0.0908 }
            }
        }
    };

    function switchToAvatar(overlay) {
        var FST = Overlays.getProperty(overlay, 'url');
        MyAvatar.skeletonModelURL = FST;
    }

    function setupAvatarOverlays(index) {
        // Delete old overlays
        Overlays.deleteOverlay(activePeter);
        Overlays.deleteOverlay(activePhilip);

        var active = PLATFORM_ENUM[index];

        var propertiesNewPhilip = AVATAR_FST_URLS['philip'][active];
        propertiesNewPhilip.rotation = BASE_AVATAR_ROTATION;
        propertiesNewPhilip.position = AVATAR_POSITION_LEFT;

        var propertiesNewPeter = AVATAR_FST_URLS['peter'][active];
        propertiesNewPeter.rotation = BASE_AVATAR_ROTATION;
        propertiesNewPeter.position = AVATAR_POSITION_RIGHT;

        activePhilip = Overlays.addOverlay('model', propertiesNewPhilip);
        activePeter = Overlays.addOverlay('model', propertiesNewPeter);
        Overlays.editOverlay(textOverlay, {'text' : active});
    }

    function addArrowOverlays() {
        arrowRight = Overlays.addOverlay("model", {
            url: Script.resolvePath("models/arrow.fbx"),
            name: "fwd",
            dimensions: {
                x: 0.15,
                y: 0.225,
                z: 0.1
            },
            position: {
                x: 99.225,
                y: 0.077,
                z: 31.486
            },
            rotation: BASE_AVATAR_ROTATION,
            alpha: 1,
            visible: true
        });
        overlays.push(arrowRight);

        arrowLeft = Overlays.addOverlay("model", {
            url: Script.resolvePath("models/arrow.fbx"),
            name: "bwd",
            dimensions: {
                x: 0.15,
                y: 0.225,
                z: 0.1
            },
            position: {
                x: 100.0882,
                y: 0.0769,
                z: 31.4863
            },
            alpha: 1,
            showKeyboardFocusHighlight: false,
            visible: true
        });
        overlays.push(arrowLeft);
    }

    function addTextOverlay() {
        var textProperties = {
            color: {red: 0, green: 0, blue: 0},
            position: {x: 99.6, y: -0.0302, z: 31.3},
            dimensions: {x: 0.75, y: 0.3},
            backgroundAlpha: 0,
            lineHeight: 0.1,
            topMargin: 0.05,
            text: "Ready, Player One?",
            rotation: Quat.fromVec3Degrees({x: -90, y: 180, z: 0})
        };
        textOverlay = Overlays.addOverlay('text3d', textProperties);
        overlays.push(textOverlay);
    }

    function setUpOverlays() {
        addArrowOverlays();
        addTextOverlay();
        setupAvatarOverlays(activeIndex);
    }

    function cleanUpOverlays() {
        overlays.forEach(function (overlay) {
            Overlays.deleteOverlay(overlay);
        });
        Overlays.deleteOverlay(activePeter);
        Overlays.deleteOverlay(activePhilip);
    }

    function handleOverlayClick(overlayID, event) {
        if (canPress) {
            canPress = false;
            if (overlayID === arrowLeft && activeIndex > 0) {
                activeIndex--;
                setupAvatarOverlays(activeIndex);
            }
            if (overlayID === arrowRight && activeIndex < 4) {
                activeIndex++;
                setupAvatarOverlays(activeIndex);
            }
            if (overlayID === activePeter || overlayID === activePhilip) {
                switchToAvatar(overlayID);
            }
            Script.setTimeout(function(){
                canPress = true
            }, TIMEOUT);
        }

    }

    function AvatarSwitchingZone() {

    }

    AvatarSwitchingZone.prototype = {
        enterEntity: function () {
            setUpOverlays();
            Overlays.mousePressOnOverlay.connect(handleOverlayClick);
        },
        leaveEntity: function () {
            try {
                Overlays.mousePressOnOverlay.disconnect(handleOverlayClick);
            } catch (e) {
                // do nothing
            }
            cleanUpOverlays();
        },
        unload: function () {
            try {
                Overlays.mousePressOnOverlay.disconnect(handleOverlayClick);
            } catch (e) {
                // do nothing
            }
            cleanUpOverlays();
        }
    };

    return new AvatarSwitchingZone();
});