laborious spin

laborious_spin.user.js

// ==UserScript==
// @id             laborious spin
// @name           laborious spin
// @version        1.1
// @namespace      saitamanodoruji
// @author         saitamanodoruji
// @description    spin it the hard way
// @include        *
// @run-at         document-end
// @update         2014-12-05
// ==/UserScript==

// cf. http://let.hatelabo.jp/unko-man/let/hLHWv-3firtV

(function(){

  function create_spinner(target_element, angular_velocity, fluctuate_initial_velocity) {
    var spinner = {
      init: function (element) {
        this.target = element;
        if (!this.target.getAttribute('data-spin-status')) {
          this.target.setAttribute('data-spin-status', 0);
          if (angular_velocity) {
            var v = Number(angular_velocity);
            if (v != 0 && v % 360 == 0) {
              this.angular_velocity = 360;
            } else {
              this.angular_velocity = v % 360;
            }
          } else {
            this.angular_velocity = 50;
          }
          if (fluctuate_initial_velocity) {
            var r = Math.random();
            if (r < 0.5) {
              var sign = -1;
            } else {
              var sign = 1;
            }
            var v = this.angular_velocity;
            this.angular_velocity = sign * ((v / 2) + ((v / 2) * Math.random()))
          }
          this.frequency = 15; // [Hz]
          this.rotate(0);
        }
      },
      rotate: function(delta_angle) {
        var matches = this.target.style.transform.match(/rotate\((-)?(\d+(?:\.\d+)?)deg\)/);
        if (!matches || matches.length != 3) {
          var current_angle = 0;
        } else {
          var current_angle = Number((matches[1] ? matches[1] : '') + matches[2]);
        }
        var next_angle = (current_angle + delta_angle) % 360;
        this.target.style.transform = 'rotate(' + next_angle + 'deg)';
      },
      spin: function() {
        this.target.setAttribute('data-spin-status', 1);
        var angle_delta = (this.angular_velocity / this.frequency) % 360;
        var self = this;
        this.interval = setInterval(function(){self.rotate(angle_delta);}, 1000/this.frequency);
      },
      stop: function() {
        clearInterval(this.interval);
        this.target.removeAttribute('data-spin-status');
      }
    }
    spinner.init(target_element)
    return spinner
  }

  function spin(target) {
    var target_element = document.querySelectorAll(target.query_string);
    if (target_element) {
      Array.prototype.slice.call(target_element).forEach(function(e) {
        var spinner = create_spinner(e, target.angular_velocity, target.fluctuate_initial_velocity);
        spinner.spin();
        if (target.duration && Number(target.duration) >= 0) {
          setTimeout(function(){spinner.stop();}, target.duration);
        }
      });
    }
  }

  var spin_targets = [
    {
      query_string: 'img, li, a',
      angular_velocity: 30, // [deg/sec]
      fluctuate_initial_velocity: true,
      // duration: 30000,
    },
    {
      query_string: 'h1',
      angular_velocity: 45,
      fluctuate_initial_velocity: true,
    },
  ]

  spin_targets.forEach(spin);

})();