diff --git a/javascript/src/Plugins/qfq.fabric.js b/javascript/src/Plugins/qfq.fabric.js
index 7d6df513a12c453d439ff4e0e35d630d376e4bed..ff877c201c8945b62d18ec42ec97ee0c31bffe8f 100644
--- a/javascript/src/Plugins/qfq.fabric.js
+++ b/javascript/src/Plugins/qfq.fabric.js
@@ -25,6 +25,7 @@ $(function (n) {
         this.emojiContainer = {};
         this.eventEmitter = new EventEmitter();
         this.qfqPage = {};
+        this.scaled = false;
         this.textContainer = {};
         this.userTextInput = {};
         this.outputField = {};
@@ -356,9 +357,8 @@ $(function (n) {
         this.generateStaticCanvas(width, height);
         if (this.fabricJSON) {
             this.canvas.loadFromJSON(this.fabricJSON, function() {
-                    that.setBackground();
-                    that.resizeCanvas();
-                    that.canvas.renderAll();
+                that.resizeCanvas(true);
+                that.canvas.renderAll();
             });
         } else {
             this.setBackground();
@@ -375,7 +375,7 @@ $(function (n) {
         this.parentElement.append(canvas);
         this.canvas = this.__canvas = new fabric.StaticCanvas(canvas);
         this.parentElement.on("click", function(e) { that.toggleObjects(); });
-        $(window).resize(function() { that.resizeCanvas(); });
+        $(window).resize(function() { that.scaled = false; that.resizeCanvas(); });
     };
 
     n.Fabric.prototype.getMeta = function(url, callback) {
@@ -424,14 +424,12 @@ $(function (n) {
         window.addEventListener('keydown', function(e) { that.defaultKeyStrokeHandler(e) });
         window.addEventListener('dragend', function(e) { that.dragEndEvent(e) });
         this.parentElement.on('contextmenu', function(e) { that.defaultRightClickHandler(e) });
-        $(window).resize(function() { that.resizeCanvas(); });
+        $(window).resize(function() { that.scaled=false; that.resizeCanvas(); });
     };
 
     n.Fabric.prototype.dragEndEvent = function(e) {
         if (this.dragAndDrop) {
-            if (this.mouseInsideCanvas) {
-                this.emojiAdd(this.dndData, e);
-            }
+            this.emojiAdd(this.dndData, e);
             this.dndData = '';
             this.dragAndDrop = false;
         }
@@ -441,14 +439,18 @@ $(function (n) {
         this.mouseInsideCanvas = true;
     };
 
-    n.Fabric.prototype.resizeCanvas = function () {
-        console.log("resize canvas started");
+    n.Fabric.prototype.resizeCanvas = function (forceJSON) {
+        console.log("resize canvas started 1111");
         var source = false;
         var backgroundSizing = false;
         var oldWidth = this.canvas.getWidth();
         var backgroundImageWidth = 0;
         if (this.canvas.backgroundImage) {
-            source = this.canvas;
+            if (forceJSON) {
+                source = this.fabricJSON;
+            } else {
+                source = this.canvas;
+            }
         } else {
             source = this.fabricJSON;
         }
@@ -462,6 +464,7 @@ $(function (n) {
         var newWidth = this.parentElement.innerWidth();
         if (newWidth !== oldWidth) {
             var scaleMultiplier = newWidth / oldWidth;
+            console.log("Scalemulti: " + scaleMultiplier);
             var oldHeight;
             if (backgroundSizing) {
                 if (source) {
@@ -474,13 +477,16 @@ $(function (n) {
             this.canvas.setHeight(oldHeight * scaleMultiplier);
 
 
-            var objects = source.getObjects();
-            for (var i in objects) {
-                objects[i].scaleX = objects[i].scaleX * scaleMultiplier;
-                objects[i].scaleY = objects[i].scaleY * scaleMultiplier;
-                objects[i].left = objects[i].left * scaleMultiplier;
-                objects[i].top = objects[i].top * scaleMultiplier;
-                objects[i].setCoords();
+            if (!this.scaled) {
+                var objects = this.canvas.getObjects();
+                for (var i in objects) {
+                    objects[i].scaleX = objects[i].scaleX * scaleMultiplier;
+                    objects[i].scaleY = objects[i].scaleY * scaleMultiplier;
+                    objects[i].left = objects[i].left * scaleMultiplier;
+                    objects[i].top = objects[i].top * scaleMultiplier;
+                    objects[i].setCoords();
+                }
+                this.scaled = true;
             }
             this.setBackground();
             this.canvas.renderAll();
@@ -906,6 +912,7 @@ $(function (n) {
 
     n.Fabric.prototype.delete = function() {
        this.deleteActiveGroup();
+       this.defaultChangeHandler();
     };
 
     n.Fabric.prototype.draw = function() {
@@ -952,11 +959,12 @@ $(function (n) {
     };
 
     n.Fabric.prototype.defaultKeyStrokeHandler = function(e) {
+        // Delete key
+        if (e.keyCode === 46) {
+            this.delete();
+        }
+
         if (this.mouseInsideCanvas) {
-            // Delete key
-            if (e.keyCode === 46) {
-                this.delete();
-            }
 
             // Numpad +
             if (e.keyCode === 107) {