three.js

var gf = gf || {};

gf.ViewLogic3d = gf.Object.extend( /** @lends gf.ViewLogic3d# */ {

    m_objectList: null,
    subCamera: null,
    loadingManager:null,
    fbxloader : null,
    mixers : null,
    clock : null,
    action:null,
    tempObjectList:null,
    texLoader:null,
    cameraControls:null,
    tempVideoList:null,
    /**
     * 构造函数
     */
    ctor: function() {
        this.init();
    },

    /**
     * 初始化
     */
    init: function() {

        this.m_objectList = {};

        this.subEffect = null;

        this._create3DCanvas();
        this._initEvent();
    },

    _create3DCanvas: function() {
        var _this = this;

        var renderer = _this.renderer = new THREE.WebGLRenderer({
            antialias: true
        });

        var element = renderer.domElement;
        var container = document.getElementById('canvasBg');
        container.appendChild(element);

        renderer.setPixelRatio(window.devicePixelRatio);
        renderer.setSize(container.clientWidth, container.clientHeight);

        //定义渲染器
        var subRenderer = _this.subRenderer = new THREE.WebGLRenderer();

        var subElement = subRenderer.domElement;
        var subContainer = document.getElementById('cameraCanvasBg');
        subContainer.appendChild(subElement);

        subRenderer.setPixelRatio(window.devicePixelRatio);
        subRenderer.setSize(subContainer.clientWidth, subContainer.clientHeight);

        //定义摄像机
        _this.camera = new THREE.PerspectiveCamera(60, container.clientWidth / container.clientHeight, 0.1, 10000);
        _this.camera.position.y = 20;
        _this.camera.position.z = 50;
        
        _this.camera.up.x = 0;
        _this.camera.up.y = 1;
        _this.camera.up.z = 0;

        //鼠标控制模块
        _this.mouseControl = new THREE.MouseControls(_this.camera);
        _this.mouseControl.enabled = false;

        //定义场景
        var scene = _this.scene = new THREE.Scene();

        //场景图定义的基类
        var rootNode = _this.rootNode = new THREE.Object3D();
        rootNode.position.x = 0;
        rootNode.position.y = 0;
        rootNode.position.z = 0;

        scene.add(rootNode);

        //定义网格
        var helper = new THREE.GridHelper(200, 10, 0x0000ff, 0x808080);
        rootNode.add(helper);
        
        //大神写的像unity的操控和显示的一套东西
        var control = _this.transformControl = new THREE.TransformControls(_this.camera, renderer.domElement);
        scene.add(control);
        //loadingManager
        loadingManager = new THREE.LoadingManager();
        fbxloader = null;
        mixers = [];
        clock = new THREE.Clock();
        tempObjectList = [];
        texLoader = new THREE.TextureLoader();

        //大神写的通过鼠标操控摄像机的一套东西
        cameraControls = new THREE.OrbitControls( _this.camera, renderer.domElement );
        cameraControls.damping = 0.1;

        tempVideoList = [];
        function render() {
            renderer.clear();

            if (_this.scene && _this.camera) {
                _this.transformControl.visible = true;
                renderer.render(_this.scene, _this.camera);
            }

            if(_this.subEffect) {
                if (_this.scene && _this.subCamera) {
                    _this.subEffect.render(_this.scene, _this.subCamera);
                }
            } else {
                subRenderer.clear();
                if (_this.scene && _this.subCamera) {
                    _this.transformControl.visible = false;
                    subRenderer.render(_this.scene, _this.subCamera);
                }
            }

        }

        function animate() {
            //reqAnimFrameID = requestAnimationFrame(webGL.drawScene);
            requestAnimationFrame(animate);

            if ( mixers.length > 0 && mixers != null) {
                for (var i in mixers) {
                    mixers[i].update( 0.01 );
                }
            }
  
            render();
            if(_this.subCamera) {
                _this.subCamera.updateProjectionMatrix();
            }
            if(_this.cameraHelper) {
                _this.cameraHelper.update();
            }
            //_this.mouseControl.update();
            _this.transformControl.update();
        }

        animate();
    },

    leftButtonDown: function(event) {

    },

    leftButtonUp: function(event) {

    },

    middleButtonDown: function(event) {

    },

    middleButtonUp: function(event) {

    },

    rightButtonDown: function(event) {
        var _this = this;

        _this.mouseControl.enabled = true;
    },

    rightButtonUp: function(event) {
        var _this = this;

        _this.mouseControl.enabled = false;
    },

    mouseMove: function(event) {

    },

    mouseWheel: function(event) {
        /*var _this = this;
        var matrix4 = new THREE.Matrix4();
        var step = 2;*/

        /*if (event.wheelDelta > 0) {
            matrix4.set(1, 0, 0, 0,
                0, 1, 0, 0,
                0, 0, 1, step,
                0, 0, 0, 1);
        } else if (event.wheelDelta < 0) {
            matrix4.set(1, 0, 0, 0,
                0, 1, 0, 0,
                0, 0, 1, -step,
                0, 0, 0, 1);
        }
        _this.camera.projectionMatrix.multiply(matrix4);
        _this.camera.updateMatrixWorld(true);*/
   
        /*if (event.wheelDelta > 0) {
            step *= 1;
        } else if (event.wheelDelta < 0) {
            step *= -1;
        }
        _this.camera.fov -= step;
        if(_this.camera.fov <0){
            _this.camera.fov = 0;
        }
        _this.camera.updateProjectionMatrix();*/
    },

    onKeyDown: function(event) {
        var _this = this;

        var keyCode = event.keyCode;

        if (keyCode == 38) {
            _this.camera.position.z -= 2;
        } else if (keyCode == 40) {
            _this.camera.position.z += 2;
        } else if (keyCode == 37) {
            _this.camera.position.x -= 2;
        } else if (keyCode == 39) {
            _this.camera.position.x += 2;
        }
    },

    onWraperChanged: function() {
        var _this = this;

        var obj = arguments[0];

        switch (obj.action) {
            case 'ADD_WRAPER':
                _this._addWrapper(obj.wraperId,obj.parentId);
                break;
            case 'DELETE_WRAPER':
                _this._deleteWrapper(obj.wraperId);
            case 'WRAPER_TRANSFORM_CHANGE':
                _this._changeWrapperTransform(obj.wraperId, obj.type, obj.direction, obj.value);
                break;
            case 'WRAPER_CHANGE_MODEL':
                _this._changeWrapperModel(obj.wraperId, obj.type, obj.value, obj.resURL);
                break;
            case 'WRAPER_CHANGE_MATERIAL':
                _this._changeWrapperMaterial(obj.wraperId, obj.type, obj.value);
                break;
            case 'WRAPER_CAMERA_CHANGE':
                _this._changeSubCamera(obj.wraperId, obj.type, obj.value);
                _this._changeWrapperTransform(obj.wraperId, obj.type, obj.direction, obj.value);
                break;
            case 'WRAPER_CHANGE_VIDEO':
                _this._changeWrapperVideo(obj.wraperId, obj.type, obj.value, obj.resURL);
                break;
            case 'WRAPER_CHANGE_DIRECTIONALIGHT':
                _this._changeWrapperDirectionalLight(obj.wraperId, obj.type, obj.value);
                break;
            default:
                break;
        }
    },

    _changeSubCamera: function(id, type, value) {
        if (type === 'add') {
            if(this.subCamera) {
                return;
            }
            this.subCameraWraperId = id;

            var fov = Number(value['fov'].getValue());
            var near = Number(value['near'].getValue());
            var far = Number(value['far'].getValue());
            var subContainer = document.getElementById('cameraCanvasBg');
            this.subCamera = new THREE.PerspectiveCamera(fov, subContainer.clientWidth / subContainer.clientHeight, near, far);
            this.cameraHelper = new THREE.CameraHelper(this.subCamera);
            this.scene.add(this.cameraHelper);
        } else if (type === 'fov') {
            if(this.subCamera) {
                this.subCamera.fov = Number(value);
            }
        } else if (type === 'near') {
            if(this.subCamera) {
                this.subCamera.near = Number(value);
            }
        } else if (type === 'far') {
            if(this.subCamera) {
                this.subCamera.far = Number(value);
            }
        } else if (type === 'stereo') {
            var subRendererSize = this.subRenderer.getSize();

            var subEffect = this.subEffect = new THREE.StereoEffect(this.subRenderer);
            subEffect.setSize(subRendererSize.width, subRendererSize.height);
        }
    },

    _changeWrapperMaterial: function (id, type, value) {
        var _this = this;
        var wrapper = _this.m_objectList[id];
        if (!wrapper) {
            return;
        }

        var object = wrapper.getObjectByName('model');
        if (!object) {
            return;
        }
       
        if(type == 'image') {
            var resInfo = gameEditor.getFileInfo(value);

            var textureLoader = new THREE.TextureLoader();
            textureLoader.load(resInfo.resURL, function(texture) {
                //var maptexture = new THREE.Texture();
                var wraper  = gf.ProjectObj.getWraper(id);
                var matComponent = wraper.getComponentByType('Material');
                var property1 = matComponent.getProperty("file");
                var tempValue1 = property1.getValue();
                var resInfo1 = gameEditor.getFileInfo(tempValue1.id);
                if(resInfo1.resURL){
                    var textureLoader = new THREE.TextureLoader();
                    textureLoader.load(resInfo1.resURL, function(texture) {
                        var wraper  = gf.ProjectObj.getWraper(id);
                        var matComponent = wraper.getComponentByType('Material');
                        var property2 = matComponent.getProperty("modes");
                        var tempValue2 = property2.getValue();
                        tempValue2 = Number(tempValue2);
                        //maptexture.image = texture;
                        switch(tempValue2) {
                            case 0:
                                texture.wrapS = texture.wrapT = THREE.ClampToEdgeWrapping;
                                break;
                            case 1:
                                texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
                                break;
                            case 2:
                                texture.wrapS = texture.wrapT = THREE.MirroredRepeatWrapping;
                                break;
                            default: break;
                        }
                        object.material = new THREE.MeshBasicMaterial({
                            map:texture
                        });
                        object.material.needsUpdate = true;
                        object.traverse( function( child ) {
                            if ( child instanceof THREE.Mesh ) {
                                var tempMat = new THREE.MeshBasicMaterial({
                                    map:texture
                                });
                                var modelComponent = wraper.getComponentByType('MeshFilter');
                                var property3 = modelComponent.getProperty("file");
                                var tempValue3 = property3.getValue();
                                var resInfo3 = gameEditor.getFileInfo(tempValue3.id);
                                if(resInfo3){
                                    var strs = resURL.split(".");
                                    var str = null;
                                    if(strs.length >0)
                                    {
                                        str = strs[strs.length-1]
                                        if(str){
                                            switch(str){
                                                case 'fbx':
                                                    child.material.map = tempMat.map;
                                                    break;
                                                case 'obj':
                                                    child.material = tempMat;
                                                    break;
                                            }
                                        }
                                        child.material.needsUpdate = true;
                                    }
                                }else{
                                    child.material.map = tempMat.map;
                                    child.material.needsUpdate = true;
                                }
                            }
                        });
                        var wraper  = gf.ProjectObj.getWraper(id);
                        var matComponent = wraper.getComponentByType('Material');
                        var property = matComponent.getProperty("side");
                        var tempValue = property.getValue();
                        tempValue = Number(tempValue);
                        if(tempValue != null && typeof(tempValue) !="undefined")
                        {
                            switch(tempValue) {
                                case 0:
                                    object.material.side = THREE.FrontSide;
                                    object.traverse( function( child ) {
                                        if ( child instanceof THREE.Mesh ) {
                                            child.material.side = THREE.FrontSide;
                                            child.material.needsUpdate = true;
                                        }
                                    });
                                    break;
                                case 1:
                                    object.material.side = THREE.BackSide;
                                    object.traverse( function( child ) {
                                        if ( child instanceof THREE.Mesh ) {
                                            child.material.side = THREE.BackSide;
                                            child.material.needsUpdate = true;
                                        }
                                    });
                                    break;
                                case 2:
                                    object.material.side = THREE.DoubleSide;
                                    object.traverse( function( child ) {
                                        if ( child instanceof THREE.Mesh ) {
                                            child.material.side = THREE.DoubleSide;
                                            child.material.needsUpdate = true;
                                        }
                                    });
                                    break;
                                default: break;
                            }
                        }
                    });
                }
                
            });

        } else if(type == 'side') {
            value = Number(value);
            if(object.material == null || typeof(object.material) =="undefined")
            {
                 
            }else{
                switch(value) {
                    case 0:
                        object.material.side = THREE.FrontSide;
                        object.traverse( function( child ) {
                            if ( child instanceof THREE.Mesh ) {
                                child.material.side = THREE.FrontSide;
                                child.material.needsUpdate = true;
                            }
                        });
                        break;
                    case 1:
                        object.material.side = THREE.BackSide;
                        object.traverse( function( child ) {
                            if ( child instanceof THREE.Mesh ) {
                                child.material.side = THREE.BackSide;
                                child.material.needsUpdate = true;
                            }
                        });
                        break;
                    case 2:
                        object.material.side = THREE.DoubleSide;
                        object.traverse( function( child ) {
                            if ( child instanceof THREE.Mesh ) {
                                child.material.side = THREE.DoubleSide;
                                child.material.needsUpdate = true;
                            }
                        });
                        break;
                    default: break;
                }
                object.material.needsUpdate = true;
            }
        }else if(type == 'modes') {
            value = Number(value);
            var wraper  = gf.ProjectObj.getWraper(id);
            var matComponent = wraper.getComponentByType('Material');
            var property1 = matComponent.getProperty("file");
            var tempValue1 = property1.getValue();
            var resInfo1 = gameEditor.getFileInfo(tempValue1.id);
            if(resInfo1){
                if(resInfo1.resURL){
                    var textureLoader = new THREE.TextureLoader();
                    textureLoader.load(resInfo1.resURL, function(texture) {
                        switch(value) {
                            case 0:
                                texture.wrapS = texture.wrapT = THREE.ClampToEdgeWrapping;
                                break;
                            case 1:
                                texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
                                break;
                            case 2:
                                texture.wrapS = texture.wrapT = THREE.MirroredRepeatWrapping;
                                break;
                            default: break;
                        }
                        var tempMat = new THREE.MeshBasicMaterial({
                            map:texture
                        });
                        object.traverse( function( child ) {
                            if ( child instanceof THREE.Mesh ) {
                                child.material.map = tempMat.map;
                                child.material.needsUpdate = true;
                            }
                        });
                    });
                }
            }
        }
    },

    _changeWrapperModel: function(id, type, value, resURL) {
        var _this = this;
        var wrapper = _this.m_objectList[id];
        if (!wrapper) {
            return;
        }
        
        if(tempObjectList == null){
            var temp = tempObjectList[id] = this._createWrapper();
            temp.tempid = tempObjectList[id].tempid = id;
            temp.tempValue = tempObjectList[id].tempValue = value;
        }else{
            var temp = tempObjectList[id];
            if(temp != null){
                if(temp.tempid == id && temp.tempValue == value){
                    return;
                }else{
                    temp.tempid = id;
                    temp.tempValue = value;
                    tempObjectList[id] = temp;
                }
            }else{
                var temp = tempObjectList[id] = this._createWrapper();
                temp.tempid = tempObjectList[id].tempid = id;
                temp.tempValue = tempObjectList[id].tempValue = value;
            }
        }
       
        var object = wrapper.getObjectByName('model');

        if (object) {
            wrapper.remove(object);
            object.useid = id;
        }

        var material = new THREE.MeshBasicMaterial({
            color: 0xa9a9a9,
            side: THREE.DoubleSide
        });
        if(object)
        {
            if(object.material)
            {
                if(object.material.map)
                {
                    if(object.material.map.image.baseURI)
                    {
                        material = object.material;
                    }
                }
            }
        }

        if (type == 'default') {
            switch (value) {
                case 'sphere':
                    object = new THREE.Mesh(new THREE.SphereGeometry(3, 10, 10), material);
                    break;
                case 'cube':
                    object = new THREE.Mesh(new THREE.BoxGeometry(3, 3, 3), material);
                    break;
                case 'plane':
                    object = new THREE.Mesh(new THREE.PlaneGeometry(100, 1, 20, 20), material);
                    break;
                case 'cylinder':
                    object = new THREE.CylinderGeometry(3, 3, 5);
                    break;
                case 'capsule':
                    object = new THREE.Mesh(new THREE.SphereGeometry(3, 10, 10), material);
                    break;
                default:
                    console.log("Error mesh type!");
                    break;
            }
        }

        if (type == 'custom')
        {
            loadingManager.onProgress = function( item, loaded, total ) {
                console.log( item, loaded, total );
            };

            var onProgress = function( xhr ) {
                if ( xhr.lengthComputable ) {
                    var percentComplete = xhr.loaded / xhr.total * 100;
                    console.log( Math.round( percentComplete, 2 ) + '% downloaded' );
                }
            };
            var onError = function( xhr ) {

            };
            var strs = resURL.split(".");
            var str = null;
            if(strs.length >0)
            {
                str = strs[strs.length-1]
            }
            if(str !== null)
            {
                switch(str)
                {
                    case 'fbx':
                        var wraper  = gf.ProjectObj.getWraper(id);
                        var matComponent = wraper.getComponentByType('Material');
                        fbxloader = new THREE.FBXLoader(loadingManager);
                        fbxloader.load(resURL, function( object ) {
                            return function(object,matComponent,wrapper)
                            {
                                object.traverse( function( child ) {
                                    return function(child,object,matComponent,wrapper)
                                    {
                                        if ( child instanceof THREE.Mesh ) {
                                            if(matComponent != null && typeof(matComponent) != "undefined"){
                                                var property = matComponent.getProperty("file");
                                                var value = property.getValue();
                                                var resInfo = gameEditor.getFileInfo(value.id);
                                                texLoader = new THREE.TextureLoader();
                                                texLoader.load(resInfo.resURL, function(texture) {
                                                    var tempMat = new THREE.MeshBasicMaterial({
                                                        map:texture
                                                    });
                                                    child.material.map = tempMat.map;
                                                    child.material.needsUpdate = true;
                                                });
                                            }
                                        }

                                        if ( child instanceof THREE.SkinnedMesh ) {
                                            child.mixer = new THREE.AnimationMixer( child );
                                            child.mixer.id = wrapper.name;
                                            mixers.push( child.mixer );

                                            action = child.mixer.clipAction( child.geometry.animations[ 0 ] );
                                            action.play();
                                        }

                                        if (object) {
                                            object.name = 'model';
                                            object.position.set(0, 0, 0);
                                            wrapper.add(object);
                                        }
                                    }(child,object,matComponent,wrapper);
                                });
                            }(object,matComponent,wrapper);
                        }, onProgress, onError);
                        break;
                    case 'obj':
                        var wraper  = gf.ProjectObj.getWraper(id);
                        var matComponent = wraper.getComponentByType('Material');
                        fbxloader = new THREE.OBJLoader(loadingManager);
                        fbxloader.load(resURL, function( object ) {
                            return function(object,matComponent,wrapper)
                            {
                                object.traverse( function( child ) {
                                    return function(child,object,matComponent,wrapper)
                                    {
                                        if ( child instanceof THREE.Mesh ) {
                                            if(matComponent != null && typeof(matComponent) != "undefined"){
                                                var property = matComponent.getProperty("file");
                                                var value = property.getValue();
                                                var resInfo = gameEditor.getFileInfo(value.id);
  
                                                texLoader = new THREE.TextureLoader();
                                                texLoader.load(resInfo.resURL, function(texture) {
                                                    var tempMat = new THREE.MeshBasicMaterial({
                                                        map:texture
                                                    });
                                                 
                                                    child.material = tempMat;
                                                    child.material.needsUpdate = true;
                                                });
                                            }else{
                                                var tempMat = new THREE.MeshBasicMaterial({
                                                    color: 0xa9a9a9,
                                                    side: THREE.DoubleSide
                                                });
                                             
                                                child.material = tempMat;
                                                child.material.needsUpdate = true;
                                            }
                                        }

                                        if (object) {
                                            object.name = 'model';
                                            object.position.set(0, 0, 0);
                                            wrapper.add(object);
                                        }
                                    }(child,object,matComponent,wrapper);
                                });
                            }(object,matComponent,wrapper);
                        }, onProgress, onError);
                    break;
                }
            }    
        } 

        switch (value) {
            case 'sphere':
            case 'cube':
            case 'plane':
            case 'cylinder':
            case 'capsule':
                if (object) {
                    object.name = 'model';
                    object.position.set(0, 0, 0);
                    wrapper.add(object);
                }
            break;
        }
    },

    _changeWrapperVideo: function(id, type, value, resURL){
        var _this = this;
        var wrapper = _this.m_objectList[id];
        if (!wrapper) {
            return;
        }
        if(type == 'file'){
            var temp = tempVideoList[id];
            if(temp != null){
                if(temp.tempid == id && temp.tempResURL == resURL){
                    return;
                }else{
                    temp.tempid = id;
                    temp.tempResURL = resURL;
                    tempVideoList[id] = temp;
                }
            }else{
                var temp = tempVideoList[id] = this._createWrapper();
                temp.tempid = tempVideoList[id].tempid = id;
                temp.tempResURL = tempVideoList[id].tempResURL = resURL;
            }
            videoControls.startPlay(resURL);
        }

        if(type == 'event'){
            if(!window.video){
                return;
            }
            var temp = tempVideoList[id];
            if(temp != null){
                if(temp.tempid == id && temp.tempValue == value){
                    return;
                }else{
                    temp.tempid = id;
                    temp.tempValue = value;
                    temp.tempResURL = tempVideoList[id].tempResURL;
                    tempVideoList[id] = temp;
                }
            }
            value = Number(value);
            switch(value) {
                case 0:
                    videoControls.play();
                    break;
                case 1:
                    videoControls.pause();
                    break;
                case 2:
                    videoControls.rePlay();
                    break;
                case 3:
                    videoControls.stop();
                    break;
                default:
                    console.log("ERROR VIDEO EVENT!");
                    break;
            }
        }
    },

    _changeWrapperDirectionalLight: function(id,Type,direction,value){
        var _this = this;
        var wrapper = _this.m_objectList[id];
        if (!wrapper) {
            return;
        }
        var directionalLight = new THREE.DirectionalLight( 0xffeedd );
        directionalLight.position.set( 0, 0, 1);
        wrapper.add(directionalLight);
    },

    _changeWrapperTransform: function(id, type, direction, value) {

        if (this.subCameraWraperId == id) {
            switch (type) {
                case 'Position':
                    this.subCamera.position[direction] = value;
                    break;
                case 'Rotation':
                    this.subCamera.rotation[direction] = value;
                    break;
                case 'Scale':
                    this.subCamera.scale[direction] = value;
                    break;
                case 'Transform':
                    this.subCamera.position["x"] = value.Position.x;
                    this.subCamera.position["y"] = value.Position.y;
                    this.subCamera.position["z"] = value.Position.z;
                    break;
                default:
                    break;
            }
        }

        var wrapper = this.m_objectList[id];
        if (wrapper) {
            switch (type) {
                case 'Position':
                    wrapper.position[direction] = value;
                    break;
                case 'Rotation':
                    wrapper.rotation[direction] = value;
                    break;
                case 'Scale':
                    wrapper.scale[direction] = value;
                    break;
                case 'Transform':
                    wrapper.position.set(Number(value.Position.x), Number(value.Position.y), Number(value.Position.z));
                    wrapper.rotation.set(Number(value.Rotation.x), Number(value.Rotation.y), Number(value.Rotation.z));
                    wrapper.scale.set(Number(value.Scale.x), Number(value.Scale.y), Number(value.Scale.z));
                    break;
                default:
                    break;
            }

            this.transformControl.update();
        }
    },

    _addWrapper: function(id,parentID) {
        var _this = this;

        if (this.m_objectList[id]) {
            return;
        }

        var wrapper = this.m_objectList[id] = this._createWrapper();
        wrapper.name = id;

        _this.scene.add(wrapper);

        if (_this.transformControl.object) {
            if(parentID != -1 && typeof(parentID) != "undefined")
                wrapper.parent = _this.transformControl.object;
            _this.transformControl.detach();
        }

        _this.transformControl.attach(wrapper);

        _this.transformControl.addEventListener('change', function(e) {
            var object = e.target.object;

            var wrapper = gameEditor.GetWraper(object.name);
            if (wrapper) {
                /*
                var component = wrapper.getComponentByType('Transform');
                var componentId = component.getId();

                gameEditor.execute("CMD_PROPERTY_CHANGE", {
                    "wraperId": object.name,
                    "componentId": componentId,
                    "propertyKey": 'transform',
                    "value": sValue,
                    userData: userdata
                });
                */
                //console.log(object.position);
                gameEditor.execute("CMD_TRANSFORM_CHANGE", {
                    "wraperId": object.name,
                    "Type": "Position",
                    "value": {
                        x: parseFloat(object.position.x).toFixed(2),
                        y: parseFloat(object.position.y).toFixed(2),
                        z: parseFloat(object.position.z).toFixed(2)
                    },
                    "Type1": "Rotation",
                    "value1": {
                        x: parseFloat(object.rotation.x).toFixed(2),
                        y: parseFloat(object.rotation.y).toFixed(2),
                        z: parseFloat(object.rotation.z).toFixed(2)
                    },
                    "Type2": "Scale",
                    "value2": {
                        x: parseFloat(object.scale.x).toFixed(2),
                        y: parseFloat(object.scale.y).toFixed(2),
                        z: parseFloat(object.scale.z).toFixed(2)
                    }
                });
            }
        });
    },

    _deleteWrapper: function(id) {
        var _this = this;
        if(id == _this.subCameraWraperId)
        {
            this.scene.remove(this.cameraHelper);
            _this.subCamera = null;
        }
        if(id){
            var wraper = gf.ProjectObj.getWraper(id);
            var videoComponent = wraper.getComponentByType('Video');
            if(videoComponent){
                videoControls.pause();
                videoControls.stop();
            }
        }
        _this.transformControl.scale.set( 0, 0, 0 );
        _this.transformControl.detach();
        _this.scene.remove(this.m_objectList[id]);
        var mixer = null;
        for(var i in mixers){
            if(mixers[i].id == id){
                mixer = i;
                break;
            }
        }
        if(mixer){
            mixers.splice(mixer,1);
        }
        delete this.m_objectList[id];
    },

    _createWrapper: function() {
        var wrapper = new THREE.Object3D();
        return wrapper;
    },

    onWrapperSelected: function(id) {
        var _this = this;

        if (_this.transformControl.object) {
            if (id === _this.transformControl.object.name) {
                return;
            }
        }

        var wrapper = this.m_objectList[id];

        _this.transformControl.attach(wrapper);
    },

    _initEvent: function() {
        var _this = this;

        //场景底栏“原始比例”按钮
        $('#SceneInfoScale').on('click', function() {
            scollScale.selectIndex = 2;
            scollScale.size = '100%';
            scollScale.refresh();
        });
        //场景底栏指针位置显示
        var scale = 1;
        //$(".canvasBg").on('mousemove', function(ev) {});
        var wheelScale = function(event, delta) {}
        $("#GameScene").bind('mousewheel', wheelScale);

        var element = _this.renderer.domElement;
        element.addEventListener('mousedown', function(event) {
            var pos = {
                x: event.layerX,
                y: element.clientHeight - event.layerY
            };
            if (event.button == 0) {
                _this.leftButtonDown(event);
            } else if (event.button == 1) {
                _this.middleButtonDown(event);
            } else if (event.button == 2) {
                _this.rightButtonDown(event);
            }
        }, false);

        element.addEventListener('mouseup', function(event) {
            var pos = {
                x: event.layerX,
                y: element.clientHeight - event.layerY
            };
            if (event.button == 0) {
                _this.leftButtonUp(event);
            } else if (event.button == 1) {
                _this.middleButtonUp(event);
            } else if (event.button == 2) {
                _this.rightButtonUp(event);
            }
        }, false);

        element.addEventListener('mousemove', function(event) {
            _this.mouseMove(event);
        }, false);

        element.addEventListener("mousewheel", function(event) {
            _this.mouseWheel(event);
        }, false);

        window.addEventListener('keydown', function(event) {
            _this.onKeyDown(event);
        }, false);

        window.addEventListener('resize', function(e) {
            var container = document.getElementById('canvasBg');

            _this.camera.aspect = container.clientWidth / container.clientHeight;
            _this.camera.updateProjectionMatrix();

            _this.renderer.setSize(container.clientWidth, container.clientHeight);

            var subContainer = document.getElementById('cameraCanvasBg');
            if (_this.subCamera) {
                _this.subCamera.aspect = subContainer.clientWidth / subContainer.clientHeight;
                _this.subCamera.updateProjectionMatrix();
            }
            _this.subRenderer.setSize(subContainer.clientWidth, subContainer.clientHeight);
        }, false);

        eventCenter.on("NOTIFY_WRAPER", function() {
            _this.onWraperChanged.apply(_this, arguments);
        });

        eventCenter.on('', function(gameSetting) { //加载项目设置里
            var aTempDom = $(dom).find('#Cocos2dGameContainer span');
            if (aTempDom.length) {
                var data = gameSetting.data || {};
                data.senceBorder = data.senceBorder || {};
                data.senceBorder.bBorderShow = data.senceBorder.bBorderShow || false;
                if (data.senceBorder.bBorderShow) {
                    aTempDom.css({
                        'display': 'block',
                        'backgroundColor': data.senceBorder.sBorderColor
                    });
                } else {
                    aTempDom.css("display", "none");
                }
            }
        });

        eventCenter.on('NOTIFY_WRAPPER_SELECTED', function() {
            _this.onWrapperSelected.apply(_this, arguments);
        });

        $('.icon-move').on('click', function() {
            if (_this.transformControl) {
                _this.transformControl.setMode("translate");
            }
        });

        $('.icon-zoom').on('click', function() {
            if (_this.transformControl) {
                _this.transformControl.setMode("scale");
            }
        });

        $('.icon-rotate').on('click', function() {
            if (_this.transformControl) {
                _this.transformControl.setMode("rotate");
            }
        });
    }
});

var viewLogic3d = new gf.ViewLogic3d();