este-library-oldschool/este/ui/resizer/resizer.js

Library for github.com/steida/este.git

// Generated by github.com/steida/coffee2closure 900.1.18
/**
  @fileoverview Simple resizer for images, iframes, elements.
  @see /demos/ui/resizer.html
 */
var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.superClass_ = parent.prototype; return child; },
  hasProp = {}.hasOwnProperty;
goog.provide('este.ui.Resizer');
goog.require('este.events.Delegation.create');
goog.require('este.ui.Component');
goog.require('este.ui.resizer.Handles.create');

/**
  @param {Function} delegationFactory
  @param {Function} handlesFactory
  @constructor
  @extends {este.ui.Component}
 */
este.ui.Resizer = function(delegationFactory, handlesFactory) {
  this.delegationFactory = delegationFactory;
  this.handlesFactory = handlesFactory;
  este.ui.Resizer.superClass_.constructor.call(this);
}
extend(este.ui.Resizer, superClass);

/**
  @return {este.ui.Resizer}
 */
este.ui.Resizer.create = function() {
  return new este.ui.Resizer(este.events.Delegation.create, este.ui.resizer.Handles.create);
};

/**
  @enum {string}
 */
este.ui.Resizer.EventType = {
  RESIZEEND: 'resizeend'
};

/**
  @type {Function}
  @protected
 */
este.ui.Resizer.prototype.delegationFactory = null;

/**
  @type {Function}
  @protected
 */
este.ui.Resizer.prototype.handlesFactory = null;

/**
  @type {number}
 */
este.ui.Resizer.prototype.minimalWidth = 5;

/**
  @type {number}
 */
este.ui.Resizer.prototype.minimalHeight = 5;

/**
  @type {Element}
  @protected
 */
este.ui.Resizer.prototype.activeElement = null;

/**
  @type {goog.math.Size}
  @protected
 */
este.ui.Resizer.prototype.activeElementSize = null;

/**
  @param {Element} element
  @return {boolean}
 */
este.ui.Resizer.prototype.targetFilter = function(element) {
  return true;
};

/**
  @param {Element} element
  @return {boolean}
 */
este.ui.Resizer.prototype.targetParentFilter = function(element) {
  return true;
};

/**
  @type {este.events.Delegation}
  @protected
 */
este.ui.Resizer.prototype.delegation = null;

/**
  @type {este.ui.resizer.Handles}
  @protected
 */
este.ui.Resizer.prototype.handles = null;

/**
  @type {boolean}
  @protected
 */
este.ui.Resizer.prototype.dragging = false;

/**
  @override
 */
este.ui.Resizer.prototype.enterDocument = function() {
  var events;
  este.ui.Resizer.superClass_.enterDocument.call(this);
  events = ['mouseover', 'mouseout'];
  this.delegation = this.delegationFactory(this.getElement(), events, this.targetFilter, this.targetParentFilter);
  this.on(this.delegation, 'mouseover', this.onDelegationMouseOver);
  this.on(this.delegation, 'mouseout', this.onDelegationMouseOut);
};

/**
  @override
 */
este.ui.Resizer.prototype.exitDocument = function() {
  este.ui.Resizer.superClass_.exitDocument.call(this);
  this.delegation.dispose();
  if (this.handles) {
    this.handles.dispose();
  }
};

/**
  @param {goog.events.BrowserEvent} e
  @protected
 */
este.ui.Resizer.prototype.onDelegationMouseOver = function(e) {
  if (this.dragging) {
    return;
  }
  if (this.handles) {
    this.handles.dispose();
  }
  this.handles = this.handlesFactory();
  this.handles.decorate(e.target);
  this.on(this.handles, 'mouseout', this.onDelegationMouseOut);
  this.on(this.handles, 'start', this.onDragStart);
  this.on(this.handles, 'drag', this.onDrag);
  return this.on(this.handles, 'end', this.onDragEnd);
};

/**
  @param {goog.events.BrowserEvent} e
  @protected
 */
este.ui.Resizer.prototype.onDelegationMouseOut = function(e) {
  if (this.dragging || this.handles.isHandle(e.relatedTarget)) {
    return;
  }
  return this.handles.dispose();
};

/**
  @param {Object} e
  @protected
 */
este.ui.Resizer.prototype.onDragStart = function(e) {
  var el;
  el = /** @type {Element} */(e.element);
  this.activeElementSize = goog.style.getContentBoxSize(el);
  return this.dragging = true;
};

/**
  @param {Object} e
  @protected
 */
este.ui.Resizer.prototype.onDrag = function(e) {
  var height, width;
  width = Math.max(this.minimalWidth, this.activeElementSize.width + e.width);
  height = Math.max(this.minimalHeight, this.activeElementSize.height + e.height);
  if (e.element.tagName !== 'IMG') {
    e.element.style.width = width + 'px';
    e.element.style.height = height + 'px';
    return;
  }
  if (e.vertical) {
    e.element.style.width = width + 'px';
    return e.element.style.height = 'auto';
  } else {
    e.element.style.width = 'auto';
    return e.element.style.height = height + 'px';
  }
};

/**
  @param {Object} e
  @protected
 */
este.ui.Resizer.prototype.onDragEnd = function(e) {
  this.dragging = false;
  if (e.close) {
    this.handles.dispose();
  }
  return this.dispatchEvent({
    type: este.ui.Resizer.EventType.RESIZEEND,
    element: e.element
  });
};