favico.js update

packages/rocketchat-favico/favico.js

@@ -2,7 +2,7 @@
  * @license MIT
  * @fileOverview Favico animations
  * @author Miroslav Magda, http://blog.ejci.net
- * @version 0.3.9
+ * @version 0.3.10
  */
 
 /**
@@ -68,28 +68,30 @@
 			var isUp = _opt.position.indexOf('up') > -1;
 			var isLeft = _opt.position.indexOf('left') > -1;
 
-			//transform animation
+			//transform the animations
 			if (isUp || isLeft) {
-				for (var i = 0; i < animation.types['' + _opt.animation].length; i++) {
-					var step = animation.types['' + _opt.animation][i];
+				for (var a in animation.types) {
+					for (var i = 0; i < animation.types[a].length; i++) {
+						var step = animation.types[a][i];
 
-					if (isUp) {
-						if (step.y < 0.6) {
-							step.y = step.y - 0.4;
-						} else {
-							step.y = step.y - 2 * step.y + (1 - step.w);
+						if (isUp) {
+							if (step.y < 0.6) {
+								step.y = step.y - 0.4;
+							} else {
+								step.y = step.y - 2 * step.y + (1 - step.w);
+							}
 						}
-					}
 
-					if (isLeft) {
-						if (step.x < 0.6) {
-							step.x = step.x - 0.4;
-						} else {
-							step.x = step.x - 2 * step.x + (1 - step.h);
+						if (isLeft) {
+							if (step.x < 0.6) {
+								step.x = step.x - 0.4;
+							} else {
+								step.x = step.x - 2 * step.x + (1 - step.h);
+							}
 						}
-					}
 
-					animation.types['' + _opt.animation][i] = step;
+						animation.types[a][i] = step;
+					}
 				}
 			}
 			_opt.type = (type['' + _opt.type]) ? _opt.type : _def.type;
@@ -101,7 +103,6 @@
 			_img = document.createElement('img');
 			if (_orig.hasAttribute('href')) {
 				_img.setAttribute('crossOrigin', 'anonymous');
-				_img.setAttribute('src', _orig.getAttribute('href'));
 				//get width/height
 				_img.onload = function() {
 					_h = (_img.height > 0) ? _img.height : 32;
@@ -111,16 +112,19 @@
 					_context = _canvas.getContext('2d');
 					icon.ready();
 				};
+				_img.setAttribute('src', _orig.getAttribute('href'));
 			} else {
+				_img.onload = function() {
+					_h = 32;
+					_w = 32;
+					_img.height = _h;
+					_img.width = _w;
+					_canvas.height = _h;
+					_canvas.width = _w;
+					_context = _canvas.getContext('2d');
+					icon.ready();
+				};
 				_img.setAttribute('src', '');
-				_h = 32;
-				_w = 32;
-				_img.height = _h;
-				_img.width = _w;
-				_canvas.height = _h;
-				_canvas.width = _w;
-				_context = _canvas.getContext('2d');
-				icon.ready();
 			}
 
 		};
@@ -350,12 +354,14 @@
 					var newImg = document.createElement('img');
 					var ratio = (w / _w < h / _h) ? (w / _w) : (h / _h);
 					newImg.setAttribute('crossOrigin', 'anonymous');
+					newImg.onload = function() {
+						_context.clearRect(0, 0, _w, _h);
+						_context.drawImage(newImg, 0, 0, _w, _h);
+						link.setIcon(_canvas);
+					};
 					newImg.setAttribute('src', imageElement.getAttribute('src'));
 					newImg.height = (h / ratio);
 					newImg.width = (w / ratio);
-					_context.clearRect(0, 0, _w, _h);
-					_context.drawImage(newImg, 0, 0, _w, _h);
-					link.setIcon(_canvas);
 				} catch (e) {
 					throw new Error('Error setting image. Message: ' + e.message);
 				}
@@ -449,7 +455,9 @@
 			} catch (e) {
 
 			}
-			_drawTimeout = setTimeout(drawVideo, animation.duration, video);
+			_drawTimeout = setTimeout(function() {
+				drawVideo(video);
+			}, animation.duration);
 			link.setIcon(_canvas);
 		}