library/js/literallycanvas/js/tools/Polygon.js

   1 var Polygon, ToolWithStroke, createShape,
   2   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.__super__ = parent.prototype; return child; },
   3   hasProp = {}.hasOwnProperty;
   4
   5 ToolWithStroke = require('./base').ToolWithStroke;
   6
   7 createShape = require('../core/shapes').createShape;
   8
   9 module.exports = Polygon = (function(superClass) {
  10   extend(Polygon, superClass);
  11
  12   function Polygon() {
  13     return Polygon.__super__.constructor.apply(this, arguments);
  14   }
  15
  16   Polygon.prototype.name = 'Polygon';
  17
  18   Polygon.prototype.iconName = 'polygon';
  19
  20   Polygon.prototype.usesSimpleAPI = false;
  21
  22   Polygon.prototype.didBecomeActive = function(lc) {
  23     var onDown, onMove, onUp, polygonCancel, polygonFinishClosed, polygonFinishOpen, polygonUnsubscribeFuncs;
  24     Polygon.__super__.didBecomeActive.call(this, lc);
  25     polygonUnsubscribeFuncs = [];
  26     this.polygonUnsubscribe = (function(_this) {
  27       return function() {
  28         var func, i, len, results;
  29         results = [];
  30         for (i = 0, len = polygonUnsubscribeFuncs.length; i < len; i++) {
  31           func = polygonUnsubscribeFuncs[i];
  32           results.push(func());
  33         }
  34         return results;
  35       };
  36     })(this);
  37     this.points = null;
  38     this.maybePoint = null;
  39     onUp = (function(_this) {
  40       return function() {
  41         if (_this._getWillFinish()) {
  42           return _this._close(lc);
  43         }
  44         lc.trigger('lc-polygon-started');
  45         if (_this.points) {
  46           _this.points.push(_this.maybePoint);
  47         } else {
  48           _this.points = [_this.maybePoint];
  49         }
  50         _this.maybePoint = {
  51           x: _this.maybePoint.x,
  52           y: _this.maybePoint.y
  53         };
  54         lc.setShapesInProgress(_this._getShapes(lc));
  55         return lc.repaintLayer('main');
  56       };
  57     })(this);
  58     onMove = (function(_this) {
  59       return function(arg) {
  60         var x, y;
  61         x = arg.x, y = arg.y;
  62         if (_this.maybePoint) {
  63           _this.maybePoint.x = x;
  64           _this.maybePoint.y = y;
  65           lc.setShapesInProgress(_this._getShapes(lc));
  66           return lc.repaintLayer('main');
  67         }
  68       };
  69     })(this);
  70     onDown = (function(_this) {
  71       return function(arg) {
  72         var x, y;
  73         x = arg.x, y = arg.y;
  74         _this.maybePoint = {
  75           x: x,
  76           y: y
  77         };
  78         lc.setShapesInProgress(_this._getShapes(lc));
  79         return lc.repaintLayer('main');
  80       };
  81     })(this);
  82     polygonFinishOpen = (function(_this) {
  83       return function() {
  84         _this.maybePoint = {
  85           x: Infinity,
  86           y: Infinity
  87         };
  88         return _this._close(lc);
  89       };
  90     })(this);
  91     polygonFinishClosed = (function(_this) {
  92       return function() {
  93         _this.maybePoint = _this.points[0];
  94         return _this._close(lc);
  95       };
  96     })(this);
  97     polygonCancel = (function(_this) {
  98       return function() {
  99         return _this._cancel(lc);
 100       };
 101     })(this);
 102     polygonUnsubscribeFuncs.push(lc.on('drawingChange', (function(_this) {
 103       return function() {
 104         return _this._cancel(lc);
 105       };
 106     })(this)));
 107     polygonUnsubscribeFuncs.push(lc.on('lc-pointerdown', onDown));
 108     polygonUnsubscribeFuncs.push(lc.on('lc-pointerdrag', onMove));
 109     polygonUnsubscribeFuncs.push(lc.on('lc-pointermove', onMove));
 110     polygonUnsubscribeFuncs.push(lc.on('lc-pointerup', onUp));
 111     polygonUnsubscribeFuncs.push(lc.on('lc-polygon-finishopen', polygonFinishOpen));
 112     polygonUnsubscribeFuncs.push(lc.on('lc-polygon-finishclosed', polygonFinishClosed));
 113     return polygonUnsubscribeFuncs.push(lc.on('lc-polygon-cancel', polygonCancel));
 114   };
 115
 116   Polygon.prototype.willBecomeInactive = function(lc) {
 117     Polygon.__super__.willBecomeInactive.call(this, lc);
 118     if (this.points || this.maybePoint) {
 119       this._cancel(lc);
 120     }
 121     return this.polygonUnsubscribe();
 122   };
 123
 124   Polygon.prototype._getArePointsClose = function(a, b) {
 125     return (Math.abs(a.x - b.x) + Math.abs(a.y - b.y)) < 10;
 126   };
 127
 128   Polygon.prototype._getWillClose = function() {
 129     if (!(this.points && this.points.length > 1)) {
 130       return false;
 131     }
 132     if (!this.maybePoint) {
 133       return false;
 134     }
 135     return this._getArePointsClose(this.points[0], this.maybePoint);
 136   };
 137
 138   Polygon.prototype._getWillFinish = function() {
 139     if (!(this.points && this.points.length > 1)) {
 140       return false;
 141     }
 142     if (!this.maybePoint) {
 143       return false;
 144     }
 145     return this._getArePointsClose(this.points[0], this.maybePoint) || this._getArePointsClose(this.points[this.points.length - 1], this.maybePoint);
 146   };
 147
 148   Polygon.prototype._cancel = function(lc) {
 149     lc.trigger('lc-polygon-stopped');
 150     this.maybePoint = null;
 151     this.points = null;
 152     lc.setShapesInProgress([]);
 153     return lc.repaintLayer('main');
 154   };
 155
 156   Polygon.prototype._close = function(lc) {
 157     lc.trigger('lc-polygon-stopped');
 158     lc.setShapesInProgress([]);
 159     if (this.points.length > 2) {
 160       lc.saveShape(this._getShape(lc, false));
 161     }
 162     this.maybePoint = null;
 163     return this.points = null;
 164   };
 165
 166   Polygon.prototype._getShapes = function(lc, isInProgress) {
 167     var shape;
 168     if (isInProgress == null) {
 169       isInProgress = true;
 170     }
 171     shape = this._getShape(lc, isInProgress);
 172     if (shape) {
 173       return [shape];
 174     } else {
 175       return [];
 176     }
 177   };
 178
 179   Polygon.prototype._getShape = function(lc, isInProgress) {
 180     var points;
 181     if (isInProgress == null) {
 182       isInProgress = true;
 183     }
 184     points = [];
 185     if (this.points) {
 186       points = points.concat(this.points);
 187     }
 188     if ((!isInProgress) && points.length < 3) {
 189       return null;
 190     }
 191     if (isInProgress && this.maybePoint) {
 192       points.push(this.maybePoint);
 193     }
 194     if (points.length > 1) {
 195       return createShape('Polygon', {
 196         isClosed: this._getWillClose(),
 197         strokeColor: lc.getColor('primary'),
 198         fillColor: lc.getColor('secondary'),
 199         strokeWidth: this.strokeWidth,
 200         points: points.map(function(xy) {
 201           return createShape('Point', xy);
 202         })
 203       });
 204     } else {
 205       return null;
 206     }
 207   };
 208
 209   Polygon.prototype.optionsStyle = 'polygon-and-stroke-width';
 210
 211   return Polygon;
 212
 213 })(ToolWithStroke);