Image loading

dist/dwelibs.min.js

@@ -1 +1 @@
-!function(t){var e={};function n(r){if(e[r])return e[r].exports;var i=e[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,n),i.l=!0,i.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)n.d(r,i,function(e){return t[e]}.bind(null,i));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";window.DWE={};n(1),n(2),n(3)},function(t,e,n){"use strict";DWE.context=function(t){return t.star=function(e,n,r,i,o){var a=Math.PI/2*3,u=e,c=n,h=Math.PI/r;t.beginPath(),t.moveTo(e,n-i);for(var s=0;s<r;s++)u=e+Math.cos(a)*i,c=n+Math.sin(a)*i,t.lineTo(u,c),a+=h,u=e+Math.cos(a)*o,c=n+Math.sin(a)*o,t.lineTo(u,c),a+=h;t.lineTo(e,n-i),t.closePath()},t.fillStar=function(e,n,r,i,o){t.star(e,n,r,i,o),t.fill()},t.circle=function(e,n,r,i){i||(i=0),t.beginPath(),t.arc(e,n,r,i,2*Math.PI,!0),t.closePath()},t.fillCircle=function(e,n,r,i){t.circle(e,n,r,i),t.fill()},t}},function(t,e,n){"use strict";var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}();function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}DWE.Math={},DWE.Math.random=function(t,e){return Math.floor(Math.random()*e)+t},DWE.Math.lerp=function(t,e,n){return(1-n)*t+n*e},DWE.Math.reverseLerp=function(t,e,n){return 1/((e-t)*n)},DWE.Math.intersectsBox=function(t,e,n,r,i,o,a,u){return 2*Math.abs(t-i)<=n+a&&2*Math.abs(e-o)<=r+u},DWE.Math.intersects2Box=function(t,e){return 2*Math.abs(t.x-e.x)<=t.width+e.width&&2*Math.abs(t.y-e.y)<=t.height+e.height},DWE.Math.clamp=function(t,e,n){return Math.max(e,Math.min(n,t))},DWE.Math.Vector2=function(){function t(e,n){i(this,t),this.x=e,this.y=n}return r(t,[{key:"normalize",value:function(){var t=this.magnitude;this.x/=t,this.y/=t}},{key:"distance",value:function(t){if(!(t instanceof DWE.Math.Vector2))throw new Error("Distance function takes another Vector2 as an argument.");return Math.abs(Math.sqrt(Math.pow(t.x-this.x,2)+Math.pow(t.y-this.y,2)))}},{key:"magnitude",get:function(){return Math.abs(Math.sqrt(this.x*this.x+this.y*this.y))}}]),t}(),DWE.Math.Box2=function(){function t(e,n,r,o){i(this,t),this.x=e,this.y=n,this.width=r,this.height=o}return r(t,[{key:"intersectsBox",value:function(t){if(!(t instanceof DWE.Math.Box2))throw new Error("Intersection function takes another Box2 as an argument.");return DWE.Math.intersects2Box(this,t)}},{key:"intersectsCircle",value:function(t){if(!(t instanceof DWE.Math.Circle))throw new Error("Intersection function takes another Circle as an argument.");var e=new DWE.Math.Vector2(Math.abs(t.x-this.x),Math.abs(t.y-this.y));return!(e.x>this.width/2+t.r)&&(!(e.y>this.height/2+t.r)&&(e.x<=this.width/2||(e.y<=this.height/2||Math.pow(e.x-this.width/2,2)+Math.pow(e.y-this.height/2,2)<=Math.pow(t.r,2))))}}]),t}(),DWE.Math.Circle=function(){function t(e,n,r){i(this,t),this.x=e,this.y=n,this.r=r}return r(t,[{key:"radius",get:function(){return this.r}}]),t}()},function(t,e,n){"use strict";DWE.getMousePosition=function(t,e){var n=void 0,r=void 0;if(t.changedTouches){var i=t.changedTouches[0];i&&(t.pageX=i.pageX,t.pageY=i.pageY)}return t.pageX||t.pageY?(n=t.pageX,r=t.pageY):(n=t.clientX+document.body.scrollLeft+document.documentElement.scrollLeft,r=t.clientY+document.body.scrollTop+document.documentElement.scrollTop),{x:n-=e.offsetLeft,y:r-=e.offsetTop}}}]);
+!function(t){var e={};function n(r){if(e[r])return e[r].exports;var i=e[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,n),i.l=!0,i.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)n.d(r,i,function(e){return t[e]}.bind(null,i));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";window.DWE={};n(1),n(2),n(3),n(4)},function(t,e,n){"use strict";DWE.context=function(t){return t.star=function(e,n,r,i,o){var a=Math.PI/2*3,h=e,c=n,u=Math.PI/r;t.beginPath(),t.moveTo(e,n-i);for(var s=0;s<r;s++)h=e+Math.cos(a)*i,c=n+Math.sin(a)*i,t.lineTo(h,c),a+=u,h=e+Math.cos(a)*o,c=n+Math.sin(a)*o,t.lineTo(h,c),a+=u;t.lineTo(e,n-i),t.closePath()},t.fillStar=function(e,n,r,i,o){t.star(e,n,r,i,o),t.fill()},t.circle=function(e,n,r,i){i||(i=0),t.beginPath(),t.arc(e,n,r,i,2*Math.PI,!0),t.closePath()},t.fillCircle=function(e,n,r,i){t.circle(e,n,r,i),t.fill()},t}},function(t,e,n){"use strict";var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}();function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}DWE.Math={},DWE.Math.random=function(t,e){return Math.floor(Math.random()*e)+t},DWE.Math.lerp=function(t,e,n){return(1-n)*t+n*e},DWE.Math.reverseLerp=function(t,e,n){return 1/((e-t)*n)},DWE.Math.intersectsBox=function(t,e,n,r,i,o,a,h){return 2*Math.abs(t-i)<=n+a&&2*Math.abs(e-o)<=r+h},DWE.Math.intersects2Box=function(t,e){return 2*Math.abs(t.x-e.x)<=t.width+e.width&&2*Math.abs(t.y-e.y)<=t.height+e.height},DWE.Math.clamp=function(t,e,n){return Math.max(e,Math.min(n,t))},DWE.Math.Vector2=function(){function t(e,n){i(this,t),this.x=e,this.y=n}return r(t,[{key:"normalize",value:function(){var t=this.magnitude;this.x/=t,this.y/=t}},{key:"distance",value:function(t){if(!(t instanceof DWE.Math.Vector2))throw new Error("Distance function takes another Vector2 as an argument.");return Math.abs(Math.sqrt(Math.pow(t.x-this.x,2)+Math.pow(t.y-this.y,2)))}},{key:"magnitude",get:function(){return Math.abs(Math.sqrt(this.x*this.x+this.y*this.y))}}]),t}(),DWE.Math.Box2=function(){function t(e,n,r,o){i(this,t),this.x=e,this.y=n,this.width=r,this.height=o}return r(t,[{key:"intersectsBox",value:function(t){if(!(t instanceof DWE.Math.Box2))throw new Error("Intersection function takes another Box2 as an argument.");return DWE.Math.intersects2Box(this,t)}},{key:"intersectsCircle",value:function(t){if(!(t instanceof DWE.Math.Circle))throw new Error("Intersection function takes another Circle as an argument.");var e=new DWE.Math.Vector2(Math.abs(t.x-this.x),Math.abs(t.y-this.y));return!(e.x>this.width/2+t.r)&&(!(e.y>this.height/2+t.r)&&(e.x<=this.width/2||(e.y<=this.height/2||Math.pow(e.x-this.width/2,2)+Math.pow(e.y-this.height/2,2)<=Math.pow(t.r,2))))}}]),t}(),DWE.Math.Circle=function(){function t(e,n,r){i(this,t),this.x=e,this.y=n,this.r=r}return r(t,[{key:"radius",get:function(){return this.r}}]),t}()},function(t,e,n){"use strict";DWE.getMousePosition=function(t,e){var n=void 0,r=void 0;if(t.changedTouches){var i=t.changedTouches[0];i&&(t.pageX=i.pageX,t.pageY=i.pageY)}return t.pageX||t.pageY?(n=t.pageX,r=t.pageY):(n=t.clientX+document.body.scrollLeft+document.documentElement.scrollLeft,r=t.clientY+document.body.scrollTop+document.documentElement.scrollTop),n-=e.offsetLeft,r-=e.offsetTop,new DWE.Math.Vector2(n,r)}},function(t,e,n){"use strict";DWE.Image={},DWE.Image.Image=function(t){var e=this;this.src=t,this.img=new Image,this.img.src=this.src,this.width=0,this.height=0,this.loaded=!1,this.errored=!1,this.img.onload=function(){e.loaded=!0,e.width=e.img.width,e.height=e.img.height,e.onload&&e.onload.apply(e,[])},this.img.onerror=function(t){e.loaded=!1,e.errored=!0,e.onerror&&e.onerror.apply(e,[t])}},DWE.Image.loadImageArray=function(t){return new Promise(function(e,n){var r=0,i=t.length,o=[];!function a(h){var c=t[h],u=new DWE.Image.Image(c);u.onload=function(){o.push(u),++r==i?e(o):a(r)},u.onerror=function(t){n(t)}}(r)})}}]);

src/image.js

@@ -0,0 +1,63 @@
+
+DWE.Image = {}
+
+DWE.Image.Image = function (src) {
+  this.src = src
+  this.img = new Image()
+  this.img.src = this.src
+
+  this.width = 0
+  this.height = 0
+
+  this.loaded = false
+  this.errored = false
+
+  this.img.onload = () => {
+    this.loaded = true
+    this.width = this.img.width
+    this.height = this.img.height
+
+    if (this['onload']) {
+      this.onload.apply(this, [])
+    }
+  }
+
+  this.img.onerror = (e) => {
+    this.loaded = false
+    this.errored = true
+
+    if (this['onerror']) {
+      this.onerror.apply(this, [e])
+    }
+  }
+}
+
+// Load an array of image URLs
+// Returns a Promise
+DWE.Image.loadImageArray = function (uris) {
+  return new Promise(function (resolve, reject) {
+    let loaded = 0
+    let toLoad = uris.length
+    let images = []
+
+    function loadNext(index) {
+      let uri = uris[index]
+      let img = new DWE.Image.Image(uri)
+      img.onload = function () {
+        images.push(img)
+        loaded++
+
+        if (loaded == toLoad)
+          resolve(images)
+        else
+          loadNext(loaded)
+      }
+
+      img.onerror = function (e) {
+        reject(e)
+      }
+    }
+
+    loadNext(loaded)
+  })
+}

src/index.js

@@ -8,3 +8,6 @@ require('./math.js')
 
 // Mouse helpers
 require('./mouse.js')
+
+// Image helpers
+require('./image.js')

src/mouse.js

@@ -21,5 +21,5 @@ DWE.getMousePosition = function (e, canvas) {
   x -= canvas.offsetLeft
   y -= canvas.offsetTop
 
-  return {x: x, y: y}
+  return new DWE.Math.Vector2(x, y)
 }