ibms-dome/Frontend/js/forge/modeltest.js

var viewer;
let fragProxy;
var targetFloorZ;
var elevatorSpeed;
var allDbIdsStr;

function launchViewer(urn) {
    var options = {
        env: 'AutodeskProduction',
        getAccessToken: getForgeToken
    };

    Autodesk.Viewing.Initializer(options, () => {
        viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById('forgeViewer'));
        //viewer = new Autodesk.Viewing.Viewer3D(document.getElementById('forgeViewer'));//沒有工具列
        viewer.start();
        var documentId = 'urn:' + urn;
        Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
        
    });
}

function getAllLeafComponents(viewer, callback) {
    var cbCount = 0;
    var tree;
    var jsData = []

    function getLeafComponentsRec(current, parent) {
        cbCount++;
        if (tree.getChildCount(current) != 0) {
            tree.enumNodeChildren(current, function (children) {
                getLeafComponentsRec(children, current);
            }, false);
        }
        var nodeName = viewer.model.getInstanceTree().getNodeName(current)
        jsData.push({ id: current, parent: parent, text: nodeName })

        if (--cbCount == 0) callback(jsData);
    }
    viewer.getObjectTree(function (objectTree) {
        tree = objectTree;
        var rootId = tree.getRootId()
        var nodeName = viewer.model.getInstanceTree().getNodeName(rootId)
        jsData.push({ id: rootId, parent: '#', text: nodeName })
        var allLeafComponents = getLeafComponentsRec(rootId, '#');

    });
}

function onDocumentLoadSuccess(doc) {
    var viewables = doc.getRoot().getDefaultGeometry();
    viewer.loadDocumentNode(doc, viewables).then(i => {
        // documented loaded, any action?
    });
     viewer.addEventListener(Autodesk.Viewing.AGGREGATE_SELECTION_CHANGED_EVENT, (args) => {
         var currSelection = viewer.getSelection();
         var domElem = document.getElementById('id_printer');
         domElem.innerText = currSelection[0];


         //var color = new THREE.Vector4(255 / 255, 0, 0, 1);
         //viewer.setThemingColor(751, color);

         //var color = new THREE.Vector4(0, 1, 0, 1);
         //viewer.setThemingColor(751, color);



         //var dbid = currSelection[0]; //750;
         //var it = NOP_VIEWER.model.getData().instanceTree;
         //var indexinNames = it.nodeAccess.dbIdToIndex[dbid];
         //var indexinStrings = it.nodeAccess.names[indexinNames];
         //var nodeMainString = it.nodeAccess.strings[indexinStrings];
         //var nodeSuffixString = it.nodeAccess.nameSuffixes[indexinStrings];
         //var nodeFinalName = it.getNodeName(dbid);
         //console.log("names: " + indexinNames + ", inStrings: " + indexinStrings + ", nodeMainString: " + nodeMainString + ", nodeSuffix: " + nodeSuffixString);
         //console.log("nodeFinalName: " + nodeFinalName);

         //var vp = viewer.impl.clientToViewport(event.canvasX, event.canvasY);
         //var renderer = viewer.impl.renderer();

         //var dbId = renderer.idAtPixel(vp.x, vp.y);
         //if (dbId) {
         //    console.debug("Selected Id: " + dbId);
         //    //viewer.select(dbId);
         //    //viewer.impl.invalidate(true);
         //    viewer.model.getExternalIdMapping(data => console.log(data));
         //}

         //set color
         //let nodeIdObj = 750;
         //this.viewer.setThemingColor(nodeIdObj, red, this.model);

         //const color = new THREE.Vector4(1.0, 0.0, 0.0, 0.5);
         //viewer.setThemingColor(751, color, null, true);

         var myDbid = currSelection;
         viewer.getProperties(myDbid, function (e) {
             //console.log('Entire object response ', e);
             //console.log('Properties ', e.properties);
             //foreach(item in e.properties) {
             //    if (item.displayName == "【tag_id】") {
             //        console.log(">> " + item.displayValue);
             //    }
             //}

             e.properties.forEach(function (item) {
                 if (item.displayName == "【tag_id】") {
                     console.log(">> " + item.displayValue);
                 }
             });

         });

     });

    //viewer.loadExtension('ToolbarExtension');

   
    viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function () {
     var instanceTree = viewer.model.getData().instanceTree;
     allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
     var domElem = document.getElementById('all_id');
     domElem.innerText = allDbIdsStr;

        

     

     let tree = viewer.model.getData().instanceTree;
    let nodeId = 12112;//12104; //749; //10952;
    let nodeId2 = 12111;//12105; //750;
    let nodeId3 = 12110;//12104; //751;

     tree.enumNodeFragments(nodeId, function (frag) {
         fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
         fragProxy.getAnimTransform();
         let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26

         fragProxy.position = fragPosition

         fragProxy.updateAnimTransform()

     });
        viewer.impl.sceneUpdated(true);

        //------------ add -------------
        tree.enumNodeFragments(nodeId2, function (frag) {
            fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
            fragProxy.getAnimTransform();
            let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26

            fragProxy.position = fragPosition

            fragProxy.updateAnimTransform()

        });
        viewer.impl.sceneUpdated(true);

        tree.enumNodeFragments(nodeId3, function (frag) {
            fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
            fragProxy.getAnimTransform();
            let fragPosition = new THREE.Vector3(0, 0, 0);// 一樓0 二樓15 三樓 26

            fragProxy.position = fragPosition

            fragProxy.updateAnimTransform()

        });
        viewer.impl.sceneUpdated(true);

    });

    //add toolbar fail
    //function ToolbarExtension(viewer, options) {
    //    Autodesk.Viewing.Extension.call(this, viewer, options);
    //}

    //ToolbarExtension.prototype = Object.create(Autodesk.Viewing.Extension.prototype);
    //ToolbarExtension.prototype.constructor = ToolbarExtension;

    //ToolbarExtension.prototype.load = function () {
    //    this.viewer.setLightPreset(6);
    //    this.viewer.setEnvMapBackground(true);
    //    this.viewer.fitToView();
    //    return true;
    //};

    //ToolbarExtension.prototype.unload = function () {

    //};
    //Autodesk.Viewing.theExtensionManager.registerExtension('ToolbarExtension', ToolbarExtension);

    //ToolbarExtension.prototype.onToolbarCreated = function (toolbar) {
    //    //alert('TODO: customize Viewer toolbar');

    //    var viewer = this.viewer;
    //    var button1 = new Autodesk.Viewing.UI.Button('show-env-bg-button');
    //    button1.onClick = function (e) {
    //        viewer.setEnvMapBackground(true);
    //    };
    //    button1.addClass('show-env-bg-button');
    //    button1.setToolTip('Show Environment');

    //    //SubToolbar
    //    this.subToolbar = new Autodesk.Viewing.UI.ControlGroup('my-custom-toolbar');
    //    this.subToolbar.addControl(button1);
    //    toolbar.addControl(this.subToolbar);

    //};


    //NOP_VIEWER.getProperties(NOP_VIEWER.getSelection(), data => console.log(data));
}

function setTransparentBuilding() {
    //allDbIdsStr.forEach((dbId) => {
    //    setTransparency(dbId, 0.2);
    //})

    for (var i = 0; i < allDbIdsStr.length; i++) {
        setTransparency(parseInt(allDbIdsStr[i]) , 0.2);
    }

}

function recoverTransparentBuilding() {
    //allDbIdsStr.forEach((dbId) => {
    //    setTransparency(dbId, 1);
    //})

    for (var i = 0; i < allDbIdsStr.length; i++) {
        setTransparency(parseInt(allDbIdsStr[i]), 1);
    }
}

//設定模型 透明度
function setTransparency(nodeId, opacity) {
    var model = viewer.model;
    //var nodeId = 1633;

    var fragList = viewer.model.getFragmentList();

    var fragIds = []

    model.getData().instanceTree.enumNodeFragments(
        nodeId, (fragId) => {
            fragIds.push(fragId)
        });

    fragIds.forEach((fragId) => {
        //获取材质
        var material = fragList.getMaterial(fragId);

        if (material) {
            //设置透明度
            material.opacity = opacity;//0.5;
            material.transparent = true;
            //标记更新
            material.needsUpdate = true;
        }
    })

    //更新viewer
    viewer.impl.invalidate(true, true, true);
}



function setElevatorFloor(floor) {
    if (floor == 0)
        targetFloorZ = 0;
    else if (floor == 1)
        targetFloorZ = 14.6;// 15;
    else if (floor == 2)
        targetFloorZ = 24.6;// 26;
    else if (floor == 3)
        targetFloorZ = 34.6;
    else if (floor == 4)
        targetFloorZ = 44.6;
    else if (floor == 5)
        targetFloorZ = 54.6;
    else if (floor == 6)
        targetFloorZ = 64.6;
    else if (floor == 7)
        targetFloorZ = 74.6;
    else if (floor == 8)
        targetFloorZ = 84.6;
    else if (floor == 9)
        targetFloorZ = 94.6;
    else if (floor == 10)
        targetFloorZ = 104.6;
    else if (floor == 11)
        targetFloorZ = 114.6;
    else if (floor == 12)
        targetFloorZ = 124.6;
    else if (floor == -1)
        targetFloorZ = -13;
}

function setElevatorSpeed(speed) { //0.01 ~ 1
    elevatorSpeed = speed;
}

function movElevator() {


    let tree = viewer.model.getData().instanceTree;//三組:(749,750,751),(755,756,757),(761,762,763)
    let nodeId = 12112;//12104; //749; //10952;
    let nodeId2 = 12111;//12105; //750;
    let nodeId3 = 12110;//12104; //751;
    let fragProxyZ = 0;
    var movStatus = 0; // 0=no 1=up 2=down
    changeColor(nodeId3);
    //setTransparency(0.2);
    setTransparentBuilding();


    if (fragProxy.position.z > targetFloorZ) {
        movStatus = 2
    }
    else if (fragProxy.position.z < targetFloorZ) {
        movStatus = 1
    }

    if (movStatus == 0) {
        return;
    }

    tree.enumNodeFragments(nodeId, function (frag) {
        fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
        fragProxy.getAnimTransform();
        //let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
        if (movStatus == 2) {
            fragProxy.position.z -= elevatorSpeed;
        }
        else if (movStatus == 1) {
            fragProxy.position.z += elevatorSpeed;
        }

        fragProxyZ = fragProxy.position.z;
        fragProxy.updateAnimTransform()

    });
    viewer.impl.sceneUpdated(true);

    tree.enumNodeFragments(nodeId2, function (frag) {
        fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
        fragProxy.getAnimTransform();
        //let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
        if (movStatus == 2) {
            fragProxy.position.z -= elevatorSpeed;
        }
        else if (movStatus == 1) {
            fragProxy.position.z += elevatorSpeed;
        }

        fragProxyZ = fragProxy.position.z;
        fragProxy.updateAnimTransform()

    });
    viewer.impl.sceneUpdated(true);

    tree.enumNodeFragments(nodeId3, function (frag) {
        fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
        fragProxy.getAnimTransform();
        //let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
        if (movStatus == 2) {
            fragProxy.position.z -= elevatorSpeed;
        }
        else if (movStatus == 1) {
            fragProxy.position.z += elevatorSpeed;
        }

        fragProxyZ = fragProxy.position.z;
        fragProxy.updateAnimTransform()

    });
    viewer.impl.sceneUpdated(true);

    if (movStatus == 2) {
        if (fragProxyZ >= targetFloorZ) {
            requestAnimationFrame(movElevator);
        }
        else {
            hideColor(nodeId3);
            //setTransparency(1);
            recoverTransparentBuilding();
        }
    }
    else if (movStatus == 1) {
        if (fragProxyZ <= targetFloorZ) {
            requestAnimationFrame(movElevator);
        }
        else {
            hideColor(nodeId3);
            //setTransparency(1);
            recoverTransparentBuilding();
        }
    }


    //let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26

    //fragProxy.position = fragPosition;

    //fragProxy.updateAnimTransform();

    //viewer.impl.sceneUpdated(true);
}

function changeColor(nodeId) {//電梯變綠色
    var color = new THREE.Vector4(0, 1, 0, 1);
    viewer.setThemingColor(nodeId, color);
}

function hideColor(nodeId) {//顏色改成透明
    var color = new THREE.Vector4(0, 1, 0, 0);
    viewer.setThemingColor(nodeId, color);
}

//function movElevator() {


//    let tree = viewer.model.getData().instanceTree;
//    let nodeId = 750;// 10952;
//    let fragProxyZ = 0;
//    var movStatus = 0; // 0=no 1=up 2=down


//    if (fragProxy.position.z > targetFloorZ) {
//        movStatus = 2
//    }
//    else if (fragProxy.position.z < targetFloorZ) {
//        movStatus = 1
//    }

//    if (movStatus == 0) {
//        return;
//    }

//    tree.enumNodeFragments(nodeId, function (frag) {
//        fragProxy = viewer.impl.getFragmentProxy(viewer.model, frag);
//        fragProxy.getAnimTransform();
//        //let fragPosition = new THREE.Vector3(0, 0, 15);// 一樓0 二樓15 三樓 26
//        if (movStatus == 2) {
//            fragProxy.position.z -= elevatorSpeed;
//        }
//        else if (movStatus == 1) {
//            fragProxy.position.z += elevatorSpeed;
//        }

//        fragProxyZ = fragProxy.position.z;
//        fragProxy.updateAnimTransform()

//    });
//    viewer.impl.sceneUpdated(true);

//    if (movStatus == 2) {
//        if (fragProxyZ >= targetFloorZ) {
//            requestAnimationFrame(movElevator);
//        }
//    }
//    else if (movStatus == 1) {
//        if (fragProxyZ <= targetFloorZ) {
//            requestAnimationFrame(movElevator);
//        }
//    }


//    //let fragPosition = new THREE.Vector3(position);// 一樓0 二樓15 三樓 26

//    //fragProxy.position = fragPosition;

//    //fragProxy.updateAnimTransform();

//    //viewer.impl.sceneUpdated(true);
//}

function getAllDbIds(viewer) {
    var instanceTree = viewer.model.getData().instanceTree;

    var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);

    return allDbIdsStr.map(function (id) { return parseInt(id) });
}

//釋放viewer
function ReleaseViewer() {
    viewer.finish();
    viewer = null;
    Autodesk.Viewing.shutdown();
}

//擴展類 刪除添加的所有DOM元素和事件
//ToolbarExtension.prototype.unload = function () {
//    if (this.subToolbar) {
//        this.viewer.toolbar.removeControl(this.subToolbar);
//        this.subToolbar = null;
//    }
//};


// ---- 模型剖面 ----
function getCutPlaneParam(idx, n) {
    if (idx < 0 || !n) return;

    const level = this.levels[idx];
    if (!level) return;

    //const precision = Autodesk.Viewing.Private.calculatePrecision( level.elevation  );
    const model = this.viewer.model;
    const globalOffset = model.getData().globalOffset;
    const units = model.getUnitString();
    const elevRaw = Autodesk.Viewing.Private.convertUnits('ft', units, 1, level.elevation);

    let d = elevRaw - globalOffset.z - 0.5;
    if (n == 1)
        d = -1 * d;

    return new THREE.Vector4(0, 0, n, d);
}

function onButtonClicked() {
    const upperSelector = document.getElementById('adn-upper-lvl-selector');
    const lowerSelector = document.getElementById('adn-lower-lvl-selector');

    if (!upperSelector || !lowerSelector)
        return;

    const upperIdx = upperSelector.selectedIndex;
    const upperCutPlaneParam = this.getCutPlaneParam(upperIdx, 1);
    const lowerIdx = lowerSelector.selectedIndex;
    const lowerCutPlaneParam = this.getCutPlaneParam(lowerIdx, -1);

    this.viewer.setCutPlanes([upperCutPlaneParam, lowerCutPlaneParam]);
}

function displayCuttedPlane() {

}

/**
 * Autodesk.Viewing.Document.load() failuire callback.
 */
function onDocumentLoadFailure(viewerErrorCode) {
    console.error("onDocumentLoadFailure() - errorCode:" + viewerErrorCode);
}

function getForgeToken(callback) {
    fetch(baseApiUrl + '/api/forge/oauth/token').then(res => {
        res.json().then(data => {
            callback(data.dictionary.access_token, data.dictionary.expires_in);
        });
    });
    //callback("eyJhbGciOiJSUzI1NiIsImtpZCI6IlU3c0dGRldUTzlBekNhSzBqZURRM2dQZXBURVdWN2VhIn0.eyJzY29wZSI6WyJkYXRhOndyaXRlIiwiZGF0YTpyZWFkIiwiYnVja2V0OnJlYWQiLCJidWNrZXQ6dXBkYXRlIiwiYnVja2V0OmNyZWF0ZSJdLCJjbGllbnRfaWQiOiJUQTNocXNGZnpRYk5PVVhLcGxkS1VLU2V3NFNKMjF3NSIsImF1ZCI6Imh0dHBzOi8vYXV0b2Rlc2suY29tL2F1ZC9hand0ZXhwNjAiLCJqdGkiOiJiemxzWE5qWElvZ2R1UjUzTUJkdlhrTTNTT01qeVB1bHJrMmdTVWJudGNTeDg1b01kRG1xejg3Z05jenJkRzhpIiwiZXhwIjoxNjY4MTgzMDM2fQ.VU3qLwTJ9nlXnomKCdk4y5UcgszGEO_zlvE7w5mWWajeBMwKLo-zw7LJEqUEajRksvssppR9SbVsjLSx-vDVc3DRhCo3jYTWKPT1T3wQrlkOSqLeIrAdnKdBDNBWKgrGJt_xcmXc3dZ3XNKf9L_F6Ex808rUlo6cem1mcPpKl1jCBDqKu1mAX7aDtZ65TTQZbGGhbG4HdnET-d1i5w4LunGN11UAHhDUW3n0SWWIBL27PiiUQONZttajhD5st6IngYLcjr93BYVyJmDF7-wm4WZlHSw2OnXIfbJcFXEd83uVv_Rej4UXjzZ0e6kHwzc2nvGvKSIFu3Nt7CabdR8CkA", 3599);
}

async function loadHeatmaps(model) {

    const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");

    // Given a model loaded from Forge
    const structureInfo = new Autodesk.DataVisualization.Core.ModelStructureInfo(model);

    const devices = [
        {
            id: "Oficina 6",
            name: "Oficina-",
            position: { x: 22.475382737884104, y: 7.4884431474006163, z: 3.0 },
            sensorTypes: ["temperature", "humidity"]
        }
    ];

    var offset = Autodesk.viewer.model.getGlobalOffset();
    removeOffset(devices[0], offset)

    // Generates `SurfaceShadingData` after assigning each device to a room.

    const shadingData = await Autodesk.structureInfo.generateSurfaceShadingData(devices);

    // Use the resulting shading data to generate heatmap from.
    await dataVizExtn.setupSurfaceShading(model, shadingData);

    // Register color stops for the heatmap. Along with the normalized sensor value
    // in the range of [0.0, 1.0], `renderSurfaceShading` will interpolate the final
    // heatmap color based on these specified colors.
    const sensorColors = [0x0000ff, 0x00ff00, 0xffff00, 0xff0000];

    // Set heatmap colors for temperature
    const sensorType = "temperature";
    dataVizExtn.registerSurfaceShadingColors(sensorType, sensorColors);

    // Function that provides sensor value in the range of [0.0, 1.0]

    function getSensorValue(surfaceShadingPoint, sensorType) {
        // The `SurfaceShadingPoint.id` property matches one of the identifiers passed
        // to `generateSurfaceShadingData` function. In our case above, this will either
        // be "cafeteria-entrace-01" or "cafeteria-exit-01".
        const deviceId = surfaceShadingPoint.id;

        // Read the sensor data, along with its possible value range
        let sensorValue = readSensorValue(deviceId, sensorType);
        const maxSensorValue = getMaxSensorValue(sensorType);
        const minSensorValue = getMinSensorValue(sensorType);

        // Normalize sensor value to [0, 1.0]
        sensorValue = (sensorValue - minSensorValue) / (maxSensorValue - minSensorValue);
        return clamp(sensorValue, 0.0, 1.0);
    }

    // This value can also be a room instead of a floor
    const floorName = "01 - Entry Level";
    dataVizExtn.renderSurfaceShading(floorName, sensorType, getSensorValue);


    
}