glax/Tranga-Website
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Compare commits

base: glax:9a52262e2b5cfac74a8b5d45e8a052ebf5b6d9bc
Branches Tags
glax:master
glax:cuttingedge
glax:frontend-v2
glax:dev
..
compare: glax:6c209d0f9dab7060b237c26fc1cabebf653f59e8
Branches Tags
glax:cuttingedge
glax:master
glax:frontend-v2
glax:dev

No commits in common. "9a52262e2b5cfac74a8b5d45e8a052ebf5b6d9bc" and "6c209d0f9dab7060b237c26fc1cabebf653f59e8" have entirely different histories.
9a52262e2b ... 6c209d0f9d

4 changed files with 40 additions and 76 deletions
Show Stats Expand all files Collapse all files

5
Website/apiConnector.js
View File

@ -177,8 +177,3 @@ function RemoveJob(jobId){
var uri = `${apiUri}/Jobs?jobId=${jobId}`; var uri = `${apiUri}/Jobs?jobId=${jobId}`;
DeleteData(uri); DeleteData(uri);
} }
function CancelJob(jobId){
var uri = `${apiUri}/Jobs/Cancel?jobId=${jobId}`;
PostData(uri);
}

33
Website/index.html
View File

@ -27,8 +27,8 @@
<publication onclick="ShowNewMangaSearch()"> <publication onclick="ShowNewMangaSearch()">
<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>
@ -93,18 +93,19 @@
<publication-viewer> <publication-viewer>
<img id="pubviewcover" src="media/cover.jpg" alt="cover"> <img id="pubviewcover" src="media/cover.jpg" alt="cover">
<publication-information> <publication-information>
<publication-name id="publicationViewerName">Best Manga there is</publication-name> <publication-name id="publicationViewerName">Tensei Pandemic</publication-name>
<publication-tags id="publicationViewerTags">A Manga</publication-tags> <publication-tags id="publicationViewerTags"></publication-tags>
<publication-author id="publicationViewerAuthor">Glax</publication-author> <publication-author id="publicationViewerAuthor">Imamura Hinata</publication-author>
<publication-description id="publicationViewerDescription"> <publication-description id="publicationViewerDescription">Imamura Hinata is a high school boy with a cute appearance.
An interesting description. The description is very intriguing, yet wholesome. 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-description>
<publication-interactions> <publication-interactions>
<publication-starttask id="startJobButton">Start Job ▶️</publication-starttask> <publication-starttask>Start Task ▶️</publication-starttask>
<publication-canceltask id="cancelJobButton">Cancel Job ❌</publication-canceltask> <publication-delete>Delete Task ❌</publication-delete>
<publication-delete id="deleteJobButton">Delete Job 🗑️</publication-delete> <publication-add id="createMonitorTaskButton">Monitor ➕</publication-add>
<publication-add id="createMonitorJobButton">Monitor ➕</publication-add> <publication-add id="createDownloadChapterTaskButton">Download Chapter ➕</publication-add>
<publication-add id="createDownloadChapterJobButton">Download Chapter 📥</publication-add>
</publication-interactions> </publication-interactions>
</publication-information> </publication-information>
</publication-viewer> </publication-viewer>
@ -112,11 +113,11 @@
</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>

74
Website/interaction.js
View File

@ -2,17 +2,13 @@
let notificationConnectorTypes = []; let notificationConnectorTypes = [];
let libraryConnectorTypes = []; let libraryConnectorTypes = [];
let selectedManga; let selectedManga;
let selectedJob;
const searchBox = document.querySelector("#searchbox"); const searchBox = document.querySelector("#searchbox");
const settingsPopup = document.querySelector("#settingsPopup"); const settingsPopup = document.querySelector("#settingsPopup");
const settingsCog = document.querySelector("#settingscog"); const settingsCog = document.querySelector("#settingscog");
const tasksContent = document.querySelector("content"); const tasksContent = document.querySelector("content");
const createMonitorTaskButton = document.querySelector("#createMonitoJobButton"); const createMonitorTaskButton = document.querySelector("#createMonitorTaskButton");
const createDownloadChapterTaskButton = document.querySelector("#createDownloadChapterJobButton"); const createDownloadChapterTaskButton = document.querySelector("#createDownloadChapterTaskButton");
const startJobButton = document.querySelector("#startJobButton");
const cancelJobButton = document.querySelector("#cancelJobButton");
const deleteJobButton = document.querySelector("#deleteJobButton");
const mangaViewerPopup = document.querySelector("#publicationViewerPopup"); const mangaViewerPopup = document.querySelector("#publicationViewerPopup");
const mangaViewerWindow = document.querySelector("publication-viewer"); const mangaViewerWindow = document.querySelector("publication-viewer");
const mangaViewerDescription = document.querySelector("#publicationViewerDescription"); const mangaViewerDescription = document.querySelector("#publicationViewerDescription");
@ -20,6 +16,8 @@ const mangaViewerName = document.querySelector("#publicationViewerName");
const mangaViewerTags = document.querySelector("#publicationViewerTags"); const mangaViewerTags = document.querySelector("#publicationViewerTags");
const mangaViewerAuthor = document.querySelector("#publicationViewerAuthor"); const mangaViewerAuthor = document.querySelector("#publicationViewerAuthor");
const mangaViewCover = document.querySelector("#pubviewcover"); const mangaViewCover = 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");
@ -39,8 +37,6 @@ const newMangaPopup = document.querySelector("#newMangaPopup");
const newMangaConnector = document.querySelector("#newMangaConnector"); const newMangaConnector = document.querySelector("#newMangaConnector");
const newMangaTitle = document.querySelector("#newMangaTitle"); const newMangaTitle = document.querySelector("#newMangaTitle");
const newMangaResult = document.querySelector("#newMangaResult"); const newMangaResult = document.querySelector("#newMangaResult");
const jobsRunningTag = document.querySelector("#jobsRunningTag");
const jobsQueuedTag = document.querySelector("#jobsQueuedTag");
function Setup(){ function Setup(){
GetAvailableNotificationConnectors().then((json) => { GetAvailableNotificationConnectors().then((json) => {
@ -103,7 +99,7 @@ function GetNewMangaItems(){
var mangaElement = CreateManga(result, newMangaConnector.value) var mangaElement = CreateManga(result, newMangaConnector.value)
newMangaResult.appendChild(mangaElement); newMangaResult.appendChild(mangaElement);
mangaElement.addEventListener("click", (event) => { mangaElement.addEventListener("click", (event) => {
ShowMangaWindow(null, result, event, true); ShowMangaWindow(result, event, true);
}); });
}); });
@ -131,28 +127,17 @@ function CreateManga(manga, connector){
return mangaElement; return mangaElement;
} }
createMonitorJobButton.addEventListener("click", () => { createMonitorTaskButton.addEventListener("click", () => {
NewMonitorJob();
mangaViewerPopup.style.display = "none";
});
function NewMonitorJob(){
CreateMonitorJob(newMangaConnector.value, selectedManga.internalId); CreateMonitorJob(newMangaConnector.value, selectedManga.internalId);
UpdateJobs(); 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){ function ShowMangaWindow(manga, event, add){
selectedManga = manga; selectedManga = manga;
selectedJob = job;
//Show popup //Show popup
mangaViewerPopup.style.display = "block"; mangaViewerPopup.style.display = "block";
@ -177,18 +162,16 @@ function ShowMangaWindow(job, manga, event, add){
//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 = "initial"; 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";
} }
} }
@ -197,6 +180,7 @@ function HidePublicationPopup(){
} }
searchBox.addEventListener("keyup", () => FilterResults()); searchBox.addEventListener("keyup", () => FilterResults());
//Filter shown jobs //Filter shown jobs
function FilterResults(){ function FilterResults(){
if(searchBox.value.length > 0){ if(searchBox.value.length > 0){
@ -345,25 +329,13 @@ setInterval(() => {
function UpdateJobs(){ function UpdateJobs(){
GetMonitorJobs().then((json) => { GetMonitorJobs().then((json) => {
ResetContent(); ResetContent();
//console.log(json); console.log(json);
json.forEach(job => { json.forEach(job => {
var mangaView = CreateManga(job.manga, job.mangaConnector.name); var mangaView = CreateManga(job.manga, job.mangaConnector.name);
mangaView.addEventListener("click", (event) => { mangaView.addEventListener("click", (event) => {
ShowMangaWindow(job, job.manga, event, false); ShowMangaWindow(job.manga, event, false);
}); });
tasksContent.appendChild(mangaView); tasksContent.appendChild(mangaView);
}); });
}); });
GetRunningJobs().then((json) => {
console.log("Running");
console.log(json);
jobsRunningTag.innerText = json.length;
});
GetWaitingJobs().then((json) => {
console.log("Waiting");
console.log(json);
jobsQueuedTag.innerText = json.length;
});
} }

4
Website/style.css
View File

@ -462,10 +462,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;
} }