writes image to output file now

javascript/src/Plugins/qfq.fabric.js

@@ -255,6 +255,7 @@ $(function (n) {
         if (viewOnly) {
             this.getMeta(this.backgroundImage, function(width, height) { that.prepareStaticCanvas(width, height); } );
         } else if (editImage) {
+            this.outputField = $("#" + inputField);
             this.getMeta(this.backgroundImage, function(width, height) { that.prepareImageEditor(width, height);});
             this.modeSettings.initialize(this, jsonButtons);
         } else {
@@ -783,6 +784,7 @@ $(function (n) {
     n.Fabric.prototype.exportToPNG = function(height, width, rotated) {
         var png = this.canvas.toDataURL('png');
         $("#target-png").attr("src", png);
+        this.outputField.val("" + png);
         var img = this.canvas.item(0);
         img.width = width;
         img.height = height;

mockup/fabric.html

@@ -40,8 +40,11 @@
     <div class="row">
         <div class="col-md-4">
 
-            <div class="fabric" data-buttons="mockData/fabric.buttons.json" data-emojis="mockData/qfq.emoji.json"
-                 data-control-name='fabric-output'></div>
+            <div class="fabric"
+                 data-buttons="mockData/fabric.buttons.json"
+                 data-emojis="mockData/qfq.emoji.json"
+                 data-control-name='fabric-output'>
+            </div>
             <input id="fabric-output" name="fabric-data" type="hidden">
 
 

mockup/imageEditorFabric.html

@@ -41,8 +41,10 @@
             <div class="fabric"
                  data-buttons="mockData/fabric.editor.buttons.json"
                  data-edit-image="true"
-                 data-background-image="mockData/Scan2a.jpeg">
+                 data-background-image="mockData/Scan2a.jpeg"
+                 data-control-name='fabric-output'>
             </div>
+            <input id="fabric-output" name="fabric-data" type="hidden">
         </div>
         <div class="col-md-8">
             <img id="target-png">