Initial commit

2017-05-09 12:18:29 +02:00
commit c73e1ed9b4
29 changed files with 1481 additions and 0 deletions
@@ -0,0 +1,102 @@
+'use strict';
+var util = require('./Util');
+var ApertureHandler = require('./ApertureHandler');
+var ButtonMenu = require('./ButtonMenu');
+var DragbarHandler = require('./DragbarHandler');
+var Viewport = require('./Viewport');
+
+var Canvas = fabric.util.createClass(fabric.Canvas, {
+    initialize: function (id) {
+        this.callSuper('initialize', id, {
+            enableRetinaScaling: true,
+            renderOnAddRemove: false,
+            stateful: false,
+            backgroundColor: '#d4d4d4',
+            preserveObjectStacking: true,
+            selection: false,
+        });
+
+        this.on('mouse:up', function () {
+            if (this.image.__moved) {
+                this.aperture.setTransparent(false);
+            }
+            $(this.upperCanvasEl).css('cursor', 'default');
+            this.renderAll();
+        });
+    },
+
+    get_apertures: function () {
+        return this.__aperturehandler ||
+            (this.__aperturehandler = new ApertureHandler(this));
+    },
+
+    get_dragbars: function () {
+        return this.__dragbars ||
+            (this.__dragbars = new DragbarHandler(this));
+    },
+
+    /**
+     * @return {fabric.Image}
+     */
+    get_image: function () {
+        return this.__image;
+    },
+
+    /**
+     * @return {Viewport}
+     */
+    get_viewport: function () {
+        return this.__viewport ||
+            (this.__viewport = new Viewport(this));
+    },
+
+    /**
+     * @return {Canvas}
+     */
+    removeImage: function () {
+        if (!this.__image) {
+            return this;
+        }
+        return this.remove(this.__image);
+    },
+
+    /**
+     * @param  {fabric.Image} img
+     * @return {Canvas}
+     */
+    setImage: function (img) {
+        this.removeImage();
+        this.__image = img;
+        this.__image.addTo(this).center().on('mousedown', function () {
+            img.canvas.aperture.setTransparent(true);
+        }).setCoords();
+        this.viewport.reset();
+        return this;
+    }
+});
+
+// Define properties
+util.setProperties(Canvas.prototype, {
+    aperture: {
+        get: Canvas.prototype.get_apertures
+    },
+    dragbars: {
+        get: Canvas.prototype.get_dragbars
+    },
+    image: {
+        get: Canvas.prototype.get_image
+    },
+    topMenu: {
+        get: function () {
+            if (!this.__topMenu) {
+                this.__topMenu = new ButtonMenu(this);
+            }
+            return this.__topMenu;
+        }
+    },
+    viewport: {
+        get: Canvas.prototype.get_viewport
+    }
+});
+
+module.exports = Canvas;