docker-compose.yaml

Added Dockerfile to website
Changed Ports

Dockerfile

@@ -0,0 +1,15 @@
+# syntax=docker/dockerfile:1
+
+FROM mcr.microsoft.com/dotnet/sdk:7.0 as build-env
+WORKDIR /src
+COPY . /src/
+RUN ls /src
+RUN dotnet restore Tranga-API/Tranga-API.csproj
+RUN dotnet publish -c Release -o /publish
+
+FROM mcr.microsoft.com/dotnet/aspnet:7.0 as runtime
+WORKDIR /publish
+COPY --from=build-env /publish .
+RUN ls /publish
+EXPOSE 80
+ENTRYPOINT ["dotnet", "/publish/Tranga-API.dll"]

Tranga-API/Dockerfile

@@ -1,20 +0,0 @@
-FROM mcr.microsoft.com/dotnet/aspnet:7.0 AS base
-WORKDIR /app
-EXPOSE 80
-EXPOSE 443
-
-FROM mcr.microsoft.com/dotnet/sdk:7.0 AS build
-WORKDIR /src
-COPY ["Tranga-API/Tranga-API.csproj", "Tranga-API/"]
-RUN dotnet restore "Tranga-API/Tranga-API.csproj"
-COPY . .
-WORKDIR "/src/Tranga-API"
-RUN dotnet build "Tranga-API.csproj" -c Release -o /app/build
-
-FROM build AS publish
-RUN dotnet publish "Tranga-API.csproj" -c Release -o /app/publish /p:UseAppHost=false
-
-FROM base AS final
-WORKDIR /app
-COPY --from=publish /app/publish .
-ENTRYPOINT ["dotnet", "Tranga-API.dll"]

Tranga-API/Program.cs

@@ -1,26 +1,30 @@
+using System.Runtime.InteropServices;
 using Logging;
 using Tranga;
 
-string applicationFolderPath =
-    Path.Join(Environment.GetFolderPath(Environment.SpecialFolder.CommonApplicationData), "Tranga-API");
-string logsFolderPath = Path.Join(applicationFolderPath, "logs");
+string applicationFolderPath = Path.Join(Environment.GetFolderPath(Environment.SpecialFolder.CommonApplicationData), "Tranga-API");
+string downloadFolderPath = RuntimeInformation.IsOSPlatform(OSPlatform.Linux) ? "/Manga" : Path.Join(applicationFolderPath, "Manga");
+string logsFolderPath = RuntimeInformation.IsOSPlatform(OSPlatform.Linux) ? "/var/logs/Tranga" : Path.Join(applicationFolderPath, "logs");
 string logFilePath = Path.Join(logsFolderPath, $"log-{DateTime.Now:dd-M-yyyy-HH-mm-ss}.txt");
 string settingsFilePath = Path.Join(applicationFolderPath, "settings.json");
 
 Directory.CreateDirectory(applicationFolderPath);
+Directory.CreateDirectory(downloadFolderPath);
 Directory.CreateDirectory(logsFolderPath);
-        
+
+Console.WriteLine($"Application-Folder: {applicationFolderPath}");
+Console.WriteLine($"Download-Folder-Path: {downloadFolderPath}");
 Console.WriteLine($"Logfile-Path: {logFilePath}");
 Console.WriteLine($"Settings-File-Path: {settingsFilePath}");
 
-Logger logger = new(new[] { Logger.LoggerType.FileLogger }, null, null, logFilePath);
+Logger logger = new(new[] { Logger.LoggerType.FileLogger, Logger.LoggerType.ConsoleLogger }, Console.Out, Console.Out.Encoding, logFilePath);
         
 logger.WriteLine("Tranga_CLI", "Loading Taskmanager.");
 TrangaSettings settings;
 if (File.Exists(settingsFilePath))
     settings = TrangaSettings.LoadSettings(settingsFilePath);
 else
-    settings = new TrangaSettings(Directory.GetCurrentDirectory(), applicationFolderPath, null);
+    settings = new TrangaSettings(downloadFolderPath, applicationFolderPath, null);
 
 TaskManager taskManager = new (settings, logger);
 
@@ -28,17 +32,31 @@ var builder = WebApplication.CreateBuilder(args);
 builder.Services.AddEndpointsApiExplorer();
 builder.Services.AddSwaggerGen();
 builder.Services.AddControllers().AddNewtonsoftJson();
+
+string corsHeader = "Tranga";
+builder.Services.AddCors(options =>
+{
+    options.AddPolicy(name: corsHeader,
+        policy  =>
+        {
+            policy.AllowAnyOrigin();
+            policy.WithMethods("GET", "POST", "DELETE");
+        });
+});
+
 var app = builder.Build();
 app.UseSwagger();
 app.UseSwaggerUI();
 app.UseSwagger();
 app.UseSwaggerUI();
 
-app.MapGet("/GetAvailableControllers", () =>  taskManager.GetAvailableConnectors());
+app.UseCors(corsHeader);
 
-app.MapGet("/GetKnownPublications", () => taskManager.GetAllPublications());
+app.MapGet("/Tranga/GetAvailableControllers", () =>  taskManager.GetAvailableConnectors().Keys.ToArray());
 
-app.MapGet("/GetPublicationsFromConnector", (string connectorName, string title) =>
+app.MapGet("/Tranga/GetKnownPublications", () => taskManager.GetAllPublications());
+
+app.MapGet("/Tranga/GetPublicationsFromConnector", (string connectorName, string title) =>
 {
     Connector? connector = taskManager.GetAvailableConnectors().FirstOrDefault(con => con.Key == connectorName).Value;
     if (connector is null)
@@ -65,16 +83,47 @@ app.MapDelete("/Tasks/Delete", (string taskType, string? connectorName, string?
     taskManager.DeleteTask(task, connectorName, publication);
 });
 
-app.MapGet("/Tasks/GetList", () => taskManager.GetAllTasks());
+app.MapGet("/Tasks/Get", (string taskType, string? connectorName, string? searchString) =>
+{
+    try
+    {
+        TrangaTask.Task task = Enum.Parse<TrangaTask.Task>(taskType);
+        if (searchString is null || connectorName is null)
+            return taskManager.GetAllTasks().Where(tTask => tTask.task == task);
+        else
+            return taskManager.GetAllTasks().Where(tTask =>
+                tTask.task == task && tTask.connectorName == connectorName && tTask.ToString()
+                    .Contains(searchString, StringComparison.InvariantCultureIgnoreCase));
+    }
+    catch (ArgumentException)
+    {
+        return Array.Empty<TrangaTask>();
+    }
+});
 
 app.MapPost("/Tasks/Start", (string taskType, string? connectorName, string? publicationId) =>
 {
-    TrangaTask.Task pTask = Enum.Parse<TrangaTask.Task>(taskType);
-    TrangaTask? task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
-        tTask.task == pTask && tTask.publication?.internalId == publicationId && tTask.connectorName == connectorName);
-    if (task is null)
+    try
+    {
+        TrangaTask.Task pTask = Enum.Parse<TrangaTask.Task>(taskType);
+        TrangaTask? task = null;
+        if (connectorName is null || publicationId is null)
+            task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
+                tTask.task == pTask);
+        else
+            task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
+                tTask.task == pTask && tTask.publication?.internalId == publicationId &&
+                tTask.connectorName == connectorName);
+            
+        if (task is null)
+            return;
+        taskManager.ExecuteTaskNow(task);
+    }
+    catch (ArgumentException)
+    {
         return;
-    taskManager.ExecuteTaskNow(task);
+    }
+
 });
 
 app.MapGet("/Tasks/GetRunningTasks",
@@ -85,22 +134,50 @@ app.MapGet("/Queue/GetList",
 
 app.MapPost("/Queue/Enqueue", (string taskType, string? connectorName, string? publicationId) =>
 {
-    TrangaTask.Task pTask = Enum.Parse<TrangaTask.Task>(taskType);
-    TrangaTask? task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
-        tTask.task == pTask && tTask.publication?.internalId == publicationId && tTask.connectorName == connectorName);
-    if (task is null)
+    try
+    {
+        TrangaTask.Task pTask = Enum.Parse<TrangaTask.Task>(taskType);
+        TrangaTask? task = null;
+        if (connectorName is null || publicationId is null)
+            task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
+                tTask.task == pTask);
+        else
+            task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
+                tTask.task == pTask && tTask.publication?.internalId == publicationId &&
+                tTask.connectorName == connectorName);
+            
+        if (task is null)
+            return;
+        taskManager.AddTaskToQueue(task);
+    }
+    catch (ArgumentException)
+    {
         return;
-    taskManager.AddTaskToQueue(task);
+    }
 });
 
 app.MapDelete("/Queue/Dequeue", (string taskType, string? connectorName, string? publicationId) =>
 {
-    TrangaTask.Task pTask = Enum.Parse<TrangaTask.Task>(taskType);
-    TrangaTask? task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
-        tTask.task == pTask && tTask.publication?.internalId == publicationId && tTask.connectorName == connectorName);
-    if (task is null)
+    try
+    {
+        TrangaTask.Task pTask = Enum.Parse<TrangaTask.Task>(taskType);
+        TrangaTask? task = null;
+        if (connectorName is null || publicationId is null)
+            task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
+                tTask.task == pTask);
+        else
+            task = taskManager.GetAllTasks().FirstOrDefault(tTask =>
+                tTask.task == pTask && tTask.publication?.internalId == publicationId &&
+                tTask.connectorName == connectorName);
+            
+        if (task is null)
+            return;
+        taskManager.RemoveTaskFromQueue(task);
+    }
+    catch (ArgumentException)
+    {
         return;
-    taskManager.RemoveTaskFromQueue(task);
+    }
 });
 
 app.MapGet("/Settings/Get", () => taskManager.settings);

Tranga-CLI/Dockerfile

@@ -1,18 +0,0 @@
-FROM mcr.microsoft.com/dotnet/runtime:7.0 AS base
-WORKDIR /app
-
-FROM mcr.microsoft.com/dotnet/sdk:7.0 AS build
-WORKDIR /src
-COPY ["Tranga-CLI/Tranga-CLI.csproj", "Tranga-CLI/"]
-RUN dotnet restore "Tranga-CLI/Tranga-CLI.csproj"
-COPY . .
-WORKDIR "/src/Tranga-CLI"
-RUN dotnet build "Tranga-CLI.csproj" -c Release -o /app/build
-
-FROM build AS publish
-RUN dotnet publish "Tranga-CLI.csproj" -c Release -o /app/publish /p:UseAppHost=false
-
-FROM base AS final
-WORKDIR /app
-COPY --from=publish /app/publish .
-ENTRYPOINT ["dotnet", "Tranga-CLI.dll"]

Tranga/Komga.cs

@@ -1,4 +1,5 @@
-using System.Net.Http.Headers;
+using System.Net;
+using System.Net.Http.Headers;
 using System.Text.Json.Nodes;
 using Logging;
 using Newtonsoft.Json;
@@ -45,9 +46,17 @@ public class Komga
     {
         logger?.WriteLine(this.GetType().ToString(), $"Getting Libraries");
         Stream data = NetClient.MakeRequest($"{baseUrl}/api/v1/libraries", auth);
+        if (data == Stream.Null)
+        {
+            logger?.WriteLine(this.GetType().ToString(), $"No libraries returned");
+            return Array.Empty<KomgaLibrary>();
+        }
         JsonArray? result = JsonSerializer.Deserialize<JsonArray>(data);
         if (result is null)
+        {
+            logger?.WriteLine(this.GetType().ToString(), $"No libraries returned");
             return Array.Empty<KomgaLibrary>();
+        }
 
         HashSet<KomgaLibrary> ret = new();
 
@@ -89,37 +98,51 @@ public class Komga
     {
         public static Stream MakeRequest(string url, string auth)
         {
-            HttpClient client = new();
-            HttpRequestMessage requestMessage = new HttpRequestMessage
+            HttpClientHandler clientHandler = new ();
+            clientHandler.ServerCertificateCustomValidationCallback = (message, cert, chain, sslPolicyErrors) => true;
+            HttpClient client = new(clientHandler);
+            client.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Basic", auth);
+            
+            HttpRequestMessage requestMessage = new ()
             {
                 Method = HttpMethod.Get,
-                RequestUri = new Uri(url),
-                Headers =
-                {
-                    { "Accept", "application/json" },
-                    { "Authorization", new AuthenticationHeaderValue("Basic", auth).ToString() }
-                }
+                RequestUri = new Uri(url)
             };
             HttpResponseMessage response = client.Send(requestMessage);
-            Stream resultString = response.IsSuccessStatusCode ? response.Content.ReadAsStream() : Stream.Null;
-            return resultString;
+            Stream ret;
+            if (response.StatusCode is HttpStatusCode.Unauthorized)
+            {
+                ret = MakeRequest(response.RequestMessage!.RequestUri!.AbsoluteUri, auth);
+            }else
+                return response.IsSuccessStatusCode ? response.Content.ReadAsStream() : Stream.Null;
+            return ret;
         }
 
         public static bool MakePost(string url, string auth)
         {
-            HttpClient client = new();
-            HttpRequestMessage requestMessage = new HttpRequestMessage
+            HttpClientHandler clientHandler = new HttpClientHandler();
+            clientHandler.ServerCertificateCustomValidationCallback = (message, cert, chain, sslPolicyErrors) => true;
+            HttpClient client = new(clientHandler)
             {
-                Method = HttpMethod.Post,
-                RequestUri = new Uri(url),
-                Headers =
+                DefaultRequestHeaders =
                 {
                     { "Accept", "application/json" },
                     { "Authorization", new AuthenticationHeaderValue("Basic", auth).ToString() }
                 }
             };
+            HttpRequestMessage requestMessage = new HttpRequestMessage
+            {
+                Method = HttpMethod.Post,
+                RequestUri = new Uri(url)
+            };
             HttpResponseMessage response = client.Send(requestMessage);
-            return response.IsSuccessStatusCode;
+            bool ret;
+            if (response.StatusCode is HttpStatusCode.Unauthorized)
+            {
+                ret = MakePost(response.RequestMessage!.RequestUri!.AbsoluteUri, auth);
+            }else
+                return response.IsSuccessStatusCode;
+            return ret;
         }
     }
 }

Website/Dockerfile

@@ -0,0 +1,4 @@
+FROM nginx:alpine3.17-slim
+COPY . /usr/share/nginx/html
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

Website/apiConnector.js

@@ -1,4 +1,23 @@
-const apiUri = "http://localhost:5177";
+let apiUri = `http://${window.location.host.split(':')[0]}:6531`
+
+if(getCookie("apiUri") != ""){
+    apiUri = getCookie("apiUri");
+}
+function getCookie(cname) {
+    let name = cname + "=";
+    let decodedCookie = decodeURIComponent(document.cookie);
+    let ca = decodedCookie.split(';');
+    for(let i = 0; i < ca.length; i++) {
+        let c = ca[i];
+        while (c.charAt(0) == ' ') {
+            c = c.substring(1);
+        }
+        if (c.indexOf(name) == 0) {
+            return c.substring(name.length, c.length);
+        }
+    }
+    return "";
+}
 
 async function GetData(uri){
     let request = await fetch(uri, {
@@ -52,8 +71,8 @@ async function GetRunningTasks(){
     return json;
 }
 
-async function GetTasks(){
-    var uri = apiUri + "/Tasks/GetList";
+async function GetDownloadTasks(){
+    var uri = apiUri + "/Tasks/Get?taskType=DownloadNewChapters";
     let json = await GetData(uri);
     return json;
 }
@@ -64,6 +83,12 @@ async function GetSettings(){
     return json;
 }
 
+async function GetKomgaTask(){
+    var uri = apiUri + "/Tasks/Get?taskType=UpdateKomgaLibrary";
+    let json = await GetData(uri);
+    return json;
+}
+
 function CreateTask(taskType, reoccurrence, connectorName, publicationId, language){
     var uri = apiUri + `/Tasks/Create?taskType=${taskType}&connectorName=${connectorName}&publicationId=${publicationId}&reoccurrenceTime=${reoccurrence}&language=${language}`;
     PostData(uri);
@@ -80,7 +105,7 @@ function EnqueueTask(taskType, connectorName, publicationId){
 }
 
 function UpdateSettings(downloadLocation, komgaUrl, komgaAuth){
-    var uri = apiUri + `/Settings/Update?downloadLocation=${downloadLocation}&komgaUrl=${komgaAuth}&komgaAuth=${komgaAuth}`;
+    var uri = apiUri + `/Settings/Update?downloadLocation=${downloadLocation}&komgaUrl=${komgaUrl}&komgaAuth=${komgaAuth}`;
     PostData(uri);
 }
 

Website/index.html

@@ -46,13 +46,14 @@
         </window-titlebar>
         <window-content>
           <addtask-settings>
-            <addtask-setting><label for="selectReccurrence">Recurrence</label><input id="selectReccurrence" type="time" value="01:00" step="3600"></addtask-setting>
+            <addtask-setting><label for="selectReccurrence">Recurrence</label><input id="selectReccurrence" type="time" value="01:00:00" step="3600"></addtask-setting>
             <addtask-setting><label for="connectors">Connector</label>
               <select id="connectors">
                 <option value=""></option>
               </select>
             </addtask-setting>
             <addtask-setting><label for="searchPublicationQuery">Search Title</label><input id="searchPublicationQuery" type="text"></addtask-setting>
+            <input type="submit" value="Search" onclick="NewSearch();">
           </addtask-settings>
           <div id="taskSelectOutput"></div>
         </window-content>
@@ -79,7 +80,19 @@
   </viewport>
   
   <settingstab id="settingstab">
-
+    <span class="title">Download Location:</span>
+    <span id="downloadLocation"></span>
+    <span class="title">API-URI</span>
+    <label for="settingApiUri"></label><input placeholder="https://" type="text" id="settingApiUri">
+    <komga-settings>
+      <span class="title">Komga</span>
+      <div>Configured: <span id="komgaConfigured">✅❌</span></div>
+      <label for="komgaUrl"></label><input placeholder="URL" id="komgaUrl" type="text">
+      <label for="komgaUsername"></label><input placeholder="Username" id="komgaUsername" type="text">
+      <label for="komgaPassword"></label><input placeholder="Password" id="komgaPassword" type="password">
+      <div><label for="komgaUpdateTime" style="margin-right: 5px;">Update Time</label><input id="komgaUpdateTime" type="time" value="00:01:00" step="10"></div>
+      <input type="submit" value="Update" onclick="UpdateKomgaSettings()">
+    </komga-settings>
   </settingstab>
   
   <script src="apiConnector.js"></script>

Website/interaction.js

@@ -22,7 +22,6 @@ let publications = [];
 let tasks = [];
 let toEditId;
 
-const taskTypesSelect = document.querySelector("#taskTypes")
 const searchPublicationQuery = document.querySelector("#searchPublicationQuery");
 const selectPublication = document.querySelector("#taskSelectOutput");
 const connectorSelect = document.querySelector("#connectors");
@@ -40,30 +39,37 @@ const pubviewcover = document.querySelector("#pubviewcover");
 const publicationDelete = document.querySelector("publication-delete");
 const publicationAdd = document.querySelector("publication-add");
 const closetaskpopup = document.querySelector("#closePopupImg");
+const settingDownloadLocation = document.querySelector("#downloadLocation");
+const settingKomgaUrl = document.querySelector("#komgaUrl");
+const settingKomgaUser = document.querySelector("#komgaUsername");
+const settingKomgaPass = document.querySelector("#komgaPassword");
+const settingKomgaTime = document.querySelector("#komgaUpdateTime");
+const settingKomgaConfigured = document.querySelector("#komgaConfigured");
+const settingApiUri = document.querySelector("#settingApiUri");
 
-settingsCog.addEventListener("click", () => slide());
+
+settingsCog.addEventListener("click", () => OpenSettings());
 closetaskpopup.addEventListener("click", () => HideAddTaskPopup());
 document.querySelector("#blurBackgroundTaskPopup").addEventListener("click", () => HideAddTaskPopup());
 document.querySelector("#blurBackgroundPublicationPopup").addEventListener("click", () => HidePublicationPopup());
 publicationDelete.addEventListener("click", () => DeleteTaskClick());
 publicationAdd.addEventListener("click", () => AddTaskClick());
-
-/*
-let availableTaskTypes;
-GetTaskTypes()
-    .then(json => availableTaskTypes = json)
-    .then(json => 
-        json.forEach(taskType => {
-            var option = document.createElement('option');
-            option.value = taskType;
-            option.innerText = taskType;
-            taskTypesSelect.appendChild(option);
-        }));*/
+settingApiUri.addEventListener("keypress", (event) => {
+    if(event.key === "Enter"){
+        apiUri = settingApiUri.value;
+        setTimeout(() => GetSettingsClick(), 100);
+        document.cookie = `apiUri=${apiUri};`;
+    }
+});
+searchPublicationQuery.addEventListener("keypress", (event) => {
+    if(event.key === "Enter"){
+        NewSearch();
+    }
+});
 
 let availableConnectors;
 GetAvailableControllers()
     .then(json => availableConnectors = json)
-    //.then(json => console.log(json))
     .then(json => 
         json.forEach(connector => {
             var option = document.createElement('option');
@@ -73,32 +79,34 @@ GetAvailableControllers()
         })
     );
 
-searchPublicationQuery.addEventListener("keypress", (event) => {
-   if(event.key === "Enter"){
-       selectRecurrence.disabled = true;
-       connectorSelect.disabled = true;
-       searchPublicationQuery.disabled = true;
-       
-       selectPublication.replaceChildren();
-       GetPublication(connectorSelect.value, searchPublicationQuery.value)
-           //.then(json => console.log(json));
-           .then(json => 
-               json.forEach(publication => {
-                   var option = CreatePublication(publication, connectorSelect.value);
-                   option.addEventListener("click", (mouseEvent) => {
-                       ShowPublicationViewerWindow(publication.internalId, mouseEvent, true);
-                   });
-                   selectPublication.appendChild(option);
-               }
-           ))
-           .then(() => {
-               selectRecurrence.disabled = false;
-               connectorSelect.disabled = false;
-               searchPublicationQuery.disabled = false;
-           });
-   } 
-});
 
+function NewSearch(){
+    //Disable inputs
+    selectRecurrence.disabled = true;
+    connectorSelect.disabled = true;
+    searchPublicationQuery.disabled = true;
+
+    //Empty previous results
+    selectPublication.replaceChildren();
+    GetPublication(connectorSelect.value, searchPublicationQuery.value)
+        .then(json =>
+            json.forEach(publication => {
+                    var option = CreatePublication(publication, connectorSelect.value);
+                    option.addEventListener("click", (mouseEvent) => {
+                        ShowPublicationViewerWindow(publication.internalId, mouseEvent, true);
+                    });
+                    selectPublication.appendChild(option);
+                }
+            ))
+        .then(() => {
+            //Re-enable inputs
+            selectRecurrence.disabled = false;
+            connectorSelect.disabled = false;
+            searchPublicationQuery.disabled = false;
+        });
+}
+
+//Returns a new "Publication" Item to display in the tasks section
 function CreatePublication(publication, connector){
     var publicationElement = document.createElement('publication');
     publicationElement.setAttribute("id", publication.internalId);
@@ -131,7 +139,7 @@ function AddTaskClick(){
     HidePublicationPopup();
 }
 
-var slideIn = true;
+let slideIn = true;
 function slide() {
     if (slideIn)
         settingsTab.animate(slideInRight, slideInRightTiming);
@@ -141,7 +149,10 @@ function slide() {
 }
 
 function ResetContent(){
+    //Delete everything
     tasksContent.replaceChildren();
+    
+    //Add "Add new Task" Button
     var add = document.createElement("div");
     add.setAttribute("id", "addPublication")
     var plus = document.createElement("p");
@@ -151,16 +162,19 @@ function ResetContent(){
     tasksContent.appendChild(add);
 }
 function ShowPublicationViewerWindow(publicationId, event, add){
+    //Set position to mouse-position
     publicationViewerWindow.style.top = `${event.clientY - 60}px`;
     publicationViewerWindow.style.left = `${event.clientX}px`;
-    var publication = publications.filter(pub => pub.internalId === publicationId)[0];
     
+    //Edit information inside the window
+    var publication = publications.filter(pub => pub.internalId === publicationId)[0];
     publicationViewerName.innerText = publication.sortName;
     publicationViewerDescription.innerText = publication.description;
     publicationViewerAuthor.innerText = publication.author;
     pubviewcover.src = publication.posterUrl;
     toEditId = publicationId;
     
+    //Check what action should be listed
     if(add){
         publicationAdd.style.display = "block";
         publicationDelete.style.display = "none";
@@ -170,10 +184,14 @@ function ShowPublicationViewerWindow(publicationId, event, add){
         publicationDelete.style.display = "block";
     }
     
-    toEditId = publicationId;
+    //Show popup
     publicationViewerPopup.style.display = "block";
 }
 
+function HidePublicationPopup(){
+    publicationViewerPopup.style.display = "none";
+}
+
 function ShowNewTaskWindow(){
     selectPublication.replaceChildren();
     addTaskPopup.style.display = "block";
@@ -182,9 +200,6 @@ function HideAddTaskPopup(){
     addTaskPopup.style.display = "none";
 }
 
-function HidePublicationPopup(){
-    publicationViewerPopup.style.display = "none";
-}
 
 const fadeIn = [
     { opacity: "0" },
@@ -197,9 +212,49 @@ const fadeInTiming = {
     fill: "forwards"
 }
 
+function OpenSettings(){
+    GetSettingsClick();
+    slide();
+}
+
+function GetSettingsClick(){
+    settingApiUri.value = "";
+    settingKomgaUrl.value = "";
+    settingKomgaUser.value = "";
+    settingKomgaPass.value = "";
+    
+    settingApiUri.placeholder = apiUri;
+    
+    GetSettings().then(json => {
+        settingDownloadLocation.innerText = json.downloadLocation;
+        if(json.komga != null)
+            settingKomgaUrl.placeholder = json.komga.baseUrl;
+    });
+    
+    GetKomgaTask().then(json => {
+        if(json.length > 0)
+            settingKomgaConfigured.innerText = "✅";
+        else
+            settingKomgaConfigured.innerText = "❌";
+    });
+}
+
+function UpdateKomgaSettings(){
+    var auth = utf8_to_b64(`${settingKomgaUser.value}:${settingKomgaPass.value}`);
+    console.log(auth);
+    UpdateSettings("", settingKomgaUrl.value, auth);
+    CreateTask("UpdateKomgaLibrary", settingKomgaTime.value, "","","");
+    setTimeout(() => GetSettingsClick(), 500);
+}
+
+function utf8_to_b64( str ) {
+    return window.btoa(unescape(encodeURIComponent( str )));
+}
+
+//Resets the tasks shown
 ResetContent();
-GetTasks()
-    //.then(json => console.log(json))
+//Get Tasks and show them
+GetDownloadTasks()
     .then(json => json.forEach(task => {
         var publication = CreatePublication(task.publication, task.connectorName);
         publication.addEventListener("click", (event) => ShowPublicationViewerWindow(task.publication.internalId, event, false));
@@ -208,13 +263,16 @@ GetTasks()
     }));
 
 setInterval(() => {
+    //Tasks from API
     var cTasks = [];
-    GetTasks()
-        //.then(json => console.log(json))
+    GetDownloadTasks()
         .then(json => json.forEach(task => cTasks.push(task)))
         .then(() => {
+            //Only update view if tasks-amount has changed
             if(tasks.length != cTasks.length) {
+                //Resets the tasks shown
                 ResetContent();
+                //Add all currenttasks to view
                 cTasks.forEach(task => {
                     var publication = CreatePublication(task.publication, task.connectorName);
                     publication.addEventListener("click", (event) => ShowPublicationViewerWindow(task.publication.internalId, event, false));

Website/style.css

@@ -123,6 +123,37 @@ settingstab{
     height: calc(100% - var(--topbar-height) - 40px);
     margin-bottom: 10px;
     border-radius: 5px 0 0 5px;
+    display: flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+}
+
+settingstab > * {
+    margin: 0 20px;
+}
+
+settingstab input {
+    padding: 3px;
+    border-radius: 3px;
+    border: 0;
+    margin: 2px 20px;
+}
+
+settingstab .title {
+    font-size: 14pt;
+    font-weight: bolder;
+    margin-top: 20px;
+}
+
+komga-settings {
+    margin-top: 20px;
+    display: flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+}
+
+komga-settings input {
+    margin: 2px 0;
 }
 
 #addPublication {

docker-compose.yaml

@@ -0,0 +1,15 @@
+services:
+  tranga-api:
+    image: glax/tranga-api:latest
+    container_name: tranga-api
+    volumes:
+      - ./tranga:/usr/share/Tranga-API
+      - ./Manga:/Manga
+    ports:
+      - 6531:80
+    restart: unless-stopped
+  tranga-website:
+    image: glax/tranga-website:latest
+    container_name: tranga-website
+    ports:
+      - 9555:80