abstract-shape-element.js

/**
 * Abstract shape element. Shape element represents some visual vector or raster object.
 * @constructor
 * @param {String} name Tag name of the element.
 * @param {Object} config Set of parameters to initialize element with.
 * @param {Object} style Object with styles to set on element initialization.
 */
jvm.AbstractShapeElement = function(name, config, style){
  this.style = style || {};
  this.style.current = {};
  this.isHovered = false;
  this.isSelected = false;
  this.updateStyle();
};

/**
 * Set hovered state to the element. Hovered state means mouse cursor is over element. Styles will be updates respectively.
 * @param {Boolean} isHovered <code>true</code> to make element hovered, <code>false</code> otherwise.
 */
jvm.AbstractShapeElement.prototype.setHovered = function(isHovered){
  if (this.isHovered !== isHovered) {
    this.isHovered = isHovered;
    this.updateStyle();
  }
};

/**
 * Set selected state to the element. Styles will be updates respectively.
 * @param {Boolean} isSelected <code>true</code> to make element selected, <code>false</code> otherwise.
 */
jvm.AbstractShapeElement.prototype.setSelected = function(isSelected){
  if (this.isSelected !== isSelected) {
    this.isSelected = isSelected;
    this.updateStyle();
    jvm.$(this.node).trigger('selected', [isSelected]);
  }
};

/**
 * Set element's style.
 * @param {Object|String} property Could be string to set only one property or object to set several style properties at once.
 * @param {String} value Value to set in case only one property should be set.
 */
jvm.AbstractShapeElement.prototype.setStyle = function(property, value){
  var styles = {};

  if (typeof property === 'object') {
    styles = property;
  } else {
    styles[property] = value;
  }
  jvm.$.extend(this.style.current, styles);
  this.updateStyle();
};


jvm.AbstractShapeElement.prototype.updateStyle = function(){
  var attrs = {};

  jvm.$.extend(attrs, this.style.initial || {});
  jvm.$.extend(attrs, this.style.current || {});
  if (this.isHovered) {
    jvm.$.extend(attrs, this.style.hover || {});
  }
  if (this.isSelected) {
    jvm.$.extend(attrs, this.style.selected || {});
    if (this.isHovered) {
      jvm.$.extend(attrs, this.style.selectedHover || {});
    }
  }
  this.set(attrs);
};