Add eslint

.eslintrc.js

@@ -0,0 +1,28 @@
+module.exports = {
+  env: {
+    es6: true,
+    browser: true,
+  },
+  extends: [
+    '@metamask/eslint-config',
+    '@metamask/eslint-config/config/nodejs',
+  ],
+  plugins: [
+    'json',
+  ],
+  parserOptions: {
+    ecmaVersion: 2017,
+  },
+  ignorePatterns: [
+    '!.eslintrc.js',
+    'node_modules/',
+    'bundle.js',
+  ],
+  rules: {
+    'no-bitwise': 'off',
+    'no-mixed-operators': 'off',
+    'prefer-destructuring': [
+      'error', { 'array': false, 'object': true },
+    ],
+  },
+}

bundle.js

@@ -1,7 +1,7 @@
 (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
-var copy=require("copy-to-clipboard");document.addEventListener("keypress",function(e){if(99===e.keyCode){var r=document.querySelector("svg").innerHTML;copy('<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="521px" height="521px" version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events">'+r+"</svg>")}});var createViewer=require("../index"),viewer=createViewer({width:.4,height:.4,followMouse:!0,followMotion:!0});document.body.appendChild(viewer.container);
+const copy=require("copy-to-clipboard");document.addEventListener("keypress",function(e){if(99===e.keyCode){const e=document.querySelector("svg").innerHTML;copy('<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="521px" height="521px" version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events">'+e+"</svg>")}});const createViewer=require(".."),viewer=createViewer({width:.4,height:.4,followMouse:!0,followMotion:!0});document.body.appendChild(viewer.container);
 
-},{"../index":3,"copy-to-clipboard":4}],2:[function(require,module,exports){
+},{"..":3,"copy-to-clipboard":4}],2:[function(require,module,exports){
 module.exports={
   "positions": [
     [
@@ -1430,7 +1430,7 @@ module.exports={
 }
 
 },{}],3:[function(require,module,exports){
-var perspective=require("gl-mat4/perspective"),multiply=require("gl-mat4/multiply"),lookAt=require("gl-mat4/lookAt"),invert=require("gl-mat4/invert"),rotate=require("gl-mat4/rotate"),transform=require("gl-vec3/transformMat4"),foxJSON=require("./fox.json"),SVG_NS="http://www.w3.org/2000/svg";function createNode(t){return document.createElementNS(SVG_NS,t)}function setAttribute(t,e,n){t.setAttributeNS(null,e,n)}module.exports=function(t){var e=t||{},n=!!e.followMouse,r=!!e.followMotion,i=!!e.slowDrift,o=!0,a=[0,0],l=.3,u=e.width||400,s=e.height||400,h=createNode("svg"),f={x:0,y:0},d=foxJSON.positions.length,c=new Float32Array(3*d),w=new Float32Array(3*d),g=[];function v(t){var e=h.getBoundingClientRect();f.x=1-2*(t.x-e.left)/e.width,f.y=1-2*(t.y-e.top)/e.height}function A(t,e){this.svg=t,this.indices=e,this.zIndex=0}e.pxNotRatio||(u=window.innerWidth*(e.width||.25)|0,s=0|(window.innerHeight*e.height||u),"minWidth"in e&&u<e.minWidth&&(u=e.minWidth,s=e.minWidth*e.height/e.width|0)),setAttribute(h,"width",u+"px"),setAttribute(h,"height",s+"px"),document.body.appendChild(h),function(){for(var t=foxJSON.positions,e=0,n=0;n<t.length;++n)for(var r=t[n],i=0;i<3;++i)c[e++]=r[i]}();var m=function(){for(var t=[],e=0;e<foxJSON.chunks.length;++e)for(var n=foxJSON.chunks[e],r="rgb("+n.color+")",i=n.faces,o=0;o<i.length;++o){var a=i[o],l=createNode("polygon");setAttribute(l,"fill",r),setAttribute(l,"stroke",r),setAttribute(l,"points","0,0, 10,0, 0,10"),h.appendChild(l),t.push(new A(l,a))}return t}(),p=function(){var t=new Float32Array(3),e=new Float32Array([0,1,0]),n=new Float32Array(16),r=new Float32Array(16),o=lookAt(new Float32Array(16),new Float32Array([0,0,400]),t,e),l=invert(new Float32Array(16),o),u=new Float32Array(16),s=new Float32Array(3),f=new Float32Array(16),d=new Float32Array([1,0,0]),c=new Float32Array([0,1,0]),w=new Float32Array([0,0,1]);return function(){var g=h.getBoundingClientRect(),v=g.width,A=g.height;if(perspective(n,Math.PI/4,v/A,100,1e3),invert(u,n),s[0]=a[0],s[1]=a[1],s[2]=1.2,transform(s,s,u),transform(s,s,l),lookAt(r,t,s,e),i){var m=Date.now()/1e3;rotate(r,r,.1+.2*Math.sin(m/3),d),rotate(r,r,.03*Math.sin(m/2)-.1,w),rotate(r,r,.5+.2*Math.sin(m/3),c)}return multiply(f,n,o),multiply(f,f,r),f}}();function y(t){for(var e=t[0],n=t[1],r=t[2],i=t[3],o=t[4],a=t[5],l=t[6],u=t[7],s=t[8],h=t[9],f=t[10],g=t[11],v=t[12],A=t[13],m=t[14],p=t[15],y=0;y<d;++y){var x=c[3*y],F=c[3*y+1],N=c[3*y+2],M=x*i+F*u+N*g+p;w[3*y]=(x*e+F*o+N*s+v)/M,w[3*y+1]=(x*n+F*a+N*h+A)/M,w[3*y+2]=(x*r+F*l+N*f+m)/M}}function x(t,e){return e.zIndex-t.zIndex}function F(){var t,e=h.getBoundingClientRect(),n=e.width,r=e.height;for(g.length=0,t=0;t<m.length;++t){var i=m[t],o=i.indices,a=o[0],l=o[1],u=o[2],s=w[3*a],f=w[3*a+1],d=w[3*l],c=w[3*l+1],v=w[3*u];if(!((d-s)*(w[3*u+1]-f)-(c-f)*(v-s)<0)){for(var A=[],p=-1/0,y=1/0,F=i.svg,N=0;N<3;++N){var M=o[N];A.push(.5*n*(1-w[3*M])+","+.5*r*(1-w[3*M+1]));var b=w[3*M+2];p=Math.max(p,b),y=Math.min(y,b)}i.zIndex=p+.25*y;var S=A.join(" ");-1===S.indexOf("NaN")&&setAttribute(F,"points",S),g.push(i)}}for(g.sort(x),h.innerHTML="",t=0;t<g.length;++t)h.appendChild(g[t].svg)}function N(){o=!1}function M(){o=!0}function b(){if(o){window.requestAnimationFrame(b);var t=1-l;h.getBoundingClientRect();a[0]=t*a[0]+l*f.x,a[1]=t*a[1]+l*f.y+.085,y(p()),F(),N()}}return window.addEventListener("mousemove",function(t){o||M(),n&&(v({x:t.clientX,y:t.clientY}),b())}),window.addEventListener("deviceorientation",function(t){if(o||M(),r){const e=10;v({x:200+t.gamma*e,y:-300+t.beta*e}),b()}}),b(),{container:h,lookAt:v,setFollowMouse:function(t){n=t},setFollowMotion:function(t){r=t},stopAnimation:N,startAnimation:M,lookAtAndRender:function(t){v(t),a[0]=f.x,a[1]=f.y+.085/l,y(p()),F(),N()}}};
+const perspective=require("gl-mat4/perspective"),multiply=require("gl-mat4/multiply"),lookAt=require("gl-mat4/lookAt"),invert=require("gl-mat4/invert"),rotate=require("gl-mat4/rotate"),transform=require("gl-vec3/transformMat4"),foxJSON=require("./fox.json"),SVG_NS="http://www.w3.org/2000/svg";function createNode(t){return document.createElementNS(SVG_NS,t)}function setAttribute(t,n,e){t.setAttributeNS(null,n,e)}module.exports=function(t){const n=t||{};let e=Boolean(n.followMouse),o=Boolean(n.followMotion);const i=Boolean(n.slowDrift);let r=!0;const l=[0,0],s=.3;let a=n.width||400,c=n.height||400;const u=createNode("svg"),h={x:0,y:0},f=foxJSON.positions.length,d=new Float32Array(3*f),w=new Float32Array(3*f),g=[];function A(t){const n=u.getBoundingClientRect();h.x=1-2*(t.x-n.left)/n.width,h.y=1-2*(t.y-n.top)/n.height}function m(t,n){this.svg=t,this.indices=n,this.zIndex=0}n.pxNotRatio||(a=window.innerWidth*(n.width||.25)|0,c=0|(window.innerHeight*n.height||a),"minWidth"in n&&a<n.minWidth&&(a=n.minWidth,c=n.minWidth*n.height/n.width|0)),setAttribute(u,"width",`${a}px`),setAttribute(u,"height",`${c}px`),document.body.appendChild(u),function(){const t=foxJSON.positions;let n=0;for(let e=0;e<t.length;++e){const o=t[e];for(let t=0;t<3;++t)d[n]=o[t],n+=1}}();const p=function(){const t=[];for(let n=0;n<foxJSON.chunks.length;++n){const e=foxJSON.chunks[n],o=`rgb(${e.color})`,{faces:i}=e;for(let n=0;n<i.length;++n){const e=i[n],r=createNode("polygon");setAttribute(r,"fill",o),setAttribute(r,"stroke",o),setAttribute(r,"points","0,0, 10,0, 0,10"),u.appendChild(r),t.push(new m(r,e))}}return t}(),y=function(){const t=new Float32Array(3),n=new Float32Array([0,1,0]),e=new Float32Array(16),o=new Float32Array(16),r=lookAt(new Float32Array(16),new Float32Array([0,0,400]),t,n),s=invert(new Float32Array(16),r),a=new Float32Array(16),c=new Float32Array(3),h=new Float32Array(16),f=new Float32Array([1,0,0]),d=new Float32Array([0,1,0]),w=new Float32Array([0,0,1]);return function(){const g=u.getBoundingClientRect(),A=g.width,m=g.height;if(perspective(e,Math.PI/4,A/m,100,1e3),invert(a,e),c[0]=l[0],c[1]=l[1],c[2]=1.2,transform(c,c,a),transform(c,c,s),lookAt(o,t,c,n),i){const t=Date.now()/1e3;rotate(o,o,.1+.2*Math.sin(t/3),f),rotate(o,o,.03*Math.sin(t/2)-.1,w),rotate(o,o,.5+.2*Math.sin(t/3),d)}return multiply(h,e,r),multiply(h,h,o),h}}();function x(t){const n=t[0],e=t[1],o=t[2],i=t[3],r=t[4],l=t[5],s=t[6],a=t[7],c=t[8],u=t[9],h=t[10],g=t[11],A=t[12],m=t[13],p=t[14],y=t[15];for(let t=0;t<f;++t){const f=d[3*t],x=d[3*t+1],F=d[3*t+2],v=f*i+x*a+F*g+y;w[3*t]=(f*n+x*r+F*c+A)/v,w[3*t+1]=(f*e+x*l+F*u+m)/v,w[3*t+2]=(f*o+x*s+F*h+p)/v}}function F(t,n){return n.zIndex-t.zIndex}function v(){let t;const n=u.getBoundingClientRect(),e=n.width,o=n.height;for(g.length=0,t=0;t<p.length;++t){const n=p[t],{indices:i}=n,r=i[0],l=i[1],s=i[2],a=w[3*r],c=w[3*r+1],u=w[3*l],h=w[3*l+1],f=w[3*s];if((u-a)*(w[3*s+1]-c)-(h-c)*(f-a)<0)continue;const d=[];let A=-1/0,m=1/0;const y=n.svg;for(let t=0;t<3;++t){const n=i[t];d.push(`${.5*e*(1-w[3*n])},${.5*o*(1-w[3*n+1])}`);const r=w[3*n+2];A=Math.max(A,r),m=Math.min(m,r)}n.zIndex=A+.25*m;const x=d.join(" ");-1===x.indexOf("NaN")&&setAttribute(y,"points",x),g.push(n)}for(g.sort(F),u.innerHTML="",t=0;t<g.length;++t)u.appendChild(g[t].svg)}function N(){r=!1}function M(){r=!0}function b(){if(!r)return;window.requestAnimationFrame(b);const t=1-s;l[0]=t*l[0]+s*h.x,l[1]=t*l[1]+s*h.y+.085,x(y()),v(),N()}return window.addEventListener("mousemove",function(t){r||M(),e&&(A({x:t.clientX,y:t.clientY}),b())}),window.addEventListener("deviceorientation",function(t){if(r||M(),o){const n=10;A({x:200+t.gamma*n,y:-300+t.beta*n}),b()}}),b(),{container:u,lookAt:A,setFollowMouse:function(t){e=t},setFollowMotion:function(t){o=t},stopAnimation:N,startAnimation:M,lookAtAndRender:function(t){A(t),l[0]=h.x,l[1]=h.y+.085/s,x(y()),v(),N()}}};
 
 },{"./fox.json":2,"gl-mat4/invert":6,"gl-mat4/lookAt":7,"gl-mat4/multiply":8,"gl-mat4/perspective":9,"gl-mat4/rotate":10,"gl-vec3/transformMat4":11}],4:[function(require,module,exports){
 "use strict";var deselectCurrent=require("toggle-selection"),defaultMessage="Copy to clipboard: #{key}, Enter";function format(e){var t=(/mac os x/i.test(navigator.userAgent)?"⌘":"Ctrl")+"+C";return e.replace(/#{\s*key\s*}/g,t)}function copy(e,t){var o,r,n,c,s,a,l=!1;t||(t={}),o=t.debug||!1;try{if(n=deselectCurrent(),c=document.createRange(),s=document.getSelection(),(a=document.createElement("span")).textContent=e,a.style.all="unset",a.style.position="fixed",a.style.top=0,a.style.clip="rect(0, 0, 0, 0)",a.style.whiteSpace="pre",a.style.webkitUserSelect="text",a.style.MozUserSelect="text",a.style.msUserSelect="text",a.style.userSelect="text",document.body.appendChild(a),c.selectNode(a),s.addRange(c),!document.execCommand("copy"))throw new Error("copy command was unsuccessful");l=!0}catch(n){o&&console.error("unable to copy using execCommand: ",n),o&&console.warn("trying IE specific stuff");try{window.clipboardData.setData("text",e),l=!0}catch(n){o&&console.error("unable to copy using clipboardData: ",n),o&&console.error("falling back to prompt"),r=format("message"in t?t.message:defaultMessage),window.prompt(r,e)}}finally{s&&("function"==typeof s.removeRange?s.removeRange(c):s.removeAllRanges()),a&&document.body.removeChild(a),n()}return l}module.exports=copy;

convert.js

@@ -1,22 +1,22 @@
-var fs = require('fs')
+const fs = require('fs')
 
 function parseMTL (mtl) {
-  var output = {}
+  const output = {}
   mtl.split('newmtl ').slice(1).forEach(function (block) {
-    var lines = block.split('\r\n')
-    var label = lines[0]
-    var props = {}
+    const lines = block.split('\r\n')
+    const label = lines[0]
+    const props = {}
     lines.slice(1).forEach(function (line) {
       if (line.charAt(0) !== '\t') {
         return
       }
-      var toks = line.split(/\s+/).slice(1)
-      var label = toks[0]
-      var data = toks.slice(1)
+      const toks = line.split(/\s+/u).slice(1)
+      const tokenLabel = toks[0]
+      const data = toks.slice(1)
       if (data.length === 1) {
-        props[label] = +data[0]
+        props[tokenLabel] = Number(data[0])
       } else {
-        props[label] = data.map(function (x) {
+        props[tokenLabel] = data.map(function (x) {
           return Math.sqrt(x).toPrecision(4)
         })
       }
@@ -27,25 +27,26 @@ function parseMTL (mtl) {
   return output
 }
 
-var mtl = parseMTL(fs.readFileSync('fox.mtl').toString('utf8'))
+const mtl = parseMTL(fs.readFileSync('fox.mtl').toString('utf8'))
 
 function parseOBJ (obj) {
-  var lines = obj.split('\r\n')
+  const lines = obj.split('\r\n')
 
-  var positions = []
-  var faceGroups = {}
-  var currentMTL
+  const positions = []
+  const faceGroups = {}
+  let currentMTL
 
   lines.forEach(function (line) {
-    var toks = line.split(/\s+/)
+    const toks = line.split(/\s+/u)
     if (toks.length === 0) {
       return
     }
 
+    let f
     switch (toks[0]) {
       case 'v':
         positions.push(toks.slice(1, 4).map(function (p) {
-          return +p
+          return Number(p)
         }))
         break
       case 'usemtl':
@@ -55,33 +56,35 @@ function parseOBJ (obj) {
         }
         break
       case 'f':
-        var f = toks.slice(1, 4).map(function (tuple) {
+        f = toks.slice(1, 4).map(function (tuple) {
           return (tuple.split('/')[0] | 0) - 1
         })
         if (f[0] !== f[1] && f[1] !== f[2] && f[2] !== f[0]) {
           faceGroups[currentMTL].push(f)
         }
         break
+      default:
+        break
     }
   })
 
-  var chunks = []
+  const chunks = []
   Object.keys(faceGroups).forEach(function (name) {
-    var material = mtl[name]
+    const material = mtl[name]
     chunks.push({
-      color: material.Ka.map(function (c, i) {
+      color: material.Ka.map(function (c) {
         return (255 * c) | 0
       }),
-      faces: faceGroups[name]
+      faces: faceGroups[name],
     })
   })
 
   return {
-    positions: positions,
-    chunks: chunks
+    positions,
+    chunks,
   }
 }
 
-var obj = parseOBJ(fs.readFileSync('fox.obj').toString('utf8'))
+const obj = parseOBJ(fs.readFileSync('fox.obj').toString('utf8'))
 
 console.log(JSON.stringify(obj, null, 2))

example/example.js

@@ -1,23 +1,23 @@
-var copy = require('copy-to-clipboard')
+const copy = require('copy-to-clipboard')
 
 document.addEventListener('keypress', function (event) {
   if (event.keyCode === 99) { // the c key
-    var svg = document.querySelector('svg')
-    var inner = svg.innerHTML
-    var head = '<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" '
-    + '"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> '
-    + '<svg width="521px" height="521px" version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events">'
-    var foot = '</svg>'
+    const svg = document.querySelector('svg')
+    const inner = svg.innerHTML
+    const head = '<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" ' +
+    '"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> ' +
+    '<svg width="521px" height="521px" version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events">'
+    const foot = '</svg>'
 
-     var full = head + inner + foot;
+    const full = head + inner + foot
 
-     copy(full)
+    copy(full)
   }
 })
 
-var createViewer = require('../index')
+const createViewer = require('..')
 
-var viewer = createViewer({
+const viewer = createViewer({
   width: 0.4,
   height: 0.4,
   followMouse: true,