mirror of
https://github.com/hrfee/jfa-go.git
synced 2024-11-12 21:30:10 +00:00
Compare commits
No commits in common. "563888c5e796bc27eb7d93a183fee07e735b10c3" and "a3f5396211e394ce161a325243b1f6cbc0165e1b" have entirely different histories.
563888c5e7
...
a3f5396211
11
api.go
11
api.go
@ -667,9 +667,6 @@ func (app *appContext) DeleteProfile(gc *gin.Context) {
|
||||
gc.BindJSON(&req)
|
||||
name := req.Name
|
||||
if _, ok := app.storage.profiles[name]; ok {
|
||||
if app.storage.defaultProfile == name {
|
||||
app.storage.defaultProfile = ""
|
||||
}
|
||||
delete(app.storage.profiles, name)
|
||||
}
|
||||
app.storage.storeProfiles()
|
||||
@ -1100,12 +1097,15 @@ func (app *appContext) GetConfig(gc *gin.Context) {
|
||||
}
|
||||
}
|
||||
s := resp.Sections["ui"].Settings["language"]
|
||||
s.Options = app.lang.langOptions
|
||||
s.Value = app.lang.langOptions[app.lang.chosenIndex]
|
||||
resp.Sections["ui"].Settings["language"] = s
|
||||
for sectName, section := range resp.Sections {
|
||||
for settingName, setting := range section.Settings {
|
||||
val := app.config.Section(sectName).Key(settingName)
|
||||
s := resp.Sections[sectName].Settings[settingName]
|
||||
switch setting.Type {
|
||||
case "text", "email", "select", "password":
|
||||
case "text", "email", "select":
|
||||
s.Value = val.MustString("")
|
||||
case "number":
|
||||
s.Value = val.MustInt(0)
|
||||
@ -1115,9 +1115,6 @@ func (app *appContext) GetConfig(gc *gin.Context) {
|
||||
resp.Sections[sectName].Settings[settingName] = s
|
||||
}
|
||||
}
|
||||
s.Options = app.lang.langOptions
|
||||
s.Value = app.lang.langOptions[app.lang.chosenIndex]
|
||||
resp.Sections["ui"].Settings["language"] = s
|
||||
gc.JSON(200, resp)
|
||||
}
|
||||
|
||||
|
||||
@ -81,8 +81,9 @@
|
||||
"requires_restart": true,
|
||||
"type": "select",
|
||||
"options": [
|
||||
"Bootstrap (Light)",
|
||||
"Jellyfin (Dark)",
|
||||
"Default (Light)"
|
||||
"Custom CSS"
|
||||
],
|
||||
"value": "Jellyfin (Dark)",
|
||||
"description": "Default appearance for all users."
|
||||
@ -178,6 +179,14 @@
|
||||
"value": "Your account has been created. Click below to continue to Jellyfin.",
|
||||
"description": "Displayed when a user creates an account"
|
||||
},
|
||||
"bs5": {
|
||||
"name": "Use Bootstrap 5",
|
||||
"required": false,
|
||||
"requires_restart": true,
|
||||
"type": "bool",
|
||||
"value": false,
|
||||
"description": "Use the Bootstrap 5 Alpha. Looks better and removes the need for jQuery, so the page should load faster."
|
||||
},
|
||||
"url_base": {
|
||||
"name": "URL Base",
|
||||
"required": false,
|
||||
@ -676,6 +685,14 @@
|
||||
"value": "",
|
||||
"description": "Location of stored user profiles (encompasses template and configuration and displayprefs) (json)"
|
||||
},
|
||||
"custom_css": {
|
||||
"name": "Custom CSS",
|
||||
"required": false,
|
||||
"requires_restart": true,
|
||||
"type": "text",
|
||||
"value": "",
|
||||
"description": "Location of custom bootstrap CSS."
|
||||
},
|
||||
"html_templates": {
|
||||
"name": "Custom HTML Template Directory",
|
||||
"required": false,
|
||||
|
||||
14
css/base.css
14
css/base.css
@ -68,10 +68,6 @@
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.ml-half {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
.mr-1 {
|
||||
margin-right: 1rem;
|
||||
}
|
||||
@ -100,10 +96,6 @@
|
||||
align-items: top;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.flex-expand {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -216,12 +208,6 @@ sup.\~critical, .text-critical {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.ellipsis {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.no-pad {
|
||||
padding: 0px 0px 0px 0px;
|
||||
}
|
||||
|
||||
@ -40,22 +40,12 @@
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.modal-content.wide {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.modal-shown .modal-content {
|
||||
animation: modal-content-show 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
.modal-content.wide {
|
||||
width: 75%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 400px) {
|
||||
.modal-content, .modal-content.wide {
|
||||
.modal-content {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="{{ .cssClass }}">
|
||||
<html lang="en" class="light-theme">
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="css/base.css">
|
||||
|
||||
@ -101,17 +101,17 @@
|
||||
</form>
|
||||
</div>
|
||||
<div id="modal-restart" class="modal">
|
||||
<div class="modal-content card ~critical !low">
|
||||
<div class="modal-content card ~critical !normal">
|
||||
<span class="heading">Restart needed <span class="modal-close">×</span></span>
|
||||
<p class="content pb-1">A restart is needed to apply some settings you changed. Do it now or later?</p>
|
||||
<div class="fr">
|
||||
<span class="button ~info !normal" id="settings-apply-no-restart">Apply, restart later</span>
|
||||
<span class="button ~critical !normal" id="settings-apply-restart">Apply & restart</span>
|
||||
<span class="button ~info !normal">Apply, restart later</span>
|
||||
<span class="button ~critical !normal">Apply & restart</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="modal-refresh" class="modal">
|
||||
<div class="modal-content card ~neutral !normal">
|
||||
<div class="modal-content card ~urge !normal">
|
||||
<span class="heading">Settings applied.</span>
|
||||
<p class="content">Refresh the page in a few seconds.</p>
|
||||
</div>
|
||||
@ -132,51 +132,6 @@
|
||||
</label>
|
||||
</form>
|
||||
</div>
|
||||
<div id="modal-user-profiles" class="modal">
|
||||
<div class="modal-content wide card">
|
||||
<span class="heading">User profiles <span class="modal-close">×</span></span>
|
||||
<p class="support lg">Profiles are applied to users when they create an account. A profile includes library access rights and homescreen layout.</p>
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Default</th>
|
||||
<th>From</th>
|
||||
<th>Libraries</th>
|
||||
<th><span class="button ~neutral !high" id="button-profile-create">Create</span></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="table-profiles">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="modal-add-profile" class="modal">
|
||||
<form class="modal-content card" id="form-add-profile" href="">
|
||||
<span class="heading">Add profile <span class="modal-close">×</span></span>
|
||||
<p class="content">Create a Jellyfin user and configure it. Select it here, and when this profile is applied to an invite, new users will be created with its settings.</p>
|
||||
<label>
|
||||
<span class="supra">Profile Name </span>
|
||||
<input type="text" class="field input ~neutral !high mt-half mb-1" placeholder="Name" id="add-profile-name">
|
||||
<label>
|
||||
<span class="supra">User</span>
|
||||
<div class="select ~neutral !normal mt-half mb-1">
|
||||
<select id="add-profile-user">
|
||||
</select>
|
||||
</div>
|
||||
</label>
|
||||
<label class="switch mb-1">
|
||||
<input type="checkbox" id="add-profile-homescreen" checked>
|
||||
<span>Store homescreen layout</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="submit" class="unfocused">
|
||||
<span class="button ~urge !normal full-width center supra submit">Create</span>
|
||||
</label>
|
||||
</form>
|
||||
</div>
|
||||
<div id="notification-box"></div>
|
||||
<div class="page-container max-w-screen-lg px-6 py-4 mx-auto lg:mx-auto md:py-8">
|
||||
<div class="mb-1">
|
||||
@ -275,18 +230,17 @@
|
||||
</div>
|
||||
</div>
|
||||
<div id="settingsTab" class="unfocused">
|
||||
<div class="card ~neutral !low settings overflow">
|
||||
<div class="card ~neutral !low settings">
|
||||
<span class="heading">Settings</span>
|
||||
<div class="fr">
|
||||
<span class="button ~neutral !normal unfocused" id="settings-save">Save</span>
|
||||
<span class="button ~neutral !normal" id="accounts-add-user">Save</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="card ~neutral !normal col" id="settings-sidebar">
|
||||
<aside class="aside sm ~info mb-half">Note: <span class="badge ~critical">*</span> indicates a required field, <span class="badge ~info">R</span> indicates changes require a restart.</aside>
|
||||
<span class="button ~neutral !low settings-section-button mb-half" id="setting-about"><span class="flex">About <i class="ri-information-line ml-half"></i></span></span>
|
||||
<span class="button ~neutral !low settings-section-button mb-half" id="setting-profiles"><span class="flex">User profiles <i class="ri-user-line ml-half"></i></span></span>
|
||||
<aside class="aside sm ~info mb-half">Note: <span class="badge ~critical">*</span> indicates a required field, <span class="badge ~critical">R</span> indicates changes require a restart.</aside>
|
||||
<span class="button ~neutral !low settings-section-button mb-half" id="setting-about">About</span>
|
||||
</div>
|
||||
<div class="card ~neutral !normal col overflow" id="settings-panel"></div>
|
||||
<div class="card ~neutral !normal col" id="settings-panel"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="{{ .cssClass }}">
|
||||
<html lang="en" class="light-theme">
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="css/base.css">
|
||||
{{ template "header.html" . }}
|
||||
|
||||
22
main.go
22
main.go
@ -51,7 +51,8 @@ type appContext struct {
|
||||
configBase settings
|
||||
dataPath string
|
||||
localPath string
|
||||
cssClass string
|
||||
cssFile string
|
||||
bsVersion int
|
||||
jellyfinLogin bool
|
||||
users []User
|
||||
invalidTokens []string
|
||||
@ -361,6 +362,14 @@ func start(asDaemon, firstCall bool) {
|
||||
|
||||
app.debug.Printf("Loaded config file \"%s\"", app.configPath)
|
||||
|
||||
if app.config.Section("ui").Key("bs5").MustBool(false) {
|
||||
app.cssFile = "bs5-jf.css"
|
||||
app.bsVersion = 5
|
||||
} else {
|
||||
app.cssFile = "bs4-jf.css"
|
||||
app.bsVersion = 4
|
||||
}
|
||||
|
||||
app.debug.Println("Loading storage")
|
||||
|
||||
app.storage.invite_path = app.config.Section("files").Key("invites").String()
|
||||
@ -411,15 +420,14 @@ func start(asDaemon, firstCall bool) {
|
||||
json.Unmarshal(configBase, &app.configBase)
|
||||
|
||||
themes := map[string]string{
|
||||
"Jellyfin (Dark)": "dark-theme",
|
||||
"Default (Light)": "light-theme",
|
||||
}
|
||||
if app.config.Section("ui").Key("theme").String() == "Bootstrap (Light)" {
|
||||
app.config.Section("ui").Key("theme").SetValue("Default (Light)")
|
||||
"Jellyfin (Dark)": fmt.Sprintf("bs%d-jf.css", app.bsVersion),
|
||||
"Bootstrap (Light)": fmt.Sprintf("bs%d.css", app.bsVersion),
|
||||
"Custom CSS": "",
|
||||
}
|
||||
if val, ok := themes[app.config.Section("ui").Key("theme").String()]; ok {
|
||||
app.cssClass = val
|
||||
app.cssFile = val
|
||||
}
|
||||
app.debug.Printf("Using css file \"%s\"", app.cssFile)
|
||||
secret, err := generateSecret(16)
|
||||
if err != nil {
|
||||
app.err.Fatal(err)
|
||||
|
||||
@ -4,7 +4,6 @@ import { Tabs } from "./modules/tabs.js";
|
||||
import { inviteList, createInvite } from "./modules/invites.js";
|
||||
import { accountsList } from "./modules/accounts.js";
|
||||
import { settingsList } from "./modules/settings.js";
|
||||
import { ProfileEditor } from "./modules/profiles.js";
|
||||
import { _post, notificationBox, whichAnimationEvent, toggleLoader } from "./modules/common.js";
|
||||
|
||||
loadTheme();
|
||||
@ -37,10 +36,6 @@ window.availableProfiles = window.availableProfiles || [];
|
||||
|
||||
window.modals.ombiDefaults = new Modal(document.getElementById('modal-ombi-defaults'));
|
||||
document.getElementById('form-ombi-defaults').addEventListener('submit', window.modals.ombiDefaults.close);
|
||||
|
||||
window.modals.profiles = new Modal(document.getElementById("modal-user-profiles"));
|
||||
|
||||
window.modals.addProfile = new Modal(document.getElementById("modal-add-profile"));
|
||||
})();
|
||||
|
||||
var inviteCreator = new createInvite();
|
||||
@ -50,8 +45,6 @@ window.invites = new inviteList();
|
||||
|
||||
var settings = new settingsList();
|
||||
|
||||
var profiles = new ProfileEditor();
|
||||
|
||||
window.notifications = new notificationBox(document.getElementById('notification-box') as HTMLDivElement, 5);
|
||||
|
||||
/*const modifySettingsSource = function () {
|
||||
|
||||
@ -1,204 +0,0 @@
|
||||
import { _get, _post, _delete, toggleLoader } from "../modules/common.js";
|
||||
|
||||
interface Profile {
|
||||
admin: boolean;
|
||||
libraries: string;
|
||||
fromUser: string;
|
||||
}
|
||||
|
||||
class profile implements Profile {
|
||||
private _row: HTMLTableRowElement;
|
||||
private _name: HTMLElement;
|
||||
private _adminChip: HTMLSpanElement;
|
||||
private _libraries: HTMLTableDataCellElement;
|
||||
private _fromUser: HTMLTableDataCellElement;
|
||||
private _defaultRadio: HTMLInputElement;
|
||||
|
||||
get name(): string { return this._name.textContent; }
|
||||
set name(v: string) { this._name.textContent = v; }
|
||||
|
||||
get admin(): boolean { return this._adminChip.classList.contains("chip"); }
|
||||
set admin(state: boolean) {
|
||||
if (state) {
|
||||
this._adminChip.classList.add("chip", "~info", "ml-half");
|
||||
this._adminChip.textContent = "Admin";
|
||||
} else {
|
||||
this._adminChip.classList.remove("chip", "~info", "ml-half");
|
||||
this._adminChip.textContent = "";
|
||||
}
|
||||
}
|
||||
|
||||
get libraries(): string { return this._libraries.textContent; }
|
||||
set libraries(v: string) { this._libraries.textContent = v; }
|
||||
|
||||
get fromUser(): string { return this._fromUser.textContent; }
|
||||
set fromUser(v: string) { this._fromUser.textContent = v; }
|
||||
|
||||
get default(): boolean { return this._defaultRadio.checked; }
|
||||
set default(v: boolean) { this._defaultRadio.checked = v; }
|
||||
|
||||
constructor(name: string, p: Profile) {
|
||||
this._row = document.createElement("tr") as HTMLTableRowElement;
|
||||
this._row.innerHTML = `
|
||||
<td><b class="profile-name"></b> <span class="profile-admin"></span></td>
|
||||
<td><input type="radio" name="profile-default"></td>
|
||||
<td class="profile-from ellipsis"></td>
|
||||
<td class="profile-libraries"></td>
|
||||
<td><span class="button ~critical !normal">Delete</span></td>
|
||||
`;
|
||||
this._name = this._row.querySelector("b.profile-name");
|
||||
this._adminChip = this._row.querySelector("span.profile-admin") as HTMLSpanElement;
|
||||
this._libraries = this._row.querySelector("td.profile-libraries") as HTMLTableDataCellElement;
|
||||
this._fromUser = this._row.querySelector("td.profile-from") as HTMLTableDataCellElement;
|
||||
this._defaultRadio = this._row.querySelector("input[type=radio]") as HTMLInputElement;
|
||||
this._defaultRadio.onclick = () => document.dispatchEvent(new CustomEvent("profiles-default", { detail: this.name }));
|
||||
(this._row.querySelector("span.button") as HTMLSpanElement).onclick = this.delete;
|
||||
|
||||
this.update(name, p);
|
||||
}
|
||||
|
||||
update = (name: string, p: Profile) => {
|
||||
this.name = name;
|
||||
this.admin = p.admin;
|
||||
this.fromUser = p.fromUser;
|
||||
this.libraries = p.libraries;
|
||||
}
|
||||
|
||||
remove = () => { document.dispatchEvent(new CustomEvent("profiles-delete", { detail: this._name })); this._row.remove(); }
|
||||
|
||||
delete = () => _delete("/profiles", { "name": this.name }, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
if (req.status == 200 || req.status == 204) {
|
||||
this.remove();
|
||||
} else {
|
||||
window.notifications.customError("profileDelete", `Failed to delete profile "${this.name}"`);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
asElement = (): HTMLTableRowElement => { return this._row; }
|
||||
}
|
||||
|
||||
interface profileResp {
|
||||
default_profile: string;
|
||||
profiles: { [name: string]: Profile };
|
||||
}
|
||||
|
||||
export class ProfileEditor {
|
||||
private _table = document.getElementById("table-profiles") as HTMLTableElement;
|
||||
private _createButton = document.getElementById("button-profile-create") as HTMLSpanElement;
|
||||
private _profiles: { [name: string]: profile } = {};
|
||||
private _default: string;
|
||||
|
||||
private _createForm = document.getElementById("form-add-profile") as HTMLFormElement;
|
||||
private _profileName = document.getElementById("add-profile-name") as HTMLInputElement;
|
||||
private _userSelect = document.getElementById("add-profile-user") as HTMLSelectElement;
|
||||
private _storeHomescreen = document.getElementById("add-profile-homescreen") as HTMLInputElement;
|
||||
|
||||
get empty(): boolean { return (Object.keys(this._table.children).length == 0) }
|
||||
set empty(state: boolean) {
|
||||
if (state) {
|
||||
this._table.innerHTML = `<tr><td class="empty">None</td></tr>`
|
||||
} else if (this._table.querySelector("td.empty")) {
|
||||
this._table.textContent = ``;
|
||||
}
|
||||
}
|
||||
|
||||
get default(): string { return this._default; }
|
||||
set default(v: string) {
|
||||
this._default = v;
|
||||
if (v != "") { this._profiles[v].default = true; }
|
||||
for (let name in this._profiles) {
|
||||
if (name != v) { this._profiles[name].default = false; }
|
||||
}
|
||||
}
|
||||
|
||||
load = () => _get("/profiles", null, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
if (req.status == 200) {
|
||||
let resp = req.response as profileResp;
|
||||
if (Object.keys(resp.profiles).length == 0) {
|
||||
this.empty = true;
|
||||
} else {
|
||||
this.empty = false;
|
||||
for (let name in resp.profiles) {
|
||||
if (name in this._profiles) {
|
||||
this._profiles[name].update(name, resp.profiles[name]);
|
||||
} else {
|
||||
this._profiles[name] = new profile(name, resp.profiles[name]);
|
||||
this._table.appendChild(this._profiles[name].asElement());
|
||||
}
|
||||
}
|
||||
}
|
||||
this.default = resp.default_profile;
|
||||
window.modals.profiles.show();
|
||||
} else {
|
||||
window.notifications.customError("profileEditor", "Failed to load profiles.");
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
constructor() {
|
||||
(document.getElementById('setting-profiles') as HTMLSpanElement).onclick = this.load;
|
||||
document.addEventListener("profiles-default", (event: CustomEvent) => {
|
||||
const prevDefault = this.default;
|
||||
const newDefault = event.detail;
|
||||
_post("/profiles/default", { "name": newDefault }, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
if (req.status == 200 || req.status == 204) {
|
||||
this.default = newDefault;
|
||||
} else {
|
||||
this.default = prevDefault;
|
||||
window.notifications.customError("profileDefault", "Failed to set default profile.");
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
document.addEventListener("profiles-delete", (event: CustomEvent) => {
|
||||
delete this._profiles[event.detail];
|
||||
this.load();
|
||||
});
|
||||
|
||||
this._createButton.onclick = () => _get("/users", null, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
if (req.status == 200 || req.status == 204) {
|
||||
let innerHTML = ``;
|
||||
for (let user of req.response["users"]) {
|
||||
innerHTML += `<option value="${user['id']}">${user['name']}</option>`;
|
||||
}
|
||||
this._userSelect.innerHTML = innerHTML;
|
||||
this._storeHomescreen.checked = true;
|
||||
window.modals.profiles.close();
|
||||
window.modals.addProfile.show();
|
||||
} else {
|
||||
window.notifications.customError("loadUsers", "Failed to load users.");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this._createForm.onsubmit = (event: SubmitEvent) => {
|
||||
event.preventDefault();
|
||||
const button = this._createForm.querySelector("span.submit") as HTMLSpanElement;
|
||||
toggleLoader(button);
|
||||
let send = {
|
||||
"homescreen": this._storeHomescreen.checked,
|
||||
"id": this._userSelect.value,
|
||||
"name": this._profileName.value
|
||||
}
|
||||
_post("/profiles", send, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
toggleLoader(button);
|
||||
window.modals.addProfile.close();
|
||||
if (req.status == 200 || req.status == 204) {
|
||||
this.load();
|
||||
window.notifications.customPositive("createProfile", "Success:", `created profile "${send['name']}"`);
|
||||
} else {
|
||||
window.notifications.customError("createProfile", `Failed to create profile "${send['name']}"`);
|
||||
}
|
||||
window.modals.profiles.show();
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
}
|
||||
}
|
||||
@ -1,9 +1,15 @@
|
||||
import { _get, _post, toggleLoader } from "../modules/common.js";
|
||||
import { _get } from "../modules/common.js";
|
||||
|
||||
interface settingsBoolEvent extends Event {
|
||||
detail: boolean;
|
||||
}
|
||||
|
||||
interface Profile {
|
||||
Admin: boolean;
|
||||
LibraryAccess: string;
|
||||
FromUser: string;
|
||||
}
|
||||
|
||||
interface Meta {
|
||||
name: string;
|
||||
description: string;
|
||||
@ -58,15 +64,15 @@ class DOMInput {
|
||||
get requires_restart(): boolean { return this._restart.classList.contains("badge"); }
|
||||
set requires_restart(state: boolean) {
|
||||
if (state) {
|
||||
this._restart.classList.add("badge", "~info");
|
||||
this._restart.classList.add("badge", "~critical");
|
||||
this._restart.textContent = "R";
|
||||
} else {
|
||||
this._restart.classList.remove("badge", "~info");
|
||||
this._restart.classList.remove("badge", "~critical");
|
||||
this._restart.textContent = "";
|
||||
}
|
||||
}
|
||||
|
||||
constructor(inputType: string, setting: Setting, section: string, name: string) {
|
||||
constructor(inputType: string, setting: Setting, section: string) {
|
||||
this._container = document.createElement("div");
|
||||
this._container.classList.add("setting");
|
||||
this._container.innerHTML = `
|
||||
@ -91,12 +97,6 @@ class DOMInput {
|
||||
this._input.disabled = (event.detail !== state);
|
||||
});
|
||||
}
|
||||
const onValueChange = () => {
|
||||
const event = new CustomEvent(`settings-${section}-${name}`, { "detail": this.value })
|
||||
document.dispatchEvent(event);
|
||||
if (this.requires_restart) { document.dispatchEvent(new CustomEvent("settings-requires-restart")); }
|
||||
};
|
||||
this._input.onchange = onValueChange;
|
||||
this.update(setting);
|
||||
}
|
||||
|
||||
@ -118,7 +118,7 @@ interface SText extends Setting {
|
||||
value: string;
|
||||
}
|
||||
class DOMText extends DOMInput implements SText {
|
||||
constructor(setting: Setting, section: string, name: string) { super("text", setting, section, name); }
|
||||
constructor(setting: Setting, section: string) { super("text", setting, section); }
|
||||
type: string = "text";
|
||||
get value(): string { return this._input.value }
|
||||
set value(v: string) { this._input.value = v; }
|
||||
@ -128,7 +128,7 @@ interface SPassword extends Setting {
|
||||
value: string;
|
||||
}
|
||||
class DOMPassword extends DOMInput implements SPassword {
|
||||
constructor(setting: Setting, section: string, name: string) { super("password", setting, section, name); }
|
||||
constructor(setting: Setting, section: string) { super("password", setting, section); }
|
||||
type: string = "password";
|
||||
get value(): string { return this._input.value }
|
||||
set value(v: string) { this._input.value = v; }
|
||||
@ -138,7 +138,7 @@ interface SEmail extends Setting {
|
||||
value: string;
|
||||
}
|
||||
class DOMEmail extends DOMInput implements SEmail {
|
||||
constructor(setting: Setting, section: string, name: string) { super("email", setting, section, name); }
|
||||
constructor(setting: Setting, section: string) { super("email", setting, section); }
|
||||
type: string = "email";
|
||||
get value(): string { return this._input.value }
|
||||
set value(v: string) { this._input.value = v; }
|
||||
@ -148,7 +148,7 @@ interface SNumber extends Setting {
|
||||
value: number;
|
||||
}
|
||||
class DOMNumber extends DOMInput implements SNumber {
|
||||
constructor(setting: Setting, section: string, name: string) { super("number", setting, section, name); }
|
||||
constructor(setting: Setting, section: string) { super("number", setting, section); }
|
||||
type: string = "number";
|
||||
get value(): number { return +this._input.value; }
|
||||
set value(v: number) { this._input.value = ""+v; }
|
||||
@ -193,10 +193,10 @@ class DOMBool implements SBool {
|
||||
get requires_restart(): boolean { return this._restart.classList.contains("badge"); }
|
||||
set requires_restart(state: boolean) {
|
||||
if (state) {
|
||||
this._restart.classList.add("badge", "~info");
|
||||
this._restart.classList.add("badge", "~critical");
|
||||
this._restart.textContent = "R";
|
||||
} else {
|
||||
this._restart.classList.remove("badge", "~info");
|
||||
this._restart.classList.remove("badge", "~critical");
|
||||
this._restart.textContent = "";
|
||||
}
|
||||
}
|
||||
@ -220,13 +220,10 @@ class DOMBool implements SBool {
|
||||
this._restart = this._container.querySelector("span.setting-restart") as HTMLSpanElement;
|
||||
this._input = this._container.querySelector("input[type=checkbox]") as HTMLInputElement;
|
||||
const onValueChange = () => {
|
||||
const event = new CustomEvent(`settings-${section}-${name}`, { "detail": this.value })
|
||||
const event = new CustomEvent(`settings-${section}-${name}`, { "detail": this._input.checked })
|
||||
document.dispatchEvent(event);
|
||||
};
|
||||
this._input.onchange = () => {
|
||||
onValueChange();
|
||||
if (this.requires_restart) { document.dispatchEvent(new CustomEvent("settings-requires-restart")); }
|
||||
};
|
||||
this._input.onchange = onValueChange;
|
||||
document.addEventListener(`settings-loaded`, onValueChange);
|
||||
|
||||
if (setting.depends_false || setting.depends_true) {
|
||||
@ -291,10 +288,10 @@ class DOMSelect implements SSelect {
|
||||
get requires_restart(): boolean { return this._restart.classList.contains("badge"); }
|
||||
set requires_restart(state: boolean) {
|
||||
if (state) {
|
||||
this._restart.classList.add("badge", "~info");
|
||||
this._restart.classList.add("badge", "~critical");
|
||||
this._restart.textContent = "R";
|
||||
} else {
|
||||
this._restart.classList.remove("badge", "~info");
|
||||
this._restart.classList.remove("badge", "~critical");
|
||||
this._restart.textContent = "";
|
||||
}
|
||||
}
|
||||
@ -311,7 +308,7 @@ class DOMSelect implements SSelect {
|
||||
this._select.innerHTML = innerHTML;
|
||||
}
|
||||
|
||||
constructor(setting: SSelect, section: string, name: string) {
|
||||
constructor(setting: SSelect, section: string) {
|
||||
this._options = [];
|
||||
this._container = document.createElement("div");
|
||||
this._container.classList.add("setting");
|
||||
@ -339,12 +336,6 @@ class DOMSelect implements SSelect {
|
||||
this._input.disabled = (event.detail !== state);
|
||||
});
|
||||
}
|
||||
const onValueChange = () => {
|
||||
const event = new CustomEvent(`settings-${section}-${name}`, { "detail": this.value })
|
||||
document.dispatchEvent(event);
|
||||
if (this.requires_restart) { document.dispatchEvent(new CustomEvent("settings-requires-restart")); }
|
||||
};
|
||||
this._select.onchange = onValueChange;
|
||||
this.update(setting);
|
||||
}
|
||||
update = (s: SSelect) => {
|
||||
@ -369,18 +360,15 @@ class sectionPanel {
|
||||
private _section: HTMLDivElement;
|
||||
private _settings: { [name: string]: Setting };
|
||||
private _sectionName: string;
|
||||
values: { [field: string]: string } = {};
|
||||
|
||||
constructor(s: Section, sectionName: string) {
|
||||
this._sectionName = sectionName;
|
||||
this._settings = {};
|
||||
this._section = document.createElement("div") as HTMLDivElement;
|
||||
this._section.classList.add("settings-section", "unfocused");
|
||||
this._section.innerHTML = `
|
||||
<span class="heading">${s.meta.name}</span>
|
||||
<p class="support lg">${s.meta.description}</p>
|
||||
`;
|
||||
this._section.innerHTML = `<p class="support lg mb-half">${s.meta.description}</p>`;
|
||||
this.update(s);
|
||||
|
||||
}
|
||||
update = (s: Section) => {
|
||||
for (let name of s.order) {
|
||||
@ -390,30 +378,24 @@ class sectionPanel {
|
||||
} else {
|
||||
switch (setting.type) {
|
||||
case "text":
|
||||
setting = new DOMText(setting, this._sectionName, name);
|
||||
setting = new DOMText(setting, this._sectionName);
|
||||
break;
|
||||
case "password":
|
||||
setting = new DOMPassword(setting, this._sectionName, name);
|
||||
setting = new DOMPassword(setting, this._sectionName);
|
||||
break;
|
||||
case "email":
|
||||
setting = new DOMEmail(setting, this._sectionName, name);
|
||||
setting = new DOMEmail(setting, this._sectionName);
|
||||
break;
|
||||
case "number":
|
||||
setting = new DOMNumber(setting, this._sectionName, name);
|
||||
setting = new DOMNumber(setting, this._sectionName);
|
||||
break;
|
||||
case "bool":
|
||||
setting = new DOMBool(setting as SBool, this._sectionName, name);
|
||||
break;
|
||||
case "select":
|
||||
setting = new DOMSelect(setting as SSelect, this._sectionName, name);
|
||||
setting = new DOMSelect(setting as SSelect, this._sectionName);
|
||||
break;
|
||||
}
|
||||
this.values[name] = ""+setting.value;
|
||||
document.addEventListener(`settings-${this._sectionName}-${name}`, (event: CustomEvent) => {
|
||||
const oldValue = this.values[name];
|
||||
this.values[name] = ""+event.detail;
|
||||
document.dispatchEvent(new CustomEvent("settings-section-changed"));
|
||||
});
|
||||
this._section.appendChild(setting.asElement());
|
||||
this._settings[name] = setting;
|
||||
}
|
||||
@ -440,15 +422,10 @@ interface Settings {
|
||||
}
|
||||
|
||||
export class settingsList {
|
||||
private _saveButton = document.getElementById("settings-save") as HTMLSpanElement;
|
||||
private _saveNoRestart = document.getElementById("settings-apply-no-restart") as HTMLSpanElement;
|
||||
private _saveRestart = document.getElementById("settings-apply-restart") as HTMLSpanElement;
|
||||
|
||||
private _panel = document.getElementById("settings-panel") as HTMLDivElement;
|
||||
private _sidebar = document.getElementById("settings-sidebar") as HTMLDivElement;
|
||||
private _sections: { [name: string]: sectionPanel }
|
||||
private _buttons: { [name: string]: HTMLSpanElement }
|
||||
private _needsRestart: boolean = false;
|
||||
|
||||
addSection = (name: string, s: Section) => {
|
||||
const section = new sectionPanel(s, name);
|
||||
@ -465,6 +442,7 @@ export class settingsList {
|
||||
private _showPanel = (name: string) => {
|
||||
for (let n in this._sections) {
|
||||
if (n == name) {
|
||||
console.log("found", n);
|
||||
this._sections[name].visible = true;
|
||||
this._buttons[name].classList.add("selected");
|
||||
} else {
|
||||
@ -474,53 +452,9 @@ export class settingsList {
|
||||
}
|
||||
}
|
||||
|
||||
private _save = () => {
|
||||
let config = {};
|
||||
for (let name in this._sections) {
|
||||
config[name] = this._sections[name].values;
|
||||
}
|
||||
if (this._needsRestart) {
|
||||
this._saveRestart.onclick = () => {
|
||||
config["restart-program"] = true;
|
||||
this._send(config, () => {
|
||||
window.modals.settingsRestart.close();
|
||||
window.modals.settingsRefresh.show();
|
||||
});
|
||||
};
|
||||
this._saveNoRestart.onclick = () => {
|
||||
config["restart-program"] = false;
|
||||
this._send(config, window.modals.settingsRestart.close);
|
||||
}
|
||||
window.modals.settingsRestart.show();
|
||||
} else {
|
||||
this._send(config);
|
||||
}
|
||||
// console.log(config);
|
||||
}
|
||||
|
||||
private _send = (config: Object, run?: () => void) => _post("/config", config, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
if (req.status == 200 || req.status == 204) {
|
||||
window.notifications.customPositive("settingsSaved", "Success:", "settings were saved.");
|
||||
} else {
|
||||
window.notifications.customError("settingsSaved", "Couldn't save settings.");
|
||||
}
|
||||
this.reload();
|
||||
if (run) { run(); }
|
||||
}
|
||||
});
|
||||
|
||||
constructor() {
|
||||
this._sections = {};
|
||||
this._buttons = {};
|
||||
document.addEventListener("settings-section-changed", () => this._saveButton.classList.remove("unfocused"));
|
||||
this._saveButton.onclick = this._save;
|
||||
document.addEventListener("settings-requires-restart", () => { this._needsRestart = true; });
|
||||
|
||||
if (window.ombiEnabled) {
|
||||
let ombi = new ombiDefaults();
|
||||
this._sidebar.appendChild(ombi.button());
|
||||
}
|
||||
}
|
||||
|
||||
reload = () => _get("/config", null, (req: XMLHttpRequest) => {
|
||||
@ -537,78 +471,8 @@ export class settingsList {
|
||||
this.addSection(name, settings.sections[name]);
|
||||
}
|
||||
}
|
||||
this._showPanel(settings.order[0]);
|
||||
this._needsRestart = false;
|
||||
document.dispatchEvent(new CustomEvent("settings-loaded"));
|
||||
this._saveButton.classList.add("unfocused");
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
interface ombiUser {
|
||||
id: string;
|
||||
name: string;
|
||||
}
|
||||
|
||||
class ombiDefaults {
|
||||
private _form: HTMLFormElement;
|
||||
private _button: HTMLSpanElement;
|
||||
private _select: HTMLSelectElement;
|
||||
private _users: { [id: string]: string } = {};
|
||||
constructor() {
|
||||
this._button = document.createElement("span") as HTMLSpanElement;
|
||||
this._button.classList.add("button", "~neutral", "!low", "settings-section-button", "mb-half");
|
||||
this._button.innerHTML = `<span class="flex">Ombi user defaults <i class="ri-link-unlink-m ml-half"></i></span>`;
|
||||
this._button.onclick = this.load;
|
||||
this._form = document.getElementById("form-ombi-defaults") as HTMLFormElement;
|
||||
this._form.onsubmit = this.send;
|
||||
this._select = this._form.querySelector("select") as HTMLSelectElement;
|
||||
}
|
||||
button = (): HTMLSpanElement => { return this._button; }
|
||||
send = () => {
|
||||
const button = this._form.querySelector("span.submit") as HTMLSpanElement;
|
||||
toggleLoader(button);
|
||||
let resp = {} as ombiUser;
|
||||
resp.id = this._select.value;
|
||||
resp.name = this._users[resp.id];
|
||||
_post("/ombi/defaults", resp, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
toggleLoader(button);
|
||||
if (req.status == 200 || req.status == 204) {
|
||||
window.notifications.customPositive("ombiDefaults", "Success:", "stored ombi defaults.");
|
||||
} else {
|
||||
window.notifications.customError("ombiDefaults", "Failed to store ombi defaults.");
|
||||
}
|
||||
window.modals.ombiDefaults.close();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
load = () => {
|
||||
toggleLoader(this._button);
|
||||
_get("/ombi/users", null, (req: XMLHttpRequest) => {
|
||||
if (req.readyState == 4) {
|
||||
if (req.status == 200 && "users" in req.response) {
|
||||
const users = req.response["users"] as ombiUser[];
|
||||
let innerHTML = "";
|
||||
for (let user of users) {
|
||||
this._users[user.id] = user.name;
|
||||
innerHTML += `<option value="${user.id}">${user.name}</option>`;
|
||||
}
|
||||
this._select.innerHTML = innerHTML;
|
||||
toggleLoader(this._button);
|
||||
window.modals.ombiDefaults.show();
|
||||
} else {
|
||||
toggleLoader(this._button);
|
||||
window.notifications.customError("ombiLoadError", "Failed to load ombi users.")
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -5,12 +5,8 @@ export function toggleTheme() {
|
||||
}
|
||||
|
||||
export function loadTheme() {
|
||||
const theme = localStorage.getItem("theme");
|
||||
if (theme == "dark") {
|
||||
if (localStorage.getItem('theme') == "dark") {
|
||||
document.documentElement.classList.add('dark-theme');
|
||||
document.documentElement.classList.remove('light-theme');
|
||||
} else if (theme == "light") {
|
||||
document.documentElement.classList.add('light-theme');
|
||||
document.documentElement.classList.remove('dark-theme');
|
||||
}
|
||||
}
|
||||
|
||||
@ -60,8 +60,6 @@ declare interface Modals {
|
||||
settingsRefresh: Modal;
|
||||
ombiDefaults?: Modal;
|
||||
newAccountSuccess?: Modal;
|
||||
profiles: Modal;
|
||||
addProfile: Modal;
|
||||
}
|
||||
|
||||
interface Invite {
|
||||
|
||||
7
views.go
7
views.go
@ -18,7 +18,6 @@ func (app *appContext) AdminPage(gc *gin.Context) {
|
||||
ombiEnabled := app.config.Section("ombi").Key("enabled").MustBool(false)
|
||||
gcHTML(gc, http.StatusOK, "admin.html", gin.H{
|
||||
"urlBase": app.URLBase,
|
||||
"cssClass": app.cssClass,
|
||||
"contactMessage": "",
|
||||
"email_enabled": emailEnabled,
|
||||
"notifications": notificationsEnabled,
|
||||
@ -40,7 +39,6 @@ func (app *appContext) InviteProxy(gc *gin.Context) {
|
||||
}
|
||||
gcHTML(gc, http.StatusOK, "form-loader.html", gin.H{
|
||||
"urlBase": app.URLBase,
|
||||
"cssClass": app.cssClass,
|
||||
"contactMessage": app.config.Section("ui").Key("contact_message").String(),
|
||||
"helpMessage": app.config.Section("ui").Key("help_message").String(),
|
||||
"successMessage": app.config.Section("ui").Key("success_message").String(),
|
||||
@ -48,13 +46,14 @@ func (app *appContext) InviteProxy(gc *gin.Context) {
|
||||
"validate": app.config.Section("password_validation").Key("enabled").MustBool(false),
|
||||
"requirements": app.validator.getCriteria(),
|
||||
"email": email,
|
||||
"bs5": app.config.Section("ui").Key("bs5").MustBool(false),
|
||||
"username": !app.config.Section("email").Key("no_username").MustBool(false),
|
||||
"lang": app.storage.lang.Form["strings"],
|
||||
})
|
||||
} else {
|
||||
gcHTML(gc, 404, "invalidCode.html", gin.H{
|
||||
"bs5": app.config.Section("ui").Key("bs5").MustBool(false),
|
||||
"cssFile": app.cssClass,
|
||||
"cssFile": app.cssFile,
|
||||
"contactMessage": app.config.Section("ui").Key("contact_message").String(),
|
||||
})
|
||||
}
|
||||
@ -63,7 +62,7 @@ func (app *appContext) InviteProxy(gc *gin.Context) {
|
||||
func (app *appContext) NoRouteHandler(gc *gin.Context) {
|
||||
gcHTML(gc, 404, "404.html", gin.H{
|
||||
"bs5": app.config.Section("ui").Key("bs5").MustBool(false),
|
||||
"cssFile": app.cssClass,
|
||||
"cssFile": app.cssFile,
|
||||
"contactMessage": app.config.Section("ui").Key("contact_message").String(),
|
||||
})
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user