sprite-player - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

docs/sprite-player.js

 (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+/*
 
+	https://github.com/positlabs/sprite-player
+
+*/
+
+
 const componentName = 'sprite-player'
@@ -7,3 +13,3 @@
 	created(){
-		this.paused = true
+		this._paused = true
 		this._frame = 0
@@ -14,7 +20,4 @@ this._prevTime = Date.now()
 	},
-	inserted(){
-		if(this.autoplay) this.play()
-	},
 	removed(){
-		this.paused = true
+		this._paused = true
 	}
@@ -24,2 +27,7 @@ }
 const accessors = {
+
+	/*
+		attributes
+	*/
+	
 	src: {
@@ -31,6 +39,16 @@ attribute: {},
 			this._img = document.createElement('img')
+			xtag.fireEvent(this, 'loadstart')
+			this._img.onload = () => {
+				xtag.fireEvent(this, 'load')
+				this._resize()
+				if(this.autoplay) this.play()
+			}
+			this._img.onerror = () => {
+				xtag.fireEvent(this, 'error', {message: 'failed to load ' + this._src})
+				this._paused = true
+			}
 			this._img.src = val
-			this._img.onload = () => {this._resize()}
 		}
 	},
+	
 	frames: {
@@ -45,2 +63,3 @@ attribute: {},
 	},
+	
 	rows: {
@@ -51,2 +70,3 @@ attribute: {},
 	},
+	
 	cols: {
@@ -57,6 +77,5 @@ attribute: {},
 	},
+	
 	fps: {
-		attribute: {
-			def: 30
-		},
+		attribute: { def: 30 },
 		get(){return this._fps},
@@ -68,6 +87,30 @@ set(val){
 	},
+	
 	autoplay: { attribute: { boolean: true } },
+	
 	loop: { attribute: { boolean: true } },
-	paused: { attribute: { boolean: true } }
 	
+	/*
+		properties
+	*/
+	paused: {
+		get(){
+			return this._paused
+		},
+		set(val){
+			if(this._paused === val) return
+			this._paused = val
+			if(this._paused){
+				xtag.fireEvent(this, 'pause')
+			}else {
+				xtag.fireEvent(this, 'play')
+				this._onFrame()
+			}
+		},
+	},
+
+	duration: {
+		get(){ return this.frames / this.fps }
+	}
+	
 }
@@ -78,5 +121,8 @@
 		this.paused = false
-		this._onFrame()
 	},
 
+	pause(){
+		this.paused = true
+	},
+
 	_render (){
@@ -103,2 +149,5 @@ xtag.innerHTML(this, `
 
+		// fire playing event on first frame
+		if(this._frame === 0){ xtag.fireEvent(this, 'playing') }
+
 		this._draw()
@@ -110,4 +159,4 @@ this._frame = (this._frame + 1) % this.frames
 			this._paused = true
+			xtag.fireEvent(this, 'ended')
 		}
-
 	},
@@ -114,0 +163,0 @@

package.json

 {
   "name": "sprite-player",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Web component for controlling sprite sheet animations.",
@@ -5,0 +5,0 @@ "main": "docs/sprite-player.js",

No alert changes

Improved metrics

Total package byte prevSize

21417

increased by3.5%

Lines of code

271

increased by14.83%

No dependency changes