// Generated by CoffeeScript 1.8.0

/*
 * * space-frame
 * * https://github.com/brewster1134/jquery-space-frame
 * *
 * * Copyright (c) 2012 Ryan Brewster
 * * Licensed under the MIT license.
 */

(function() {
  (function(root, factory) {
    if (typeof define === 'function' && define.amd) {
      return define(['jquery', 'widget'], function($) {
        return factory($);
      });
    } else {
      return factory(jQuery);
    }
  })(this, function($) {
    return $.widget('ui.spaceframe', {
      widgetEventPrefix: 'spaceframe',
      options: {
        transitionDuration: 200,
        transitionTiming: 'ease',
        axis: null,
        lockScrubber: true,
        position: {
          x: 0,
          y: 0
        }
      },
      _create: function() {
        this.$scrubber = this.element.find('.space-scrubber');
        this.$panels = this.element.find('.space-panel');
        this.$scrubber.add(this.$panels).css({
          transitionProperty: 'none'
        });
        this.element.css({
          width: 'auto',
          height: 'auto'
        });
        $(this.$panels.get().reverse()).each(function(i, el) {
          return $(el).css({
            zIndex: i + 1
          });
        });
        this._events();
        return this;
      },
      _init: function() {
        this.panelWidth = this.$panels.eq(0).outerWidth();
        this.panelHeight = this.$panels.eq(0).outerHeight();
        this.element.css({
          width: this.panelWidth,
          height: this.panelHeight
        });
        if (!this.options.axis) {
          this.options.axis = this.element.data('space-axis');
        }
        this.$panels.css({
          position: 'absolute',
          clip: "rect(0px, " + this.panelWidth + "px, " + this.panelHeight + "px, 0)"
        });
        this.$scrubber.add(this.$panels).show();
        this._positionScrubber(this.options.position.x, this.options.position.y);
        this._clipPanels(this.options.position.x, this.options.position.y);
        return this;
      },
      animate: function(x, y, duration, timing) {
        if (duration == null) {
          duration = this.options.transitionDuration;
        }
        if (timing == null) {
          timing = this.options.transitionTiming;
        }
        this.$scrubber.css({
          transitionProperty: 'left, top',
          transitionDuration: "" + duration + "ms",
          transitionTiming: timing
        });
        this.$panels.css({
          transitionProperty: 'clip',
          transitionDuration: "" + duration + "ms",
          transitionTiming: timing
        });
        this.options.position.x = x;
        this.options.position.y = y;
        this._positionScrubber(x, y);
        this._clipPanels(x, y);
        return this;
      },
      refresh: function() {
        this.options.position.x = 0;
        this.options.position.y = 0;
        this._init();
        return this;
      },
      destroy: function() {
        this.$scrubber.hide();
        this.$panels.not(this.$panels.eq(0)).hide();
        this.$panels.eq(0).css({
          position: 'relative'
        });
        this.$panels.css({
          clip: 'inherit'
        });
        return this;
      },
      _events: function() {
        var drag;
        drag = false;
        this.$scrubber.on('mousedown touchstart', (function(_this) {
          return function(e) {
            var eventPosition;
            if ((typeof Modernizr !== "undefined" && Modernizr !== null ? Modernizr.touch : void 0) && e.type === 'mousedown') {
              return;
            }
            e.preventDefault();
            _this.$scrubber.add(_this.$panels).css({
              transitionProperty: 'none'
            });
            drag = true;
            eventPosition = _this._getPositionFromEvent(e);
            _this.options.position.x = eventPosition.x - _this.options.position.x;
            return _this.options.position.y = eventPosition.y - _this.options.position.y;
          };
        })(this));
        this.element.on('mousemove touchmove', (function(_this) {
          return function(e) {
            var eventPosition, left, top;
            if (!drag) {
              return;
            }
            if ((typeof Modernizr !== "undefined" && Modernizr !== null ? Modernizr.touch : void 0) && e.type === 'mousemove') {
              return;
            }
            e.preventDefault();
            eventPosition = _this._getPositionFromEvent(e);
            left = eventPosition.x - _this.options.position.x;
            top = eventPosition.y - _this.options.position.y;
            _this._positionScrubber(left, top);
            return _this._clipPanels(left, top);
          };
        })(this));
        return this.element.on('mouseup touchend', (function(_this) {
          return function(e) {
            var left, top;
            if ((typeof Modernizr !== "undefined" && Modernizr !== null ? Modernizr.touch : void 0) && e.type === 'mouseup') {
              return;
            }
            e.preventDefault();
            drag = false;
            left = parseInt(_this.$scrubber.css('left'));
            top = parseInt(_this.$scrubber.css('top'));
            _this.options.position.x = left;
            return _this.options.position.y = top;
          };
        })(this));
      },
      _getPositionFromEvent: function(event) {
        var x, y;
        if (event.type.indexOf('touch') === 0) {
          x = event.originalEvent.touches[0].clientX;
          y = event.originalEvent.touches[0].clientY;
        } else {
          x = event.clientX;
          y = event.clientY;
        }
        return {
          x: x,
          y: y
        };
      },
      _normalizeCoordinates: function(x, y) {
        if (x < 0) {
          x = 0;
        }
        if (x > this.panelWidth) {
          x = this.panelWidth;
        }
        if (y < 0) {
          y = 0;
        }
        if (y > this.panelHeight) {
          y = this.panelHeight;
        }
        return {
          x: x,
          y: y
        };
      },
      _positionScrubber: function(x, y) {
        var axis, coords, lock;
        axis = this.options.axis;
        lock = this.options.lockScrubber;
        coords = this._normalizeCoordinates(x, y);
        if (lock && axis) {
          if (axis === 'x') {
            return this.$scrubber.css({
              left: coords.x
            });
          } else if (axis === 'y') {
            return this.$scrubber.css({
              top: coords.y
            });
          }
        } else {
          return this.$scrubber.css({
            left: coords.x,
            top: coords.y
          });
        }
      },
      _clipPanels: function(x, y) {
        var coords, panelHeight, panelWidth, scrubberLeft, scrubberTop;
        coords = this._normalizeCoordinates(x, y);
        scrubberLeft = "" + coords.x + "px";
        scrubberTop = "" + coords.y + "px";
        panelWidth = "" + this.panelWidth + "px";
        panelHeight = "" + this.panelHeight + "px";
        if (this.options.axis === 'x') {
          this.$panels.eq(0).css({
            clip: "rect(0px, " + panelWidth + ", " + panelHeight + ", " + scrubberLeft + ")"
          });
          return this.$panels.eq(1).css({
            clip: "rect(0px, " + scrubberLeft + ", " + panelHeight + ", 0px)"
          });
        } else if (this.options.axis === 'y') {
          this.$panels.eq(0).css({
            clip: "rect(" + scrubberTop + ", " + panelWidth + ", " + panelHeight + ", 0px)"
          });
          return this.$panels.eq(1).css({
            clip: "rect(0px, " + panelWidth + ", " + scrubberTop + ", 0px)"
          });
        } else {
          this.$panels.eq(0).css({
            clip: "rect(" + scrubberTop + ", " + panelWidth + ", " + panelHeight + ", " + scrubberLeft + ")"
          });
          this.$panels.eq(1).css({
            clip: "rect(" + scrubberTop + ", " + scrubberLeft + ", " + panelHeight + ", 0px)"
          });
          this.$panels.eq(2).css({
            clip: "rect(0px, " + panelWidth + ", " + scrubberTop + ", " + scrubberLeft + ")"
          });
          return this.$panels.eq(3).css({
            clip: "rect(0px, " + scrubberLeft + ", " + scrubberTop + ", 0px)"
          });
        }
      }
    });
  });

}).call(this);