dial_rotate

  • /*
     * @title dial_rotate
     * @description ダイヤルで回せます
     * @include http://*
     * @license MIT License
     * @require jQuery
     */
    
    (function($) {
      var throttle;
      throttle = function(fn, delay) {
        var timer;
        timer = null;
        return function() {
          var args, context;
          if (timer) {
            return;
          }
          context = this;
          args = arguments;
          return timer = setTimeout(function() {
            timer = null;
            return fn.apply(context, args);
          }, delay);
        };
      };
      var debounce;
      debounce = function(fn, delay) {
        var timer;
        timer = null;
        return function() {
          var args, context;
          if (timer) {
            clearTimeout(timer);
          }
          context = this;
          args = arguments;
          return timer = setTimeout(function() {
            timer = null;
            return fn.apply(context, args);
          }, delay);
        };
      };
      $.fn.dial = function(callback) {
        var container, last;
        last = null;
        container = this;
        return $(container).mousemove(throttle(function(event) {
          var center, diff, distance, rad, x, y;
          center = {
            left: $(container).position().left + $(container).width() / 2,
            top: $(container).position().top + $(container).height() / 2
          };
          x = event.pageX - center.left;
          y = event.pageY - center.top;
          distance = Math.sqrt(x * x + y * y);
          rad = Math.atan(y / x);
          if (x < 0) {
            rad += Math.PI;
          }
          if (last == null) {
            last = rad;
          }
          diff = rad - last;
          if (diff < -Math.PI) {
            diff += Math.PI * 2;
          }
          if (diff > Math.PI) {
            diff -= Math.PI * 2;
          }
          callback.apply(container, [diff, distance]);
          return last = rad;
        }, 100));
      };
    
      $("img").each(function() {
          $(this).dial(function(diff) {
              var deg = $(this).data("degree") || 0;
              deg += diff / Math.PI * 360.0;
              $(this).data("degree", deg);
              $(this).css({
                  "-webkit-transform": "rotate(" + deg + "deg)",
                  "-moz-transform": "rotate(" + deg + "deg)"
              });
          });
      });
    })(jQuery);
    
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。

History

  1. 2011/09/06 01:47:12 - 2011-09-06
  2. 2011/09/06 01:44:37 - 2011-09-06
  3. 2011/09/06 01:43:12 - 2011-09-06
  4. 2011/09/06 01:42:04 - 2011-09-06