diff --git a/src/app/app.component.css b/src/app/app.component.css index 59009fe..3939d52 100644 --- a/src/app/app.component.css +++ b/src/app/app.component.css @@ -16,6 +16,7 @@ top: 2px; left: 10px; position: relative; + pointer-events: none; } .sidenav-container { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 90c1ac8..3784230 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -24,6 +24,7 @@ import { MatSidenavModule } from '@angular/material/sidenav'; import { MatSlideToggleModule } from '@angular/material/slide-toggle'; import { MatSnackBarModule } from '@angular/material/snack-bar'; import { MatToolbarModule } from '@angular/material/toolbar'; +import { MatTabsModule } from '@angular/material/tabs'; import {DragDropModule} from '@angular/cdk/drag-drop'; import {FormsModule, ReactiveFormsModule} from '@angular/forms'; import { AppComponent } from './app.component'; @@ -113,6 +114,7 @@ export function isVisible({ event, element, scrollContainer, offset }: IsVisible MatSlideToggleModule, MatMenuModule, MatAutocompleteModule, + MatTabsModule, MatTooltipModule, DragDropModule, VgCoreModule, diff --git a/src/app/settings/settings.component.html b/src/app/settings/settings.component.html index 1cc4e6e..576c874 100644 --- a/src/app/settings/settings.component.html +++ b/src/app/settings/settings.component.html @@ -1,295 +1,286 @@

Settings

- + + - - - - - Host - - -
-
-
- - - URL this app will be accessed from, without the port. - -
-
- - - The desired port. Default is 17442. - + + + + +
+
+
+ + + URL this app will be accessed from, without the port. + +
+
+ + + The desired port. Default is 17442. + +
+
- -
-
- - - - - - - Encryption - - -
-
-
- Use encryption + +
+
+
+ Use encryption +
+ +
+ + + +
+ +
+ + + +
+
- -
- - - + +
+
+
+ Allow subscriptions +
+
+ + + Base path for videos from your subscribed channels and playlists. It is relative to YTDL-Material's root folder. + +
+
+ + + Unit is seconds, only include numbers. + +
+
+ Use youtube-dl archive +

With youtube-dl's archive feature, downloaded videos from your subscriptions get recorded in a text file in the subscriptions archive sub-directory.

+

This enables the ability to permanently delete videos from your subscriptions without unsubscribing, and allows you to record which videos you downloaded in case of data loss.

+
+
- -
- - - + +
+
+
+ + Theme + + Default + Dark + + +
+
+ Allow theme change +
+
-
-
- - - - - - - Downloader - - -
-
-
- - - Path for audio only downloads. It is relative to YTDL-Material's root folder. - + +
+
+
+ + Language + + + {{all_locales[locale]['nativeName']}} + + + +
+
+ + + + + + + +
+
+
+ + + Path for audio only downloads. It is relative to YTDL-Material's root folder. + +
+ +
+ + + Path for video downloads. It is relative to YTDL-Material's root folder. + +
-
- - - Global custom args for downloads on the home page. - - -
+
+ + + Global custom args for downloads on the home page. + + +
-
- Use youtube-dl archive -

Note: This setting only applies to downloads on the Home page. If you would like to use youtube-dl archive functionality in subscriptions, head down to the Subscriptions section.

+
+ Use youtube-dl archive +

Note: This setting only applies to downloads on the Home page. If you would like to use youtube-dl archive functionality in subscriptions, head down to the Subscriptions section.

+
+
-
-
- - - - - - - Extra - - -
-
-
- - - - -
-
- File manager enabled -
-
- Allow quality select + + + + + +
+
+
+ + + + +
+
+ File manager enabled +
+
+ Allow quality select +
+
+ Download only mode +
+
+ Allow multi-download mode +
+
+ Require pin for settings + +
+
-
- Download only mode + +
+
+
+ Use YouTube API +
+
+ + + Generating a key is easy! + +
+
-
- Allow multi-download mode -
-
- Require pin for settings - -
-
-
- - - - - - - API - - -
-
-
- Use YouTube API -
-
- - - Generating a key is easy! - -
-
-
- - - - - - - Themes - - -
-
-
- - Default - Dark - + +
+
+
+
Chrome
+

Click here to download the official YoutubeDL-Material Chrome extension manually.

+

You must manually load the extension and modify the extension's settings to set the frontend URL.

+ +
+
+
Firefox
+

Click here to install the official YoutubeDL-Material Firefox extension right off the Firefox extensions page.

+

Detailed setup instructions. Not much is required other than changing the extension's settings to set the frontend URL.

+ +
+
+
Bookmarklet
+

Drag the link below to your bookmarks, and you're good to go! Just navigate to the YouTube video you'd like to download, and click the bookmark.

+ +

YTDL-Bookmarklet

+
+
+ + + - - - - Subscriptions - - -
-
-
- Allow subscriptions -
-
- - - Base path for videos from your subscribed channels and playlists. It is relative to YTDL-Material's root folder. - -
-
- - - Unit is seconds, only include numbers. - -
-
- Use youtube-dl archive -

With youtube-dl's archive feature, downloaded videos from your subscriptions get recorded in a text file in the subscriptions archive sub-directory.

-

This enables the ability to permanently delete videos from your subscriptions without unsubscribing, and allows you to record which videos you downloaded in case of data loss.

-
-
-
- - - - - - - Extensions - - -
-
-
-
Chrome
-

Click here to download the official YoutubeDL-Material Chrome extension manually.

-

You must manually load the extension and modify the extension's settings to set the frontend URL.

- -
-
-
Firefox
-

Click here to install the official YoutubeDL-Material Firefox extension right off the Firefox extensions page.

-

Detailed setup instructions. Not much is required other than changing the extension's settings to set the frontend URL.

- -
-
-
Bookmarklet
-

Drag the link below to your bookmarks, and you're good to go! Just navigate to the YouTube video you'd like to download, and click the bookmark.

- -

YTDL-Bookmarklet

-
-
-
- - - - - - - Version - - -
- -
- - - - - - - - Advanced - - -
-
-
- Use default downloading agent -
-
- - Select a downloader - aria2c - avconv - axel - curl - ffmpeg - httpie - wget - + + --> + + + + + + + +
+
+
+ Use default downloading agent +
+
+ + Select a downloader + + aria2c + avconv + axel + curl + ffmpeg + httpie + wget + + +
+
+ Allow advanced download +
+
-
- Allow advanced download + +
+
-
-
- + + + diff --git a/src/app/settings/settings.component.scss b/src/app/settings/settings.component.scss index 9547506..2db20e2 100644 --- a/src/app/settings/settings.component.scss +++ b/src/app/settings/settings.component.scss @@ -2,11 +2,12 @@ margin-bottom: 20px; } -.locale-select { - margin-bottom: 10px; - width: 130px; -} - .ext-divider { margin-bottom: 14px; -} \ No newline at end of file +} + +.args-edit-button { + position: absolute; + margin-left: 10px; + top: 20px; +}