Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

crashes Firefox Nightly

By: a guest on Jul 30th, 2011  |  syntax: JavaScript  |  size: 4.00 KB  |  hits: 174  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
This paste has a previous version, view the difference. Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. (function (exports) {
  2.   "use strict";
  3.  
  4.   var
  5.     ss = document.styleSheets[0],
  6.     body = document.body,
  7.     el = document.querySelector('#main');
  8.  
  9.  
  10.   Object.defineProperties(Array.prototype, {
  11.     contains: {
  12.       value: function (item) {
  13.         return this.indexOf(item) > -1;
  14.       }
  15.     },
  16.  
  17.     include: {
  18.       value: function (item) {
  19.         if (!this.contains(item)) {
  20.           this.push(item);
  21.         }
  22.         return this;
  23.       }
  24.     },
  25.  
  26.     remove: {
  27.       value: function (item) {
  28.         var remove = function () {
  29.           var pos = this.indexOf(item);
  30.  
  31.           if (pos > -1) {
  32.             /* THIS MAKES FIREFOX NIGHTLY CRASH AT SOME POINT */
  33.             this.splice(pos, 1);
  34.           }
  35.         };
  36.  
  37.         while (this.contains(item)) {
  38.           remove.call(this);
  39.         }
  40.  
  41.         return this;
  42.       }
  43.     }
  44.   });
  45.  
  46.   Object.defineProperties(Array, {
  47.     from: {
  48.       value: function (obj) {
  49.         return Array.isArray(obj) ? obj : [obj];
  50.       }
  51.     }
  52.   });
  53.  
  54.   var Animorph = function (el) {
  55.     var style = el.style;
  56.  
  57.     return {
  58.       setEvent: function (property, value, separator) {
  59.         el.addEventListener('transitionend', function remover(e) {
  60.           if (e.propertyName === property) {
  61.             this.remove(property, value, separator);
  62.             this.set(property, val);
  63.             el.removeEventListener('transitionend', remover, true);
  64.           }
  65.         }.bind(this), true);
  66.         return this;
  67.       },
  68.      
  69.       add: function (property, value, separator) {
  70.         separator = separator || ', ';
  71.         return this.set(property, (style.getPropertyValue(property) || '').split(separator).remove('').include(value).join(separator));
  72.       },
  73.  
  74.       remove: function (property, value, separator) {
  75.         separator = separator || ', ';
  76.         return this.set(property, (style.getPropertyValue(property) || '').split(separator).remove('').remove(value).join(separator));
  77.       },
  78.  
  79.       set: function (property, value, important) {
  80.         style.setProperty(property, value, important || '');
  81.         return this;
  82.       },
  83.  
  84.       configure: function (property, duration) {
  85.         return this.setEvent('-moz-transition-property', property)
  86.                     .setEvent('-moz-transition-duration', duration)
  87.                     .add('-moz-transition-property', property)
  88.                     .add('-moz-transition-duration', duration);
  89.       },
  90.  
  91.       bgColor: function (color, duration) {
  92.         return this.configure('background-color', duration)
  93.                     .set('background-color', color);
  94.       },
  95.  
  96.       left: function (position, duration) {
  97.         return this.configure('left', duration)
  98.                     .set('left', position);
  99.       },
  100.  
  101.       skew: function (deg, duration) {
  102.         deg = 'skew(' + deg + ')';
  103.         return this.setEvent('-moz-transform', deg, ' ')
  104.                     .configure('-moz-transform', duration)
  105.                     .add('-moz-transform', deg, ' ');
  106.       },
  107.      
  108.       rotate: function (deg, duration) {
  109.         deg = 'rotate(' + deg + ')';
  110.         return this.setEvent('-moz-transform', deg, ' ')
  111.                     .configure('-moz-transform', duration)
  112.                     .add('-moz-transform', deg, ' ');
  113.       },
  114.      
  115.       translate: function (translation, duration) {
  116.         translation = 'translate(' + translation + ')';
  117.         return this.setEvent('-moz-transform', translation, ' ')
  118.                     .configure('-moz-transform', duration)
  119.                     .add('-moz-transform', translation, ' ');
  120.       }
  121.     }
  122.   };
  123.  
  124.   ss.insertRule('body {background-color: red;}', 0);
  125.  
  126.   setTimeout(function () {
  127.     Animorph(el).bgColor('green', '2s').left('400px', '2s').translate('-100px', '2s');
  128.  
  129.     setTimeout(function () {
  130.        Animorph(el).rotate('-15deg', '2s');
  131.       //Animorph(el).skew('40deg', '2s');
  132.     }, 1000);
  133.  
  134.     el.addEventListener('transitionend', function (e) {
  135.      
  136.     }, true);
  137.  
  138.   }, 100);
  139.  
  140. }(window));
create a new version of this paste RAW Paste Data