refactor(workflow): only run action on manual trigger

Bumps [electron](https://github.com/electron/electron) from 29.2.0 to 30.0.2.
- [Release notes](https://github.com/electron/electron/releases)
- [Changelog](https://github.com/electron/electron/blob/main/docs/breaking-changes.md)
- [Commits](https://github.com/electron/electron/compare/v29.2.0...v30.0.2)

---
updated-dependencies:
- dependency-name: electron
  dependency-type: direct:development
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

.github/FUNDING.yml

@@ -1 +1 @@
-liberapay: barbapapa
+custom: https://my.fsf.org/donate

.github/dependabot.yml

@@ -3,4 +3,4 @@ updates:
   - package-ecosystem: "npm"
     directory: "/"
     schedule:
-      interval: "daily"
+      interval: "weekly"

.github/workflows/build.yml

@@ -1,27 +1,24 @@
 on:
-  push:
-    branches:
-      - master
-  pull_request:
-  workflow_dispatch:
+  workflow_dispatch
 
 jobs:
   build:
-    runs-on: macos-latest
+    runs-on: ubuntu-latest
     steps:
       - name: Check out repositoty
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Set up nodejs
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: 18
+          cache: 'npm'
+          node-version: 20
 
       - name: Set up npm project
         run: npm install
 
       - name: Build project
-        run: npm run buildall
+        run: npm run build
 
       - name: Move x64 exe
         run: cp ./dist/SteamDepotDownloaderGUI*.exe ./SteamDepotDownloaderGUI-${{ github.run_number }}.exe
@@ -39,7 +36,7 @@ jobs:
         run: cp `ls -d1 dist/* | grep -E "steamdepotdownloadergui-[0-9]+\.[0-9]+\.[0-9]+\-arm64.zip"` ./SteamDepotDownloaderGUI-${{ github.run_number }}-arm64.zip
 
       - name: Upload artifacts
-        uses: actions/upload-artifact@v3
+        uses: actions/upload-artifact@v4
         with:
           name: SteamDepotDownloaderGUI-${{ github.run_number }}
           path: SteamDepotDownloaderGUI-${{ github.run_number }}*.*

.github/workflows/github-repo-stats.yml

@@ -14,6 +14,6 @@ jobs:
     steps:
       - name: run-ghrs
         # Use latest release.
-        uses: jgehrcke/github-repo-stats@v1.4.1 # Don't use latest release for security reasons (what if the workflow gets taken over by a malicious party)
+        uses: jgehrcke/github-repo-stats@v1.4.2
         with:
           ghtoken: ${{ secrets.ghrs_github_api_token }}

.gitignore

@@ -135,7 +135,9 @@ dist
 # IntelliJ
 .idea/
 
-# SteamDepotDownloaderGUI specific directories
-/depotdownloader/
-/games/
-*.zip
+# SteamDepotDownloaderGUI specific
+depotdownloader
+games
+*.zip
+run.bat
+run.sh

README.md

@@ -1,40 +1,106 @@
-<h1 align="center">SteamDepotDownloaderGUI</h1>
 
-<p align="center">SteamDepotDownloaderGUI is a graphical user interface for DepotDownloader.</p>
-<p align="center">You can download older versions of Steam games, useful for testing and speedrunners.</p>
+<h1 align="center">SteamDepotDownloaderGUI
+
+<h4 align="center">A graphical wrapper for DepotDownloader, designed to make downloading older versions of Steam games easy. built using <a href="https://www.electronjs.org" target="_blank">Electron</a>.
+<br><br>
+→<a href="https://www.youtube.com/watch?v=H2COwT5OUOo" target="_blank"><b>Tutorial</b></a> ~ 
+<a href="https://github.com/mmvanheusden/SteamDepotDownloaderGUI/tree/steamdeck-dotnet#steamdepotdownloadergui-for-steam-deck" target="_blank"><b>Steam Deck</b></a> ~ 
+<a href="https://www.youtube.com/watch?v=ogiDAuH3VdY" target="_blank"><b>Subnautica</b></a>←
+</h4>
+
+
+
+<p align="center"><a href="https://github.com/mmvanheusden/SteamDepotDownloaderGUI/releases/latest"><img src="https://img.shields.io/github/downloads/mmvanheusden/SteamDepotDownloaderGUI/total?color=orange&label=downloads" alt="Download count badge"></a><a href="https://img.shields.io/github/last-commit/mmvanheusden/SteamDepotDownloaderGUI?color=crimson"><img src="https://img.shields.io/github/last-commit/mmvanheusden/SteamDepotDownloaderGUI?color=crimson" alt="Last contribution badge"></a><a href="https://github.com/mmvanheusden/SteamDepotDownloaderGUI/releases/latest"><img src="https://img.shields.io/badge/Download -ffbd03?style=for-the-badge&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAABmJLR0QA/wD/AP+gvaeTAAABd0lEQVRoge2XwUrDQBCGPz3Ee++2UBSvdsGbeLHeFX0lPQhei+8g2AfwSVREK+LJ1oqHUGjRQ7Z0laRJNtldKPPBwoTM7D9/sks2IAiCsKrsAK/AC7DtSmTd1cTAKbAJtIAzVyIuDURGvOFKxKUBL4iB0IiB0IiB0IiB0IiB0IiB0IiB0IgBoA08Ak+AKpCvdO6AGn416zBwDGyRGLljuQmlc9pAEzipKl6HgVtgpOMGSYOdlLyOvtfQ1yPgpgb9WlDAEPjRYwj0jet+yv0iy80ru8AHiyazxiewF6jHXPJMeG3+CoiBy5J1/5dTlWVzAXwD5yXrAJho4YlFbdqesFnzsa6PLWr/PD0bFPAA3GO/YXN7WMspLpLnktweVvooMTPiKDPLHabmLCtpmYF3I96v3E55Doz4zWaCaxYb6Bno4udNRMCR1pzr92wmagFfZH+UfI0xycHPim5gE2Pg0Lb5OU2SVzgAph6anmqtHhWevCAIgh9+AdLMtu/CZhHJAAAAAElFTkSuQmCC" alt="Download latest release badge"></a><a href="https://img.shields.io/endpoint?url=https%3A%2F%2Fhits.dwyl.com%2Fmmvanheusden%2Fsteamdepotdownloadergui.json&color=lightblue"><img src="https://img.shields.io/endpoint?url=https%3A%2F%2Fhits.dwyl.com%2Fmmvanheusden%2Fsteamdepotdownloadergui.json&color=lightblue" alt="Visitor count badge"></a><a href="https://my.fsf.org/donate"><img src="https://img.shields.io/badge/Donate-%23A42E2B?logo=gnu" alt="Donation badge"></a><a href="https://www.codefactor.io/repository/github/mmvanheusden/steamdepotdownloadergui/badge/master"><img src="https://www.codefactor.io/repository/github/mmvanheusden/steamdepotdownloadergui/badge/master" alt="CodeFactor badge"></a></p>
+
 
 <p align="center">
-  <img alt="GitHub all releases" src="https://img.shields.io/github/downloads/mmvanheusden/SteamDepotDownloaderGUI/total?color=orange&label=downloads">
-  <img alt="GitHub last commit" src="https://img.shields.io/github/last-commit/mmvanheusden/SteamDepotDownloaderGUI?color=crimson">
-  <a href="https://github.com/mmvanheusden/SteamDepotDownloaderGUI/releases/latest"><img alt="Download latest release" src="https://img.shields.io/badge/Download -ffbd03?style=for-the-badge&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAABmJLR0QA/wD/AP+gvaeTAAABd0lEQVRoge2XwUrDQBCGPz3Ee++2UBSvdsGbeLHeFX0lPQhei+8g2AfwSVREK+LJ1oqHUGjRQ7Z0laRJNtldKPPBwoTM7D9/sks2IAiCsKrsAK/AC7DtSmTd1cTAKbAJtIAzVyIuDURGvOFKxKUBL4iB0IiB0IiB0IiB0IiB0IiB0IiB0IgBoA08Ak+AKpCvdO6AGn416zBwDGyRGLljuQmlc9pAEzipKl6HgVtgpOMGSYOdlLyOvtfQ1yPgpgb9WlDAEPjRYwj0jet+yv0iy80ru8AHiyazxiewF6jHXPJMeG3+CoiBy5J1/5dTlWVzAXwD5yXrAJho4YlFbdqesFnzsa6PLWr/PD0bFPAA3GO/YXN7WMspLpLnktweVvooMTPiKDPLHabmLCtpmYF3I96v3E55Doz4zWaCaxYb6Bno4udNRMCR1pzr92wmagFfZH+UfI0xycHPim5gE2Pg0Lb5OU2SVzgAph6anmqtHhWevCAIgh9+AdLMtu/CZhHJAAAAAElFTkSuQmCC">
-  </a>
-  <img alt="Visitor Count" src="https://visitor-badge.glitch.me/badge?page_id=mmvanheusden.SteamDepotDownloaderGUI">
-  <a href="https://www.codefactor.io/repository/github/mmvanheusden/steamdepotdownloadergui/overview/master"><img src="https://www.codefactor.io/repository/github/mmvanheusden/steamdepotdownloadergui/badge/master" alt="CodeFactor" /></a>
-</p>
-<p align="center">
-  <img alt="Screenshot" src="screenshot.png" />
+  <img alt="Screenshot of the downloader interface" src="screenshot.png"  
+     style="max-width: 60%;"/>
 </p>
 
-## Installation
+## Features
 
-Download the latest release for your operating system
-from [GitHub](https://github.com/mmvanheusden/SteamDepotDownloaderGUI/releases/latest).
+* **Cross platform**
+  - Windows
+  - <s>macOS</s> (in development™)
+  - Linux
+  - [Steam Deck](https://github.com/mmvanheusden/SteamDepotDownloaderGUI/tree/steamdeck-dotnet#steamdepotdownloadergui-for-steam-deck)
+* **Cross terminal**
+  - Gnome Terminal
+  - Konsole
+  - xfce4-terminal
+  - Terminator
+  - Terminology
+  - xterm
+  - Kitty
+  - LXTerminal
+  - Tilix
+  - Deepin Terminal
+  - cool-retro-term
+  - Manual: produce a script that can be copy pasted into a terminal of choice
+* **Support for anonymous downloads**
 
-## Support
+## Rewrite
+Computer resources are not an all-you-can-eat buffet. The executables weigh on average 103 MB.  
+That's why in the future, this project is fully switching to a different toolset, probably [gtk-rs](https://gtk-rs.org/).
+This framework is more suited as we don't need a whole browser engine just to download files.
 
-If you need help, please open an issue.
 
-**⚠ No support will be provided for binaries downloaded from unofficial mirrors like softpedia. ⚠**
+## Download
 
-## Usage
+### Windows:
+* If you haven't already, install [.NET SDK 6.0](https://dotnet.microsoft.com/en-us/download/dotnet/6.0) on your computer.
+  Then, download the [latest Windows build](https://github.com/mmvanheusden/SteamDepotDownloaderGUI/releases/latest)
+### **Linux:**
+#### Arch Linux:
+* There is an [AUR package](https://aur.archlinux.org/packages/steamdepotdownloadergui-bin) made. this can be installed using `yay -S steamdepotdownloadergui-bin`.
+  **This is not maintained by me!!**
+#### Other Linux distros:
+* **You'll need `unzip`, .NET SDK 6.0.**
+* **Ubuntu:**
+  
+  `sudo apt install unzip dotnet-sdk-6.0`
+* **Fedora:**
+  
+  `sudo dnf install unzip dotnet-sdk-6.0`
 
-Enter everything you normally would in the DepotDownloader console.
+  
+* There are several options, AppImage, and a `.zip`, for both x64 and arm64.
+  
+  [Download latest release](https://github.com/mmvanheusden/SteamDepotDownloaderGUI/releases/latest)
 
-## Contributing
 
-If you want to contribute to SteamDepotDownloaderGUI, please make sure to follow
-the [contributing instructions and guidelines](contributing.md).
+## How to use
 
-Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
+#### Tutorials:
+* https://www.youtube.com/watch?v=H2COwT5OUOo How to download older versions of Steam games. rollback steam games tutorial
+* https://www.youtube.com/watch?v=ogiDAuH3VdY How to download older versions of Subnautica tutorial
+---
 
-Please make sure to keep code consistent and cross-platform compatible.
+**Enter everything you normally would in the DepotDownloader console and select your OS/terminal and click download**
+
+
+## Credits
+
+This software makes use of the following projects:
+- [**DepotDownloader**](https://github.com/SteamRE/DepotDownloader/)
+- [Electron](https://www.electronjs.org/)
+- [Node.js](https://nodejs.org/)
+- [Primer CSS](https://primer.style/css/)
+- [follow-redirects](https://github.com/follow-redirects/follow-redirects)
+- [Hubut Sans](https://github.com/github/hubot-sans) under [license](https://github.com/github/hubot-sans/blob/05d5ea150c20e6434485db8ffd2277ed18a9e911/LICENSE) 
+
+
+## Donate
+I prefer not to receive any donations. If you want to make me happy open an issue and say thanks ;)  
+Please donate to the [Free Software Foundation](https://my.fsf.org/donate) instead.
+
+
+## Contribute
+If you would like to contribute to SteamDepotDownloaderGUI, please make sure to follow
+the [contributing instructions and guidelines](contributing.md).  
+Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.  
+Please make sure to keep code clean and cross-platform compatible.
+
+
+![forthebadge](https://forthebadge.com/images/featured/featured-built-with-love.svg)

contributing.md

@@ -2,8 +2,8 @@
 
 SteamDepotDownloaderGUI is a graphical user interface for DepotDownloader.
 
-It is written in Node.js and uses the [electron](https://electronjs.org/) framework.
-The CSS framework is [Primer](https://primer.style).
+It is written in Node.js and uses the [Electron](https://electronjs.org/) framework.
+The CSS framework being used is [Primer](https://primer.style), by GitHub.
 
 ## Setup development environment
 
@@ -38,7 +38,7 @@ npm start
 npm run build
 ```
 
-* If you are using macOS, you may build using the following command:
+* If you are using macOS, you can build using the following command:
 
 ```bash
 npm run buildall

downloader.js

@@ -1,84 +1,358 @@
+// Uses a prebuild binary of https://github.com/SteamRE/DepotDownloader
+// License can be found at https://github.com/SteamRE/DepotDownloader/blob/master/LICENSE
+const {ipcRenderer, shell} = require("electron")
 const {
 	preDownloadCheck,
 	download,
-	createCommand,
 	runCommand,
 	removeDir,
 	removeFile,
-	unzip
+	unzip,
+	forceTerminals,
+	generateRunScript,
+	createCommandWithTerminal,
+	platformpath
 } = require("./utils")
+const electron = require("electron")
+const {sep} = require("path")
+
+// Initializes the variable that holds the path to the specified download location
+let exportedFile = ""
+let ready = true
+let app_version
+
+const DOTNET_DOWNLOAD_URL = "https://github.com/SteamRE/DepotDownloader/releases/download/DepotDownloader_2.5.0/depotdownloader-2.5.0.zip" // the url to the depotdownloader zip
+const DOTNET_DIR = "depotdownloader" // folder where zip is extracted
+const DOTNET_ZIP_FILE = DOTNET_DOWNLOAD_URL.split("/").pop() // the file that is being downloaded.
 
 function submitForm() {
 	// Check if the form is filled in and if dotnet is installed
 	preDownloadCheck().then(async function () {
+		//console.log(terminal[1][0])
 		document.getElementById("dotnetwarning").hidden = true
+		document.getElementById("dotnetwarning2").hidden = true
 		document.getElementById("emptywarning").hidden = true
 		console.info("dotnet found in PATH")
+		// create variables for the form values
+		const username = document.getElementById("username").value
+		const password = document.getElementById("password").value
+		const appid = document.getElementById("appid").value
+		const depotid = document.getElementById("depotid").value
+		const manifestid = document.getElementById("manifestid").value
+		const terminal_dropdown = document.getElementById("terminal-dropdown").selectedIndex
+		const os_dropdown = document.getElementById("os-dropdown").selectedIndex
+		const foldername_element = document.getElementById("folder-name-custom-input")
 
-		// Remove the old depotdownloader directory
+
+		// Remove the old depotdownloader directory if there are any
 		await removeDir("depotdownloader")
 
-		// Download the DepotDownloader binary, so it doesn't have to be included in the source code
-		await download("https://github.com/SteamRE/DepotDownloader/releases/download/DepotDownloader_2.4.7/depotdownloader-2.4.7.zip")
+		// Download a prebuild DepotDownloader binary, so it doesn't have to be included in the source code
+		await download(DOTNET_DOWNLOAD_URL)
 
 		// Unzip the DepotDownloader binary
-		await unzip("depotdownloader-2.4.7.zip", "depotdownloader")
+		await unzip(DOTNET_ZIP_FILE, DOTNET_DIR)
 
 		// Clean up the old files
-		await removeFile("depotdownloader-2.4.7.zip")
+		await removeFile(DOTNET_ZIP_FILE)
+
+		// Generate the run script (run.sh for linux, or run.bat for windows).
+		await generateRunScript(username, password, appid, depotid, manifestid, foldername_element, exportedFile)
+
+		let terminal
+		let os
+		if (terminal_dropdown === 11) {
+			terminal = "auto"
+		} else {
+			terminal = terminal_dropdown
+		}
+		if (os_dropdown === 4) {
+			os = "auto"
+		} else {
+			os = os_dropdown
+		}
+		let command
+		if (process.platform.includes("linux")) {
+			// if the OS is linux, run the sh file with the chosen terminal
+			command = await createCommandWithTerminal(`sh ${platformpath().replaceAll(" ", "\\ ")}${sep}run.sh`, terminal, os)
+		} else if (process.platform.includes("win")) {
+			// if the OS is windows, just run the batch file
+			command = await createCommandWithTerminal(`"${platformpath()}${sep}run.bat"`, terminal, os)
+		} else if (process.platform.includes("darwin")) {
+			//macOS
+		}
 
 		// Run the final command
-		await runCommand(createCommand())
+		if (document.getElementById("os-dropdown").selectedIndex !== 3) await console.debug("Command issued:\n--------\n" + command)
+		await runCommand(command)
 	}).catch(function (error) {
 		if (error === "noDotnet") {
-			console.error("Dotnet not found in PATH")
+			// if dotnet is not found, show the dotnet warning
+			document.getElementById("dotnetwarning2").hidden = true
 			document.getElementById("emptywarning").hidden = true
 			document.getElementById("dotnetwarning").hidden = false
 		} else if (error === "emptyField") {
-			console.error("Fill in all required fields")
+			// if a required field is empty, show the empty field warning
+			document.getElementById("dotnetwarning2").hidden = true
 			document.getElementById("dotnetwarning").hidden = true
 			document.getElementById("emptywarning").hidden = false
 		}
 	})
 }
 
-function submitDotnet() {
+// Combines all buttons that are supposed to open an external URL into one big function.
+function openRelevantPage(target) {
 	const electron = require("electron")
 	const os = process.platform.toString()
-	document.getElementById("dotnetwarning").hidden = true
-	if (os.includes("win")) {
-		console.debug("Opened .NET download page for " + os.charAt(0).toUpperCase() + os.slice(1))
-		void electron.shell.openExternal("https://dotnet.microsoft.com/en-us/download/dotnet/thank-you/sdk-6.0.301-windows-x64-installer")
+	/* eslint-disable indent */
+	// why are you not indenting nicely eslint?
+	switch (target) {
+	case "dotnet":
+		document.getElementById("dotnetwarning").hidden = true
+		document.getElementById("dotnetwarning2").hidden = false
+		if (os.includes("win")) {
+			console.debug("Opened .NET download page for " + os.charAt(0).toUpperCase() + os.slice(1))
+			void electron.shell.openExternal("https://aka.ms/dotnet/6.0/dotnet-sdk-win-x64.exe")
+		}
+		if (os.includes("linux")) {
+			const electron = require("electron")
+			console.debug("Opened .NET download page for " + os.charAt(0).toUpperCase() + os.slice(1))
+			void electron.shell.openExternal("https://docs.microsoft.com/en-us/dotnet/core/install/linux")
+		}
+		if (os.includes("darwin")) {
+			console.debug("Opened .NET download page for" + os)
+			//TODO: Apple Silicon(ARM64) URL
+			void electron.shell.openExternal("https://aka.ms/dotnet/6.0/dotnet-sdk-osx-x64.pkg")
+		}
+		break
+	case "issues":
+		console.debug("Opened GitHub issues page")
+		void electron.shell.openExternal("https://github.com/mmvanheusden/SteamDepotDownloaderGUI/issues/new")
+		break
+	case "steamdb":
+		console.debug("Opened SteamDB instant search page")
+		void electron.shell.openExternal("https://steamdb.info/instantsearch/")
+		break
+	case "donate":
+		console.debug("Opened donation page")
+		void electron.shell.openExternal("https://my.fsf.org/donate")
+		break
+	case "instructions":
+		console.debug("Opened instructions page")
+		void electron.shell.openExternal("https://github.com/mmvanheusden/SteamDepotDownloaderGUI/#how-to-use")
+		break
+	default:
+		return
 	}
-	if (os.includes("linux")) {
-		console.debug("Opened .NET download page for " + os.charAt(0).toUpperCase() + os.slice(1))
-		void electron.shell.openExternal("https://docs.microsoft.com/en-us/dotnet/core/install/linux")
-	}
-	if (os.includes("darwin")) {
-		console.debug("Opened .NET download page for" + os)
-		//TODO: Apple Silicon(ARM64) URL
-		void electron.shell.openExternal("https://dotnet.microsoft.com/en-us/download/dotnet/thank-you/sdk-6.0.301-macos-x64-installer")
+	/* eslint-enable indent */
+}
+
+// Opens the chosen location where the game will be downloaded to
+function checkPath() {
+	toggleFormAccessibility(false)
+	shell.openPath(exportedFile).then(() => {
+		console.log("Opened " + exportedFile + " in file explorer.")
+	})
+}
+
+/**
+ * Fills the values for default os
+ * Runs when the app is fully loaded.
+ */
+function fillDefaultValues() {
+	// [0]: Windows, [1]: macOS [2]: Linux [3]: manual
+	if (process.platform.toString().includes("linux")) {
+		document.getElementById("default-os").innerText = "Linux"
+	} else if (process.platform.toString().includes("win")) {
+		document.getElementById("default-os").innerText = "Windows"
+	} else if (process.platform.toString().includes("darwin")) {
+		document.getElementById("default-os").innerText = "macOS"
 	}
 }
 
-function openGitHubIssues() {
-	const electron = require("electron")
-	console.debug("Opened GitHub issues page")
-	void electron.shell.openExternal("https://github.com/mmvanheusden/SteamDepotDownloaderGUI/issues/new")
+
+/**
+ * Validates the choice of the OS dropdown.
+ * If the choice is 2 (Linux), enable the terminal selection dropdown.
+ * If the choice is not 2 (Linux), disable the terminal selection dropdown.
+ * If the choice is 4 (manual), enable the terminal selection dropdown.
+ * If the choice is not 4 (manual), disable the terminal selection dropdown.
+ */
+function validateChoice() {
+	// [0]: Windows, [1]: macOS [2]: Linux [3]: manual
+	const os_dropdown = document.getElementById("os-dropdown")
+	const terminal_dropdown = document.getElementById("terminal-dropdown")
+	// if the choice = 2, enable the terminal selection dropdown.
+	if (os_dropdown.selectedIndex === (2 || 3)) {
+		terminal_dropdown.disabled = false
+	} else {
+		terminal_dropdown.disabled = true
+		terminal_dropdown.selectedIndex = 11
+	}
+	if (os_dropdown.selectedIndex === 4) if (process.platform.includes("linux")) terminal_dropdown.disabled = false
 }
 
-function openSteamDB() {
-	const electron = require("electron")
-	console.debug("Opened SteamDB instant search page")
-	void electron.shell.openExternal("https://steamdb.info/instantsearch/")
+/**
+ * Enable or disable the form.
+ * @param disable Enable or disable the form.
+ *
+ * * true => disable everything
+ *
+ * * false => enable everything
+ */
+function toggleFormAccessibility(disable) {
+	document.getElementById("username").disabled = disable
+	document.getElementById("theform").disabled = disable
+	document.getElementById("password").disabled = disable
+	document.getElementById("appid").disabled = disable
+	document.getElementById("depotid").disabled = disable
+	document.getElementById("manifestid").disabled = disable
+	document.getElementById("os-dropdown").disabled = disable
+
+	// if the OS dropdown value was 2 (Linux), don't disable the Terminal dropdown.
+	document.getElementById("terminal-dropdown").disabled = (((document.getElementById("os-dropdown").selectedIndex !== 2)))
+
+	document.getElementById("pickpath").ariaDisabled = disable
+	document.getElementById("pickpath").disabled = disable
+	document.getElementById("downloadbtn").ariaDisabled = disable
+	document.getElementById("downloadbtn").disabled = disable
+	document.getElementById("settings-button").disabled = disable
+	document.getElementById("downloadbtn").classList.replace(((disable) ? "btn-primary" : "btn-disabled"), ((!disable) ? "btn-primary" : "btn-disabled"))
 }
 
-/* Everything below this line runs when the page is loaded */
+
+function setTheme(theme) {
+	document.getElementById("theme-auto").ariaSelected = (theme === "auto").toString()
+	document.getElementById("theme-light").ariaSelected = (theme === "light").toString()
+	document.getElementById("theme-dark").ariaSelected = (theme === "dark").toString()
+}
+
+// main.js sends a ready message if the page is loaded in. This will be received here.
+ipcRenderer.on("ready", async () => {
+	if (!ready) return
+
+
+	await toggleFormAccessibility(true) // disables the form, while loading
+	document.getElementById("loader").hidden = false
+
+
+	console.debug("🐰🐰🐰🐰")
+
+
+	await fillDefaultValues() // Set the default values based on OS
+
+	const terminals = await forceTerminals()
+	/* forceTerminals() returns two values:
+	[bol, list, list]
+	1: true/false. if true, there are terminals found. if false none are, or not on linux
+	2: a list of available terminals with their associated number in the terminal dropdown index.
+	3: a list of available terminals with their associated name in the terminal dropdown.
+	 */
+	if (terminals[0]) {
+		console.log(`${terminals[1].length} terminals found in PATH.`)
+		document.getElementById("terminals-found").innerText = `${terminals[1].length.toString()} / ${document.getElementById("terminal-dropdown").length - 1}`
+		document.getElementById("default-terminal").innerText = terminals[2][0]
+
+	} else {
+		console.log("No terminals found in PATH. Continuing with default values") // when no terminals are found on the system, or when linux is not used.
+	}
+
+	await toggleFormAccessibility(false) //enable the form again
+
+	await validateChoice() // updates the 'enabled/disabled' html value of the terminal dropdown.
+
+	console.debug(`DEBUGGING INFORMATION:
+--
+OS: ${process.platform}
+Version: ${app_version}
+--
+Working directory locating methods:
+process.cwd(): ${process.cwd()}
+__dirname: ${__dirname}
+PORTABLE_EXECUTABLE_DIR: ${process.env.PORTABLE_EXECUTABLE_DIR}
+--
+platformpath(): ${platformpath()}
+
+`)
+	document.getElementById("loader").hidden = true
+	ready = false
+})
 
 // Add event listeners to the buttons
 window.addEventListener("DOMContentLoaded", () => {
-	document.getElementById("dotnetalertbtn").addEventListener("click", submitDotnet)
-	document.getElementById("downloadbtn").addEventListener("click", submitForm)
-	document.getElementById("smbtn1").addEventListener("click", openGitHubIssues)
-	document.getElementById("smbtn2").addEventListener("click", openSteamDB)
-})
+	document.getElementById("dotnetalertbtn").addEventListener("click", () => openRelevantPage("dotnet"))
+	document.getElementById("smbtn1").addEventListener("click", () => openRelevantPage("issues"))
+	document.getElementById("smbtn2").addEventListener("click", () => openRelevantPage("steamdb"))
+	document.getElementById("smbtn3").addEventListener("click", () => openRelevantPage("donate"))
+	document.getElementById("smbtn4").addEventListener("click", () => openRelevantPage("instructions"))
+	document.getElementById("pickpath").addEventListener("click", () => {
+		if (document.getElementById("pickpath").disabled === false) ipcRenderer.send("selectpath")
+	})
+	document.getElementById("checkpath").addEventListener("click", () => {
+		if (document.getElementById("checkpath").disabled === false) checkPath()
+	})
+	document.getElementById("os-dropdown").addEventListener("input", validateChoice)
+	document.getElementById("downloadbtn").addEventListener("click", () => {
+		if (document.getElementById("downloadbtn").disabled === false) submitForm()
+	})
+	document.getElementById("settings-button").addEventListener("click", () => {
+		if (document.getElementById("settings-button").disabled === false) {
+			// show the modal. This is done by setting the display to block.
+			document.getElementById("settings-surrounding").style.display = "block"
+		}
+	})
+	document.getElementById("settings-surrounding").addEventListener("click", (event) => {
+		if (event.target === document.getElementById("settings-surrounding")) {
+			document.getElementById("settings-surrounding").style.display = "none"
+		}
+	})
+	document.getElementById("theme-auto").addEventListener("click", () => {
+		setTheme("auto")
+		document.getElementById("theme").setAttribute("data-color-mode", "auto")
+	})
+	document.getElementById("theme-light").addEventListener("click", () => {
+		setTheme("light")
+		document.getElementById("theme").setAttribute("data-color-mode", "light")
+	})
+	document.getElementById("theme-dark").addEventListener("click", () => {
+		setTheme("dark")
+		document.getElementById("theme").setAttribute("data-color-mode", "dark")
+	})
+	document.getElementById("folder-name-appid").addEventListener("click", () => {
+		document.getElementById("folder-name-custom").ariaSelected = false
+		document.getElementById("folder-name-appid").ariaSelected = true
+		document.getElementById("folder-name-custom-input").hidden = true
+		document.getElementById("folder-name-custom-input").value = ""
+	})
+	document.getElementById("folder-name-custom").addEventListener("click", () => {
+		document.getElementById("folder-name-appid").ariaSelected = false
+		document.getElementById("folder-name-custom").ariaSelected = true
+		document.getElementById("folder-name-custom-input").hidden = false
+	})
+	document.getElementById("version-info").addEventListener("click", () => {
+		//todo: update checker
+		electron.shell.openExternal(`https://github.com/mmvanheusden/SteamDepotDownloaderGUI/releases/v${app_version}`)
+	})
+})
+
+// make sure devtools open in external window.
+window.addEventListener("keydown", (e) => {
+	if (e.key === "F12" || (e.ctrlKey && e.shiftKey && e.key === "I")) {
+		e.preventDefault()
+		ipcRenderer.send("open-devtools")
+	}
+})
+
+ipcRenderer.on("file", (event, file) => {
+	console.log("path selected by user: " + file)
+	document.getElementById("checkpath").ariaDisabled = false // Makes the check button active
+	document.getElementById("checkpath").disabled = false // Makes the check button active
+	exportedFile = file.toString()
+})
+
+// receive the version from main.js
+ipcRenderer.on("version", (event, version) => {
+	console.log("version: " + version)
+	document.getElementById("version-info").innerText = `v${version}`
+	app_version = version.toString()
+})

electron-builder.yml

@@ -1,6 +1,6 @@
 appId: rocks.maarten.depotdownloader
 productName: SteamDepotDownloaderGUI
-copyright: Copyright © 2022 mmvanheusden | This work is free. Licensed under the GNU GPLv3 Public License
+copyright: Copyright © mmvanheusden | This work is free. Licensed under the GNU GPLv3 Public License
 
 linux:
   executableName: SteamDepotDownloaderGUI
@@ -25,8 +25,9 @@ mac:
         - x64
 
 win:
-  legalTrademarks: Copyright © 2022 mmvanheusden | This work is free. Licensed under the GNU GPLv3 Public License
+  legalTrademarks: Copyright © mmvanheusden | This work is free. Licensed under the GNU GPLv3 Public License
   target:
     - target: portable
       arch:
         - x64
+        - arm64

index.html

@@ -1,11 +1,13 @@
 <!DOCTYPE html>
 <!--  automatic dark mode :) -->
-<html class="anim-fade-in" data-color-mode="auto" data-dark-theme="dark" data-light-theme="light" lang="en">
+<html data-color-mode="auto" data-dark-theme="dark" data-light-theme="light" id="theme" lang="en">
 <head>
 	<meta charset="UTF-8">
 	<meta content="width=device-width, initial-scale=1" name="viewport"/>
-	<link href="https://unpkg.com/@primer/css@20.4.8/dist/primer.css" rel="stylesheet"/>
+	<link href="https://unpkg.com/@primer/css@21.1.1/dist/primer.css" rel="stylesheet"/>
+	<link href="style.css" rel="stylesheet">
 	<title>SteamDepotDownloaderGUI</title>
+	<script src=" https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js "></script>
 </head>
 <body>
 <script src="downloader.js"></script>
@@ -14,14 +16,14 @@
 		<div class="flash flash-error mx-2 mt-2 color-shadow-medium" id="dotnetalert">
 			<svg class="octicon" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
 				<path d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm6.5-.25A.75.75 0 017.25 7h1a.75.75 0 01.75.75v2.75h.25a.75.75 0 010 1.5h-2a.75.75 0 010-1.5h.25v-2h-.25a.75.75 0 01-.75-.75zM8 6a1 1 0 100-2 1 1 0 000 2z"
-					  fill-rule="evenodd"></path>
+				      fill-rule="evenodd"></path>
 			</svg>
 			<code><span class="text-italic">dotnet</span></code> was not found.
 			<button class="btn btn-sm flash-action" id="dotnetalertbtn">
 				<svg class="octicon" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
 					<path d="M7.47 10.78a.75.75 0 001.06 0l3.75-3.75a.75.75 0 00-1.06-1.06L8.75 8.44V1.75a.75.75 0 00-1.5
          0v6.69L4.78 5.97a.75.75 0 00-1.06 1.06l3.75 3.75zM3.75 13a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5z"
-						  fill-rule="evenodd"></path>
+					      fill-rule="evenodd"></path>
 				</svg>
 				<span class="text-bold">Download</span>
 			</button>
@@ -32,25 +34,38 @@
 		<div class="flash flash-warn mx-2 mt-2 color-shadow-medium" id="emptyalert">
 			<svg class="octicon" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
 				<path d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm6.5-.25A.75.75 0 017.25 7h1a.75.75 0 01.75.75v2.75h.25a.75.75 0 010 1.5h-2a.75.75 0 010-1.5h.25v-2h-.25a.75.75 0 01-.75-.75zM8 6a1 1 0 100-2 1 1 0 000 2z"
-					  fill-rule="evenodd"></path>
-			</svg>Please fill in all required fields.
+				      fill-rule="evenodd"></path>
+			</svg>
+			Please fill in all required fields.
 		</div>
 	</div>
-	<div class="f0-light text-center">Steam Depot Downloader</div>
+
+	<div hidden id="dotnetwarning2">
+		<div class="flash mx-2 mt-2 color-shadow-medium">
+			<svg class="octicon" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
+				<path d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm6.5-.25A.75.75 0 017.25 7h1a.75.75 0 01.75.75v2.75h.25a.75.75 0 010 1.5h-2a.75.75 0 010-1.5h.25v-2h-.25a.75.75 0 01-.75-.75zM8 6a1 1 0 100-2 1 1 0 000 2z"
+				      fill-rule="evenodd"></path>
+			</svg>
+			Please re-open after installing .NET.
+		</div>
+	</div>
+	<div class="f1-light text-center">Steam Depot Downloader</div>
 
 	<form id="theform">
 		<div class="form-group mx-3 mt-1">
 			<div class="form-group-header">
 				<label for="username">Username</label>
 			</div>
-			<input class="form-control input-block" id="username" type="text" placeholder="Leave empty for anonymous login"/>
+			<input class="form-control input-block" id="username" placeholder="Leave empty for anonymous download"
+			       type="text"/>
 		</div>
 
 		<div class="form-group mx-3 mt-1">
 			<div class="form-group-header">
 				<label for="password">Password</label>
 			</div>
-			<input class="form-control input-block" id="password" type="password" placeholder="Leave empty for anonymous login"/>
+			<input class="form-control input-block" id="password" placeholder="Leave empty for anonymous download"
+			       type="password"/>
 		</div>
 
 		<div class="form-group mx-3 mt-1 required">
@@ -74,56 +89,182 @@
 			<input class="form-control input-block" id="manifestid" type="number"/>
 		</div>
 
-		<div class="form-group mx-3 mt-1 required">
-			<div class="form-group-header ">
-				<label for="osdropdown">Operating system</label>
+		<div class="mx-3 mt-1 required">
+			<div class="form-group-header">
+				<label>Download Location</label>
+			</div>
+			<div aria-label="Pick the path/location where the game will be downloaded to."
+			     class="form-control btn btn-sm tooltipped tooltipped-ne" id="pickpath">
+				Set location
 			</div>
 
-			<div aria-label="Select your OS/terminal here." class="form-group-body tooltipped tooltipped-n">
-				<select aria-label="Preference" class="form-select width-full" id="osdropdown">
-					<option disabled>Choose your OS</option>
-					<option>Windows</option>
-					<option disabled>macOS (NOT YET IMPLEMENTED)</option>
-					<option disabled>If you are using Linux</option>
-					<option disabled>Select your terminal</option>
-					<option>KDE Konsole</option>
-					<option>Gnome Terminal</option>
-					<option>Xfce Terminal</option>
-					<option>Terminator</option>
-					<option>Print command in console (CTRL-SHIFT-I)</option>
-				</select>
+			<div aria-disabled="true"
+			     aria-label="Check the location that has been selected."
+			     class="form-control btn btn-sm ml-2 tooltipped tooltipped-ne" id="checkpath">
+				Open location
 			</div>
+			<span class="Label mt-1 ml-3 Label--warning" id="loader">
+				<span aria-label="Loading" class="tooltipped tooltipped-n">Loading</span>
+				<span class="AnimatedEllipsis"></span>
+			</span>
 		</div>
 	</form>
 
+
 	<div class="form-group mt-3 ml-3 mr-3">
-		<button class="btn btn-block btn-primary" id="downloadbtn">
-			<svg class="octicon" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg">
-				<path d="M7.47 10.78a.75.75 0 001.06 0l3.75-3.75a.75.75 0 00-1.06-1.06L8.75 8.44V1.75a.75.75 0 00-1.5 0v6.69L4.78 5.97a.75.75 0 00-1.06 1.06l3.75 3.75zM3.75 13a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5z"
-					  fill-rule="evenodd"></path>
-			</svg>
-			Download
-		</button>
+		<div class="BtnGroup d-flex">
+			<button class="BtnGroup-item btn btn-block btn-primary flex-1" id="downloadbtn">
+				<svg class="octicon filter-red" height="16"
+				     style="display: inline-block; user-select: none; vertical-align: text-bottom;" viewBox="0 0 16 16"
+				     width="16"
+				     xmlns="http://www.w3.org/2000/svg">
+					<path d="M7.47 10.78a.75.75 0 001.06 0l3.75-3.75a.75.75 0 00-1.06-1.06L8.75 8.44V1.75a.75.75 0 00-1.5 0v6.69L4.78 5.97a.75.75 0 00-1.06 1.06l3.75 3.75zM3.75 13a.75.75 0 000 1.5h8.5a.75.75 0 000-1.5h-8.5z"
+					      fill-rule="evenodd"></path>
+				</svg>
+				Download
+			</button>
+			<button class="BtnGroup-item btn flex-0" id="settings-button">
+				<svg fill="#8B949E" height="16"
+				     style="display: inline-block; user-select: none; vertical-align: text-bottom;" viewBox="0 0 16 16"
+				     width="16"
+				     xmlns="http://www.w3.org/2000/svg">
+					<path d="M8 0a8.2 8.2 0 0 1 .701.031C9.444.095 9.99.645 10.16 1.29l.288 1.107c.018.066.079.158.212.224.231.114.454.243.668.386.123.082.233.09.299.071l1.103-.303c.644-.176 1.392.021 1.82.63.27.385.506.792.704 1.218.315.675.111 1.422-.364 1.891l-.814.806c-.049.048-.098.147-.088.294.016.257.016.515 0 .772-.01.147.038.246.088.294l.814.806c.475.469.679 1.216.364 1.891a7.977 7.977 0 0 1-.704 1.217c-.428.61-1.176.807-1.82.63l-1.102-.302c-.067-.019-.177-.011-.3.071a5.909 5.909 0 0 1-.668.386c-.133.066-.194.158-.211.224l-.29 1.106c-.168.646-.715 1.196-1.458 1.26a8.006 8.006 0 0 1-1.402 0c-.743-.064-1.289-.614-1.458-1.26l-.289-1.106c-.018-.066-.079-.158-.212-.224a5.738 5.738 0 0 1-.668-.386c-.123-.082-.233-.09-.299-.071l-1.103.303c-.644.176-1.392-.021-1.82-.63a8.12 8.12 0 0 1-.704-1.218c-.315-.675-.111-1.422.363-1.891l.815-.806c.05-.048.098-.147.088-.294a6.214 6.214 0 0 1 0-.772c.01-.147-.038-.246-.088-.294l-.815-.806C.635 6.045.431 5.298.746 4.623a7.92 7.92 0 0 1 .704-1.217c.428-.61 1.176-.807 1.82-.63l1.102.302c.067.019.177.011.3-.071.214-.143.437-.272.668-.386.133-.066.194-.158.211-.224l.29-1.106C6.009.645 6.556.095 7.299.03 7.53.01 7.764 0 8 0Zm-.571 1.525c-.036.003-.108.036-.137.146l-.289 1.105c-.147.561-.549.967-.998 1.189-.173.086-.34.183-.5.29-.417.278-.97.423-1.529.27l-1.103-.303c-.109-.03-.175.016-.195.045-.22.312-.412.644-.573.99-.014.031-.021.11.059.19l.815.806c.411.406.562.957.53 1.456a4.709 4.709 0 0 0 0 .582c.032.499-.119 1.05-.53 1.456l-.815.806c-.081.08-.073.159-.059.19.162.346.353.677.573.989.02.03.085.076.195.046l1.102-.303c.56-.153 1.113-.008 1.53.27.161.107.328.204.501.29.447.222.85.629.997 1.189l.289 1.105c.029.109.101.143.137.146a6.6 6.6 0 0 0 1.142 0c.036-.003.108-.036.137-.146l.289-1.105c.147-.561.549-.967.998-1.189.173-.086.34-.183.5-.29.417-.278.97-.423 1.529-.27l1.103.303c.109.029.175-.016.195-.045.22-.313.411-.644.573-.99.014-.031.021-.11-.059-.19l-.815-.806c-.411-.406-.562-.957-.53-1.456a4.709 4.709 0 0 0 0-.582c-.032-.499.119-1.05.53-1.456l.815-.806c.081-.08.073-.159.059-.19a6.464 6.464 0 0 0-.573-.989c-.02-.03-.085-.076-.195-.046l-1.102.303c-.56.153-1.113.008-1.53-.27a4.44 4.44 0 0 0-.501-.29c-.447-.222-.85-.629-.997-1.189l-.289-1.105c-.029-.11-.101-.143-.137-.146a6.6 6.6 0 0 0-1.142 0ZM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM9.5 8a1.5 1.5 0 1 0-3.001.001A1.5 1.5 0 0 0 9.5 8Z"></path>
+				</svg>
+			</button>
+		</div>
 	</div>
 
-	<div aria-label="Visit the GitHub issues website." class="btn btn-sm ml-3 tooltipped tooltipped-ne mb-1" id="smbtn1">
+	<div aria-label="Visit the GitHub issues website." class="btn btn-sm ml-3 tooltipped tooltipped-ne mb-1"
+	     id="smbtn1">
 		<svg fill="#8B949E" height="16" style="display: inline-block; vertical-align: text-bottom;" viewBox="0 0 16 16"
-			 width="16" xmlns="http://www.w3.org/2000/svg">
+		     width="16" xmlns="http://www.w3.org/2000/svg">
 			<path d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zM6.92 6.085c.081-.16.19-.299.34-.398.145-.097.371-.187.74-.187.28 0 .553.087.738.225A.613.613 0 019 6.25c0 .177-.04.264-.077.318a.956.956 0 01-.277.245c-.076.051-.158.1-.258.161l-.007.004a7.728 7.728 0 00-.313.195 2.416 2.416 0 00-.692.661.75.75 0 001.248.832.956.956 0 01.276-.245 6.3 6.3 0 01.26-.16l.006-.004c.093-.057.204-.123.313-.195.222-.149.487-.355.692-.662.214-.32.329-.702.329-1.15 0-.76-.36-1.348-.863-1.725A2.76 2.76 0 008 4c-.631 0-1.155.16-1.572.438-.413.276-.68.638-.849.977a.75.75 0 101.342.67z"
-				  fill-rule="evenodd"></path>
+			      fill-rule="evenodd"></path>
 		</svg>
-		Support
+		Help
 	</div>
 
-	<div aria-label="Visit the SteamDB instant search website." class="btn btn-sm ml-1 tooltipped tooltipped-n mb-1"
-		 id="smbtn2">
-		<svg aria-hidden="true" class="octicon" height="14" viewBox="0 0 128 128" width="14"
-			 xmlns="http://www.w3.org/2000/svg">
+	<div aria-label="Visit the SteamDB instant search website." class="btn btn-sm ml-2 tooltipped tooltipped-n mb-1"
+	     id="smbtn2">
+		<svg aria-hidden="true" class="octicon" fill="#8B949E" height="16" viewBox="0 0 128 128" width="16"
+		     xmlns="http://www.w3.org/2000/svg">
 			<path d="M63.9 0C30.5 0 3.1 11.9.1 27.1l35.6 6.7c2.9-.9 6.2-1.3 9.6-1.3l16.7-10c-.2-2.5 1.3-5.1 4.7-7.2 4.8-3.1 12.3-4.8 19.9-4.8 5.2-.1 10.5.7 15 2.2 11.2 3.8 13.7 11.1 5.7 16.3-5.1 3.3-13.3 5-21.4 4.8l-22 7.9c-.2 1.6-1.3 3.1-3.4 4.5-5.9 3.8-17.4 4.7-25.6 1.9-3.6-1.2-6-3-7-4.8L2.5 38.4c2.3 3.6 6 6.9 10.8 9.8C5 53 0 59 0 65.5c0 6.4 4.8 12.3 12.9 17.1C4.8 87.3 0 93.2 0 99.6 0 115.3 28.6 128 64 128c35.3 0 64-12.7 64-28.4 0-6.4-4.8-12.3-12.9-17 8.1-4.8 12.9-10.7 12.9-17.1 0-6.5-5-12.6-13.4-17.4 8.3-5.1 13.3-11.4 13.3-18.2 0-16.5-28.7-29.9-64-29.9zm22.8 14.2c-5.2.1-10.2 1.2-13.4 3.3-5.5 3.6-3.8 8.5 3.8 11.1 7.6 2.6 18.1 1.8 23.6-1.8s3.8-8.5-3.8-11c-3.1-1-6.7-1.5-10.2-1.5zm.3 1.7c7.4 0 13.3 2.8 13.3 6.2 0 3.4-5.9 6.2-13.3 6.2s-13.3-2.8-13.3-6.2c0-3.4 5.9-6.2 13.3-6.2zM45.3 34.4c-1.6.1-3.1.2-4.6.4l9.1 1.7a10.8 5 0 1 1-8.1 9.3l-8.9-1.7c1 .9 2.4 1.7 4.3 2.4 6.4 2.2 15.4 1.5 20-1.5s3.2-7.2-3.2-9.3c-2.6-.9-5.7-1.3-8.6-1.3zM109 51v9.3c0 11-20.2 19.9-45 19.9-24.9 0-45-8.9-45-19.9v-9.2c11.5 5.3 27.4 8.6 44.9 8.6 17.6 0 33.6-3.3 45.2-8.7zm0 34.6v8.8c0 11-20.2 19.9-45 19.9-24.9 0-45-8.9-45-19.9v-8.8c11.6 5.1 27.4 8.2 45 8.2s33.5-3.1 45-8.2z"
-				  fill-rule="evenodd"></path>
+			      fill-rule="evenodd"></path>
 		</svg>
 		SteamDB
 	</div>
+
+	<div aria-label="Donate to the Free Software Foundation." class="btn btn-sm ml-2 tooltipped tooltipped-nw mb-1"
+	     id="smbtn3">
+		<svg fill="#8B949E" height="16" style="display: inline-block; vertical-align: text-bottom;" viewBox="0 0 16 16"
+		     width="16" xmlns="http://www.w3.org/2000/svg">
+			<path d="M2 2.75A2.75 2.75 0 0 1 4.75 0c.983 0 1.873.42 2.57 1.232.268.318.497.668.68 1.042.183-.375.411-.725.68-1.044C9.376.42 10.266 0 11.25 0a2.75 2.75 0 0 1 2.45 4h.55c.966 0 1.75.784 1.75 1.75v2c0 .698-.409 1.301-1 1.582v4.918A1.75 1.75 0 0 1 13.25 16H2.75A1.75 1.75 0 0 1 1 14.25V9.332C.409 9.05 0 8.448 0 7.75v-2C0 4.784.784 4 1.75 4h.55c-.192-.375-.3-.8-.3-1.25ZM7.25 9.5H2.5v4.75c0 .138.112.25.25.25h4.5Zm1.5 0v5h4.5a.25.25 0 0 0 .25-.25V9.5Zm0-4V8h5.5a.25.25 0 0 0 .25-.25v-2a.25.25 0 0 0-.25-.25Zm-7 0a.25.25 0 0 0-.25.25v2c0 .138.112.25.25.25h5.5V5.5h-5.5Zm3-4a1.25 1.25 0 0 0 0 2.5h2.309c-.233-.818-.542-1.401-.878-1.793-.43-.502-.915-.707-1.431-.707ZM8.941 4h2.309a1.25 1.25 0 0 0 0-2.5c-.516 0-1 .205-1.43.707-.337.392-.646.975-.879 1.793Z"
+			      fill-rule="evenodd"></path>
+		</svg>
+		Donate
+	</div>
+
+	<div aria-label="View the instructions on how to use SteamDepotDownloaderGUI."
+	     class="btn btn-sm ml-2 tooltipped tooltipped-nw mb-1"
+	     id="smbtn4">
+		<svg fill="#8B949E" height="16" style="display: inline-block; vertical-align: text-bottom;" viewBox="0 0 16 16"
+		     width="16">
+			<path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path>
+		</svg>
+		Instructions
+	</div>
+</div>
+<div class="settings-surrounding" id="settings-surrounding">
+	<div class="settings-content mx-auto" id="settings-content">
+		<label class="version-info" id="version-info">UNKNOWN</label>
+		<h3><b>Settings</b></h3>
+		<hr>
+		<form>
+			<div class="form-group">
+				<div class="form-group-header">
+					<label>Theme</label>
+				</div>
+				<div class="form-group-body">
+					<div class="BtnGroup">
+						<button aria-selected="true" class="BtnGroup-item btn btn-sm" id="theme-auto" type="button">
+							Auto
+						</button>
+						<button class="BtnGroup-item btn btn-sm" id="theme-light" type="button">
+							Light
+						</button>
+						<button class="BtnGroup-item btn btn-sm" id="theme-dark" type="button">
+							Dark
+						</button>
+					</div>
+				</div>
+			</div>
+			<hr>
+			<div class="form-group">
+				<div class="form-group-header">
+					<label for="terminal-dropdown">Override terminal selection (for Linux only)</label>
+				</div>
+				<div class="form-group-body">
+					<div class="mb-2">
+						<select class="form-select" id="terminal-dropdown">
+							<option>Gnome Terminal</option>
+							<option>KDE Konsole</option>
+							<option>Xfce Terminal</option>
+							<option>Terminator</option>
+							<option>Terminology</option>
+							<option>xterm</option>
+							<option>Kitty</option>
+							<option>LXTerminal</option>
+							<option>Tilix</option>
+							<option>Deepin Terminal</option>
+							<option>cool-retro-term</option>
+							<option selected="selected">Auto</option>
+						</select>
+						found: <span class="Counter"><code id="terminals-found">none</code></span>
+						<br>default: <span class="Counter"><code id="default-terminal">none</code></span>
+					</div>
+				</div>
+			</div>
+			<hr>
+			<div class="form-group">
+				<div class="form-group-header">
+					<label for="os-dropdown">Override OS selection</label>
+				</div>
+				<div class="form-group-body">
+					<div class="mb-2">
+						<select class="form-select" id="os-dropdown">
+							<option>Windows</option>
+							<option disabled>macOS (NOT YET IMPLEMENTED)</option>
+							<option>Linux</option>
+							<option>Print command in console (CTRL-SHIFT-I)</option>
+							<option selected="selected">Auto</option>
+						</select>
+						default: <span class="Counter"><code id="default-os">none</code></span>
+					</div>
+				</div>
+			</div>
+			<hr>
+			<div class="form-group">
+				<div class="form-group-header">
+					<label for="os-dropdown">Folder name</label>
+				</div>
+				<div class="form-group-body">
+					<div class="BtnGroup">
+						<button aria-selected="true" class="BtnGroup-item btn btn-sm" id="folder-name-appid"
+						        type="button">
+							App-ID
+						</button>
+						<button class="BtnGroup-item btn btn-sm" id="folder-name-custom" type="button">
+							Custom
+						</button>
+					</div>
+					<br>
+					<input class="form-control input-block" hidden id="folder-name-custom-input"
+					       placeholder="Game directory name"
+					       type="text"/>
+				</div>
+			</div>
+		</form>
+	</div>
 </div>
 </body>
 </html>

main.js

@@ -1,27 +1,31 @@
-const {app, BrowserWindow} = require("electron")
+const {app, BrowserWindow, dialog, ipcMain} = require("electron")
+const {platformpath} = require("./utils")
+require("v8-compile-cache")
 
+let mainWindow
 const createWindow = () => {
 	// Create the browser window.
-	const mainWindow = new BrowserWindow({
+	mainWindow = new BrowserWindow({
 		autoHideMenuBar: true,
 		resizable: false,
-		width: 430,
-		height: 590,
+		width: 445,
+		height: 650,
 		useContentSize: true,
 		maximizable: false,
 		webPreferences: {
-			nodeIntegration: true,
-			contextIsolation: false
+			nodeIntegration: true, contextIsolation: false
 		}
 	})
 
 	// and load the index.html of the app.
 	mainWindow.loadFile("index.html")
 
-	// Open the DevTools for debugging, only if not in production.
-	if (!app.isPackaged) {
-		mainWindow.webContents.openDevTools({mode: "detach"})
-	}
+	// @formatter:off
+	// Open the DevTools for debugging, only if not in production. This is removed for release by the build script (package.sh) because it's unreliable.
+	// disable formatting so the line always stays the same so sed can find it
+	// eslint-disable-next-line no-undef
+	if (!app.isPackaged) mainWindow.webContents.openDevTools({mode: "detach"})
+	// @formatter:on
 }
 
 // This method will be called when Electron has finished
@@ -35,6 +39,15 @@ app.whenReady().then(() => {
 		// dock icon is clicked and there are no other windows open.
 		if (BrowserWindow.getAllWindows().length === 0) createWindow()
 	})
+
+})
+
+// If the page is fully loaded in, send a sign.
+app.on("web-contents-created", (event, contents) => {
+	contents.on("dom-ready", () => {
+		contents.send("ready")
+		contents.send("version", app.getVersion()) // send the version to the renderer
+	})
 })
 
 // Quit when all windows are closed, except on macOS. There, it's common
@@ -43,3 +56,27 @@ app.whenReady().then(() => {
 app.on("window-all-closed", () => {
 	if (process.platform !== "darwin") app.quit()
 })
+
+
+ipcMain.on("selectpath", (event) => {
+	dialog.showOpenDialog(mainWindow, {
+		// Specifying the Directory Selector Property
+		properties: ["openDirectory"],
+		title: "Select the path where the game will be downloaded",
+		defaultPath: platformpath(),
+		buttonLabel: "Select"
+	}).then(file => {
+		//console.debug("Has path selection succeeded: " + ((file.canceled) ? "NO" : "YES; see below")) --- doesn't log to the dev console TODO
+		if (!file.canceled) {
+			const filepath = file.filePaths[0].toString()
+			// console.debug("Path selected is " + filepath)											--- same thing
+			event.reply("file", filepath)
+		}
+	}).catch(err => {
+		console.log(err)
+	})
+})
+
+ipcMain.on("open-devtools", () => {
+	mainWindow.webContents.openDevTools({mode: "detach"})
+})

package.json

@@ -1,6 +1,6 @@
 {
   "name": "steamdepotdownloadergui",
-  "version": "2.1.0",
+  "version": "2.4.2",
   "description": "DepotDownloader Electron frontend",
   "main": "main.js",
   "scripts": {
@@ -30,12 +30,12 @@
   },
   "homepage": "https://github.com/mmvanheusden/SteamDepotDownloaderGUI#readme",
   "devDependencies": {
-    "electron": "^21.2.3",
-    "electron-builder": "^23.6.0",
-    "eslint": "^8.27.0"
+    "electron": "^30.0.2",
+    "electron-builder": "^24.13.3",
+    "eslint": "^9.1.1"
   },
   "dependencies": {
-    "elecron": "^0.0.1-security",
-    "follow-redirects": "^1.15.2"
+    "follow-redirects": "^1.15.6",
+    "v8-compile-cache": "^2.4.0"
   }
 }

package.sh

@@ -0,0 +1,25 @@
+#!/usr/bin/env bash
+set -e
+version=`jq '.version' package.json`
+version="${version//\"}"
+echo "version that will be build is ${version}"
+rm -rf ./dist/
+
+# Disable DevTools for release, because it's unreliable
+original_line=$(sed -n '/if (!app.isPackaged) mainWindow.webContents.openDevTools({mode: "detach"})/p' main.js)
+# original_line has 1 tab too much, so we remove it
+original_line="${original_line//	/}"
+sed -i 's/if (!app.isPackaged) mainWindow.webContents.openDevTools({mode: "detach"})/\/\/REMOVED FOR RELEASE./g' main.js
+
+
+npm run build
+mkdir -p ./dist/release-ready
+
+cp ./dist/SteamDepotDownloaderGUI*.exe ./dist/release-ready/SteamDepotDownloaderGUI-windows-"${version}".exe
+cp `ls -d1 dist/* | grep -E "SteamDepotDownloaderGUI-[0-9]+\.[0-9]+\.[0-9]+\.AppImage"` ./dist/release-ready/SteamDepotDownloaderGUI-linux-"${version}"-x64.AppImage
+cp `ls -d1 dist/* | grep -E "steamdepotdownloadergui-[0-9]+\.[0-9]+\.[0-9]+\.zip"` ./dist/release-ready/SteamDepotDownloaderGUI-linux-"${version}"-x64.zip
+cp `ls -d1 dist/* | grep -E "SteamDepotDownloaderGUI-[0-9]+\.[0-9]+\.[0-9]+\-arm64.AppImage"` ./dist/release-ready/SteamDepotDownloaderGUI-linux-"${version}"-arm64.AppImage
+cp `ls -d1 dist/* | grep -E "steamdepotdownloadergui-[0-9]+\.[0-9]+\.[0-9]+\-arm64.zip"` ./dist/release-ready/SteamDepotDownloaderGUI-linux-"${version}"-arm64.zip
+echo "done building!"
+echo "reverting changes to main.js"
+sed -i "s|\/\/REMOVED FOR RELEASE.|$original_line|g" main.js

style.css

@@ -0,0 +1,68 @@
+@font-face {
+    font-family: 'Hubot Sans';
+    src: url('Hubot-Sans.woff2') format('woff2 supports variations'),
+    url('Hubot-Sans.woff2') format('woff2-variations');
+    font-weight: 700;
+    font-stretch: expanded;
+}
+
+.f1-light {
+    font-family: 'Hubot Sans', sans-serif;
+    overflow: hidden;
+    white-space: nowrap;
+}
+
+/* The grey part */
+.settings-surrounding {
+    display: none;
+    position: fixed;
+    z-index: 1;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    background-color: rgba(0, 0, 0, 0.33);
+}
+
+.settings-content {
+    position: relative;
+    border-radius: 10px;
+    overflow: auto;
+    /*noinspection CssUnresolvedCustomProperty*/
+    background-color: var(--bgColor-default, var(--color-canvas-default));
+    margin: 5%;
+    padding: 25px;
+    border: 1px solid #b4dede;
+    width: 90vw; /* 90vw -> 90% */
+    height: 90vh; /* 90vh -> 90% */
+    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 6px 20px rgba(0, 0, 0, 0.1);
+}
+
+.hide {
+    display: none;
+}
+
+hr {
+    border: 0;
+    height: 1px;
+    background: #0d1117 linear-gradient(to right, #0d1117, #ccc, #0d1117);
+}
+[data-color-mode="light"] hr {
+    filter: invert(1);
+}
+@media (prefers-color-scheme: light) {
+	[data-color-mode="auto"] hr {
+		filter: invert(1);
+	}
+}
+
+
+.version-info {
+    position: absolute;
+    bottom: 0;
+    right: 0;
+    font-size: 0.8em;
+    padding: 5px 10px; /* space around text */
+    font-family: monospace;
+}

utils.js

@@ -1,6 +1,14 @@
+var defaultTerminal = ""
+
 /**
- * Checks if dotnet is installed in the system path
- * @returns {Promise<unknown>} A promise that resolves to true if dotnet is installed, false otherwise
+ * Checks if all required fields are filled and if dotnet is installed in the system path.
+ * It returns a promise that resolves to true if dotnet is installed and all required fields are filled, false otherwise.
+ *
+ * @returns {Promise<unknown>} A promise that resolves to true if dotnet is installed and all required fields are filled, false otherwise.
+ *
+ * **rejects**:
+ * `emptyField` -> One or more required field(s) are not filled in.
+ * `noDotnet` -> `dotnet` has not been found in the path.
  */
 function preDownloadCheck() {
 	return new Promise((resolve, reject) => {
@@ -18,7 +26,7 @@ function preDownloadCheck() {
 			return
 		}
 
-		// Check if dotnet is installed, depending on the platform
+		// Check if dotnet is found, depending on the platform
 		if (process.platform.toString().includes("win")) {
 			// Windows
 			const {exec} = require("child_process")
@@ -31,7 +39,8 @@ function preDownloadCheck() {
 				}
 			})
 		} else {
-			// Linux
+			// Others
+			// macOS seems to be broken.
 			const {exec} = require("child_process")
 			const command = "dotnet --version"
 			exec(command, function (error) {
@@ -45,10 +54,14 @@ function preDownloadCheck() {
 	})
 }
 
+
 /**
- * Download a file from a url, saving it to the current directory (__dirname)
- * @param url The url to download from
- * @returns {Promise<unknown>} A promise that resolves when the download is finished, or rejects if something fails
+ * Downloads a file from a given URL and saves it to the current directory.
+ *
+ * @param {string} url - The URL of the file to download.
+ * @returns {Promise<void>} A promise that resolves when the download is finished, or rejects if an error occurs.
+ *
+ * @throws {Error} If an error occurs during the download or file writing process, the promise is rejected with the error.
  */
 function download(url) {
 	return new Promise((resolve, reject) => {
@@ -56,13 +69,13 @@ function download(url) {
 		const fs = require("fs")
 		const path = require("path")
 		const file = fs.createWriteStream(platformpath() + path.sep + url.split("/").pop())
-		https.get(url, function (response) {
+		https.get(url, (response) => {
 			response.pipe(file)
-			file.on("finish", function () {
+			file.on("finish", () => {
 				file.close()
 				resolve()
 			})
-			file.on("error", function (error) {
+			file.on("error", (error) => {
 				console.error(error)
 				reject(error)
 			})
@@ -71,9 +84,12 @@ function download(url) {
 }
 
 /**
- * Removes a file from the current directory
- * @param file The filename to remove
- * @returns {Promise<unknown>} A promise that resolves when the file is removed, or rejects if something fails
+ * Removes a file from the current directory.
+ *
+ * @param {string} file - The name of the file to be removed.
+ * @returns {Promise<void>} A promise that resolves when the file is successfully removed, or rejects if an error occurs.
+ *
+ * @throws {Error} If an error occurs during the file removal process, the promise is rejected with the error.
  */
 function removeFile(file) {
 	return new Promise((resolve, reject) => {
@@ -89,9 +105,12 @@ function removeFile(file) {
 }
 
 /**
- * Removes a directory from the current directory
- * @param dir The directory to remove
- * @returns {Promise<unknown>} A promise that resolves when the directory is removed, or rejects if something fails
+ * Removes a directory from the current directory.
+ *
+ * @param {string} dir - The name of the directory to be removed.
+ * @returns {Promise<void>} A promise that resolves when the directory is successfully removed, or rejects if an error occurs.
+ *
+ * @throws {Error} If an error occurs during the directory removal process, the promise is rejected with the error.
  */
 function removeDir(dir,) {
 	return new Promise((resolve, reject) => {
@@ -107,18 +126,22 @@ function removeDir(dir,) {
 }
 
 /**
- * Unzip a file to the current directory
- * @param file The file to unzip, preferably a .zip file
- * @param target The target directory to unzip to
- * @returns {Promise<unknown>} A promise that resolves when the unzip is complete, or rejects if something fails
+ * Unzips a file to a specified target directory.
+ *
+ * @param {string} file - The name of the zip file to be unzipped.
+ * @param {string} target - The target directory where the file will be unzipped to.
+ * @returns {Promise<void>} A promise that resolves when the unzip operation is complete, or rejects if an error occurs.
+ *
+ * @throws {Error} If an error occurs during the unzip operation, the promise is rejected with the error.
  */
 function unzip(file, target) {
 	const {exec} = require("child_process")
 	const path = require("path")
+	let finalPath = platformpath() + path.sep
 
 	return new Promise((resolve, reject) => {
 		if (process.platform.toString().includes("win")) {
-			const command = "powershell.exe -Command Expand-Archive -Path " + platformpath() + path.sep + file + " -Destination " + platformpath() + path.sep + target
+			const command = `powershell.exe -Command Expand-Archive -Path '${finalPath + file}' -Destination '${finalPath + target}'`
 			exec(command, function (error) {
 				if (error) {
 					reject(error)
@@ -126,7 +149,7 @@ function unzip(file, target) {
 				} else resolve()
 			})
 		} else {
-			const command = "unzip -o " + file + " -d ./" + target + "/"
+			const command = `unzip -o ${platformpath().replaceAll(" ", "\\ ") + path.sep + file} -d ${platformpath().replaceAll(" ", "\\ ") + path.sep + target}${path.sep}`
 			exec(command, function (error) {
 				if (error) {
 					reject(error)
@@ -137,53 +160,160 @@ function unzip(file, target) {
 	})
 }
 
-/**
- * Creates a command based on the operating system/terminal being selected and the form values
- * @returns {string} The final command to run
- */
-const createCommand = () => {
-	// Import path so \ can be put in a string
+async function createCommandWithTerminal(command, terminal, os) {
+	let cmd = ""
+
+	if (terminal === "auto") {
+		terminal = defaultTerminal[0]
+	}
+	// if os is auto, choose the os for us.
+	if (os === "auto") {
+		if (process.platform.toString().includes("win")) {
+			os = 0
+		} else if (process.platform.toString().includes("linux")) {
+			os = 2
+		}
+	} else console.log("OS is manually chosen")
+	/* eslint-disable */
+	if (os === 0) {
+		cmd = `start cmd.exe /k ${command}`
+	} else if (os === 1) {
+		cmd = `osascript -c 'tell application "Terminal" to do script '${command}'`
+	} else if (os === 2) {
+		switch (terminal) {
+		case 0:
+			cmd = `gnome-terminal -e 'bash -c "${command};$SHELL"'`
+			break
+		case 1:
+			cmd = `konsole --hold -e "${command}"`
+			break
+		case 2:
+			cmd = `xfce4-terminal -H -e "${command}"`
+			break
+		case 3:
+			cmd = `terminator -e 'bash -c "${command};$SHELL"'`
+			break
+		case 4:
+			cmd = `terminology -H -e "${command}"`
+			break
+		case 5:
+			cmd = `xterm -hold -T "Downloading Depot..." -e "${command}"`
+			break
+		case 6:
+			cmd = `kitty --hold sh -c "${command}"`
+			break
+		case 7:
+			cmd = `lxterminal -e "${command};$SHELL"`
+			break
+		case 8:
+			cmd = `tilix -e sh -c "${command};$SHELL"`
+			break
+		case 9:
+			cmd = `deepin-terminal -e 'sh -c "${command};$SHELL"'`
+			break
+		case 10:
+			cmd = `cool-retro-term -e sh -c "${command}"`
+			break
+		default:
+			console.log("NO TERMINAL. PANIC.")
+		}
+	} else if (os === 3) {
+		if (process.platform.toString().includes("win")) {
+			console.log(`COPY-PASTE THE FOLLOWING INTO THE TERMINAL:\n\n${command}`)
+		} else console.log(`COPY-PASTE THE FOLLOWING INTO YOUR TERMINAL:\n\n${command}`)
+		cmd = ""
+	}
+
+	return cmd
+	/* eslint-enable */
+}
+
+async function generateRunScript(username, password, appid, depotid, manifestid, folderinput, chosenPath) {
 	const path = require("path")
+	const fs = require("fs")
+	const sep = path.sep
+	let foldername = ""
 
-	// The values inputted by the user in the form
-	let username = document.forms["theform"]["username"].value
-	let password = document.forms["theform"]["password"].value
-	let appid = document.forms["theform"]["appid"].value
-	let depotid = document.forms["theform"]["depotid"].value
-	let manifestid = document.forms["theform"]["manifestid"].value
-	let osdropdown = document.getElementById("osdropdown")
+	// allow enormous strings like &$§"&$="§$/"(§NJUIDW>;!%?aQ52V?*['YsDnRy|(+Q 1h6BmnDQp,(Xr& being used as password.
+	// This is very janky and will be replaced with a better solution in the upcoming rewrite.
+	password = password.replace(/"/g, "\"\"")
+	if (process.platform.includes("win")) {
+		// Replace all % with %% because batch scripts use % as a special character. This is not an elegant solution, but it should work.
+		password = password.replace(/%/g, "%%")
+	}
 
-	// if either the username or password fields are empty, anonymous login is used
+	// if either the username or password fields is empty, anonymous login is used
 	let anonymous = username === "" || password === ""
 
-	// build the username and password flags into one string, allowing for anonymous login
-	let userpass = anonymous ? "" : `-username ${username} -password ${password}`
 
-	const finalPath = platformpath() + path.sep + "games" + path.sep + appid
+	/* put the username and password flags into one string, allowing for anonymous login.
+						if anonymous:  false  true
+									   |       |
+	 */
+	let userpass = anonymous ? "" : `-username ${username} -password "${password}"`
 
-	// The final command to run, returned by this function
-	if (osdropdown.options[osdropdown.selectedIndex].text.includes("Gnome")) {
-		return `gnome-terminal -e 'bash -c "dotnet ./depotdownloader/DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}/ -max-servers 50 -max-downloads 16";bash'`
-	} else if (osdropdown.options[osdropdown.selectedIndex].text.includes("Windows")) {
-		return `start cmd.exe /k dotnet ${platformpath()}${path.sep}depotdownloader${path.sep}DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}/ -max-servers 50 -max-downloads 16`
-	} else if (osdropdown.options[osdropdown.selectedIndex].text.includes("macOS")) {
-		return `osascript -c 'tell application "Terminal" to do script 'dotnet ./depotdownloader/DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}/ -max-servers 50 -max-downloads 16'`
-	} else if (osdropdown.options[osdropdown.selectedIndex].text.includes("Konsole")) {
-		return `konsole --hold -e "dotnet ./depotdownloader/DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}/ -max-servers 50 -max-downloads 16"`
-	} else if (osdropdown.options[osdropdown.selectedIndex].text.includes("Xfce")) {
-		return `xfce4-terminal -H -e "dotnet ./depotdownloader/DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}/ -max-servers 50 -max-downloads 16"`
-	} else if (osdropdown.options[osdropdown.selectedIndex].text.includes("Terminator")) {
-		return `terminator -e 'bash -c "dotnet ./depotdownloader/DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}/ -max-servers 50 -max-downloads 16";bash'`
-	} else if (osdropdown.options[osdropdown.selectedIndex].text.includes("Print command")) {
-		console.log(`COPY-PASTE THE FOLLOWING INTO YOUR TERMINAL OF CHOICE:\n\ndotnet ${platformpath()}/depotdownloader/DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath} -max-servers 50 -max-downloads 16`)
-		return "echo hello"
+	/* if nothing is inputted by the user in the folder input, it will be defaulted to the appid. else to the value */
+	foldername = folderinput.value === "" ? appid : folderinput.value
+
+	/* if the path isn't selected by the user, go for the path the app is located in. else use the path the user chose. */
+	chosenPath = chosenPath === "" ? platformpath() : chosenPath
+
+	let finalPath = (chosenPath + path.sep + foldername)
+	if (process.platform.includes("win")) {
+		if (finalPath.includes(" ")) {
+			console.log("path contains spaces. adding quotes")
+			finalPath = `"${finalPath}"`
+			console.log("Result: " + finalPath)
+		}
+	} else {
+		finalPath = finalPath.replaceAll(" ", "\\ ")
+	}
+
+	/* 										/ or \         if nothing is inputted its appid  replaces " " with "\ ", so whitespaces can be in path names.
+	finalpath: ((the path the user chose) + (seperator) + (the folder name the user chose)).replaceAll()
+	 */
+
+
+	/* The structure of a DepotDownloader command:
+	.NET CLI    Path to the DepotDownloader dll.		Username/pass combination app id		 depot id			manifest id		the dir chosen by user or app path	 controls how much download servers and threads are used. Needs benchmark TODO
+	  |						|									|					|				|					|				|											|																				|
+	dotnet (path)(sep)depotdownloader(sep)DepotDownloader.dll (userpass)	-app (appid)  -depot (depotid) -manifest (manifestid) -dir (path)(sep)				-max-servers 50 -max-downloads 16
+	 */
+
+	if (process.platform.includes("linux")) {
+		// if linux, write a bash script.
+		let content = `#!/usr/bin/env bash
+dotnet ${platformpath().replaceAll(" ", "\\ ")}${sep}depotdownloader${sep}DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}${sep} -max-servers 50 -max-downloads 16
+		`
+		await fs.writeFileSync(`${platformpath()}${sep}run.sh`, content)
+		await fs.chmodSync(`${platformpath()}${sep}run.sh`, "755") // make it executable
+		console.log(`Writing:
+--------
+dotnet ${platformpath().replaceAll(" ", "\\ ")}${sep}depotdownloader${sep}DepotDownloader.dll ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath}${sep} -max-servers 50 -max-downloads 16
+
+to ${platformpath()}${sep}run.sh.
+`)
+	} else if (process.platform.includes("win")) {
+		// if windows, write a batch script
+		let content = `dotnet "${platformpath()}${sep}depotdownloader${sep}DepotDownloader.dll" ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath} -max-servers 50 -max-downloads 16`
+		await fs.writeFileSync(`${platformpath()}${sep}run.bat`, content)
+		console.log(`Writing:
+--------
+dotnet "${platformpath()}${sep}depotdownloader${sep}DepotDownloader.dll" ${userpass} -app ${appid} -depot ${depotid} -manifest ${manifestid} -dir ${finalPath} -max-servers 50 -max-downloads 16
+
+to ${platformpath()}${sep}run.bat.
+`)
+	} else { /* macos */
 	}
 }
 
 /**
- * Runs a command in a separate process, printing errors and debugging info to the console
- * @param command The command to run
- * @returns {Promise<unknown>} A promise that resolves when the command is complete or rejects if something fails
+ * Executes a given command in a separate process.
+ *
+ * @param {string} command - The command to be executed.
+ * @returns {Promise<void>} A promise that resolves when the command execution is successful, or rejects if an error occurs.
+ *
+ * @throws {Error} If an error occurs during the command execution, the promise is rejected with an error message.
  */
 function runCommand(command) {
 	return new Promise((resolve, reject) => {
@@ -199,20 +329,67 @@ function runCommand(command) {
 
 /**
  * Returns the path where the actual program is being run from, depending on the operating system.
- * Because __dirname is inconsistent across operating systems, this function is used to get the correct path
+ * Because __dirname is inconsistent across operating systems, this function is used to get the correct path.
+ *
+ * Windows -> Dev env: __dirname, Portable: process.env.PORTABLE_EXECUTABLE_DIR
+ * Linux -> process.cwd()
  * @returns {string} The absolute path
  */
 const platformpath = () => {
-	if ((__dirname.includes("AppData") || __dirname.includes("Temp")) && process.platform.toString().includes("win")) {
-		// Windows portable exe
-		return process.env.PORTABLE_EXECUTABLE_DIR
-	} else if (__dirname.includes("/tmp/") && process.platform.toString().includes("linux")) {
-		// Linux AppImage
-		return process.cwd()
+	// On linux, it must return process.cwd(). On windows, it must return process.env.PORTABLE_EXECUTABLE_DIR, but only if the program is running from a portable exe.
+	// On linux, __dirname returns the correct path, but on windows, it returns the path to the app.asar file, which is not what we want. Only in dev environment it returns the correct path.
+
+	if (process.platform.includes("win")) {
+		if (process.env.PORTABLE_EXECUTABLE_DIR !== undefined) {
+			return process.env.PORTABLE_EXECUTABLE_DIR
+		} else {
+			return __dirname
+		}
 	} else {
-		// .zip binary
-		return __dirname
+		return process.cwd()
 	}
 }
 
-module.exports = {preDownloadCheck, download, createCommand, runCommand, removeDir, removeFile, unzip, platformpath}
+/**
+ * Checks for the availability of terminal emulators on Linux.
+ * It runs the '--version' command on each terminal emulator and checks if the command is successful.
+ * If the command is successful, it means the terminal emulator is installed and available.
+ * The function returns an array of the indices of the available terminal emulators.
+ * If no terminal emulator is available, it returns false.
+ * If the operating system is not Linux, it also returns false.
+ *
+ * @returns {string[]|boolean} An array of the indices of the available terminal emulators, or false if none are available or the OS is not Linux.
+ */
+const forceTerminals = async () => {
+	const commands = [["gnome-terminal", "--version", 0], ["konsole", "--version", 1], ["xfce4-terminal", "--version", 2], ["terminator", "--version", 3], ["terminology", "--version", 4], ["xterm", "-v", 5], ["kitty", "--version", 6], ["lxterminal", "--version", 7], ["tilix", "--version", 8], ["deepin-terminal", "--version", 9], ["cool-retro-term", "--version", 10]]
+	let availableTerminals = [] // list of IDs of terminals, corrospending to their index in the dropdown menu
+	let availableNames = [] // list of names of found terminals
+	if (process.platform === "linux") {
+		for (let i = 0; i < commands.length; i++) {
+			await runCommand(`${commands[i][0]} ${commands[i][1]}`).then(() => {
+				console.log(`Found ${commands[i][0]}`)
+				availableTerminals.push(commands[i][2])
+				availableNames.push(commands[i][0])
+			}).catch(() => {
+				console.log(`${commands[i][0]} not found on system.`)
+			})
+		}
+		if (availableTerminals.length > 0) {
+			defaultTerminal = availableTerminals
+			return [true, availableTerminals, availableNames] // [true, "2,4,7", "twox,fourterm,sevenemulator"] (example)
+		} else return false
+	} else return false
+}
+
+module.exports = {
+	preDownloadCheck,
+	download,
+	runCommand,
+	removeDir,
+	removeFile,
+	unzip,
+	platformpath,
+	forceTerminals,
+	generateRunScript,
+	createCommandWithTerminal
+}