refactred app to support wails v2 compatibility

marcio199226 · Aug 23, 2021 · 624f8b7 · 624f8b7
1 parent c092f10
commit 624f8b7
Show file tree

Hide file tree

Showing 9 changed files with 567 additions and 459 deletions.
diff --git a/app.go b/app.go
diff --git a/frontend/src/app/components/audio-player/audio-player.component.ts b/frontend/src/app/components/audio-player/audio-player.component.ts
@@ -71,7 +71,7 @@ export class AudioPlayerComponent implements OnInit {
   }
 
   private _play(track: Track): void {
-    const src = track.isConvertedToMp3 ? `http://localhost:8080/youtube/${track.id}.mp3` : `http://localhost:8080/youtube/${track.id}.webm`;
+    const src = track.isConvertedToMp3 ? `http://localhost:8080/tracks/youtube/${track.id}.mp3` : `http://localhost:8080/tracks/youtube/${track.id}.webm`;
     this.audio = new Audio(src);
 
     this.audio.ontimeupdate = (e) => {

diff --git a/frontend/src/app/components/settings/settings.component.html b/frontend/src/app/components/settings/settings.component.html
@@ -56,14 +56,15 @@
       <mat-slide-toggle [(ngModel)]="model.Telegram.Share" [disabled]="!isFfmpegAvailable || !model.ConvertToMp3">
         Share downloaded tracks with your devices through telegram
       </mat-slide-toggle>
-      <div class="warning" *ngIf="!model.ConvertToMp3">
+      <div class="warning" *ngIf="model.ConvertToMp3">
         You have to enable "Convert to mp3" option before
       </div>
       <mat-form-field appearance="fill" *ngIf="model.Telegram.Share">
         <mat-label>Insert your telegram username</mat-label>
         <input matInput [(ngModel)]="model.Telegram.Username" required>
-        <mat-icon matPrefix>alternate_email</mat-icon>
-        <mat-hint>You have to set username into telegram's settings</mat-hint>
+        <span matPrefix class="at">@</span>
+        <mat-hint>
+          You have to set <span class="open-link" title="Click for more details" (click)="openUrl('https://telegram.org/faq?setln=en#q-what-are-usernames-how-do-i-get-one')">username</span> into telegram's settings</mat-hint>
         <mat-error>Cannot be empty if enabled</mat-error>
       </mat-form-field>
     </div>

diff --git a/frontend/src/app/components/settings/settings.component.scss b/frontend/src/app/components/settings/settings.component.scss
@@ -20,10 +20,26 @@ settings {
       background: transparent;
     }
 
+    .open-link {
+      font-weight: bold;
+      text-decoration: underline;
+      cursor: pointer;
+    }
+
+    .at {
+      font-weight: bold;
+      padding-right: 8px;
+    }
+
     .toggle-wrapper {
+      margin-left: 46px;
+
+      .mat-slide-toggle {
+        margin-left: -46px;
+      }
+
       .warning {
         font-weight: bold;
-        padding-left: 44px;
       }
     }
   }

diff --git a/frontend/src/app/components/settings/settings.component.ts b/frontend/src/app/components/settings/settings.component.ts
@@ -44,18 +44,22 @@ export class SettingsComponent implements OnInit {
 
   async ngOnInit(): Promise<void> {
     this.model = { ...this.data.config };
-    const [err, path] = await to(window.backend.isFFmpegInstalled());
+    const [err, path] = await to(window.backend.main.AppState.IsFFmpegInstalled());
     if(path) {
       this.isFfmpegAvailable = true;
       this._cdr.detectChanges();
     }
   }
 
   async changeBaseSaveDir(): Promise<void> {
-    const [err, path] = await to(window.backend.AppState.SelectDirectory());
+    const [err, path] = await to(window.backend.main.AppState.SelectDirectory());
     console.log(err, path)
   }
 
+  async openUrl(url: string): Promise<void> {
+    await window.backend.main.AppState.OpenUrl(url);
+  }
+
   save(): void {
     this._dialogRef.close({ config: this.model });
   }

diff --git a/frontend/src/app/models/app-state.ts b/frontend/src/app/models/app-state.ts
@@ -22,17 +22,20 @@ export interface AppState {
 
 
 export interface BackendCallbacks {
-  AppState: {
-    GetAppConfig: () => Promise<any>;
-    SelectDirectory: () => Promise<string>
+  main: {
+    AppState: {
+      GetAppConfig: () => Promise<any>;
+      SelectDirectory: () => Promise<string>
+      IsSupportedUrl: (url: string) => Promise<boolean>;
+      AddToDownload: (url: string, isFromClipboard: boolean) => Promise<any>;
+      StartDownload: (entry: Entry) => Promise<any>;
+      ReadSettingBoolValue: (name: string) => Promise<any>;
+      ReadSettingValue: (name: string) => Promise<any>;
+      SaveSettingBoolValue: (name: string, val: boolean) => Promise<any>;
+      SaveSettingValue: (name: string, val: string) => Promise<any>;
+      RemoveEntry: (entry: Entry) => Promise<any>;
+      IsFFmpegInstalled: () => Promise<boolean>;
+      OpenUrl: (url :string) => Promise<any>;
+    }
   }
-  isSupportedUrl: (url: string) => Promise<boolean>;
-  addToDownload: (url: string, isFromClipboard: boolean) => Promise<any>;
-  startDownload: (entry: Entry) => Promise<any>;
-  readSettingBoolValue: (name: string) => Promise<any>;
-  readSettingValue: (name: string) => Promise<any>;
-  saveSettingBoolValue: (name: string, val: boolean) => Promise<any>;
-  saveSettingValue: (name: string, val: string) => Promise<any>;
-  removeEntry: (entry: Entry) => Promise<any>;
-  isFFmpegInstalled: () => Promise<boolean>;
 }
diff --git a/frontend/src/app/pages/home.component.ts b/frontend/src/app/pages/home.component.ts
@@ -132,7 +132,7 @@ export class HomeComponent implements OnInit {
         for (const [key, value] of Object.entries(config)) {
           switch(key) {
             case 'BaseSaveDir':
-              await window.backend.saveSettingValue(key, value as string);
+              await window.backend.main.AppState.SaveSettingValue(key, value as string);
             break;
 
             case 'ClipboardWatch':
@@ -141,15 +141,15 @@ export class HomeComponent implements OnInit {
             case 'ConcurrentPlaylistDownloads':
             case 'ConvertToMp3':
             case 'CleanWebmFiles':
-              await window.backend.saveSettingBoolValue(key, value as boolean);
+              await window.backend.main.AppState.SaveSettingBoolValue(key, value as boolean);
             break;
 
             case 'MaxParrallelDownloads':
-              await window.backend.saveSettingValue(key, `${value}`);
+              await window.backend.main.AppState.SaveSettingValue(key, `${value}`);
             break;
 
             case 'Telegram':
-              await window.backend.saveSettingValue(key, JSON.stringify(value));
+              await window.backend.main.AppState.SaveSettingValue(key, JSON.stringify(value));
             break;
           }
         }
@@ -159,6 +159,7 @@ export class HomeComponent implements OnInit {
         this._snackbar.open("Settings has been saved");
         this._cdr.detectChanges();
       } catch(e) {
+        console.log(e)
         this._snackbar.open("An error occured while saving settings");
       }
     });
@@ -219,14 +220,14 @@ export class HomeComponent implements OnInit {
       return;
     }
 
-    const isSupported = await window.backend.isSupportedUrl(url);
+    const isSupported = await window.backend.main.AppState.IsSupportedUrl(url);
     if(!isSupported) {
       this._snackbar.open('Unsupported url');
       return
     }
 
     try {
-      await window.backend.addToDownload(url, false)
+      await window.backend.main.AppState.AddToDownload(url, false)
       this.urlInput.setValue('');
       this.pasteInput.nativeElement.blur();
       this.pasteWrapper.nativeElement.classList.remove('focused');
@@ -239,7 +240,7 @@ export class HomeComponent implements OnInit {
 
   async startDownload(entry: Entry): Promise<void> {
     try {
-      await window.backend.startDownload(entry);
+      await window.backend.main.AppState.StartDownload(entry);
       this._snackbar.open("Started downloading");
     } catch(e) {
       this._snackbar.open(e);
@@ -249,7 +250,7 @@ export class HomeComponent implements OnInit {
   async remove(entry: Entry, i: number): Promise<void> {
     console.log('remove', entry, i)
     try {
-      await window.backend.removeEntry(entry);
+      await window.backend.main.AppState.RemoveEntry(entry);
       this._snackbar.open(`${entry.type} has been removed`);
       const idx = this.entries.findIndex(e => {
         if(entry.type === 'playlist') {

diff --git a/frontend/src/backend/index.js b/frontend/src/backend/index.js
@@ -5,6 +5,15 @@
 const backend = {
   "main": {
     "AppState": {
+      /**
+       * AddToDownload
+       * @param {string} arg1 - Go Type: string
+       * @param {boolean} arg2 - Go Type: bool
+       * @returns {Promise<Error>}  - Go Type: error
+       */
+      "AddToDownload": (arg1, arg2) => {
+        return window.backend.main.AppState.AddToDownload(arg1, arg2);
+      },
       /**
        * GetAppConfig
        * @returns {Promise<any>}  - Go Type: *models.AppConfig
@@ -20,13 +29,86 @@ const backend = {
       "GetEntryById": (arg1) => {
         return window.backend.main.AppState.GetEntryById(arg1);
       },
+      /**
+       * IsFFmpegInstalled
+       * @returns {Promise<string|Error>}  - Go Type: string
+       */
+      "IsFFmpegInstalled": () => {
+        return window.backend.main.AppState.IsFFmpegInstalled();
+      },
+      /**
+       * IsSupportedUrl
+       * @param {string} arg1 - Go Type: string
+       * @returns {Promise<boolean>}  - Go Type: bool
+       */
+      "IsSupportedUrl": (arg1) => {
+        return window.backend.main.AppState.IsSupportedUrl(arg1);
+      },
+      /**
+       * OpenUrl
+       * @param {string} arg1 - Go Type: string
+       * @returns {Promise<Error>}  - Go Type: error
+       */
+      "OpenUrl": (arg1) => {
+        return window.backend.main.AppState.OpenUrl(arg1);
+      },
+      /**
+       * ReadSettingBoolValue
+       * @param {string} arg1 - Go Type: string
+       * @returns {Promise<boolean|Error>}  - Go Type: bool
+       */
+      "ReadSettingBoolValue": (arg1) => {
+        return window.backend.main.AppState.ReadSettingBoolValue(arg1);
+      },
+      /**
+       * ReadSettingValue
+       * @param {string} arg1 - Go Type: string
+       * @returns {Promise<string|Error>}  - Go Type: string
+       */
+      "ReadSettingValue": (arg1) => {
+        return window.backend.main.AppState.ReadSettingValue(arg1);
+      },
+      /**
+       * RemoveEntry
+       * @param {any} arg1 - Go Type: map[string]interface {}
+       * @returns {Promise<Error>}  - Go Type: error
+       */
+      "RemoveEntry": (arg1) => {
+        return window.backend.main.AppState.RemoveEntry(arg1);
+      },
+      /**
+       * SaveSettingBoolValue
+       * @param {string} arg1 - Go Type: string
+       * @param {boolean} arg2 - Go Type: bool
+       * @returns {Promise<Error>}  - Go Type: error
+       */
+      "SaveSettingBoolValue": (arg1, arg2) => {
+        return window.backend.main.AppState.SaveSettingBoolValue(arg1, arg2);
+      },
+      /**
+       * SaveSettingValue
+       * @param {string} arg1 - Go Type: string
+       * @param {string} arg2 - Go Type: string
+       * @returns {Promise<Error>}  - Go Type: error
+       */
+      "SaveSettingValue": (arg1, arg2) => {
+        return window.backend.main.AppState.SaveSettingValue(arg1, arg2);
+      },
       /**
        * SelectDirectory
        * @returns {Promise<string|Error>}  - Go Type: string
        */
       "SelectDirectory": () => {
         return window.backend.main.AppState.SelectDirectory();
       },
+      /**
+       * StartDownload
+       * @param {any} arg1 - Go Type: map[string]interface {}
+       * @returns {Promise<Error>}  - Go Type: error
+       */
+      "StartDownload": (arg1) => {
+        return window.backend.main.AppState.StartDownload(arg1);
+      },
     }
   }