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

Added api calls for setting css stylesheet

Browse Source
This commit is contained in:
db-2001 2023-10-26 23:23:08 -04:00
parent 7e6ea37d14
commit 5abebcf3b5
5 changed files with 28 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
Website/apiConnector.js
View File

@ -163,6 +163,11 @@ function UpdateDownloadLocation(downloadLocation){
PostData(uri); PostData(uri);
} }
function ChangeStyleSheet(sheet){
var uri = `${apiUri}/Settings/ChangeStyleSheet?styleSheet=${sheet}`;
PostData(uri);
}
function UpdateKomga(komgaUrl, komgaAuth){ function UpdateKomga(komgaUrl, komgaAuth){
var uri = `${apiUri}/LibraryConnectors/Update?libraryConnector=Komga&komgaUrl=${komgaUrl}&komgaAuth=${komgaAuth}`; var uri = `${apiUri}/LibraryConnectors/Update?libraryConnector=Komga&komgaUrl=${komgaUrl}&komgaAuth=${komgaAuth}`;
PostData(uri); PostData(uri);

6
Website/index.html
View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Tranga</title> <title>Tranga</title>
<link rel="stylesheet" href="style_mangahover.css"> <link id='pagestyle' rel="stylesheet" href="styles/style_default.css">
<link rel="icon" type="image/x-icon" href="favicon.ico"> <link rel="icon" type="image/x-icon" href="favicon.ico">
</head> </head>
<body> <body>
@ -91,6 +91,10 @@
<div>Configured: <span id="lunaseaConfigured">✅❌</span></div> <div>Configured: <span id="lunaseaConfigured">✅❌</span></div>
<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>
<input type="checkbox" id="mangaHoverCheckbox" name="css-style" value="style_mangahover.css">
<label for="css-style"> Show manga titles and sources on hover</label><br>
</div>
<div> <div>
<input type="submit" value="Update" onclick="UpdateSettings()"> <input type="submit" value="Update" onclick="UpdateSettings()">
</div> </div>

19
Website/interaction.js
View File

@ -37,6 +37,7 @@ 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 settingMangaHoverCheckbox = document.querySelector("#mangaHoverCheckbox");
const newMangaPopup = document.querySelector("#newMangaPopup"); 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");
@ -271,11 +272,19 @@ function OpenSettings(){
settingGotifyAppToken.value = ""; settingGotifyAppToken.value = "";
settingLunaseaWebhook.value = ""; settingLunaseaWebhook.value = "";
settingApiUri.value = ""; settingApiUri.value = "";
settingMangaHoverCheckbox.checked = false;
GetSettings().then((json) => { GetSettings().then((json) => {
//console.log(json); //console.log(json);
settingDownloadLocation.innerText = json.downloadLocation; settingDownloadLocation.innerText = json.downloadLocation;
settingApiUri.placeholder = apiUri; settingApiUri.placeholder = apiUri;
if (json.styleSheet == 'default') {
settingMangaHoverCheckbox.checked = false;
document.getElementById('pagestyle').setAttribute('href', 'styles/style_default.css');
} else {
settingMangaHoverCheckbox.checked = true;
document.getElementById('pagestyle').setAttribute('href', 'styles/style_mangahover.css');
}
}); });
GetLibraryConnectors().then((json) => { GetLibraryConnectors().then((json) => {
//console.log(json); //console.log(json);
@ -329,6 +338,15 @@ function UpdateSettings(){
Setup(); Setup();
} }
// If the checkbox is checked, set the style to style_mangahover.css and
if (document.getElementById("mangaHoverCheckbox").checked == true){
ChangeStyleSheet('hover')
console.log('Changing theme to mangahover')
} else {
ChangeStyleSheet('default');
console.log('Changing theme to default')
}
if(settingKomgaUrl.value != "" && if(settingKomgaUrl.value != "" &&
settingKomgaUser.value != "" && settingKomgaUser.value != "" &&
settingKomgaPass.value != ""){ settingKomgaPass.value != ""){
@ -373,7 +391,6 @@ function UpdateJobs(){
monitoringJobsCount = json.length; monitoringJobsCount = json.length;
} }
}); });
GetWaitingJobs().then((json) => { GetWaitingJobs().then((json) => {
jobsQueuedTag.innerText = json.length; jobsQueuedTag.innerText = json.length;

0
Website/style_default.css → Website/styles/style_default.css
View File

0
Website/style_mangahover.css → Website/styles/style_mangahover.css
View File