Settings page improvements

src/app/components/settings/settings.component.html

@@ -3,8 +3,8 @@
   <div class="field">
     <label>Chart library directory</label>
     <div class="ui action input">
-      <input [value]="settingsService.libraryDirectory" class="default-cursor" readonly type="text"
+      <input [value]="settingsService.libraryDirectory || 'No folder selected'" class="default-cursor" readonly
-        placeholder="No directory selected!">
+        type="text" placeholder="No directory selected!">
       <button *ngIf="settingsService.libraryDirectory != undefined" (click)="openLibraryDirectory()"
         class="ui button">Open Folder</button>
       <button (click)="getLibraryDirectory()" class="ui button teal">Choose</button>
@@ -17,6 +17,24 @@
 </div>
 <button style="margin-top: 0.5em;" (click)="clearCache()" class="ui button">Clear Cache</button>
 
+<h3 class="ui header">Downloads</h3>
+<div class="ui form">
+  <div class="field">
+    <label>Google rate limit delay</label>
+    <div id="rateLimitInput" class="ui right labeled input">
+      <input type="number" [value]="settingsService.rateLimitDelay" (input)="changeRateLimit($event)">
+      <div class="ui basic label">
+        sec
+      </div>
+    </div>
+  </div>
+</div>
+<div *ngIf="settingsService.rateLimitDelay < 30" class="ui warning message">
+  <i class="exclamation circle icon"></i>
+  <b>Warning:</b> downloading files from Google with a delay less than about 30 seconds will eventually cause Google to
+  refuse download requests from this program for a few hours. If you can find a way around this limitation, contact the devs.
+</div>
+
 <h3 class="ui header">Theme</h3>
 <div #themeDropdown class="ui selection dropdown mr">
   <input type="hidden" name="sort" [value]="settingsService.theme">
@@ -27,3 +45,10 @@
     </div>
   </div>
 </div>
+
+<div class="bottom">
+  <button class="ui basic icon button" data-tooltip="Toggle developer tools" data-position="top right"
+    (click)="toggleDevTools()">
+    <i class="cog icon"></i>
+  </button>
+</div>

src/app/components/settings/settings.component.scss

@@ -8,3 +8,13 @@
   cursor: default;
   pointer-events: none;
 }
+
+#rateLimitInput {
+  width: unset !important;
+}
+
+.bottom {
+  position: absolute;
+  bottom: 2em;
+  right: 2em;
+}

src/app/components/settings/settings.component.ts

@@ -12,7 +12,7 @@ export class SettingsComponent implements OnInit, AfterViewInit {
 
   cacheSize = 'Calculating...'
 
-  constructor(private settingsService: SettingsService, private electronService: ElectronService) { }
+  constructor(public settingsService: SettingsService, private electronService: ElectronService) { }
 
   async ngOnInit() {
     const cacheSize = await this.settingsService.getCacheSize()
@@ -49,4 +49,19 @@ export class SettingsComponent implements OnInit, AfterViewInit {
   async openLibraryDirectory() {
     this.electronService.openFolder(this.settingsService.libraryDirectory)
   }
+
+  changeRateLimit(event: Event) {
+    const inputElement = event.srcElement as HTMLInputElement
+    this.settingsService.rateLimitDelay = Number(inputElement.value)
+  }
+
+  toggleDevTools() {
+    const toolsOpened = this.electronService.currentWindow.webContents.isDevToolsOpened()
+
+    if (toolsOpened) {
+      this.electronService.currentWindow.webContents.closeDevTools()
+    } else {
+      this.electronService.currentWindow.webContents.openDevTools()
+    }
+  }
 }

src/app/core/services/settings.service.ts

@@ -62,4 +62,12 @@ export class SettingsService {
     this.changeTheme(newValue)
     this.saveSettings()
   }
+
+  get rateLimitDelay() {
+    return this.settings == undefined ? NaN : this.settings.rateLimitDelay
+  }
+  set rateLimitDelay(delay: number) {
+    this.settings.rateLimitDelay = delay
+    this.saveSettings()
+  }
 }

src/electron/shared/Settings.ts

@@ -7,5 +7,5 @@ export interface Settings {
 export const defaultSettings: Settings = {
   rateLimitDelay: 31,
   theme: 'Default',
-  libraryPath: 'C:/Users/bouviejs/Desktop/Bridge Notes/TestLibrary' // TODO: default should be undefined
+  libraryPath: undefined
 }