Merge pull request #46 from Saqib92/master

Download Image when click on Export Buttons

Author: bytesleo

projects/angular-editor-fabric-js/src/lib/angular-editor-fabric-js.component.ts

@@ -559,14 +559,36 @@ export class FabricjsEditorComponent implements AfterViewInit {
     image.src = this.canvas.toDataURL({format: 'png'});
     const w = window.open('');
     w.document.write(image.outerHTML);
+    this.downLoadImage();
+  }
+
+  downLoadImage(){
+    const c = this.canvas.toDataURL({format: 'png'});
+    const downloadLink = document.createElement('a');
+    document.body.appendChild(downloadLink);
+    downloadLink.href = c;
+    downloadLink.target = '_self';
+    downloadLink.download = Date.now()+'.png';
+    downloadLink.click();   
   }
 
   rasterizeSVG() {
     const w = window.open('');
     w.document.write(this.canvas.toSVG());
+    this.downLoadSVG();
     return 'data:image/svg+xml;utf8,' + encodeURIComponent(this.canvas.toSVG());
   }
 
+  downLoadSVG(){
+    const c = 'data:image/svg+xml;utf8,' + encodeURIComponent(this.canvas.toSVG());
+    const downloadLink = document.createElement('a');
+    document.body.appendChild(downloadLink);
+    downloadLink.href = c;
+    downloadLink.target = '_self';
+    downloadLink.download = Date.now()+'.svg';
+    downloadLink.click();   
+  }
+
   saveCanvasToJSON() {
     const json = JSON.stringify(this.canvas);
     localStorage.setItem('Kanvas', json);

src/app/app.component.html

@@ -1,7 +1,7 @@
 <div class="container">
   <div class="row">
       <div class="col-xl-12 main-title">
-          <h4>Github: <a href="https://github.com/kevoj/angular-editor-fabric-js">angular-editor-fabric-js</a></h4>
+          <h4>Github: <a href="https://github.com/saqib92/angular-editor-fabric-js">angular-editor-fabric-js</a></h4>
       </div>
       <div class="col-xl-12">
           <div class="row">