GitIgnore fixes, DockerFile fixes

PosterMaker.UI/ClientApp/.gitignore

@@ -8,6 +8,7 @@
 
 # dependencies
 /node_modules
+.angular
 
 # IDEs and editors
 /.idea

PosterMaker.UI/ClientApp/src/app/collection/collection.component.html

@@ -31,7 +31,8 @@
 
       <div *ngIf="retrievedImage">
         <h2>Image</h2>
-        <img [src]="retrievedImage" alt="Upload Image" [style.height.px]="windowHeight">
+        <img [src]="retrievedImage" alt="Upload Image" [style.height.px]="windowHeight" [title]="imageTitle">
+        <button mat-raised-button color="primary" (click)="downloadImage()">Download Image</button>
       </div>
     </div>
   </div>

PosterMaker.UI/ClientApp/src/app/collection/collection.component.ts

@@ -17,6 +17,7 @@ export class CollectionComponent {
   title2: any;
   selectedLogoControl = new FormControl();
   logoOptionControl = new FormControl();
+  imageTitle: any;
 
   constructor(private http: HttpClient)
   {
@@ -39,15 +40,25 @@ export class CollectionComponent {
     fd.append('title', this.title);
     fd.append('title2', this.title2);
 
-    this.http.post('https://localhost:44369/poster/collection', fd)
+    this.http.post('http://localhost:44369/poster/collection', fd)
       .subscribe(res => {
         console.log(res);
         this.retrieveResponse = res;
         this.base64Data = this.retrieveResponse.picBytes;
         this.retrievedImage = 'data:image/jpeg;base64,' + this.base64Data;
+        this.imageTitle = 'poster';
       });
   }
 
+  downloadImage(): void {
+    if (this.retrievedImage) {
+      const link = document.createElement('a');
+      link.href = this.retrievedImage;
+      link.download = `${this.imageTitle}.jpeg`; // Specify the filename here
+      link.click();
+    }
+  }
+
   @HostListener('window:resize')
   onResize() {
     this.windowHeight = window.innerHeight - 200;

PosterMaker.UI/ClientApp/src/app/movie/movie.component.html

@@ -61,6 +61,7 @@
       <div *ngIf="retrievedImage">
         <h2>Image</h2>
         <img [src]="retrievedImage" alt="Upload Image" [style.height.px]="windowHeight">
+        <button mat-raised-button color="primary" (click)="downloadImage()">Download Image</button>
       </div>
     </div>
   </div>

PosterMaker.UI/ClientApp/src/app/movie/movie.component.ts

@@ -23,6 +23,7 @@ export class MovieComponent {
   logoOptions = LogoOptions
   selectedLogoControl = new FormControl();
   logoOptionControl = new FormControl();
+  imageTitle = 'poster'
 
   constructor(private http: HttpClient)
   {
@@ -54,7 +55,7 @@ export class MovieComponent {
       fd.append('logoOption', this.logoOptionControl.value);
     }
 
-    this.http.post('https://localhost:44369/poster/movie', fd)
+    this.http.post('http://localhost:44369/poster/movie', fd)
       .subscribe(res => {
         console.log(res);
         this.retrieveResponse = res;
@@ -63,6 +64,15 @@ export class MovieComponent {
       });
   }
 
+  downloadImage(): void {
+    if (this.retrievedImage) {
+      const link = document.createElement('a');
+      link.href = this.retrievedImage;
+      link.download = `${this.imageTitle}.jpeg`; // Specify the filename here
+      link.click();
+    }
+  }
+
   @HostListener('window:resize')
   onResize() {
     this.windowHeight = window.innerHeight - 200;

PosterMaker.UI/ClientApp/src/app/series/networks.enum.ts

@@ -32,5 +32,6 @@ export enum NetworkLogos {
   AdultSwim = "Adult Swim",
   Max = "Max",
   Mtv = "Mtv",
-  ChannelFour = "ChannelFour"
+  ChannelFour = "ChannelFour",
+  Id = "ID"
 }

PosterMaker.UI/ClientApp/src/app/series/series.component.html

@@ -72,7 +72,8 @@
 
       <div *ngIf="retrievedImage">
         <h2>Image</h2>
-        <img [src]="retrievedImage" alt="Upload Image" [style.height.px]="windowHeight">
+        <img [src]="retrievedImage" alt="Upload Image" [style.height.px]="windowHeight" [title]='imageTitle'>
+        <button mat-raised-button color="primary" (click)="downloadImage()">Download Image</button>
       </div>
     </div>
   </div>

PosterMaker.UI/ClientApp/src/app/series/series.component.ts

@@ -27,6 +27,7 @@ export class SeriesComponent {
   logoOptionControl = new FormControl();
   selectedStudioControl = new FormControl();
   isLimitedSeries: any;
+  imageTitle: any;
 
   constructor(private http: HttpClient)
   {
@@ -61,15 +62,25 @@ export class SeriesComponent {
     if (this.logoOptionControl.value != null){
       fd.append('logoOption', this.logoOptionControl.value);
     }
-    this.http.post('https://localhost:44369/poster/series', fd)
+    this.http.post('http://localhost:44369/poster/series', fd)
       .subscribe(res => {
         console.log(res);
         this.retrieveResponse = res;
         this.base64Data = this.retrieveResponse.picBytes;
         this.retrievedImage = 'data:image/jpeg;base64,' + this.base64Data;
+        this.imageTitle = 'poster';
       });
   }
 
+  downloadImage(): void {
+    if (this.retrievedImage) {
+      const link = document.createElement('a');
+      link.href = this.retrievedImage;
+      link.download = `${this.imageTitle}.jpeg`; // Specify the filename here
+      link.click();
+    }
+  }
+
   @HostListener('window:resize')
   onResize() {
     this.windowHeight = window.innerHeight - 200;