toggle objects for canvas

javascript/src/Plugins/qfq.fabric.js

@@ -48,6 +48,7 @@ $(function (n) {
         this.dndData = '';
         this.backgroundImage = '';
         this.fabricJSON = '';
+        this.showObject = true;
 
         // Handles button states and generation of said buttons. Should be renamed.
         function ModeSettings() {
@@ -291,6 +292,7 @@ $(function (n) {
         canvas.height = canvas.width * ratio;
         this.parentElement.append(canvas);
         this.canvas = this.__canvas = new fabric.StaticCanvas(canvas);
+        this.parentElement.on("click", function(e) { that.toggleObjects(); });
     };
 
     n.Fabric.prototype.getMeta = function(url, callback) {
@@ -299,6 +301,16 @@ $(function (n) {
       img.onload = function() { callback(this.width, this.height); };
     };
 
+    n.Fabric.prototype.toggleObjects = function() {
+        this.showObject = !this.showObject;
+        var objects = this.canvas.getObjects();
+        for (var i in objects) {
+            objects[i].visible = this.showObject;
+            //objects[i].opacity = opacity;
+        }
+        this.canvas.renderAll();
+    };
+
     n.Fabric.prototype.generateCanvas = function() {
         var canvas = document.createElement('canvas');
         canvas.setAttribute('draggable', true);