Add model preview to upload page

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>

modules/glmv-upl.js

@@ -0,0 +1,35 @@
+/**
+ * Generate previews when glb or gltf files selected
+ * for upload
+ * 
+ * @param {Event} e
+ */
+checkForGltf = function (e) {
+    fileName = e.target.value
+    if (fileName.match(/(.gl(?:b|(?:tf))$)/)) {
+        const mvPreview = document.createElement('model-viewer')
+        mvPreview.style['width'] = '180px'
+        mvPreview.style['height'] = '180px'
+        mvPreview.toggleAttribute('auto-rotate')
+        mvPreview.setAttribute('auto-rotate-delay',3000)
+
+        const dThumbIn = document.createElement('div')
+        dThumbIn.classList.add('thumbinner')
+        dThumbIn.appendChild(mvPreview)
+
+        const dThumb = document.createElement('div')
+        dThumb.id = 'glmv-upload-thumbnail'
+        dThumb.classList.add('thumb', 'tright')
+        dThumb.appendChild(dThumbIn)
+
+        $('#mw-htmlform-source').before(dThumb)
+
+        const reader = new FileReader()
+        reader.addEventListener("load", () => {
+            $('model-viewer').attr('src',reader.result)
+          },{once: true})
+        reader.readAsDataURL(e.target.files[0])
+    }
+}
+
+$('#wpUploadFile').on('change', checkForGltf)