Update README.md

Update chinese translation

.github/workflows/docker-publish.yml

@@ -8,12 +8,12 @@ name: Docker
 on:
 #  schedule:
 #    - cron: '39 13 * * *'
-  push:
+  release:
     branches: [ master ]
     # Publish semver tags as releases.
     tags: [ 'v*.*.*' ]
-  pull_request:
-    branches: [ master ]
+#  pull_request:
+#    branches: [ master ]
 
 env:
   # Use docker.io for Docker Hub if empty

Dockerfile

@@ -1,11 +1,11 @@
 FROM alpine:3.17
 # folder structure
 WORKDIR /usr/src/yt-dlp-webui/downloads
-VOLUME /usr/src/yt-dlp-webui/downloads
+VOLUME /downloads
 WORKDIR /usr/src/yt-dlp-webui
 # install core dependencies
 RUN apk update
-RUN apk add curl wget psmisc python3 ffmpeg nodejs npm go yt-dlp
+RUN apk add curl wget psmisc ffmpeg nodejs npm go yt-dlp
 # copy srcs
 COPY . .
 # install node dependencies
@@ -14,7 +14,7 @@ RUN npm i
 RUN npm run build
 # install go dependencies
 WORKDIR /usr/src/yt-dlp-webui
-RUN npm go build -o yt-dlp-webui
+RUN go build -o yt-dlp-webui
 # expose and run
 EXPOSE 3033
-CMD [ "yt-dlp-webui" , "--out", "./downloads" ]
+CMD [ "./yt-dlp-webui" , "--out", "/downloads" ]

README.md

@@ -1,13 +1,9 @@
 # yt-dlp Web UI
 
-
-**To anyone who is interested i'm working on a [RPC server for yt-dlp](https://github.com/marcopeocchi/yt-dlp-rpc).**
-
-
 A not so terrible web ui for yt-dlp.  
 Created for the only purpose of *fetching* videos from my server/nas. 
 
-Intended to be used with docker but standalone is fine too. 😎👍
+Intended to be used with docker and in standalone mode. 😎👍
 
 Developed to be as lightweight as possible (because my server is basically an intel atom sbc). 
 
@@ -15,13 +11,14 @@ The bottleneck remains yt-dlp startup time (until yt-dlp will provide a rpc inte
 
 **I strongly recomend the ghcr build instead of docker hub one.**
 
-```shell
-docker pull ghcr.io/marcopeocchi/yt-dlp-web-ui:master
+```sh
+docker pull ghcr.io/marcopeocchi/yt-dlp-web-ui:latest
 ```
 
----
+![](https://i.ibb.co/RCpfg7q/image.png)
+![](https://i.ibb.co/N2749CD/image.png)
 
-Changelog:
+## Changelog
 ```
 05/03/22: Korean translation by kimpig
 
@@ -44,40 +41,33 @@ Refactoring and JSDoc.
 
 08/06/22: ARM builds.
 
-28/02/22: Reworked resume download feature. Now it's pratically instantaneous. It no longer stops and restarts each process, references to each process are saved in memory.
+28/06/22: Reworked resume download feature. Now it's pratically instantaneous. It no longer stops and restarts each process, references to each process are saved in memory.
+
+12/01/23: Switched from TypeScript to Golang on the backend. It was a great effort but it was worth it.
 ```
 
-
-<img src="https://i.imgur.com/gRNYKjI.png">
-
-## Now with dark mode
-
-<img src="https://i.imgur.com/g52mjdD.png">
-
 ## Settings
 
-The avaible settings are currently only:
+The currently avaible settings are:
 -   Server address
 -   Switch theme
 -   Extract audio
 -   Switch language
 -   Optional format selection
+-   Override the output filename
+-   Override the output path
+-   Pass custom yt-dlp arguments safely
 
-<img src="https://i.imgur.com/2zPs8FH.png">
-<img src="https://i.imgur.com/b4Jhkfk.png">
-<img src="https://i.imgur.com/knjLa8c.png">
+![](https://i.ibb.co/YdBVcgc/image.png)
+![](https://i.ibb.co/Sf102b1/image.png)
 
 ## Format selection
 
-![fs1](https://i.ibb.co/fNxDHJd/localhost-1234-2.png)
+![fs1](https://i.ibb.co/8dgS6ym/image.png)
 
-This feature is disabled by default as this WebUI/Wrapper/Software/Bunch of Code is intended to be used to retrieve the best quality automatically.
+This feature is disabled by default as this intended to be used to retrieve the best quality automatically.
 
-To enable it go to the settings page:
-
-![fs2](https://i.ibb.co/YdXRwKc/localhost-1234-3.png)
-
-And set it :D
+To enable it just go to the settings page and enable the **Enable video/audio formats selection** flag!
 
 Future releases will have:
 -   ~~Multi download~~ *done*
@@ -87,46 +77,109 @@ Future releases will have:
 -   ~~ARM Build~~ *done available through ghcr.io*
 
 ## Troubleshooting
--   **It says that it isn't connected/ip in the footer is not defined.**
+-   **It says that it isn't connected/ip in the header is not defined.**
     - You must set the server ip address in the settings section (gear icon).
 -   **The download  doesn't start.**
     - As before server address is not specified or simply yt-dlp process takes a lot of time to fire up. (Forking yt-dlp isn't fast especially if you have a lower-end/low-power NAS/server/desktop where the server is running)
--   **Background jobs are not retrieved.**
-    -   ~~As before forking yt-dlp isn't fast so resuming n background jobs takes _n_*_time to exec yt-dlp_ Just have patience.~~ Fixed.
 
-## Docker installation
-```shell 
+## [Docker](https://github.com/marcopeocchi/yt-dlp-web-ui/pkgs/container/yt-dlp-web-ui) installation
+```sh
 # recomended for ARM and x86 devices 
-docker pull ghcr.io/marcopeocchi/yt-dlp-web-ui:master
-docker run -d -p 3022:3022 -v <your dir>:/usr/src/yt-dlp-webui/downloads ghcr.io/marcopeocchi/yt-dlp-web-ui:master
+docker pull ghcr.io/marcopeocchi/yt-dlp-web-ui:latest
+docker run -d -p 3033:3033 -v <your dir>:/usr/src/yt-dlp-webui/downloads ghcr.io/marcopeocchi/yt-dlp-web-ui:latest
 
 # or even
-docker pull ghcr.io/marcopeocchi/yt-dlp-web-ui:master
-docker create --name yt-dlp-webui -p 8082:3022 -v <your dir>:/usr/src/yt-dlp-webui/downloads ghcr.io/marcopeocchi/yt-dlp-web-ui:master
+docker pull ghcr.io/marcopeocchi/yt-dlp-web-ui:latest
+docker create --name yt-dlp-webui -p 8082:3033 -v <your dir>:/usr/src/yt-dlp-webui/downloads ghcr.io/marcopeocchi/yt-dlp-web-ui:latest
 ```
 
-or  
+Or with docker but building the container manually.
+
+```sh
+docker build -t yt-dlp-webui .
+docker run -d -p 3033:3033 -v <your dir>:/usr/src/yt-dlp-webui/downloads yt-dlp-webui
+```
+
+## [Prebuilt binaries](https://github.com/marcopeocchi/yt-dlp-web-ui/releases) installation
+
+```sh
+# download the latest release from the releases page
+mv yt-dlp-webui_linux-[your_system_arch] /usr/local/bin/yt-dlp-webui
+
+# /home/user/downloads as an example and yt-dlp in $PATH
+yt-dlp-webui --out /home/user/downloads
+
+# specifying yt-dlp path
+yt-dlp-webui --out /home/user/downloads --driver /opt/soemdir/yt-dlp
+
+# specifying using a config file
+yt-dlp-webui --conf /home/user/.config/yt-dlp-webui.conf
+```
+
+### Config file
+By running `yt-dlp-webui` in standalone mode you have the ability to also specify a config file.
+The config file **will overwrite what have been passed as cli argument**.
+
+```yaml
+# Simple configuration file for yt-dlp webui
+
+---
+port: 8989
+downloadPath: /home/ren/archive
+downloaderPath: /usr/local/bin/yt-dlp
+```
+
+### Systemd integration
+By defining a service file in `/etc/systemd/system/yt-dlp-webui.service` yt-dlp webui can be launched as in background.
+
+```
+[Unit]
+Description=yt-dlp-webui service file
+After=network.target
+
+[Service]
+User=some_user
+ExecStart=/usr/local/bin/yt-dlp-webui --out /mnt/share/downloads --port 8100
+
+[Install]
+WantedBy=multi-user.target
+```
 
 ```shell
-docker build -t yt-dlp-webui .
-docker run -d -p 3022:3022 -v <your dir>:/usr/src/yt-dlp-webui/downloads yt-dlp-webui
+systemctl enable yt-dlp-webui
+systemctl start yt-dlp-webui
 ```
 
 ## Manual installation
-```shell
-# the dependencies are: python3, ffmpeg, nodejs, psmisc.
+```sh
+# the dependencies are: python3, ffmpeg, nodejs, psmisc, go.
 
+cd frontend
 npm i
-npm run build-all
+npm run build
 
-# edit the settings.json specifying port and download path or 
-# it will default to the following created folder
-
-mkdir downloads
-
-node dist/main.js
+go build -o yt-dlp-webui main.go
 ```
 
+## Extendable
+You dont'like the Material feel?
+Want to build your own frontend? We got you covered 🤠
+
+`yt-dlp-webui` now exposes a nice **JSON-RPC 1.0** interface through Websockets and HTTP-POST
+It is **planned** to also expose a **gRPC** server.
+
+Just as an overview, these are the available methods:
+-   Service.Exec
+-   Service.Progress
+-   Service.Formats
+-   Service.Pending
+-   Service.Running
+-   Service.Kill
+-   Service.KillAll
+-   Service.Clear
+
+For more information open an issue on GitHub and I will provide more info ASAP.
+
 ## FAQ
 -   **Will it availabe for Raspberry Pi/ generic ARM devices?**
     - Yes, it's currently available through ghcr.io
@@ -136,7 +189,9 @@ node dist/main.js
       If you plan to use it on a Raspberry Pi ensure to have fast and durable storage.
 -   **Why the docker image is so heavy?**
     - Originally it was 1.8GB circa, now it has been slimmed to ~340MB compressed. This is due to the fact that it encapsule a basic Alpine linux image + FFmpeg + Node.js + Python3 + yt-dlp.
--   **Am I forced to run it on port 3022?**
-    -   Well, yes (until now).
+
 -   **Why is it so slow to start a download?**
     - I genuinely don't know. I know that standalone yt-dlp is slow to start up even on my M1 Mac, so....
+
+## What yt-dlp-webui is not
+`yt-dlp-webui` isn't your ordinary website where to download stuff from the internet, so don't try asking for links of where this is hosted. It's a self hosted platform for a Linux NAS.

fetch-yt-dlp.sh

@@ -1,13 +0,0 @@
-#!/bin/sh
-
-echo "Downloading latest yt-dlp build..."
-
-rm -f yt-dlp
-
-RELEASE=$(curl --silent "https://api.github.com/repos/yt-dlp/yt-dlp/releases/latest" | grep '"tag_name":' | sed -E 's/.*"([^"]+)".*/\1/')
-
-wget "https://github.com/yt-dlp/yt-dlp/releases/download/$RELEASE/yt-dlp"
-
-chmod +x yt-dlp
-
-echo "Done!"

frontend/package.json

@@ -15,7 +15,6 @@
     "@mui/icons-material": "^5.6.2",
     "@mui/material": "^5.6.4",
     "@reduxjs/toolkit": "^1.8.1",
-    "radash": "^10.6.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-redux": "^8.0.1",
@@ -32,8 +31,6 @@
     "@types/uuid": "^8.3.4",
     "@vitejs/plugin-react": "^1.3.2",
     "buffer": "^6.0.3",
-    "path-browserify": "^1.0.1",
-    "process": "^0.11.10",
     "typescript": "^4.6.4",
     "vite": "^2.9.10"
   }

frontend/src/Home.tsx

@@ -70,6 +70,7 @@ export default function Home({ socket }: Props) {
     socket.onopen = () => {
       dispatch(connected())
       setCustomArgs(localStorage.getItem('last-input-args') ?? '')
+      setFilenameOverride(localStorage.getItem('last-filename-override') ?? '')
     }
   }, [])
 
@@ -136,7 +137,6 @@ export default function Home({ socket }: Props) {
 
     setUrl('')
     setWorkingUrl('')
-    setFilenameOverride('')
 
     setTimeout(() => {
       resetInput()
@@ -179,6 +179,7 @@ export default function Home({ socket }: Props) {
    */
   const handleFilenameOverrideChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setFilenameOverride(e.target.value)
+    localStorage.setItem('last-filename-override', e.target.value)
   }
 
   /**
@@ -297,6 +298,7 @@ export default function Home({ socket }: Props) {
                       fullWidth
                       label={i18n.t('customFilename')}
                       variant="outlined"
+                      value={fileNameOverride}
                       onChange={handleFilenameOverrideChange}
                       disabled={!status.connected || (settings.formatSelection && downloadFormats != null)}
                     />

frontend/src/assets/i18n.yaml

@@ -72,15 +72,15 @@ languages:
     toastConnected: '已连接到 '
     toastUpdated: 已更新 yt-dlp 可执行文件！
     formatSelectionEnabler: 启用视频/音频格式选择
-    themeSelect: 'Theme'
-    languageSelect: 'Language'
-    overridesAnchor: Overrides
-    pathOverrideOption: Enable output path overriding
-    filenameOverrideOption: Enable output file name overriding
-    customFilename: Custom filemame (leave blank to use default)
-    customPath: Custom path
-    customArgs: Enable custom yt-dlp args (great power = great responsabilities)
-    customArgsInput: Custom yt-dlp arguments
+    themeSelect: '主题'
+    languageSelect: '语言'
+    overridesAnchor: 覆盖
+    pathOverrideOption: 启用输出路径覆盖
+    filenameOverrideOption: 启用输出文件名覆盖
+    customFilename: 自定义文件名（留空使用默认值）
+    customPath: 自定义路径
+    customArgs: 启用自定义 yt-dlp 参数（能力越大 = 责任越大）
+    customArgsInput: 自定义 yt-dlp 参数
   spanish:
     urlInput: YouTube or other supported service video url
     statusTitle: Status

frontend/src/features/core/intl.ts

@@ -1,28 +1,28 @@
 // @ts-nocheck
-import i18n from "../../assets/i18n.yaml";
+import i18n from "../../assets/i18n.yaml"
 
 export default class I18nBuilder {
-    private language: string;
-    private textMap = i18n.languages;
+    private language: string
+    private textMap = i18n.languages
 
     constructor(language: string) {
-        this.language = language;
+        this.language = language
     }
 
     getLanguage(): string {
-        return this.language;
+        return this.language
     }
 
     setLanguage(language: string): void {
-        this.language = language;
+        this.language = language
     }
 
     t(key: string): string {
         const map = this.textMap[this.language]
         if (map) {
-            const translation = map[key];
-            return translation ?? 'caption not defined';
+            const translation = map[key]
+            return translation ?? 'caption not defined'
         }
-        return 'caption not defined';
+        return 'caption not defined'
     }
 }

frontend/src/features/core/rpcClient.ts

@@ -20,10 +20,13 @@ export class RPCClient {
   }
 
   private sendHTTP<T>(req: RPCRequest) {
-    return new Promise<RPCResponse<T>>((resolve, reject) => {
+    return new Promise<RPCResponse<T>>((resolve) => {
       fetch(getHttpRPCEndpoint(), {
         method: 'POST',
-        body: JSON.stringify(req)
+        body: JSON.stringify({
+          id: this.incrementSeq(),
+          ...req
+        })
       })
         .then(res => res.json())
         .then(data => resolve(data))
@@ -59,6 +62,7 @@ export class RPCClient {
 
   public running() {
     this.send({
+      id: this.incrementSeq(),
       method: 'Service.Running',
       params: [],
     })

server/process.go

@@ -130,7 +130,6 @@ func (p *Process) Start(path, filename string) {
 	go func() {
 		defer r.Close()
 		defer p.Complete()
-		defer close(eventChan)
 		for scan.Scan() {
 			eventChan <- scan.Text()
 		}