Compare commits
No commits in common. "52dfd7093291010ddd51512db95f02fe7660e5a8" and "bad762712dd6896da7b34777d65620bb2da0d199" have entirely different histories.
52dfd70932
...
bad762712d
123
README.md
123
README.md
@ -1,123 +0,0 @@
|
|||||||
<!-- PROJECT SHIELDS -->
|
|
||||||
<!--
|
|
||||||
*** I'm using markdown "reference style" links for readability.
|
|
||||||
*** Reference links are enclosed in brackets [ ] instead of parentheses ( ).
|
|
||||||
*** See the bottom of this document for the declaration of the reference variables
|
|
||||||
*** for contributors-url, forks-url, etc. This is an optional, concise syntax you may use.
|
|
||||||
*** https://www.markdownguide.org/basic-syntax/#reference-style-links
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!-- PROJECT LOGO -->
|
|
||||||
<br />
|
|
||||||
<div align="center">
|
|
||||||
|
|
||||||
<h3 align="center">Tranga-Website</h3>
|
|
||||||
|
|
||||||
<p align="center">
|
|
||||||
Automatic Manga and Metadata downloader
|
|
||||||
</p>
|
|
||||||
<p align="center">
|
|
||||||
This is the Website for <a href="https://github.com/C9Glax/tranga">Tranga</a> (API)
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- TABLE OF CONTENTS -->
|
|
||||||
<details>
|
|
||||||
<summary>Table of Contents</summary>
|
|
||||||
<ol>
|
|
||||||
<li>
|
|
||||||
<a href="#about-the-project">About The Project</a>
|
|
||||||
<ul>
|
|
||||||
<li><a href="#built-with">Built With</a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="#getting-started">Getting Started</a>
|
|
||||||
</li>
|
|
||||||
<li><a href="#roadmap">Roadmap</a></li>
|
|
||||||
<li><a href="#contributing">Contributing</a></li>
|
|
||||||
<li><a href="#license">License</a></li>
|
|
||||||
<li><a href="#acknowledgments">Acknowledgments</a></li>
|
|
||||||
</ol>
|
|
||||||
</details>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- ABOUT THE PROJECT -->
|
|
||||||
## About The Project
|
|
||||||
|
|
||||||
Tranga-Website is the Web-frontend to [Tranga](https://github.com/C9Glax/tranga) (the API). It displays information aquired from Tranga and can create Jobs (Manga-Downloads).
|
|
||||||
|
|
||||||
### What this does do (and nothing else)
|
|
||||||
|
|
||||||
This repo makes HTTP-requests to the [Tranga-API](https://github.com/C9Glax/tranga) to display it's present configuration.
|
|
||||||
|
|
||||||
### Built With
|
|
||||||
|
|
||||||
- nginx
|
|
||||||
- HTML, CSS, and barebones Javascript
|
|
||||||
- 💙 Blåhaj 🦈
|
|
||||||
|
|
||||||
<p align="right">(<a href="#readme-top">back to top</a>)</p>
|
|
||||||
|
|
||||||
<!-- GETTING STARTED -->
|
|
||||||
## Getting Started
|
|
||||||
|
|
||||||
There is a single release:
|
|
||||||
|
|
||||||
|
|
||||||
### Docker
|
|
||||||
|
|
||||||
Download [docker-compose.yaml](https://github.com/C9Glax/tranga-website/blob/cuttingedge/docker-compose.yaml) and configure to your needs.
|
|
||||||
The `docker-compose` also includes [Tranga](https://github.com/C9Glax/tranga) as backend. For its configuration refer to the repo README.
|
|
||||||
|
|
||||||
<!-- ROADMAP -->
|
|
||||||
## Roadmap
|
|
||||||
|
|
||||||
- [ ] ❓
|
|
||||||
|
|
||||||
See the [open issues](https://github.com/C9Glax/tranga-website/issues) for a full list of proposed features (and known issues).
|
|
||||||
|
|
||||||
<p align="right">(<a href="#readme-top">back to top</a>)</p>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- CONTRIBUTING -->
|
|
||||||
## Contributing
|
|
||||||
|
|
||||||
The following is copy & pasted:
|
|
||||||
|
|
||||||
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
|
|
||||||
|
|
||||||
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
|
|
||||||
Don't forget to give the project a star! Thanks again!
|
|
||||||
|
|
||||||
1. Fork the Project
|
|
||||||
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
|
|
||||||
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
|
|
||||||
4. Push to the Branch (`git push origin feature/AmazingFeature`)
|
|
||||||
5. Open a Pull Request
|
|
||||||
|
|
||||||
<p align="right">(<a href="#readme-top">back to top</a>)</p>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- LICENSE -->
|
|
||||||
## License
|
|
||||||
|
|
||||||
Distributed under the GNU GPLv3 License. See `LICENSE.txt` for more information.
|
|
||||||
|
|
||||||
<p align="right">(<a href="#readme-top">back to top</a>)</p>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- ACKNOWLEDGMENTS -->
|
|
||||||
## Acknowledgments
|
|
||||||
|
|
||||||
* [Choose an Open Source License](https://choosealicense.com)
|
|
||||||
* [Font Awesome](https://fontawesome.com)
|
|
||||||
* [Best-README-Template](https://github.com/othneildrew/Best-README-Template/tree/master)
|
|
||||||
|
|
||||||
<p align="right">(<a href="#readme-top">back to top</a>)</p>
|
|
Binary file not shown.
Before Width: | Height: | Size: 162 KiB |
Binary file not shown.
Before Width: | Height: | Size: 356 KiB |
Binary file not shown.
Before Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
Before Width: | Height: | Size: 1.5 MiB |
Binary file not shown.
Before Width: | Height: | Size: 1.6 MiB |
@ -3,15 +3,6 @@
|
|||||||
if(getCookie("apiUri") != ""){
|
if(getCookie("apiUri") != ""){
|
||||||
apiUri = getCookie("apiUri");
|
apiUri = getCookie("apiUri");
|
||||||
}
|
}
|
||||||
setCookie("apiUri", apiUri);
|
|
||||||
|
|
||||||
function setCookie(cname, cvalue) {
|
|
||||||
const d = new Date();
|
|
||||||
d.setTime(d.getTime() + (365*24*60*60*1000));
|
|
||||||
let expires = "expires="+ d.toUTCString();
|
|
||||||
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/;samesite=strict";
|
|
||||||
}
|
|
||||||
|
|
||||||
function getCookie(cname) {
|
function getCookie(cname) {
|
||||||
let name = cname + "=";
|
let name = cname + "=";
|
||||||
let decodedCookie = decodeURIComponent(document.cookie);
|
let decodedCookie = decodeURIComponent(document.cookie);
|
||||||
@ -51,144 +42,127 @@ function DeleteData(uri){
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async function Ping(){
|
|
||||||
let ret = await GetData(`${apiUri}/Ping`);
|
|
||||||
return ret;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function GetAvailableControllers(){
|
async function GetAvailableControllers(){
|
||||||
var uri = apiUri + "/Connectors";
|
var uri = apiUri + "/Connectors";
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetPublicationFromConnector(connector, title){
|
async function GetPublicationFromConnector(connectorName, title){
|
||||||
var uri;
|
var uri = apiUri + `/Publications/FromConnector?connectorName=${connectorName}&title=${title}`;
|
||||||
if(title.includes("http")){
|
|
||||||
uri = `${apiUri}/Manga/FromConnector?connector=${connector}&url=${title}`;
|
|
||||||
}else{
|
|
||||||
uri = `${apiUri}/Manga/FromConnector?connector=${connector}&title=${title}`;
|
|
||||||
}
|
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetChapters(connector, internalId, language){
|
async function GetKnownPublications(){
|
||||||
var uri = `${apiUri}/Manga/Chapters?connector=${connector}&internalId=${internalId}&translatedLanguage=${language}`;
|
var uri = apiUri + "/Publications/Known";
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
function GetCoverUrl(internalId){
|
async function GetPublication(internalId){
|
||||||
return `${apiUri}/Manga/Cover?internalId=${internalId}`;
|
var uri = apiUri + `/Publications/Known?internalId=${internalId}`;
|
||||||
}
|
|
||||||
|
|
||||||
async function GetAllJobs(){
|
|
||||||
var uri = `${apiUri}/Jobs`;
|
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetRunningJobs(){
|
async function GetChapters(internalId, connectorName, onlyNew, language){
|
||||||
var uri = `${apiUri}/Jobs/Running`;
|
var uri = apiUri + `/Publications/Chapters?internalId=${internalId}&connectorName=${connectorName}&onlyNew=${onlyNew}&language=${language}`;
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetWaitingJobs(){
|
async function GetTaskTypes(){
|
||||||
var uri = `${apiUri}/Jobs/Waiting`;
|
var uri = apiUri + "/Tasks/Types";
|
||||||
|
let json = await GetData(uri);
|
||||||
|
return json;
|
||||||
|
}
|
||||||
|
async function GetRunningTasks(){
|
||||||
|
var uri = apiUri + "/Tasks/RunningTasks";
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetMonitorJobs(){
|
async function GetDownloadTasks(){
|
||||||
var uri = `${apiUri}/Jobs/MonitorJobs`;
|
var uri = apiUri + "/Tasks?taskType=MonitorPublication";
|
||||||
let json = await GetData(uri);
|
|
||||||
return json;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function GetProgress(jobId){
|
|
||||||
var uri = `${apiUri}/Jobs/Progress?jobId=${jobId}`;
|
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetSettings(){
|
async function GetSettings(){
|
||||||
var uri = `${apiUri}/Settings`;
|
var uri = apiUri + "/Settings";
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetAvailableNotificationConnectors(){
|
async function GetKomgaTask(){
|
||||||
var uri = `${apiUri}/NotificationConnectors/Types`;
|
var uri = apiUri + "/Tasks?taskType=UpdateLibraries";
|
||||||
let json = await GetData(uri);
|
let json = await GetData(uri);
|
||||||
return json;
|
return json;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function GetNotificationConnectors(){
|
function CreateMonitorTask(connectorName, internalId, reoccurrence, language){
|
||||||
var uri = `${apiUri}/NotificationConnectors`;
|
var uri = apiUri + `/Tasks/CreateMonitorTask?connectorName=${connectorName}&internalId=${internalId}&reoccurrenceTime=${reoccurrence}&language=${language}`;
|
||||||
let json = await GetData(uri);
|
|
||||||
return json;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function GetAvailableLibraryConnectors(){
|
|
||||||
var uri = `${apiUri}/LibraryConnectors/Types`;
|
|
||||||
let json = await GetData(uri);
|
|
||||||
return json;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function GetLibraryConnectors(){
|
|
||||||
var uri = `${apiUri}/LibraryConnectors`;
|
|
||||||
let json = await GetData(uri);
|
|
||||||
return json;
|
|
||||||
}
|
|
||||||
|
|
||||||
function CreateMonitorJob(connector, internalId, language){
|
|
||||||
var uri = `${apiUri}/Jobs/MonitorManga?connector=${connector}&internalId=${internalId}&interval=03:00:00&translatedLanguage=${language}`;
|
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function CreateDownloadNewChaptersJob(connector, internalId, language){
|
function CreateDownloadChaptersTask(connectorName, internalId, chapters, language){
|
||||||
var uri = `${apiUri}/Jobs/DownloadNewChapters?connector=${connector}&internalId=${internalId}&translatedLanguage=${language}`;
|
var uri = apiUri + `/Tasks/CreateDownloadChaptersTask?connectorName=${connectorName}&internalId=${internalId}&chapters=${chapters}&language=${language}`;
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function StartJob(jobId){
|
function StartTask(taskType, connectorName, internalId){
|
||||||
var uri = `${apiUri}/Jobs/StartNow?jobId=${jobId}`;
|
var uri = apiUri + `/Tasks/Start?taskType=${taskType}&connectorName=${connectorName}&internalId=${internalId}`;
|
||||||
|
PostData(uri);
|
||||||
|
}
|
||||||
|
|
||||||
|
function EnqueueTask(taskType, connectorName, publicationId){
|
||||||
|
var uri = apiUri + `/Queue/Enqueue?taskType=${taskType}&connectorName=${connectorName}&publicationId=${publicationId}`;
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function UpdateDownloadLocation(downloadLocation){
|
function UpdateDownloadLocation(downloadLocation){
|
||||||
var uri = `${apiUri}/Settings/UpdateDownloadLocation?downloadLocation=${downloadLocation}`;
|
var uri = apiUri + "/Settings/Update?"
|
||||||
|
uri += "&downloadLocation="+downloadLocation;
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function UpdateKomga(komgaUrl, komgaAuth){
|
function UpdateKomga(komgaUrl, komgaAuth){
|
||||||
var uri = `${apiUri}/LibraryConnectors/Update?libraryConnector=Komga&komgaUrl=${komgaUrl}&komgaAuth=${komgaAuth}`;
|
var uri = apiUri + "/Settings/Update?"
|
||||||
|
uri += `&komgaUrl=${komgaUrl}&komgaAuth=${komgaAuth}`;
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function UpdateKavita(kavitaUrl, kavitaUsername, kavitaPassword){
|
function UpdateKavita(kavitaUrl, kavitaUser, kavitaPass){
|
||||||
var uri = `${apiUri}/LibraryConnectors/Update?libraryConnector=Kavita&kavitaUrl=${kavitaUrl}&kavitaUsername=${kavitaUsername}&kavitaPassword={kavitaPassword}`;
|
var uri = apiUri + "/Settings/Update?"
|
||||||
|
uri += `&kavitaUrl=${kavitaUrl}&kavitaUsername=${kavitaUser}&kavitaPassword=${kavitaPass}`;
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function UpdateGotify(gotifyUrl, gotifyAppToken){
|
function UpdateGotify(gotifyUrl, gotifyAppToken){
|
||||||
var uri = `${apiUri}/NotificationConnectors/Update?notificationConnector=Gotify&gotifyUrl=${gotifyUrl}&gotifyAppToken=${gotifyAppToken}`;
|
var uri = apiUri + "/Settings/Update?"
|
||||||
|
uri += `&gotifyUrl=${gotifyUrl}&gotifyAppToken=${gotifyAppToken}`;
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function UpdateLunaSea(lunaseaWebhook){
|
function UpdateLunaSea(lunaseaWebhook){
|
||||||
var uri = `${apiUri}/NotificationConnectors/Update?notificationConnector=LunaSea&lunaseaWebhook=${lunaseaWebhook}`;
|
var uri = apiUri + "/Settings/Update?"
|
||||||
|
uri += `&lunaseaWebhook=${lunaseaWebhook}`;
|
||||||
PostData(uri);
|
PostData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function RemoveJob(jobId){
|
function DeleteTask(taskType, connectorName, publicationId){
|
||||||
var uri = `${apiUri}/Jobs?jobId=${jobId}`;
|
var uri = apiUri + `/Tasks?taskType=${taskType}&connectorName=${connectorName}&publicationId=${publicationId}`;
|
||||||
DeleteData(uri);
|
DeleteData(uri);
|
||||||
}
|
}
|
||||||
|
|
||||||
function CancelJob(jobId){
|
function DequeueTask(taskType, connectorName, publicationId){
|
||||||
var uri = `${apiUri}/Jobs/Cancel?jobId=${jobId}`;
|
var uri = apiUri + `/Queue/Dequeue?taskType=${taskType}&connectorName=${connectorName}&publicationId=${publicationId}`;
|
||||||
PostData(uri);
|
DeleteData(uri);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function GetQueue(){
|
||||||
|
var uri = apiUri + "/Queue/List";
|
||||||
|
let json = await GetData(uri);
|
||||||
|
return json;
|
||||||
}
|
}
|
@ -20,41 +20,94 @@
|
|||||||
<img id="settingscog" src="media/settings-cogwheel.svg" height="100%" alt="settingscog">
|
<img id="settingscog" src="media/settings-cogwheel.svg" height="100%" alt="settingscog">
|
||||||
</topbar>
|
</topbar>
|
||||||
<viewport>
|
<viewport>
|
||||||
<div id="loaderdiv">
|
|
||||||
<blur-background></blur-background>
|
|
||||||
<div id="loader"></div>
|
|
||||||
<p id="loaderText">Check your Settings > API-URI</p>
|
|
||||||
</div>
|
|
||||||
<content>
|
<content>
|
||||||
<div id="addPublication">
|
<div id="addPublication">
|
||||||
<p>+</p>
|
<p>+</p>
|
||||||
</div>
|
</div>
|
||||||
<publication onclick="ShowNewMangaSearch()">
|
<publication>
|
||||||
<img alt="cover" src="media/cover.jpg">
|
<img alt="cover" src="media/cover.jpg">
|
||||||
<publication-information>
|
<publication-information>
|
||||||
<connector-name class="pill">Sample</connector-name>
|
<connector-name class="pill">MangaDex</connector-name>
|
||||||
<publication-name>Best Manga there is</publication-name>
|
<publication-name>Tensei Pandemic</publication-name>
|
||||||
</publication-information>
|
</publication-information>
|
||||||
</publication>
|
</publication>
|
||||||
</content>
|
</content>
|
||||||
|
|
||||||
<popup id="newMangaPopup">
|
<popup id="selectPublicationPopup">
|
||||||
<blur-background id="blurBackgroundNewMangaPopup" onclick="newMangaPopup.style.display = 'none';"></blur-background>
|
<blur-background id="blurBackgroundTaskPopup"></blur-background>
|
||||||
<div id="newMangaPopupSelector">
|
<popup-window>
|
||||||
<select id="newMangaConnector" />
|
<popup-title>Select Publication</popup-title>
|
||||||
<input type="text" placeholder="Title" id="newMangaTitle" />
|
<popup-content>
|
||||||
<select id="newMangaTranslatedLanguage">
|
<div>
|
||||||
<option selected="selected">en</option>
|
<label for="connectors">Connector</label>
|
||||||
<option>it</option>
|
<select id="connectors">
|
||||||
<option>de</option>
|
<option value=""></option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div id="newMangaResult"></div>
|
<div>
|
||||||
|
<label for="searchPublicationQuery">Search Title</label><input id="searchPublicationQuery" type="text"></addtask-setting>
|
||||||
|
</div>
|
||||||
|
<input type="submit" value="Search" style="font-weight: bolder" onclick="NewSearch();">
|
||||||
|
</popup-content>
|
||||||
|
<div id="taskSelectOutput"></div>
|
||||||
|
</popup-window>
|
||||||
|
</popup>
|
||||||
|
|
||||||
|
<popup id="createMonitorTaskPopup">
|
||||||
|
<blur-background id="blurBackgroundCreateMonitorTaskPopup"></blur-background>
|
||||||
|
<popup-window>
|
||||||
|
<popup-title>Create Task: Monitor Publication</popup-title>
|
||||||
|
<popup-content>
|
||||||
|
<div>
|
||||||
|
<span>Run every</span>
|
||||||
|
<label for="hours"></label><input id="hours" type="number" value="3" min="0" max="23"><span>hours</span>
|
||||||
|
<label for="minutes"></label><input id="minutes" type="number" value="0" min="0" max="59"><span>minutes</span>
|
||||||
|
<input type="submit" value="Create" onclick="AddMonitorTask()">
|
||||||
|
</div>
|
||||||
|
</popup-content>
|
||||||
|
</popup-window>
|
||||||
|
</popup>
|
||||||
|
|
||||||
|
<popup id="createDownloadChaptersTask">
|
||||||
|
<blur-background id="blurBackgroundCreateDownloadChaptersTask"></blur-background>
|
||||||
|
<popup-window>
|
||||||
|
<popup-title>Create Task: Download Chapter(s)</popup-title>
|
||||||
|
<popup-content>
|
||||||
|
<div>
|
||||||
|
<label for="selectedChapters">Chapters:</label><input id="selectedChapters" placeholder="Select"><input type="submit" value="Select" onclick="DownloadChapterTaskClick()">
|
||||||
|
</div>
|
||||||
|
<div id="chapterOutput">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</popup-content>
|
||||||
|
</popup-window>
|
||||||
|
</popup>
|
||||||
|
|
||||||
|
<popup id="publicationViewerPopup">
|
||||||
|
<blur-background id="blurBackgroundPublicationPopup"></blur-background>
|
||||||
|
<publication-viewer>
|
||||||
|
<img id="pubviewcover" src="media/cover.jpg" alt="cover">
|
||||||
|
<publication-information>
|
||||||
|
<publication-name id="publicationViewerName">Tensei Pandemic</publication-name>
|
||||||
|
<publication-tags id="publicationViewerTags"></publication-tags>
|
||||||
|
<publication-author id="publicationViewerAuthor">Imamura Hinata</publication-author>
|
||||||
|
<publication-description id="publicationViewerDescription">Imamura Hinata is a high school boy with a cute appearance.
|
||||||
|
Since his trauma with the first love, he wanted to be more manly than anybody else. But one day he woke up to something different…
|
||||||
|
The total opposite of his ideal male body!
|
||||||
|
Pandemic love comedy!
|
||||||
|
</publication-description>
|
||||||
|
<publication-interactions>
|
||||||
|
<publication-starttask>Start Task ▶️</publication-starttask>
|
||||||
|
<publication-delete>Delete Task ❌</publication-delete>
|
||||||
|
<publication-add id="createMonitorTaskButton">Monitor ➕</publication-add>
|
||||||
|
<publication-add id="createDownloadChapterTaskButton">Download Chapter ➕</publication-add>
|
||||||
|
</publication-interactions>
|
||||||
|
</publication-information>
|
||||||
|
</publication-viewer>
|
||||||
</popup>
|
</popup>
|
||||||
|
|
||||||
<popup id="settingsPopup">
|
<popup id="settingsPopup">
|
||||||
<blur-background id="blurBackgroundSettingsPopup" onclick="
|
<blur-background id="blurBackgroundSettingsPopup"></blur-background>
|
||||||
settingsPopup.style.display = 'none';"></blur-background>
|
|
||||||
<popup-window>
|
<popup-window>
|
||||||
<popup-title>Settings</popup-title>
|
<popup-title>Settings</popup-title>
|
||||||
<popup-content>
|
<popup-content>
|
||||||
@ -92,53 +145,29 @@
|
|||||||
<label for="lunaseaWebhook"></label><input placeholder="device/:id or user/:id" id="lunaseaWebhook" type="text">
|
<label for="lunaseaWebhook"></label><input placeholder="device/:id or user/:id" id="lunaseaWebhook" type="text">
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<input type="submit" value="Update" onclick="UpdateSettings()">
|
<label for="libraryUpdateTime" style="margin-right: 5px;">Update Time</label><input id="libraryUpdateTime" type="time" value="00:01:00" step="10">
|
||||||
|
<input type="submit" value="Update" onclick="UpdateLibrarySettings()">
|
||||||
</div>
|
</div>
|
||||||
</popup-content>
|
</popup-content>
|
||||||
</popup-window>
|
</popup-window>
|
||||||
</popup>
|
</popup>
|
||||||
|
|
||||||
<popup id="publicationViewerPopup">
|
<popup id="downloadTasksPopup">
|
||||||
<blur-background id="blurBackgroundPublicationPopup" onclick="publicationViewerPopup.style.display= 'none';"></blur-background>
|
<blur-background id="blurBackgroundTasksQueuePopup"></blur-background>
|
||||||
<publication-viewer>
|
|
||||||
<img id="pubviewcover" src="media/cover.jpg" alt="cover">
|
|
||||||
<publication-information>
|
|
||||||
<publication-name id="publicationViewerName">Best Manga there is</publication-name>
|
|
||||||
<publication-tags id="publicationViewerTags">A Manga</publication-tags>
|
|
||||||
<publication-author id="publicationViewerAuthor">Glax</publication-author>
|
|
||||||
<publication-description id="publicationViewerDescription">
|
|
||||||
An interesting description. The description is very intriguing, yet wholesome.
|
|
||||||
</publication-description>
|
|
||||||
<publication-interactions>
|
|
||||||
<publication-starttask id="startJobButton">Start Job ▶️</publication-starttask>
|
|
||||||
<publication-canceltask id="cancelJobButton">Cancel Job ❌</publication-canceltask>
|
|
||||||
<publication-delete id="deleteJobButton">Delete Job 🗑️</publication-delete>
|
|
||||||
<publication-add id="createMonitorJobButton">Monitor ➕</publication-add>
|
|
||||||
<publication-add id="createDownloadChapterJobButton">Download Chapter 📥</publication-add>
|
|
||||||
</publication-interactions>
|
|
||||||
</publication-information>
|
|
||||||
</publication-viewer>
|
|
||||||
</popup>
|
|
||||||
|
|
||||||
<popup id="jobStatusView">
|
|
||||||
<blur-background id="blurBackgroundJobStatus" onclick="jobStatusView.style.display= 'none';"></blur-background>
|
|
||||||
<popup-window>
|
<popup-window>
|
||||||
<div>
|
<popup-title>Task Progress</popup-title>
|
||||||
<div id="jobStatusRunning" style="border-right: 1px solid gray;"></div>
|
<popup-content>
|
||||||
</div>
|
|
||||||
<div>
|
</popup-content>
|
||||||
<div id="jobStatusWaiting" style="border-left: 1px solid gray;"></div>
|
|
||||||
</div>
|
|
||||||
</popup-window>
|
</popup-window>
|
||||||
</popup>
|
</popup>
|
||||||
</viewport>
|
</viewport>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<div onclick="ShowJobQueue();">
|
<div onclick="ShowTasksQueue();">
|
||||||
<img src="media/running.svg" alt="running"><div id="jobsRunningTag">0</div>
|
<img src="media/running.svg" alt="running"><div id="tasksRunningTag">0</div>
|
||||||
</div>
|
</div>
|
||||||
<div onclick="ShowJobQueue();">
|
<div onclick="ShowTasksQueue();">
|
||||||
<img src="media/queue.svg" alt="queue"><div id="jobsQueuedTag">0</div>
|
<img src="media/queue.svg" alt="queue"><div id="tasksQueuedTag">0</div>
|
||||||
</div>
|
</div>
|
||||||
<p id="madeWith">Made with Blåhaj 🦈</p>
|
<p id="madeWith">Made with Blåhaj 🦈</p>
|
||||||
</footer>
|
</footer>
|
||||||
|
@ -1,26 +1,31 @@
|
|||||||
let runningJobs = [];
|
let publications = [];
|
||||||
let waitingJobs = [];
|
let tasks = [];
|
||||||
let notificationConnectorTypes = [];
|
let toEditId;
|
||||||
let libraryConnectorTypes = [];
|
|
||||||
let selectedManga;
|
|
||||||
let selectedJob;
|
|
||||||
|
|
||||||
const searchBox = document.querySelector("#searchbox");
|
const searchBox = document.querySelector("#searchbox");
|
||||||
|
const searchPublicationQuery = document.querySelector("#searchPublicationQuery");
|
||||||
|
const selectPublication = document.querySelector("#taskSelectOutput");
|
||||||
|
const connectorSelect = document.querySelector("#connectors");
|
||||||
const settingsPopup = document.querySelector("#settingsPopup");
|
const settingsPopup = document.querySelector("#settingsPopup");
|
||||||
const settingsCog = document.querySelector("#settingscog");
|
const settingsCog = document.querySelector("#settingscog");
|
||||||
|
const selectRecurrence = document.querySelector("#selectReccurrence");
|
||||||
const tasksContent = document.querySelector("content");
|
const tasksContent = document.querySelector("content");
|
||||||
const createMonitorTaskButton = document.querySelector("#createMonitoJobButton");
|
const selectPublicationPopup = document.querySelector("#selectPublicationPopup");
|
||||||
const createDownloadChapterTaskButton = document.querySelector("#createDownloadChapterJobButton");
|
const createMonitorTaskButton = document.querySelector("#createMonitorTaskButton");
|
||||||
const startJobButton = document.querySelector("#startJobButton");
|
const createDownloadChapterTaskButton = document.querySelector("#createDownloadChapterTaskButton");
|
||||||
const cancelJobButton = document.querySelector("#cancelJobButton");
|
const createMonitorTaskPopup = document.querySelector("#createMonitorTaskPopup");
|
||||||
const deleteJobButton = document.querySelector("#deleteJobButton");
|
const createDownloadChaptersTask = document.querySelector("#createDownloadChaptersTask");
|
||||||
const mangaViewerPopup = document.querySelector("#publicationViewerPopup");
|
const chapterOutput = document.querySelector("#chapterOutput");
|
||||||
const mangaViewerWindow = document.querySelector("publication-viewer");
|
const selectedChapters = document.querySelector("#selectedChapters");
|
||||||
const mangaViewerDescription = document.querySelector("#publicationViewerDescription");
|
const publicationViewerPopup = document.querySelector("#publicationViewerPopup");
|
||||||
const mangaViewerName = document.querySelector("#publicationViewerName");
|
const publicationViewerWindow = document.querySelector("publication-viewer");
|
||||||
const mangaViewerTags = document.querySelector("#publicationViewerTags");
|
const publicationViewerDescription = document.querySelector("#publicationViewerDescription");
|
||||||
const mangaViewerAuthor = document.querySelector("#publicationViewerAuthor");
|
const publicationViewerName = document.querySelector("#publicationViewerName");
|
||||||
const mangaViewCover = document.querySelector("#pubviewcover");
|
const publicationViewerTags = document.querySelector("#publicationViewerTags");
|
||||||
|
const publicationViewerAuthor = document.querySelector("#publicationViewerAuthor");
|
||||||
|
const pubviewcover = document.querySelector("#pubviewcover");
|
||||||
|
const publicationDelete = document.querySelector("publication-delete");
|
||||||
|
const publicationTaskStart = document.querySelector("publication-starttask");
|
||||||
const settingDownloadLocation = document.querySelector("#downloadLocation");
|
const settingDownloadLocation = document.querySelector("#downloadLocation");
|
||||||
const settingKomgaUrl = document.querySelector("#komgaUrl");
|
const settingKomgaUrl = document.querySelector("#komgaUrl");
|
||||||
const settingKomgaUser = document.querySelector("#komgaUsername");
|
const settingKomgaUser = document.querySelector("#komgaUsername");
|
||||||
@ -31,55 +36,166 @@ const settingKavitaPass = document.querySelector("#kavitaPassword");
|
|||||||
const settingGotifyUrl = document.querySelector("#gotifyUrl");
|
const settingGotifyUrl = document.querySelector("#gotifyUrl");
|
||||||
const settingGotifyAppToken = document.querySelector("#gotifyAppToken");
|
const settingGotifyAppToken = document.querySelector("#gotifyAppToken");
|
||||||
const settingLunaseaWebhook = document.querySelector("#lunaseaWebhook");
|
const settingLunaseaWebhook = document.querySelector("#lunaseaWebhook");
|
||||||
|
const libraryUpdateTime = document.querySelector("#libraryUpdateTime");
|
||||||
const settingKomgaConfigured = document.querySelector("#komgaConfigured");
|
const settingKomgaConfigured = document.querySelector("#komgaConfigured");
|
||||||
const settingKavitaConfigured = document.querySelector("#kavitaConfigured");
|
const settingKavitaConfigured = document.querySelector("#kavitaConfigured");
|
||||||
const settingGotifyConfigured = document.querySelector("#gotifyConfigured");
|
const settingGotifyConfigured = document.querySelector("#gotifyConfigured");
|
||||||
const settingLunaseaConfigured = document.querySelector("#lunaseaConfigured");
|
const settingLunaseaConfigured = document.querySelector("#lunaseaConfigured");
|
||||||
const settingApiUri = document.querySelector("#settingApiUri");
|
const settingApiUri = document.querySelector("#settingApiUri");
|
||||||
const newMangaPopup = document.querySelector("#newMangaPopup");
|
const tagTasksRunning = document.querySelector("#tasksRunningTag");
|
||||||
const newMangaConnector = document.querySelector("#newMangaConnector");
|
const tagTasksQueued = document.querySelector("#tasksQueuedTag");
|
||||||
const newMangaTitle = document.querySelector("#newMangaTitle");
|
const downloadTasksPopup = document.querySelector("#downloadTasksPopup");
|
||||||
const newMangaResult = document.querySelector("#newMangaResult");
|
const downloadTasksOutput = downloadTasksPopup.querySelector("popup-content");
|
||||||
const newMangaTranslatedLanguage = document.querySelector("#newMangaTranslatedLanguage");
|
|
||||||
const jobsRunningTag = document.querySelector("#jobsRunningTag");
|
|
||||||
const jobsQueuedTag = document.querySelector("#jobsQueuedTag");
|
|
||||||
const loaderdiv = document.querySelector('#loaderdiv');
|
|
||||||
const jobStatusView = document.querySelector("#jobStatusView");
|
|
||||||
const jobStatusRunning = document.querySelector("#jobStatusRunning");
|
|
||||||
const jobStatusWaiting = document.querySelector("#jobStatusWaiting");
|
|
||||||
|
|
||||||
function Setup(){
|
searchBox.addEventListener("keyup", () => FilterResults());
|
||||||
Ping().then((ret) => {
|
settingsCog.addEventListener("click", () => OpenSettings());
|
||||||
loaderdiv.style.display = 'none';
|
document.querySelector("#blurBackgroundSettingsPopup").addEventListener("click", () => settingsPopup.style.display = "none");
|
||||||
|
document.querySelector("#blurBackgroundTaskPopup").addEventListener("click", () => selectPublicationPopup.style.display = "none");
|
||||||
|
document.querySelector("#blurBackgroundPublicationPopup").addEventListener("click", () => HidePublicationPopup());
|
||||||
|
document.querySelector("#blurBackgroundCreateMonitorTaskPopup").addEventListener("click", () => createMonitorTaskPopup.style.display = "none");
|
||||||
|
document.querySelector("#blurBackgroundCreateDownloadChaptersTask").addEventListener("click", () => createDownloadChaptersTask.style.display = "none");
|
||||||
|
document.querySelector("#blurBackgroundTasksQueuePopup").addEventListener("click", () => downloadTasksPopup.style.display = "none");
|
||||||
|
selectedChapters.addEventListener("keypress", (event) => {
|
||||||
|
if(event.key === "Enter"){
|
||||||
|
DownloadChapterTaskClick();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
publicationDelete.addEventListener("click", () => DeleteTaskClick());
|
||||||
|
createMonitorTaskButton.addEventListener("click", () => {
|
||||||
|
HidePublicationPopup();
|
||||||
|
createMonitorTaskPopup.style.display = "block";
|
||||||
|
});
|
||||||
|
createDownloadChapterTaskButton.addEventListener("click", () => {
|
||||||
|
HidePublicationPopup();
|
||||||
|
OpenDownloadChapterTaskPopup();
|
||||||
|
});
|
||||||
|
publicationTaskStart.addEventListener("click", () => StartTaskClick());
|
||||||
|
searchPublicationQuery.addEventListener("keypress", (event) => {
|
||||||
|
if(event.key === "Enter"){
|
||||||
|
NewSearch();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
GetAvailableNotificationConnectors().then((json) => {
|
|
||||||
json.forEach(connector => {
|
|
||||||
notificationConnectorTypes[connector.Key] = connector.Value;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
GetAvailableLibraryConnectors().then((json) => {
|
GetAvailableControllers()
|
||||||
json.forEach(connector => {
|
.then(json => availableConnectors = json)
|
||||||
libraryConnectorTypes[connector.Key] = connector.Value;
|
.then(json =>
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
GetAvailableControllers().then((json) => {
|
|
||||||
json.forEach(connector => {
|
json.forEach(connector => {
|
||||||
var option = document.createElement('option');
|
var option = document.createElement('option');
|
||||||
option.value = connector;
|
option.value = connector;
|
||||||
option.innerText = connector;
|
option.innerText = connector;
|
||||||
newMangaConnector.appendChild(option);
|
connectorSelect.appendChild(option);
|
||||||
});
|
})
|
||||||
});
|
);
|
||||||
|
|
||||||
UpdateJobs();
|
|
||||||
setInterval(() => {
|
function NewSearch(){
|
||||||
UpdateJobs();
|
//Disable inputs
|
||||||
}, 1000);
|
connectorSelect.disabled = true;
|
||||||
|
searchPublicationQuery.disabled = true;
|
||||||
|
//Waitcursor
|
||||||
|
document.body.style.cursor = "wait";
|
||||||
|
|
||||||
|
//Empty previous results
|
||||||
|
selectPublication.replaceChildren();
|
||||||
|
GetPublicationFromConnector(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
|
||||||
|
connectorSelect.disabled = false;
|
||||||
|
searchPublicationQuery.disabled = false;
|
||||||
|
//Cursor
|
||||||
|
document.body.style.cursor = "initial";
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
Setup();
|
|
||||||
|
//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);
|
||||||
|
var img = document.createElement('img');
|
||||||
|
img.src = `imageCache/${publication.coverFileNameInCache}`;
|
||||||
|
publicationElement.appendChild(img);
|
||||||
|
var info = document.createElement('publication-information');
|
||||||
|
var connectorName = document.createElement('connector-name');
|
||||||
|
connectorName.innerText = connector;
|
||||||
|
connectorName.className = "pill";
|
||||||
|
info.appendChild(connectorName);
|
||||||
|
var publicationName = document.createElement('publication-name');
|
||||||
|
publicationName.innerText = publication.sortName;
|
||||||
|
info.appendChild(publicationName);
|
||||||
|
publicationElement.appendChild(info);
|
||||||
|
if(publications.filter(pub => pub.internalId === publication.internalId) < 1)
|
||||||
|
publications.push(publication);
|
||||||
|
return publicationElement;
|
||||||
|
}
|
||||||
|
|
||||||
|
function AddMonitorTask(){
|
||||||
|
var hours = document.querySelector("#hours").value;
|
||||||
|
var minutes = document.querySelector("#minutes").value;
|
||||||
|
CreateMonitorTask(connectorSelect.value, toEditId, `${hours}:${minutes}:00`, "en");
|
||||||
|
HidePublicationPopup();
|
||||||
|
createMonitorTaskPopup.style.display = "none";
|
||||||
|
selectPublicationPopup.style.display = "none";
|
||||||
|
}
|
||||||
|
|
||||||
|
function OpenDownloadChapterTaskPopup(){
|
||||||
|
selectedChapters.value = "";
|
||||||
|
chapterOutput.replaceChildren();
|
||||||
|
createDownloadChaptersTask.style.display = "block";
|
||||||
|
GetChapters(toEditId, connectorSelect.value, true, "en").then((json) => {
|
||||||
|
var i = 0;
|
||||||
|
json.forEach(chapter => {
|
||||||
|
var chapterDom = document.createElement("div");
|
||||||
|
var indexDom = document.createElement("span");
|
||||||
|
indexDom.className = "index";
|
||||||
|
indexDom.innerText = i++;
|
||||||
|
chapterDom.appendChild(indexDom);
|
||||||
|
|
||||||
|
var volDom = document.createElement("span");
|
||||||
|
volDom.className = "vol";
|
||||||
|
volDom.innerText = chapter.volumeNumber;
|
||||||
|
chapterDom.appendChild(volDom);
|
||||||
|
|
||||||
|
var chDom = document.createElement("span");
|
||||||
|
chDom.className = "ch";
|
||||||
|
chDom.innerText = chapter.chapterNumber;
|
||||||
|
chapterDom.appendChild(chDom);
|
||||||
|
|
||||||
|
var titleDom = document.createElement("span");
|
||||||
|
titleDom.innerText = chapter.name;
|
||||||
|
chapterDom.appendChild(titleDom);
|
||||||
|
chapterOutput.appendChild(chapterDom);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function DownloadChapterTaskClick(){
|
||||||
|
CreateDownloadChaptersTask(connectorSelect.value, toEditId, selectedChapters.value, "en");
|
||||||
|
HidePublicationPopup();
|
||||||
|
createDownloadChaptersTask.style.display = "none";
|
||||||
|
selectPublicationPopup.style.display = "none";
|
||||||
|
}
|
||||||
|
|
||||||
|
function DeleteTaskClick(){
|
||||||
|
taskToDelete = tasks.filter(tTask => tTask.publication.internalId === toEditId)[0];
|
||||||
|
DeleteTask("MonitorPublication", taskToDelete.connectorName, toEditId);
|
||||||
|
HidePublicationPopup();
|
||||||
|
}
|
||||||
|
|
||||||
|
function StartTaskClick(){
|
||||||
|
var toEditTask = tasks.filter(task => task.publication.internalId == toEditId)[0];
|
||||||
|
StartTask("MonitorPublication", toEditTask.connectorName, toEditId);
|
||||||
|
HidePublicationPopup();
|
||||||
|
}
|
||||||
|
|
||||||
function ResetContent(){
|
function ResetContent(){
|
||||||
//Delete everything
|
//Delete everything
|
||||||
@ -91,120 +207,45 @@ function ResetContent(){
|
|||||||
var plus = document.createElement("p");
|
var plus = document.createElement("p");
|
||||||
plus.innerText = "+";
|
plus.innerText = "+";
|
||||||
add.appendChild(plus);
|
add.appendChild(plus);
|
||||||
add.addEventListener("click", () => ShowNewMangaSearch());
|
add.addEventListener("click", () => ShowNewTaskWindow());
|
||||||
tasksContent.appendChild(add);
|
tasksContent.appendChild(add);
|
||||||
}
|
}
|
||||||
|
function ShowPublicationViewerWindow(publicationId, event, add){
|
||||||
function ShowNewMangaSearch(){
|
|
||||||
newMangaTitle.value = "";
|
|
||||||
newMangaPopup.style.display = "block";
|
|
||||||
newMangaResult.replaceChildren();
|
|
||||||
}
|
|
||||||
|
|
||||||
newMangaTitle.addEventListener("keypress", (event) => { if(event.key === "Enter") GetNewMangaItems();})
|
|
||||||
function GetNewMangaItems(){
|
|
||||||
if(newMangaTitle.value.length < 4)
|
|
||||||
return;
|
|
||||||
|
|
||||||
newMangaResult.replaceChildren();
|
|
||||||
newMangaConnector.disabled = true;
|
|
||||||
newMangaTitle.disabled = true;
|
|
||||||
newMangaTranslatedLanguage.disabled = true;
|
|
||||||
GetPublicationFromConnector(newMangaConnector.value, newMangaTitle.value).then((json) => {
|
|
||||||
//console.log(json);
|
|
||||||
if(json.length > 0)
|
|
||||||
newMangaResult.style.display = "flex";
|
|
||||||
json.forEach(result => {
|
|
||||||
var mangaElement = CreateManga(result, newMangaConnector.value)
|
|
||||||
newMangaResult.appendChild(mangaElement);
|
|
||||||
mangaElement.addEventListener("click", (event) => {
|
|
||||||
ShowMangaWindow(null, result, event, true);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
newMangaConnector.disabled = false;
|
|
||||||
newMangaTitle.disabled = false;
|
|
||||||
newMangaTranslatedLanguage.disabled = false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
//Returns a new "Publication" Item to display in the jobs section
|
|
||||||
function CreateManga(manga, connector){
|
|
||||||
var mangaElement = document.createElement('publication');
|
|
||||||
mangaElement.id = GetValidSelector(manga.internalId);
|
|
||||||
var mangaImage = document.createElement('img');
|
|
||||||
mangaImage.src = GetCoverUrl(manga.internalId);
|
|
||||||
mangaElement.appendChild(mangaImage);
|
|
||||||
var info = document.createElement('publication-information');
|
|
||||||
var connectorName = document.createElement('connector-name');
|
|
||||||
connectorName.innerText = connector;
|
|
||||||
connectorName.className = "pill";
|
|
||||||
info.appendChild(connectorName);
|
|
||||||
var mangaName = document.createElement('publication-name');
|
|
||||||
mangaName.innerText = manga.sortName;
|
|
||||||
info.appendChild(mangaName);
|
|
||||||
mangaElement.appendChild(info);
|
|
||||||
return mangaElement;
|
|
||||||
}
|
|
||||||
|
|
||||||
createMonitorJobButton.addEventListener("click", () => {
|
|
||||||
CreateMonitorJob(newMangaConnector.value, selectedManga.internalId, newMangaTranslatedLanguage.value);
|
|
||||||
UpdateJobs();
|
|
||||||
mangaViewerPopup.style.display = "none";
|
|
||||||
});
|
|
||||||
startJobButton.addEventListener("click", () => {
|
|
||||||
StartJob(selectedJob.id);
|
|
||||||
mangaViewerPopup.style.display = "none";
|
|
||||||
});
|
|
||||||
cancelJobButton.addEventListener("click", () => {
|
|
||||||
CancelJob(selectedJob.id);
|
|
||||||
mangaViewerPopup.style.display = "none";
|
|
||||||
});
|
|
||||||
deleteJobButton.addEventListener("click", () => {
|
|
||||||
RemoveJob(selectedJob.id);
|
|
||||||
UpdateJobs();
|
|
||||||
mangaViewerPopup.style.display = "none";
|
|
||||||
});
|
|
||||||
|
|
||||||
function ShowMangaWindow(job, manga, event, add){
|
|
||||||
selectedManga = manga;
|
|
||||||
selectedJob = job;
|
|
||||||
//Show popup
|
//Show popup
|
||||||
mangaViewerPopup.style.display = "block";
|
publicationViewerPopup.style.display = "block";
|
||||||
|
|
||||||
//Set position to mouse-position
|
//Set position to mouse-position
|
||||||
if(event.clientY < window.innerHeight - mangaViewerWindow.offsetHeight)
|
if(event.clientY < window.innerHeight - publicationViewerWindow.offsetHeight)
|
||||||
mangaViewerWindow.style.top = `${event.clientY}px`;
|
publicationViewerWindow.style.top = `${event.clientY}px`;
|
||||||
else
|
else
|
||||||
mangaViewerWindow.style.top = `${event.clientY - mangaViewerWindow.offsetHeight}px`;
|
publicationViewerWindow.style.top = `${event.clientY - publicationViewerWindow.offsetHeight}px`;
|
||||||
|
|
||||||
if(event.clientX < window.innerWidth - mangaViewerWindow.offsetWidth)
|
if(event.clientX < window.innerWidth - publicationViewerWindow.offsetWidth)
|
||||||
mangaViewerWindow.style.left = `${event.clientX}px`;
|
publicationViewerWindow.style.left = `${event.clientX}px`;
|
||||||
else
|
else
|
||||||
mangaViewerWindow.style.left = `${event.clientX - mangaViewerWindow.offsetWidth}px`;
|
publicationViewerWindow.style.left = `${event.clientX - publicationViewerWindow.offsetWidth}px`;
|
||||||
|
|
||||||
//Edit information inside the window
|
//Edit information inside the window
|
||||||
mangaViewerName.innerText = manga.sortName;
|
var publication = publications.filter(pub => pub.internalId === publicationId)[0];
|
||||||
mangaViewerTags.innerText = manga.tags.join(", ");
|
publicationViewerName.innerText = publication.sortName;
|
||||||
mangaViewerDescription.innerText = manga.description;
|
publicationViewerTags.innerText = publication.tags.join(", ");
|
||||||
mangaViewerAuthor.innerText = manga.authors.join(',');
|
publicationViewerDescription.innerText = publication.description;
|
||||||
mangaViewCover.src = GetCoverUrl(manga.internalId);
|
publicationViewerAuthor.innerText = publication.authors.join(',');
|
||||||
toEditId = manga.internalId;
|
pubviewcover.src = `imageCache/${publication.coverFileNameInCache}`;
|
||||||
|
toEditId = publicationId;
|
||||||
|
|
||||||
//Check what action should be listed
|
//Check what action should be listed
|
||||||
if(add){
|
if(add){
|
||||||
createMonitorJobButton.style.display = "initial";
|
createMonitorTaskButton.style.display = "initial";
|
||||||
createDownloadChapterJobButton.style.display = "none";
|
createDownloadChapterTaskButton.style.display = "initial";
|
||||||
cancelJobButton.style.display = "none";
|
publicationDelete.style.display = "none";
|
||||||
startJobButton.style.display = "none";
|
publicationTaskStart.style.display = "none";
|
||||||
deleteJobButton.style.display = "none";
|
|
||||||
}
|
}
|
||||||
else{
|
else{
|
||||||
createMonitorJobButton.style.display = "none";
|
createMonitorTaskButton.style.display = "none";
|
||||||
createDownloadChapterJobButton.style.display = "none";
|
createDownloadChapterTaskButton.style.display = "none";
|
||||||
cancelJobButton.style.display = "initial";
|
publicationDelete.style.display = "initial";
|
||||||
startJobButton.style.display = "initial";
|
publicationTaskStart.style.display = "initial";
|
||||||
deleteJobButton.style.display = "initial";
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -212,8 +253,108 @@ function HidePublicationPopup(){
|
|||||||
publicationViewerPopup.style.display = "none";
|
publicationViewerPopup.style.display = "none";
|
||||||
}
|
}
|
||||||
|
|
||||||
searchBox.addEventListener("keyup", () => FilterResults());
|
function ShowNewTaskWindow(){
|
||||||
//Filter shown jobs
|
selectPublication.replaceChildren();
|
||||||
|
searchPublicationQuery.value = "";
|
||||||
|
selectPublicationPopup.style.display = "flex";
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const fadeIn = [
|
||||||
|
{ opacity: "0" },
|
||||||
|
{ opacity: "1" }
|
||||||
|
];
|
||||||
|
|
||||||
|
const fadeInTiming = {
|
||||||
|
duration: 50,
|
||||||
|
iterations: 1,
|
||||||
|
fill: "forwards"
|
||||||
|
}
|
||||||
|
|
||||||
|
function OpenSettings(){
|
||||||
|
GetSettingsClick();
|
||||||
|
settingsPopup.style.display = "flex";
|
||||||
|
}
|
||||||
|
|
||||||
|
function GetSettingsClick(){
|
||||||
|
settingApiUri.value = "";
|
||||||
|
settingKomgaUrl.value = "";
|
||||||
|
settingKomgaUser.value = "";
|
||||||
|
settingKomgaPass.value = "";
|
||||||
|
settingKomgaConfigured.innerText = "❌";
|
||||||
|
settingKavitaUrl.value = "";
|
||||||
|
settingKavitaUser.value = "";
|
||||||
|
settingKavitaPass.value = "";
|
||||||
|
settingKavitaConfigured.innerText = "❌";
|
||||||
|
settingGotifyUrl.value = "";
|
||||||
|
settingGotifyAppToken.value = "";
|
||||||
|
settingGotifyConfigured.innerText = "❌";
|
||||||
|
settingLunaseaWebhook.value = "";
|
||||||
|
settingLunaseaConfigured.innerText = "❌";
|
||||||
|
|
||||||
|
settingApiUri.placeholder = apiUri;
|
||||||
|
|
||||||
|
GetSettings().then(json => {
|
||||||
|
settingDownloadLocation.innerText = json.downloadLocation;
|
||||||
|
json.libraryManagers.forEach(lm => {
|
||||||
|
if(lm.libraryType == 0){
|
||||||
|
settingKomgaUrl.placeholder = lm.baseUrl;
|
||||||
|
settingKomgaUser.placeholder = "User";
|
||||||
|
settingKomgaPass.placeholder = "***";
|
||||||
|
settingKomgaConfigured.innerText = "✅";
|
||||||
|
} else if(lm.libraryType == 1){
|
||||||
|
settingKavitaUrl.placeholder = lm.baseUrl;
|
||||||
|
settingKavitaUser.placeholder = "User";
|
||||||
|
settingKavitaPass.placeholder = "***";
|
||||||
|
settingKavitaConfigured.innerText = "✅";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
json.notificationManagers.forEach(nm => {
|
||||||
|
if(nm.notificationManagerType == 0){
|
||||||
|
settingGotifyConfigured.innerText = "✅";
|
||||||
|
} else if(nm.notificationManagerType == 1){
|
||||||
|
settingLunaseaConfigured.innerText = "✅";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
GetKomgaTask().then(json => {
|
||||||
|
if(json.length > 0)
|
||||||
|
libraryUpdateTime.value = json[0].reoccurrence;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function UpdateLibrarySettings(){
|
||||||
|
if(settingKomgaUrl.value != "" && settingKomgaUser.value != "" && settingKomgaPass.value != ""){
|
||||||
|
var auth = utf8_to_b64(`${settingKomgaUser.value}:${settingKomgaPass.value}`);
|
||||||
|
console.log(auth);
|
||||||
|
UpdateKomga(settingKomgaUrl.value, auth);
|
||||||
|
}
|
||||||
|
|
||||||
|
if(settingKavitaUrl.value != "" && settingKavitaUser.value != "" && settingKavitaPass.value != ""){
|
||||||
|
UpdateKavita(settingKavitaUrl.value, settingKavitaUser.value, settingKavitaPass.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
if(settingGotifyUrl.value != "" && settingGotifyAppToken.value != ""){
|
||||||
|
UpdateGotify(settingGotifyUrl.value, settingGotifyAppToken.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
if(settingLunaseaWebhook.value != ""){
|
||||||
|
UpdateLunaSea(settingLunaseaWebhook.value);
|
||||||
|
}
|
||||||
|
|
||||||
|
if(settingApiUri.value != ""){
|
||||||
|
apiUri = settingApiUri.value;
|
||||||
|
document.cookie = `apiUri=${apiUri};`;
|
||||||
|
}
|
||||||
|
|
||||||
|
setTimeout(() => GetSettingsClick(), 200);
|
||||||
|
}
|
||||||
|
|
||||||
|
function utf8_to_b64( str ) {
|
||||||
|
return window.btoa(unescape(encodeURIComponent( str )));
|
||||||
|
}
|
||||||
|
|
||||||
function FilterResults(){
|
function FilterResults(){
|
||||||
if(searchBox.value.length > 0){
|
if(searchBox.value.length > 0){
|
||||||
tasksContent.childNodes.forEach(publication => {
|
tasksContent.childNodes.forEach(publication => {
|
||||||
@ -236,248 +377,146 @@ function FilterResults(){
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
settingsCog.addEventListener("click", () => {
|
function ShowTasksQueue(){
|
||||||
OpenSettings();
|
|
||||||
settingsPopup.style.display = "flex";
|
|
||||||
});
|
|
||||||
|
|
||||||
settingKomgaUrl.addEventListener("keypress", (event) => { { if(event.key === "Enter") UpdateSettings(); } });
|
downloadTasksOutput.replaceChildren();
|
||||||
settingKomgaUser.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
GetRunningTasks()
|
||||||
settingKomgaPass.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
.then(json => {
|
||||||
settingKavitaUrl.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
tagTasksRunning.innerText = json.length;
|
||||||
settingKavitaUser.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
json.forEach(task => {
|
||||||
settingKavitaPass.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
if(task.task == 2 || task.task == 4) {
|
||||||
settingGotifyUrl.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
downloadTasksOutput.appendChild(CreateProgressChild(task));
|
||||||
settingGotifyAppToken.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
document.querySelector(`#progress${GetValidSelector(task.taskId)}`).value = task.progress;
|
||||||
settingLunaseaWebhook.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
var finishedHours = task.executionApproximatelyRemaining.split(':')[0];
|
||||||
settingApiUri.addEventListener("keypress", (event) => { if(event.key === "Enter") UpdateSettings(); });
|
var finishedMinutes = task.executionApproximatelyRemaining.split(':')[1];
|
||||||
|
var finishedSeconds = task.executionApproximatelyRemaining.split(':')[2].split('.')[0];
|
||||||
function OpenSettings(){
|
document.querySelector(`#progressStr${GetValidSelector(task.taskId)}`).innerText = `${finishedHours}:${finishedMinutes}:${finishedSeconds}`;
|
||||||
settingGotifyConfigured.innerText = "❌";
|
|
||||||
settingLunaseaConfigured.innerText = "❌";
|
|
||||||
settingKavitaConfigured.innerText = "❌";
|
|
||||||
settingKomgaConfigured.innerText = "❌";
|
|
||||||
settingKomgaUrl.value = "";
|
|
||||||
settingKomgaUser.value = "";
|
|
||||||
settingKomgaPass.value = "";
|
|
||||||
settingKavitaUrl.value = "";
|
|
||||||
settingKavitaUser.value = "";
|
|
||||||
settingKavitaPass.value = "";
|
|
||||||
settingGotifyUrl.value = "";
|
|
||||||
settingGotifyAppToken.value = "";
|
|
||||||
settingLunaseaWebhook.value = "";
|
|
||||||
settingApiUri.value = "";
|
|
||||||
|
|
||||||
GetSettings().then((json) => {
|
|
||||||
//console.log(json);
|
|
||||||
settingDownloadLocation.innerText = json.downloadLocation;
|
|
||||||
settingApiUri.placeholder = apiUri;
|
|
||||||
});
|
|
||||||
GetLibraryConnectors().then((json) => {
|
|
||||||
//console.log(json);
|
|
||||||
json.forEach(connector => {
|
|
||||||
switch(libraryConnectorTypes[connector.libraryType]){
|
|
||||||
case "Kavita":
|
|
||||||
settingKavitaConfigured.innerText = "✅";
|
|
||||||
settingKavitaUrl.placeholder = connector.baseUrl;
|
|
||||||
settingKavitaUser.placeholder = "***";
|
|
||||||
settingKavitaPass.placeholder = "***";
|
|
||||||
break;
|
|
||||||
case "Komga":
|
|
||||||
settingKomgaConfigured.innerText = "✅";
|
|
||||||
settingKomgaUrl.placeholder = connector.baseUrl;
|
|
||||||
settingKomgaUser.placeholder = "***";
|
|
||||||
settingKomgaPass.placeholder = "***";
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
console.log("Unknown type");
|
|
||||||
console.log(connector);
|
|
||||||
break;
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
GetNotificationConnectors().then((json) => {
|
|
||||||
//console.log(json);
|
GetQueue()
|
||||||
json.forEach(connector => {
|
.then(json => {
|
||||||
switch(notificationConnectorTypes[connector.notificationConnectorType]){
|
tagTasksQueued.innerText = json.length;
|
||||||
case "Gotify":
|
json.forEach(task => {
|
||||||
settingGotifyUrl.placeholder = connector.endpoint;
|
downloadTasksOutput.appendChild(CreateProgressChild(task));
|
||||||
settingGotifyAppToken.placeholder = "***";
|
|
||||||
settingGotifyConfigured.innerText = "✅";
|
|
||||||
break;
|
|
||||||
case "LunaSea":
|
|
||||||
settingLunaseaConfigured.innerText = "✅";
|
|
||||||
settingLunaseaWebhook.placeholder = connector.id;
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
console.log("Unknown type");
|
|
||||||
console.log(connector);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
downloadTasksPopup.style.display = "flex";
|
||||||
}
|
}
|
||||||
|
|
||||||
function UpdateSettings(){
|
function CreateProgressChild(task){
|
||||||
if(settingApiUri.value != ""){
|
var child = document.createElement("div");
|
||||||
apiUri = settingApiUri.value;
|
var img = document.createElement('img');
|
||||||
setCookie("apiUri", apiUri);
|
img.src = `imageCache/${task.publication.coverFileNameInCache}`;
|
||||||
Setup();
|
child.appendChild(img);
|
||||||
|
|
||||||
|
var name = document.createElement("span");
|
||||||
|
name.innerText = task.publication.sortName;
|
||||||
|
name.className = "pubTitle";
|
||||||
|
child.appendChild(name);
|
||||||
|
|
||||||
|
|
||||||
|
var progress = document.createElement("progress");
|
||||||
|
progress.id = `progress${GetValidSelector(task.taskId)}`;
|
||||||
|
child.appendChild(progress);
|
||||||
|
|
||||||
|
var progressStr = document.createElement("span");
|
||||||
|
progressStr.innerText = " \t∞";
|
||||||
|
progressStr.className = "progressStr";
|
||||||
|
progressStr.id = `progressStr${GetValidSelector(task.taskId)}`;
|
||||||
|
child.appendChild(progressStr);
|
||||||
|
|
||||||
|
if(task.chapter != undefined){
|
||||||
|
var chapterNumber = document.createElement("span");
|
||||||
|
chapterNumber.className = "chapterNumber";
|
||||||
|
chapterNumber.innerText = `Vol.${task.chapter.volumeNumber} Ch.${task.chapter.chapterNumber}`;
|
||||||
|
child.appendChild(chapterNumber);
|
||||||
|
|
||||||
|
var chapterName = document.createElement("span");
|
||||||
|
chapterName.className = "chapterName";
|
||||||
|
chapterName.innerText = task.chapter.name;
|
||||||
|
child.appendChild(chapterName);
|
||||||
}
|
}
|
||||||
|
|
||||||
if(settingKomgaUrl.value != "" &&
|
|
||||||
settingKomgaUser.value != "" &&
|
|
||||||
settingKomgaPass.value != ""){
|
|
||||||
UpdateKomga(settingKomgaUrl.value, utf8_to_b64(`${settingKomgaUser.value}:${settingKomgaPass.value}`));
|
|
||||||
}
|
|
||||||
|
|
||||||
if(settingKavitaUrl.value != "" &&
|
return child;
|
||||||
settingKavitaUser.value != "" &&
|
|
||||||
settingKavitaPass.value != ""){
|
|
||||||
UpdateKavita(settingKavitaUrl.value, settingKavitaUser.value, settingKavitaPass.value);
|
|
||||||
}
|
|
||||||
|
|
||||||
if(settingGotifyUrl.value != "" &&
|
|
||||||
settingGotifyAppToken.value != ""){
|
|
||||||
UpdateGotify(settingGotifyUrl.value, settingGotifyAppToken.value);
|
|
||||||
}
|
|
||||||
|
|
||||||
if(settingLunaseaWebhook.value != ""){
|
|
||||||
UpdateLunaSea(settingLunaseaWebhook.value);
|
|
||||||
}
|
|
||||||
|
|
||||||
OpenSettings();
|
|
||||||
Setup();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function utf8_to_b64(str) {
|
//Resets the tasks shown
|
||||||
return window.btoa(unescape(encodeURIComponent( str )));
|
ResetContent();
|
||||||
}
|
downloadTasksOutput.replaceChildren();
|
||||||
|
//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));
|
||||||
|
tasksContent.appendChild(publication);
|
||||||
|
tasks.push(task);
|
||||||
|
}));
|
||||||
|
|
||||||
function UpdateJobs(){
|
GetRunningTasks()
|
||||||
GetMonitorJobs().then((json) => {
|
.then(json => {
|
||||||
|
tagTasksRunning.innerText = json.length;
|
||||||
|
json.forEach(task => {
|
||||||
|
downloadTasksOutput.appendChild(CreateProgressChild(task));
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
GetQueue()
|
||||||
|
.then(json => {
|
||||||
|
tagTasksQueued.innerText = json.length;
|
||||||
|
json.forEach(task => {
|
||||||
|
downloadTasksOutput.appendChild(CreateProgressChild(task));
|
||||||
|
});
|
||||||
|
})
|
||||||
|
|
||||||
|
setInterval(() => {
|
||||||
|
//Tasks from API
|
||||||
|
var cTasks = [];
|
||||||
|
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();
|
ResetContent();
|
||||||
//console.log(json);
|
//Add all currenttasks to view
|
||||||
json.forEach(job => {
|
cTasks.forEach(task => {
|
||||||
var mangaView = CreateManga(job.manga, job.mangaConnector.name);
|
var publication = CreatePublication(task.publication, task.connectorName);
|
||||||
mangaView.addEventListener("click", (event) => {
|
publication.addEventListener("click", (event) => ShowPublicationViewerWindow(task.publication.internalId, event, false));
|
||||||
ShowMangaWindow(job, job.manga, event, false);
|
tasksContent.appendChild(publication);
|
||||||
});
|
})
|
||||||
tasksContent.appendChild(mangaView);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
GetWaitingJobs().then((json) => {
|
tasks = cTasks;
|
||||||
jobsQueuedTag.innerText = json.length;
|
|
||||||
|
|
||||||
var nowWaitingJobs = [];
|
|
||||||
|
|
||||||
json.forEach(job => {
|
|
||||||
if(!waitingJobs.includes(GetValidSelector(job.id))){
|
|
||||||
var jobDom = createJob(job);
|
|
||||||
jobStatusWaiting.appendChild(jobDom);
|
|
||||||
}
|
}
|
||||||
nowWaitingJobs.push(GetValidSelector(job.id));
|
|
||||||
});
|
|
||||||
waitingJobs = nowWaitingJobs;
|
|
||||||
});
|
|
||||||
|
|
||||||
jobStatusWaiting.childNodes.forEach(child => {
|
|
||||||
if(!waitingJobs.includes(child.id))
|
|
||||||
jobStatusWaiting.removeChild(child);
|
|
||||||
});
|
|
||||||
|
|
||||||
GetRunningJobs().then((json) => {
|
|
||||||
jobsRunningTag.innerText = json.length;
|
|
||||||
|
|
||||||
var nowRunningJobs = [];
|
|
||||||
|
|
||||||
json.forEach(job => {
|
|
||||||
if(!runningJobs.includes(GetValidSelector(job.id))){
|
|
||||||
var jobDom = createJob(job);
|
|
||||||
jobStatusRunning.appendChild(jobDom);
|
|
||||||
}
|
}
|
||||||
nowRunningJobs.push(GetValidSelector(job.id));
|
);
|
||||||
UpdateJobProgress(job.id);
|
|
||||||
|
GetRunningTasks()
|
||||||
|
.then(json => {
|
||||||
|
tagTasksRunning.innerText = json.length;
|
||||||
});
|
});
|
||||||
|
|
||||||
runningJobs = nowRunningJobs;
|
GetQueue()
|
||||||
|
.then(json => {
|
||||||
|
tagTasksQueued.innerText = json.length;
|
||||||
});
|
});
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
jobStatusRunning.childNodes.forEach(child => {
|
setInterval(() => {
|
||||||
if(!runningJobs.includes(child.id))
|
GetRunningTasks().then((json) => {
|
||||||
jobStatusRunning.removeChild(child);
|
json.forEach(task => {
|
||||||
});
|
if(task.task == 2 || task.task == 4){
|
||||||
}
|
document.querySelector(`#progress${GetValidSelector(task.taskId)}`).value = task.progress;
|
||||||
|
var finishedHours = task.executionApproximatelyRemaining.split(':')[0];
|
||||||
function createJob(jobjson){
|
var finishedMinutes = task.executionApproximatelyRemaining.split(':')[1];
|
||||||
var manga;
|
var finishedSeconds = task.executionApproximatelyRemaining.split(':')[2].split('.')[0];
|
||||||
if(jobjson.chapter != null)
|
document.querySelector(`#progressStr${GetValidSelector(task.taskId)}`).innerText = `${finishedHours}:${finishedMinutes}:${finishedSeconds}`;
|
||||||
manga = jobjson.chapter.parentManga;
|
|
||||||
else if(jobjson.manga != null)
|
|
||||||
manga = jobjson.manga;
|
|
||||||
else return null;
|
|
||||||
|
|
||||||
|
|
||||||
var wrapper = document.createElement("div");
|
|
||||||
wrapper.className = "jobWrapper";
|
|
||||||
wrapper.id = GetValidSelector(jobjson.id);
|
|
||||||
|
|
||||||
var image = document.createElement("img");
|
|
||||||
image.className = "jobImage";
|
|
||||||
image.src = GetCoverUrl(manga.internalId);
|
|
||||||
wrapper.appendChild(image);
|
|
||||||
|
|
||||||
var title = document.createElement("span");
|
|
||||||
title.className = "jobTitle";
|
|
||||||
if(jobjson.chapter != null)
|
|
||||||
title.innerText = `${manga.sortName} - ${jobjson.chapter.fileName}`;
|
|
||||||
else if(jobjson.manga != null)
|
|
||||||
title.innerText = manga.sortName;
|
|
||||||
wrapper.appendChild(title);
|
|
||||||
|
|
||||||
var progressBar = document.createElement("progress");
|
|
||||||
progressBar.className = "jobProgressBar";
|
|
||||||
progressBar.id = `jobProgressBar${GetValidSelector(jobjson.id)}`;
|
|
||||||
wrapper.appendChild(progressBar);
|
|
||||||
|
|
||||||
var progressSpan = document.createElement("span");
|
|
||||||
progressSpan.className = "jobProgressSpan";
|
|
||||||
progressSpan.id = `jobProgressSpan${GetValidSelector(jobjson.id)}`;
|
|
||||||
progressSpan.innerText = "0% 00:00:00";
|
|
||||||
wrapper.appendChild(progressSpan);
|
|
||||||
|
|
||||||
var cancelSpan = document.createElement("span");
|
|
||||||
cancelSpan.className = "jobCancel";
|
|
||||||
cancelSpan.innerText = "Cancel";
|
|
||||||
cancelSpan.addEventListener("click", () => CancelJob(jobjson.id));
|
|
||||||
wrapper.appendChild(cancelSpan);
|
|
||||||
|
|
||||||
return wrapper;
|
|
||||||
}
|
|
||||||
|
|
||||||
function ShowJobQueue(){
|
|
||||||
jobStatusView.style.display = "initial";
|
|
||||||
}
|
|
||||||
|
|
||||||
function UpdateJobProgress(jobId){
|
|
||||||
GetProgress(jobId).then((json) => {
|
|
||||||
var progressBar = document.querySelector(`#jobProgressBar${GetValidSelector(jobId)}`);
|
|
||||||
var progressSpan = document.querySelector(`#jobProgressSpan${GetValidSelector(jobId)}`);
|
|
||||||
if(progressBar != null && json.progress != 0){
|
|
||||||
progressBar.value = json.progress;
|
|
||||||
}
|
|
||||||
if(progressSpan != null){
|
|
||||||
var percentageStr = "0%";
|
|
||||||
var timeleftStr = "00:00:00";
|
|
||||||
if(json.progress != 0){
|
|
||||||
percentageStr = Intl.NumberFormat("en-US", { style: "percent"}).format(json.progress);
|
|
||||||
timeleftStr = json.timeRemaining.split('.')[0];
|
|
||||||
}
|
|
||||||
progressSpan.innerText = `${percentageStr} ${timeleftStr}`;
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
});
|
||||||
|
},500);
|
||||||
|
|
||||||
function GetValidSelector(str){
|
function GetValidSelector(str){
|
||||||
var clean = [...str.matchAll(/[a-zA-Z0-9]*-*_*/g)];
|
var clean = [...str.matchAll(/[a-zA-Z0-9]*-*_*/g)];
|
||||||
|
@ -148,7 +148,7 @@ content {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#settingsPopup{
|
#settingsPopup{
|
||||||
z-index: 300;
|
z-index: 10;
|
||||||
}
|
}
|
||||||
|
|
||||||
#settingsPopup popup-content{
|
#settingsPopup popup-content{
|
||||||
@ -205,7 +205,6 @@ publication{
|
|||||||
margin: 10px 10px;
|
margin: 10px 10px;
|
||||||
padding: 15px 20px;
|
padding: 15px 20px;
|
||||||
position: relative;
|
position: relative;
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
publication::after{
|
publication::after{
|
||||||
@ -306,57 +305,138 @@ popup popup-window popup-content input, select {
|
|||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#newMangaPopup > div {
|
#selectPublicationPopup publication {
|
||||||
z-index: 3;
|
width: 150px;
|
||||||
position: relative;
|
height: 250px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#newMangaPopup > #newMangaPopupSelector {
|
#createTaskPopup {
|
||||||
width: 600px;
|
z-index: 7;
|
||||||
height: 40px;
|
|
||||||
margin: 80px auto 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#newMangaPopup > div > #newMangaConnector, #newMangaTitle, #newMangaTranslatedLanguage {
|
#createTaskPopup input {
|
||||||
margin: 0;
|
height: 30px;
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#createMonitorTaskPopup, #createDownloadChaptersTask {
|
||||||
|
z-index: 9;
|
||||||
|
}
|
||||||
|
|
||||||
|
#createMonitorTaskPopup input[type="number"] {
|
||||||
|
width: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#createDownloadChaptersTask popup-content {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
#createDownloadChaptersTask popup-content > * {
|
||||||
|
margin: 3px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#createDownloadChaptersTask #chapterOutput {
|
||||||
|
max-height: 50vh;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
#createDownloadChaptersTask #chapterOutput .index{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
height: 40px;
|
width: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#newMangaPopup #newMangaConnector {
|
#createDownloadChaptersTask #chapterOutput .index::after{
|
||||||
width: 100px;
|
content: ':';
|
||||||
padding: 0 0 0 5px;
|
|
||||||
border-radius: 5px 0 0 5px;
|
|
||||||
border: 0;
|
|
||||||
border-right: 1px solid darkgray;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#newMangaPopup #newMangaTitle{
|
#createDownloadChaptersTask #chapterOutput .vol::before{
|
||||||
width: 445px;
|
content: 'Vol.';
|
||||||
padding: 0 5px 0 5px;
|
|
||||||
border: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#newMangaPopup #newMangaTranslatedLanguage {
|
#createDownloadChaptersTask #chapterOutput .vol{
|
||||||
|
display: inline-block;
|
||||||
width: 45px;
|
width: 45px;
|
||||||
border-radius: 0 5px 5px 0;
|
|
||||||
border: 0;
|
|
||||||
border-left: 1px solid darkgray;
|
|
||||||
margin-left: -5px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#newMangaResult {
|
#createDownloadChaptersTask #chapterOutput .ch::before{
|
||||||
display: none;
|
content: 'Ch.';
|
||||||
flex-direction: row;
|
}
|
||||||
justify-content: flex-start;
|
|
||||||
margin: 5px auto 0;
|
#createDownloadChaptersTask #chapterOutput .ch {
|
||||||
border-radius: 5px;
|
display: inline-block;
|
||||||
padding: 5px;
|
width: 60px;
|
||||||
width: min-content;
|
}
|
||||||
max-width: 98%;
|
|
||||||
max-height: 400px;
|
#downloadTasksPopup popup-window {
|
||||||
overflow-x: scroll;
|
left: 0;
|
||||||
overflow-y: hidden;
|
top: 80px;
|
||||||
|
margin: 0 0 0 10px;
|
||||||
|
height: calc(100vh - 140px);
|
||||||
|
width: 400px;
|
||||||
|
max-width: 95vw;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: start;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div {
|
||||||
|
display: block;
|
||||||
|
height: 80px;
|
||||||
|
position: relative;
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div > img {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
width: 60px;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div > span {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
width: max-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div > .pubTitle {
|
||||||
|
left: 70px;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div > .chapterName {
|
||||||
|
left: 70px;
|
||||||
|
top: 28pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div > .chapterNumber {
|
||||||
|
left: 70px;
|
||||||
|
top: 14pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div > progress {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
left: 150px;
|
||||||
|
bottom: 0;
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#downloadTasksPopup popup-content > div > .progressStr {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
left: 70px;
|
||||||
|
bottom: 0;
|
||||||
|
width: 70px;
|
||||||
}
|
}
|
||||||
|
|
||||||
blur-background {
|
blur-background {
|
||||||
@ -364,10 +444,18 @@ blur-background {
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
background: rgba(245, 169, 184, 0.58);
|
background-color: black;
|
||||||
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
|
opacity: 0.5;
|
||||||
backdrop-filter: blur(4.5px);
|
}
|
||||||
-webkit-backdrop-filter: blur(4.5px);
|
|
||||||
|
#taskSelectOutput{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: start;
|
||||||
|
align-content: start;
|
||||||
|
max-height: 70vh;
|
||||||
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
#publicationViewerPopup{
|
#publicationViewerPopup{
|
||||||
@ -376,7 +464,7 @@ blur-background {
|
|||||||
|
|
||||||
publication-viewer{
|
publication-viewer{
|
||||||
display: block;
|
display: block;
|
||||||
width: 460px;
|
width: 450px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 200px;
|
top: 200px;
|
||||||
left: 400px;
|
left: 400px;
|
||||||
@ -471,10 +559,6 @@ publication-viewer publication-information publication-interactions publication-
|
|||||||
color: red;
|
color: red;
|
||||||
}
|
}
|
||||||
|
|
||||||
publication-view publication-information publication-interactions publication-canceltask {
|
|
||||||
color: yellow;
|
|
||||||
}
|
|
||||||
|
|
||||||
publication-viewer publication-information publication-interactions publication-add {
|
publication-viewer publication-information publication-interactions publication-add {
|
||||||
color: limegreen;
|
color: limegreen;
|
||||||
}
|
}
|
||||||
@ -517,122 +601,3 @@ footer-tag-popup::before{
|
|||||||
bottom: -17px;
|
bottom: -17px;
|
||||||
border-radius: 0 0 0 5px;
|
border-radius: 0 0 0 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#loaderdiv {
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 200;
|
|
||||||
}
|
|
||||||
|
|
||||||
#loader {
|
|
||||||
border: 16px solid transparent;
|
|
||||||
border-top: 16px solid var(--secondary-color);
|
|
||||||
border-bottom: 16px solid var(--primary-color);
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 120px;
|
|
||||||
height: 120px;
|
|
||||||
animation: spin 2s linear infinite;
|
|
||||||
position: absolute;
|
|
||||||
left: calc(50% - 60px);
|
|
||||||
top: calc(50% - 120px);
|
|
||||||
z-index: 201;
|
|
||||||
}
|
|
||||||
|
|
||||||
#loaderText {
|
|
||||||
position: relative;
|
|
||||||
margin: 0 auto;
|
|
||||||
top: calc(50% + 80px);
|
|
||||||
z-index: 201;
|
|
||||||
text-align: center;
|
|
||||||
color: var(--second-background-color);
|
|
||||||
font-size: 20pt;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes spin {
|
|
||||||
0% { transform: rotate(0deg); }
|
|
||||||
100% { transform: rotate(360deg); }
|
|
||||||
}
|
|
||||||
|
|
||||||
#jobStatusView {
|
|
||||||
z-index: 50;
|
|
||||||
}
|
|
||||||
|
|
||||||
#jobStatusView > popup-window {
|
|
||||||
top: 80px;
|
|
||||||
width: 50%;
|
|
||||||
max-height: calc(100% - 140px);
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
#jobStatusView > popup-window > div {
|
|
||||||
overflow-y: scroll;
|
|
||||||
overflow-x: hidden;
|
|
||||||
width: 50%;
|
|
||||||
margin: 0;
|
|
||||||
max-height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#jobStatusView > popup-window > div > div {
|
|
||||||
overflow-x: hidden;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
flex-wrap: nowrap;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jobWrapper {
|
|
||||||
width: 90%;
|
|
||||||
margin: 2px 5%;
|
|
||||||
height: 100px;
|
|
||||||
position: relative;
|
|
||||||
flex-shrink: 0;
|
|
||||||
background-color: rgba(187,187,187,0.4);
|
|
||||||
border-radius: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jobWrapper > .jobImage {
|
|
||||||
height: 90%;
|
|
||||||
width: 20%;
|
|
||||||
left: 5px;
|
|
||||||
object-fit: contain;
|
|
||||||
position: absolute;
|
|
||||||
top: 5%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jobWrapper > .jobTitle {
|
|
||||||
position: absolute;
|
|
||||||
left: calc(20% + 10px);
|
|
||||||
top: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jobWrapper > .jobProgressBar {
|
|
||||||
position: absolute;
|
|
||||||
left: calc(20% + 10px);
|
|
||||||
bottom: calc(12pt + 10px);
|
|
||||||
width: calc(80% - 20px);
|
|
||||||
height: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jobWrapper > .jobProgressSpan {
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
bottom: calc(12pt + 20px);
|
|
||||||
width: 60%;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jobWrapper > .jobCancel {
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
bottom: 5px;
|
|
||||||
font-size: 12pt;
|
|
||||||
color: var(--secondary-color);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
@ -1,7 +1,7 @@
|
|||||||
version: '3'
|
version: '3'
|
||||||
services:
|
services:
|
||||||
tranga-api:
|
tranga-api:
|
||||||
image: glax/tranga-api:cuttingedge
|
image: glax/tranga-api:latest
|
||||||
container_name: tranga-api
|
container_name: tranga-api
|
||||||
volumes:
|
volumes:
|
||||||
- ./tranga:/usr/share/Tranga-API #1 when replacing ./tranga replace #2 with same value
|
- ./tranga:/usr/share/Tranga-API #1 when replacing ./tranga replace #2 with same value
|
||||||
@ -10,7 +10,7 @@ services:
|
|||||||
- "6531:6531"
|
- "6531:6531"
|
||||||
restart: unless-stopped
|
restart: unless-stopped
|
||||||
tranga-website:
|
tranga-website:
|
||||||
image: glax/tranga-website:cuttingedge
|
image: glax/tranga-website:latest
|
||||||
container_name: tranga-website
|
container_name: tranga-website
|
||||||
volumes:
|
volumes:
|
||||||
- ./tranga/imageCache:/usr/share/nginx/html/imageCache:ro #2 when replacing Point to same value as #1/imageCache
|
- ./tranga/imageCache:/usr/share/nginx/html/imageCache:ro #2 when replacing Point to same value as #1/imageCache
|
||||||
|
Loading…
Reference in New Issue
Block a user