model-manager 0.0.3-1.0

package/js/load_items.js

@@ -0,0 +1,467 @@
+import { GLTFLoader } from '../assets/three/GLTFLoader.js'
+import { OrbitControls } from '../assets/three/OrbitControls.js'
+window.api.send("database_request", "rqID");
+
+const items = []
+window.api.receive('item_channel', function (data, evt) {
+
+  items.push(data)
+  var item = document.createElement('div');
+  item.className = "grid-item";
+  item.dataset.identifier = data[0].count;
+  // grid picture div
+  var grid_pic = document.createElement('div');
+  grid_pic.className = "grid-picture";
+  var grid_pic_img = document.createElement('img');
+  // get img path
+  grid_pic_img.src = data[0].thumbnail;
+  grid_pic_img.width = 190;
+  grid_pic.appendChild(grid_pic_img);
+  item.appendChild(grid_pic);
+
+
+  // grid label
+  var grid_label = document.createElement('h4');
+  grid_label.className = "grid-label"
+  grid_label.innerText = data[0].modelname
+  item.appendChild(grid_label)
+  // grid data
+  var grid_data = document.createElement('div');
+  grid_data.className = "grid-data"
+  // span textures
+  var grid_textures = document.createElement('div');
+  grid_textures.className = "grid-textures";
+  var span_textures = document.createElement('span');
+  // span_textures.dataset.tooltip = "Textures";
+  span_textures.dataset.flow = "bottom";
+  var img_textures = document.createElement('img');
+  if (data[0].has_textures === true) {
+      
+      img_textures.src = "assets/white/brush_white_24dp.svg";
+      span_textures.appendChild(img_textures);
+      grid_textures.appendChild(span_textures);
+      grid_data.appendChild(grid_textures);
+  }
+  // span anims
+  var grid_anims = document.createElement('div');
+  grid_anims.className = "grid-anims";
+  var span_anims = document.createElement('span');
+  // span_anims.dataset.tooltip = "Animations";
+  span_anims.dataset.flow = "bottom";
+  var img_anims = document.createElement('img');
+  if (data[0].has_animations === true) {
+      img_anims.src = "assets/white/emoji_people_white_24dp.svg";
+      span_anims.appendChild(img_anims);
+      grid_anims.appendChild(span_anims);
+      grid_data.appendChild(grid_anims);
+  }
+  var grid_behavior = document.createElement('div');
+  grid_behavior.className = "grid-behavior";
+  var span_behavior = document.createElement('span');
+  // span_behavior.dataset.tooltip = "Behavior";
+  span_behavior.dataset.flow = "bottom";
+  var img_behavior = document.createElement('img');
+  // span behavior
+  if (data[0].bp === true) {
+      img_behavior.src = "assets/white/code_white_24dp.svg";
+      
+  }
+  span_behavior.appendChild(img_behavior);
+  grid_behavior.appendChild(span_behavior);
+  grid_data.appendChild(grid_behavior);
+  // span vr
+  var grid_view_vr = document.createElement('div');
+  grid_view_vr.className = "grid-view-vr";
+  var span_vr = document.createElement('span');
+  // span_vr.dataset.tooltip = "3D View";
+  span_vr.dataset.flow = "bottom";
+  var img_vr = document.createElement('img');
+  img_vr.src = "assets/white/view_in_ar_white_24dp.svg";
+  span_vr.appendChild(img_vr);
+  grid_view_vr.appendChild(span_vr);
+  grid_data.appendChild(grid_view_vr);
+  // finalize
+  grid_data.appendChild(grid_textures);
+  grid_data.appendChild(grid_anims);
+  grid_data.appendChild(grid_behavior);
+  grid_data.appendChild(grid_view_vr);
+  item.appendChild(grid_data);
+  // add item to items sections
+  document.getElementById('items').appendChild(item);
+  item.dataset.modelname = data[0].modelname
+  item.dataset.modelcreator = data[0].modelcreator
+  item.dataset.modelpath = data[0].model_path
+  
+
+  // set item data so we can work with it later
+  item.dataset.behaviors = data[0].behaviors
+  item.dataset.textures = data[0].textures
+  item.dataset.animation = data[0].animations
+  item.dataset.tags = data[0].tags
+
+  document.querySelectorAll('.grid-item').forEach(function(item) {
+      item.addEventListener('click', function() {
+        document.getElementById("item-dialog").classList.add("visable");
+        document.getElementById("body-overlay").classList.add("visable");
+
+        // iterate over dataset array and place all the checklist items
+        var animationsArray = item.dataset.animation.split(",");
+        // clear the list first
+        document.getElementById("animation_listing").innerHTML = ""
+        animationsArray.forEach(function (animation) {
+          // create elements
+          var checkListItem = document.createElement('label');
+          checkListItem.classList = "control control-checkbox";
+          checkListItem.innerHTML = animation;
+          var inputCheckbox = document.createElement('input');
+          inputCheckbox.type = "checkbox";
+          var control_indicator = document.createElement("div");
+          control_indicator.classList = "control_indicator";
+
+          // append items
+          checkListItem.append(inputCheckbox);
+          checkListItem.append(control_indicator);
+
+          // append behavior item to behavior list
+          document.getElementById("animation_listing").append(checkListItem)
+        });
+        
+        // iterate over dataset array and place all the checklist items
+        var texturesArray = item.dataset.textures.split(",");
+        // clear the list first
+        document.getElementById("textures_listing").innerHTML = ""
+        texturesArray.forEach(function (textures) {
+          // create elements
+          var checkListItem = document.createElement('label');
+          checkListItem.classList = "control control-checkbox";
+          checkListItem.innerHTML = textures;
+          var inputCheckbox = document.createElement('input');
+          inputCheckbox.type = "checkbox";
+          var control_indicator = document.createElement("div");
+          control_indicator.classList = "control_indicator";
+
+          // append items
+          checkListItem.append(inputCheckbox);
+          checkListItem.append(control_indicator);
+
+          // append behavior item to behavior list
+          document.getElementById("textures_listing").append(checkListItem)
+        });
+
+        // iterate over dataset array and place all the checklist items
+        var behaviorsArray = item.dataset.behaviors.split(",");
+        // clear the list first
+        document.getElementById("behavior_listing").innerHTML = ""
+        behaviorsArray.forEach(function (behavior) {
+          // create elements
+          var checkListItem = document.createElement('label');
+          checkListItem.classList = "control control-checkbox";
+          checkListItem.innerHTML = behavior;
+          var inputCheckbox = document.createElement('input');
+          inputCheckbox.type = "checkbox";
+          var control_indicator = document.createElement("div");
+          control_indicator.classList = "control_indicator";
+
+          // append items
+          checkListItem.append(inputCheckbox);
+          checkListItem.append(control_indicator);
+
+          // append behavior item to behavior list
+          document.getElementById("behavior_listing").append(checkListItem)
+        });
+
+
+
+
+
+
+
+
+        // reset the button
+        document.getElementById("addtocart").dataset.id = item.dataset.modelname;
+        document.getElementById("addtocart").addEventListener('click', event => {
+          window.api.send("storage_request", document.getElementById("addtocart").dataset.id)
+          //! close dialog
+          document.getElementById("item-dialog").classList.remove("visable");
+          document.getElementById("body-overlay").classList.remove("visable");
+        });
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+        document.getElementById("item-dialog-name").innerText = item.dataset.modelname
+        document.getElementById("item-dialog-creator").innerText = "by " + item.dataset.modelcreator
+
+        var scene = new THREE.Scene();
+        var camera = new THREE.PerspectiveCamera(
+          70,
+          350/350,
+          .03,
+          1000
+        );
+        var renderer = new THREE.WebGLRenderer();
+        renderer.setSize(350,350);
+        document.getElementById("model-view").innerHTML = ""
+
+        // text here
+        var model_view_text = document.createElement('div');
+        document.getElementById("model-view").appendChild(model_view_text)
+        document.getElementById("model-view").appendChild(renderer.domElement)
+  
+  
+        var loader = new GLTFLoader();
+        var obj;
+        loader.load(item.dataset.modelpath, function(gltf) {
+          obj = gltf.scene;
+          obj.position.y = -1.3
+          obj.rotation.y = -1.57
+          scene.add(obj);
+        });
+  
+        
+        const size = 10;
+        const divisions = 10;
+        
+        const gridHelper = new THREE.GridHelper( size, divisions );
+        gridHelper.position.set(0, -1.3, 0)
+        scene.add( gridHelper );
+  
+        var ambient = new THREE.AmbientLight(0xffffff, 1);
+        ambient.position.set(0,1,0);
+        ambient.castShadow = true;
+        scene.add(ambient);
+        renderer.outputEncoding = THREE.sRGBEncoding;
+        scene.background = new THREE.Color("rgb(45, 48, 52);")
+  
+        const controls = new OrbitControls(camera,renderer.domElement);
+  
+
+       
+  
+        camera.position.y = 1;
+        camera.position.x = 3;
+        function animate() {
+          requestAnimationFrame(animate);
+          renderer.render(scene,camera);
+          //obj.rotation.y += 0.003;
+          controls.update()
+        }
+        animate();
+      });
+  });
+});
+
+
+window.api.receive('renderer', function (data, evt) {
+  if(data = "stop-spinner") {
+    document.getElementById("loading").remove()
+  }
+});
+
+
+document.querySelector("[data-search]").addEventListener("input", (e) => {
+  const value = e.target.value;
+
+  var itemCopy = [...items];
+  if (value != "") {
+    for(var i = 0; i < items.length; i++) {
+      var cube = items[i];
+      for(var j = 0; j < cube.length; j++) {
+        var obj = cube[j];
+        if (obj.modelname.toLowerCase().includes(value.toLowerCase())) {
+        } else {
+          itemCopy[i] = undefined;
+        }
+      }
+    }
+  }
+  
+  var filtered = itemCopy.filter(function (el) {
+    return el != null;
+  });
+  
+
+  // display filtered
+  document.getElementById("items").innerHTML = "";
+  for(var i = 0; i < filtered.length; i++) {
+    var cube = filtered[i];
+    if (cube == undefined) {
+      break;
+    }
+    for(var j = 0; j < cube.length; j++) {
+      var obj = cube[j];
+      var item = document.createElement('div');
+      item.className = "grid-item";
+      item.dataset.identifier = obj.count;
+      // grid picture div
+      var grid_pic = document.createElement('div');
+      grid_pic.className = "grid-picture";
+      var grid_pic_img = document.createElement('img');
+      grid_pic_img.src = obj.thumbnail;
+      grid_pic_img.width = 190;
+      grid_pic.appendChild(grid_pic_img);
+      item.appendChild(grid_pic);
+      // grid label
+      var grid_label = document.createElement('h4');
+      grid_label.className = "grid-label"
+      grid_label.innerText = obj.modelname
+      item.appendChild(grid_label)
+      // grid data
+      var grid_data = document.createElement('div');
+      grid_data.className = "grid-data"
+      // span textures
+      var grid_textures = document.createElement('div');
+      grid_textures.className = "grid-textures";
+      var span_textures = document.createElement('span');
+      // span_textures.dataset.tooltip = "Textures";
+      span_textures.dataset.flow = "bottom";
+      var img_textures = document.createElement('img');
+      if (obj.has_textures === true) {
+          
+          img_textures.src = "assets/white/brush_white_24dp.svg";
+          span_textures.appendChild(img_textures);
+          grid_textures.appendChild(span_textures);
+          grid_data.appendChild(grid_textures);
+      }
+      // span anims
+      var grid_anims = document.createElement('div');
+      grid_anims.className = "grid-anims";
+      var span_anims = document.createElement('span');
+      // span_anims.dataset.tooltip = "Animations";
+      span_anims.dataset.flow = "bottom";
+      var img_anims = document.createElement('img');
+      if (obj.has_animations === true) {
+          img_anims.src = "assets/white/emoji_people_white_24dp.svg";
+          span_anims.appendChild(img_anims);
+          grid_anims.appendChild(span_anims);
+          grid_data.appendChild(grid_anims);
+      }
+      var grid_behavior = document.createElement('div');
+      grid_behavior.className = "grid-behavior";
+      var span_behavior = document.createElement('span');
+      // span_behavior.dataset.tooltip = "Behavior";
+      span_behavior.dataset.flow = "bottom";
+      var img_behavior = document.createElement('img');
+      // span behavior
+      if (obj.bp === true) {
+          img_behavior.src = "assets/white/code_white_24dp.svg";
+          
+      }
+      span_behavior.appendChild(img_behavior);
+      grid_behavior.appendChild(span_behavior);
+      grid_data.appendChild(grid_behavior);
+      // span vr
+      var grid_view_vr = document.createElement('div');
+      grid_view_vr.className = "grid-view-vr";
+      var span_vr = document.createElement('span');
+      // span_vr.dataset.tooltip = "3D View";
+      span_vr.dataset.flow = "bottom";
+      var img_vr = document.createElement('img');
+      img_vr.src = "assets/white/view_in_ar_white_24dp.svg";
+      span_vr.appendChild(img_vr);
+      grid_view_vr.appendChild(span_vr);
+      grid_data.appendChild(grid_view_vr);
+      // finalize
+      grid_data.appendChild(grid_textures);
+      grid_data.appendChild(grid_anims);
+      grid_data.appendChild(grid_behavior);
+      grid_data.appendChild(grid_view_vr);
+      item.appendChild(grid_data);
+      // add item to items sections
+      document.getElementById('items').appendChild(item);
+      item.dataset.modelname = obj.modelname
+      item.dataset.modelcreator = obj.modelcreator
+      item.dataset.modelpath = obj.model_path
+      
+      document.querySelectorAll('.grid-item').forEach(function(item) {
+          item.addEventListener('click', function() {
+            document.getElementById("item-dialog").classList.add("visable");
+            document.getElementById("body-overlay").classList.add("visable");
+            document.getElementById("item-dialog-name").innerText = item.dataset.modelname
+            document.getElementById("item-dialog-creator").innerText = "by " + item.dataset.modelcreator
+
+            var scene = new THREE.Scene();
+            var camera = new THREE.PerspectiveCamera(
+              70,
+              350/350,
+              .03,
+              1000
+            );
+            var renderer = new THREE.WebGLRenderer();
+            renderer.setSize(350,350);
+            document.getElementById("model-view").innerHTML = ""
+
+            // text here
+            var model_view_text = document.createElement('div');
+
+            document.getElementById("model-view").appendChild(model_view_text)
+            document.getElementById("model-view").appendChild(renderer.domElement)
+      
+      
+            var loader = new GLTFLoader();
+            var obj;
+            loader.load(item.dataset.modelpath, function(gltf) {
+              obj = gltf.scene;
+              obj.position.y = -1.3
+              obj.rotation.y = -1.57
+              scene.add(obj);
+            });
+      
+      
+            var ambient = new THREE.AmbientLight(0xffffff, 1);
+            ambient.position.set(0,1,0);
+            ambient.castShadow = true;
+            scene.add(ambient);
+            renderer.outputEncoding = THREE.sRGBEncoding;
+            scene.background = new THREE.Color("rgb(45, 48, 52);");
+      
+            const controls = new OrbitControls(camera,renderer.domElement);
+      
+            const size = 10;
+            const divisions = 10;
+            
+            const gridHelper = new THREE.GridHelper( size, divisions );
+            gridHelper.position.set(0, -1.3, 0)
+            scene.add( gridHelper );
+            
+            function resizeCanvasToDisplaySize() {
+              const canvas = renderer.domElement;
+              const width = canvas.clientWidth;
+              const height = canvas.clientHeight;
+              if (canvas.width !== width ||canvas.height !== height) {
+                // you must pass false here or three.js sadly fights the browser
+                renderer.setSize(width, height, false);
+                camera.aspect = width / height;
+                camera.updateProjectionMatrix();
+            
+                // set render target sizes here
+              }
+            }
+
+      
+            camera.position.y = 1;
+            camera.position.x = 3;
+            function animate() {
+              requestAnimationFrame(animate);
+              renderer.render(scene,camera);
+              //obj.rotation.y += 0.003;
+              controls.update()
+            }
+            animate();
+          });
+      });
+    }
+  }
+});

package/js/update.js

@@ -0,0 +1,35 @@
+const uaup = require('uaup-js');
+
+const defaultStages = {
+    Checking: "Checking For Updates!", // When Checking For Updates.
+    Found: "Update Found!",  // If an Update is Found.
+    NotFound: "No Update Found.", // If an Update is Not Found.
+    Downloading: "Downloading...", // When Downloading Update.
+    Unzipping: "Installing...", // When Unzipping the Archive into the Application Directory.
+    Cleaning: "Finalizing...", // When Removing Temp Directories and Files (ex: update archive and tmp directory).
+    Launch: "Launching..." // When Launching the Application.
+};
+
+
+const updateOptions = {
+    useGithub: true,
+    gitRepo: "Mine-North-Model-Tool",
+    gitUsername: "Mine-North", 
+    isGitRepoPrivate: true, 
+    gitRepoToken: "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",
+
+    appName: "model-tool",
+    appExecutableName: "model-manager.exe",
+
+    progressBar: document.getElementById("download"), 
+    label: document.getElementById("download-label"),
+    stageTitles: defaultStages
+};
+
+uaup.Update(updateOptions);
+
+const progressbar = document.getElementById("download");
+
+while  (progressbar.value == 100) {
+    alert("t")
+}