wrapperr/web/admin.js
aunefyren 3b7e3c08d6 Squashed commit of the following:
commit 23a91e9daad1c482435581c69c756257ac703149
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Mon Jul 4 17:47:18 2022 +0200

    Removed tmp text

commit 1c09e583b2fa5e30a36c809e85fc43b328e3ad7f
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun Jul 3 15:33:36 2022 +0200

    Read log in admin interface

commit 4ae253185a33bb13a94b1a200bf3aa92a62fb17d
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sat Jul 2 00:27:39 2022 +0200

    Added comments

commit 89cabc36e86ae541fa9b001928211ba48e9ba48b
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sat Jul 2 00:08:47 2022 +0200

    Update index.js

commit 12279e7ed47eeb45454ab525aa745eeaac0da180
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sat Jul 2 00:02:36 2022 +0200

    Update index.html

commit a1c76b3e4d06cd25f7795390155521f2c341465f
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 23:56:39 2022 +0200

    Errors and frontend

    Cookies are more stable
    Errors are more concise

commit ee170aeb3acf3f586c93e7b142a08bbb32a17134
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 22:33:27 2022 +0200

    Better error handling

commit 6317a1fa15ccfaf91fb2d8737e346621d9884008
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 22:18:45 2022 +0200

    Added returns on errors

commit 7126ddf2fbb824de0906fd6d7bfc2ca8acac0fdf
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 22:09:07 2022 +0200

    Added ASCII Art

commit 1fd45ede34abe6ae9555d9d6f23f87a2e67dba3b
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 21:39:24 2022 +0200

    Form CSS tweak

commit 9861c662cd5f2b66721b3d2f2030d92d84bdf8bc
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 21:24:03 2022 +0200

    Update route_admin_auth.go

commit 119de6b2b1124266aae6cd5fec90fff2d2ddd24f
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 21:19:36 2022 +0200

    Update route_admin_auth.go

commit 87a43dfc4945fe5ce45b8d9d06c7dcd6a5c9ee0c
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 21:17:21 2022 +0200

    Bugs and CSS

    Time zone validation
    Caching log is prettier
    Return bug on certain API endpoints fixed

commit 3e81df71516572944b8e46bad129da82235b1b85
Author: Aune <31650531+aunefyren@users.noreply.github.com>
Date:   Fri Jul 1 18:36:21 2022 +0200

    Create codeql-analysis.yml

commit 32d05f3fff0231139df0e590b98097d6c6e3cdfb
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 18:23:05 2022 +0200

    Update index.js

commit c3fcdee18406e1a9d96b26c85169e1db365bb36a
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 18:15:38 2022 +0200

    Capital W

commit a243d310597b9f8148621690b9662f93b8467e83
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 18:08:53 2022 +0200

    Update index.js

commit 068739fc76b96c4379bf93aa39d11db1c2dfcada
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 17:58:48 2022 +0200

    Update README.md

commit d61074bde69f5dac1a1a2dd6b2164564131f53d1
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 17:56:55 2022 +0200

    Docker-compose mistake

commit 3036905d92d23cb0664559471fa9e0a81565fa64
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 17:55:30 2022 +0200

    README touchups

commit 6f07775121cec5cddf17f25efe349b300d43b8e6
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jul 1 17:48:10 2022 +0200

    Rewrote README

commit 58a26b11c77e6d21be0f433cd22c4da46f5d0450
Author: Aune <oystein.sverre@gmail.com>
Date:   Fri Jul 1 10:00:58 2022 +0200

    Changed release workflow

commit ffeea7ca689f405b6e629411f5bc9fc8c19e6b34
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Jun 30 20:09:01 2022 +0200

    Updated workflow to 1.18

commit aa321e87729673b4ce047f87b68f7223ea02d159
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Jun 30 19:58:44 2022 +0200

    Update README.md

commit 5c4e59474882689f6dadf61f140a4ec18f744a1e
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Jun 30 18:16:30 2022 +0200

    CSS fixes

commit 97f3fc57a389e5dd637b560e48fee86c4163dcd5
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Jun 29 22:00:32 2022 +0200

    Option to disable winter theme

    And loading screen

commit cf804312c7b9b72b416ef2a53947efab79ab604b
Author: Aune <31650531+aunefyren@users.noreply.github.com>
Date:   Tue Jun 28 22:05:43 2022 +0200

    Update README.md

commit 362a15ee1daa2464ad4f27b7e3107a63d736e591
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Jun 28 18:41:19 2022 +0200

    Fixed buddy bug

commit 58f4d0060230c2349634689438088dcdf48d7715
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Mon Jun 27 19:26:37 2022 +0200

    Finalized show buddy

commit 0f89a1df974af9947d9e297f3c662d4082c0403d
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun Jun 26 12:47:37 2022 +0200

    Improved logging

commit b57cb24928c2e213c38ce566478af11937e6e4e3
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sat Jun 25 13:42:14 2022 +0200

    Finalized shareable links

    Links can be deleted
    Links are retrieved to the front page
    Links can be copied to clipboard

commit 000022b882877bc306e13203578a3d1e184afc9a
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun Jun 12 18:47:34 2022 +0200

    Get share links now functional

commit df697f68b2bcedc7c623d9d9ec291a9625b62160
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun Jun 12 00:29:52 2022 +0200

    Share link formatting bug

commit 3b357ca72767fcbb9742a935f29770ab488ac36f
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun Jun 12 00:26:15 2022 +0200

    Share link creation

    Started implementation
    Missing get and delete functionality
    Added delete cache option to Tautulli settings

commit 54e079951ff131d9177fd0f4a79238c03043d875
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Jun 10 19:13:01 2022 +0200

    Fixed bugs

    Shows with seasons in different years were split on top lists
    Amount of media plays was not unique to media-release, just amount of plays overall
    Fixed display for music minutes
    Logging can now be disabled
    Tautulli libraries were not included in API calls

commit 26508af56a182b9611affb4401e5db494ae27c8b
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Jun 7 20:38:08 2022 +0200

    Fixed bug where top-lists under 10 crashed the API

commit 0f28e39c8d4fe444c8d30caaaee9ca138d469270
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Jun 7 20:17:41 2022 +0200

    Fixed bug for year users duration-sum

commit 1e3cb11637cfe001936d4b950b28564d2eec2a4b
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun May 29 19:51:15 2022 +0200

    Statistics retrieval finished

    Revamped config get/set functions
    Redid some UI explanations
    Renamed template JSON

commit 93390d469bab45560574e678a88b38dcef60f100
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Mon May 23 22:23:31 2022 +0200

    Bug problem

commit 3eb49b8da1c77d33923913e817cb41201cab3963
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun May 22 23:48:11 2022 +0200

    Users

commit aa6b3ec5121bb73cbe5828d9f42e1fd14514ddbd
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun May 22 13:11:35 2022 +0200

    More stats

    Leaderboard and show buddy missing
    Working on bug that resets config (?!)

commit 29742a2b6305a3835c63fc2c7760018b3e2267f0
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sun May 22 00:41:19 2022 +0200

    Basis for stats retrieval

    personal movies, shows and music is functional

commit a0df0759a76689638d47657abde755cc34dd4a1b
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri May 20 17:06:24 2022 +0200

    Removed Docker folder

commit 3e192997c08a5406a3d98e850218a674559f9ff0
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri May 20 17:06:05 2022 +0200

    Renaming and Pop-up fix

    Pop ups should now not be blocked. Hopefully...

commit 57b2d03fb57762c6c2aec7433a4f2affd6faa090
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Apr 29 15:37:26 2022 +0200

    CSS changes

    New rounded corners
    Transparent background colors
    Yellow borders
    Blurred background image
    Better footer placement
    More depth to snow particles

commit b562e75bee6ff612019fa08d221fbf1ee69edd11
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Apr 29 12:37:18 2022 +0200

    API endpoints changes

    Get wrapperr-version now also retrieves config-state
    Login via Plex Auth disabled if Wrapperr is unconfigured
    Cookies changed to strict samesite value
    Logging changes

commit e01bfc41cf46b3d7bc3b6627c93b67c0f70aa718
Author: Aune <31650531+aunefyren@users.noreply.github.com>
Date:   Fri Apr 29 10:47:12 2022 +0200

    Update README.md

    More shields

commit 2d2893cb9b212016c3455fd4f8dd3a5b229550ba
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 27 22:09:24 2022 +0200

    Comments and time zone fixes

commit 271c16b00e0eb4d58a97ed3b82f0e96993a7d853
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 27 16:26:44 2022 +0200

    Caching and caching loop

commit 44376b4d57765258602ec585e59b0825938d3c77
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 27 10:33:18 2022 +0200

    Pulling Tautulli History

    Moved Tautulli functions to their own file

commit 5355dafc68c5c2ed5a7c7e413388981438314500
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Apr 26 22:00:49 2022 +0200

    Start of Tautulli data collection

    Added time-zone setting in code
    Created cache structs

commit 8bcce997c3b1a0556752ff99b5925cce7e18c4b6
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Apr 26 17:25:06 2022 +0200

    Comments and caching mode

commit 6e951efbcd6acb0b442a691ceb9919e95d3e9e98
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Sat Apr 23 19:03:00 2022 +0200

    User details fetch (From Plex & Tautulli)

commit cb5b9384c0b716ef33770a0f96f6e4c0601cff50
Author: Aune <31650531+aunefyren@users.noreply.github.com>
Date:   Sat Apr 23 12:07:57 2022 +0200

    Shields.io stats

commit 343e0ac727576652ccd81e565a7a385879b1bfb4
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Mon Apr 18 22:14:49 2022 +0200

    Begun stats function

    Moved Taut test to separate function from API endpoint

commit b7e34224d7524358a4b59bd667d75b3b6527361c
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Apr 15 02:26:54 2022 +0200

    Update util.go

commit 4a2598f77cce3c5e9d5fc66e9e870bf3cd4bfb51
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Apr 15 02:22:34 2022 +0200

    Error handling

commit 09b80cf16c054d2767cd1cf50ae17f7f72268a53
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Apr 14 15:01:59 2022 +0200

    Updated readme to explain current standing

commit 273b08f43ca317b6cd4ede01efb5040e63cc9839
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Apr 14 14:46:34 2022 +0200

    Removed test-log commands

commit f2e85beb9d4aa9157b32933c50495c5f029787e4
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Apr 14 14:26:17 2022 +0200

    Removed legacy PHP files

commit aaafea6da38173224d1b15063d4f32468ec12879
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Apr 14 14:24:41 2022 +0200

    URL builder & test Tautulli connection

commit a02a172a7fc85a5a595fdb4003b00c8aa7d5f475
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Apr 14 02:37:48 2022 +0200

    Moved Plex Auth Get Pin to front end

    By moving this API call to the front end (JS), the IP address is identical when logging in. This removes the red warning.

commit 744fae84a088cc77ba86d3c3687aff8d9caa77d7
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Apr 14 01:33:40 2022 +0200

    Plex Auth

    Plex Auth login, validation and JWT token creation

commit 820bbca58a5679ef6a1e98ec586442cd841ac958
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 13 20:45:00 2022 +0200

    Update config

    API now updates config file

commit cb581d69007b32e8e924ac22ba66c923dd9eef23
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 13 15:49:04 2022 +0200

    More API functions

    - Admin login
    - Config/Admin file creation
    - Config API retrieval

commit f832df727de5c5fe583f03e2d8906714ceaf8017
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Apr 12 09:30:58 2022 +0200

    Functional API endpoints

    Some basic functionality
    - Retrieve wrapperr version
    - Retrieve admin state
    - Create admin

commit 76193b7230e90d578bc561c8f479a87885c0b50f
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Mon Apr 11 16:51:35 2022 +0200

    Config loaders

commit c197a1b91b6307432e560756da97887bbfb36de5
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Fri Apr 8 17:20:36 2022 +0200

    Config files

commit 2ef850426a14ecf3dc39ab4b122fb479bb1e8f11
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Thu Apr 7 13:16:01 2022 +0200

    Functional jwt validattion and creation

commit a52de743daeb3dce18db7e0848eea37d4c35b707
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 6 22:25:01 2022 +0200

    Auth token jwt

commit 2f446a484ad6e4330a3a40cc708a543ca47ce148
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 6 14:19:49 2022 +0200

    Middleware

commit 1a1bc6ef09b9bce995d9d4b3f4bf7b0d1ead988a
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 6 09:14:02 2022 +0200

    Added more comments

commit 8c36dc74a98aa66565851ab01aff91e641287f06
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Wed Apr 6 09:08:26 2022 +0200

    Port start argument

    Also included as ENV in Dockerfile

commit 6bfbbdf5c3f955ab680ee4b47863bd7f017ffd5a
Author: Aune <31650531+aunefyren@users.noreply.github.com>
Date:   Tue Apr 5 23:31:36 2022 +0200

    Whopsie

commit 7600f2812e01d266f3488ed32a49d1591740a3e6
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Apr 5 20:05:13 2022 +0200

    Routing

commit 0dbb1c756fcd411e60b73752554d75c8bf04f0b5
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Apr 5 18:20:12 2022 +0200

    Added warnings & Dockerfile

commit a787a0acd41ab182ca0607dc3c1796a28ce947bd
Author: aunefyren <oystein.sverre@gmail.com>
Date:   Tue Apr 5 17:51:48 2022 +0200

    Go branch init

    The assets are served, but no API
2022-07-04 17:47:59 +02:00

2486 lines
No EOL
145 KiB
JavaScript

function topFunction() {
document.body.scrollTop = 0; // For Safari
document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
}
function login_menu() {
topFunction();
var html = '<h2>Admin Login</h2>';
html += '<form id="password_login_form" onsubmit="log_in();return false">'
html += '<div class="form-group newline">';
html += '<label for="username" title="The username chosen during first-time setup.">Username:</label>';
html += '<input type="text" class="form-control" id="username" value="" placeholder="" minlength=4 autocomplete="on" required />';
html += '</div>';
html += '<div class="form-group newline">';
html += '<label for="password" title="The password chosen during first-time setup.">Password:</label>';
html += '<input type="password" class="form-control" id="password" value="" autocomplete="off" required />';
html += '</div>';
html += '<div class="form-group newline">';
html += '<div id="password_login_form_error"></div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button type="submit" class="form-control btn" id="log_in_button"><img src="../assets/done.svg" class="btn_logo"><p2>Log in</p2></button>';
html += '</div>';
html += '</form>';
document.getElementById("setup").innerHTML = html;
}
function log_in() {
// Disable button
document.getElementById("log_in_button").disabled = true;
document.getElementById("log_in_button").style.opacity = '0.5';
// Get variables
password = document.getElementById('password').value;
username = document.getElementById('username').value;
admin_login_form = {"admin_password" : password, "admin_username" : username};
var admin_login_data = JSON.stringify(admin_login_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
console.log('Failed to parse API response. Response: ' + this.responseText)
document.getElementById("log_in_button").disabled = false;
document.getElementById("log_in_button").style.opacity = '1';
document.getElementById('password').value = '';
}
if(result.error) {
document.getElementById("password_login_form_error").innerHTML = result.message;
document.getElementById("log_in_button").disabled = false;
document.getElementById("log_in_button").style.opacity = '1';
document.getElementById('password').value = '';
} else {
set_cookie("wrapperr-admin", result.data, 3);
location.reload();
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "../api/login/admin");
xhttp.send(admin_login_data);
return;
}
function set_password_form() {
topFunction();
var html = '<h2>Create admin</h2>';
html += '<form id="password_form" onsubmit="set_password();return false;">'
html += '<div class="form-group newline">';
html += '<label for="username" title="The username needed to log in as administrator and change the config-file remotely.">Set an admin username:</label>';
html += '<input type="text" class="form-control" id="username" value="' + username + '" placeholder="" minlength=4 autocomplete="on" required />';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="password" title="The password needed to change the config-file remotely.">Set an admin password:</label>';
html += '<input type="password" class="form-control" id="password" value="' + password + '" placeholder="" autocomplete="off" required />';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="password_2" title="The password needed to change the config-file remotely.">Repeat the password:</label>';
html += '<input type="password" class="form-control" id="password_2" value="' + password + '" placeholder="" autocomplete="off" required />';
html += '</div>';
html += '<div class="form-group newline">';
html += '<div id="password_form_error"></div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button type="submit" class="form-control btn" id="create_admin_button"><img src="../assets/done.svg" class="btn_logo"><p2>Create account</p2></button>';
html += '</div>';
html += '</form>';
document.getElementById("setup").innerHTML = html;
}
function set_password() {
// Disable button
document.getElementById("create_admin_button").disabled = true;
document.getElementById("create_admin_button").style.opacity = '0.5';
// Check password match
if(document.getElementById('password').value != document.getElementById('password_2').value) {
alert("The passwords must match.");
document.getElementById('password').value = "";
document.getElementById('password_2').value = "";
document.getElementById('password').focus();
document.getElementById("create_admin_button").disabled = false;
document.getElementById("create_admin_button").style.opacity = '1';
return false;
} else {
password = document.getElementById('password').value;
username = document.getElementById('username').value;
}
admin_create_form = {"admin_password" : password, "admin_username" : username};
var admin_create_data = JSON.stringify(admin_create_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
console.log('Failed to parse API response. Response: ' + this.responseText)
document.getElementById("create_admin_button").disabled = false;
document.getElementById("create_admin_button").style.opacity = '1';
}
if(result.error) {
document.getElementById("password_form_error").innerHTML = result.message;
document.getElementById("create_admin_button").disabled = false;
document.getElementById("create_admin_button").style.opacity = '1';
} else {
location.reload();
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/create/admin");
xhttp.send(admin_create_data);
return;
}
function update_password_form() {
topFunction();
var html = '<div class="form-group newline">';
html += '<button class="form-control btn" name="admin_menu_return_button" id="admin_menu_return_button" onclick="get_config(get_cookie(\'wrapperr-admin\'));"><img src="../assets/trash.svg" class="btn_logo"></img><p2 id="admin_menu_return_button_text">Return</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<form id="update_password_form" onsubmit="return false;">'
html += '<div class="form-group newline">';
html += '<label for="username" title="The username needed to log in as administrator and change the config-file remotely.">Update admin username:</label>';
html += '<input type="text" class="form-control" id="username" value="' + username + '" placeholder="" minlength=4 autocomplete="on" required />';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="password" title="The password needed to change the config-file remotely.">Update admin password:</label>';
html += '<input type="password" class="form-control" id="password" value="" placeholder="" autocomplete="off" required />';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="password_2" title="The password needed to change the config-file remotely.">Repeat the password:</label>';
html += '<input type="password" class="form-control" id="password_2" value="" placeholder="" autocomplete="off" required />';
html += '</div>';
html += '<div class="form-group newline">';
html += '<div id="password_form_error"></div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button type="submit" class="form-control btn" onclick="update_password();" id="update_admin_button"><img src="../assets/done.svg" class="btn_logo"><p2>Update account</p2></button>';
html += '</div>';
html += '</form>';
document.getElementById("setup").innerHTML = html;
}
function update_password() {
// Disable button
document.getElementById("update_admin_button").disabled = true;
document.getElementById("update_admin_button").style.opacity = '0.5';
// Check password match
if(document.getElementById('password').value != document.getElementById('password_2').value) {
alert("The passwords must match.");
document.getElementById('password').value = "";
document.getElementById('password_2').value = "";
document.getElementById('password').focus();
document.getElementById("update_admin_button").disabled = false;
document.getElementById("update_admin_button").style.opacity = '1';
return false;
} else {
password = document.getElementById('password').value;
username = document.getElementById('username').value;
}
admin_create_form = {"admin_password" : password, "admin_username" : username};
var admin_create_data = JSON.stringify(admin_create_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
document.getElementById("password_form_error").innerHTML = 'Failed to parse API response.';
console.log('Failed to parse API response. Response: ' + this.responseText)
document.getElementById("update_admin_button").disabled = false;
document.getElementById("update_admin_button").style.opacity = '1';
}
if(result.error) {
document.getElementById("password_form_error").innerHTML = result.message;
document.getElementById("update_admin_button").disabled = false;
document.getElementById("update_admin_button").style.opacity = '1';
} else {
set_cookie("wrapperr-admin", "", 1);
location.reload();
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/update/admin");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send(admin_create_data);
return;
}
function get_admin_state() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
console.log('Failed to parse API response. Response: ' + this.responseText)
}
if(result.error) {
console.log(result.message);
} else if(!result.configured) {
first_time = true;
set_password_form();
} else {
login_menu();
}
} else if(this.readyState == 4 && this.status !== 200) {
var html = '<h2>' + this.status + ' Error</h2>';
html += '<p>The API did not respond correctly.</p>';
document.getElementById("setup").innerHTML = html;
}
};
xhttp.withCredentials = true;
xhttp.open("post", "../api/get_admin_state.php");
xhttp.send();
return;
}
function sign_out() {
set_cookie("wrapperr-admin", "", 1);
location.reload();
}
function admin_menu() {
var html = '<div class="form-group">';
html += '<button class="form-control btn" onclick="update_password_form()"><img src="../assets/config.svg" class="btn_logo"><p2>Admin settings</p2></button>';
html += '</div>';
html += '<div class="form-group">';
html += '<button class="form-control btn" name="plex_signout_button" id="plex_signout_button" onclick="sign_out()"><img src="../assets/close.svg" class="btn_logo"></img><p2 id="plex_signout_button_text">Sign Out</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" onclick="set_tautulli_settings()" id="set_tautulli_settings"><img src="../assets/config.svg" class="btn_logo"><p2>Tautulli settings</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" onclick="set_wrapperr_settings()" id="set_wrapperr_settings"><img src="../assets/config.svg" class="btn_logo"><p2>Wrapperr settings</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" onclick="set_wrapperr_customization()" id="set_wrapperr_customization"><img src="../assets/config.svg" class="btn_logo"><p2>Wrapperr customization</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" onclick="caching_menu()" id="caching_menu"><img src="../assets/download.svg" class="btn_logo"><p2>Caching</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" onclick="log_menu()" id="log_menu"><img src="../assets/document.svg" class="btn_logo"><p2>Log</p2></button>';
html += '</div>';
document.getElementById("setup").innerHTML = html;
if(timezone === '') {
document.getElementById("set_wrapperr_settings").style.border = '0.15em dashed var(--red)';
document.getElementById("caching_menu").disabled = true;
document.getElementById("caching_menu").style.opacity = '0.5';
}
if(wrapped_start === '' || wrapped_end === '') {
document.getElementById("set_wrapperr_customization").style.border = '0.15em dashed var(--red)';
document.getElementById("caching_menu").disabled = true;
document.getElementById("caching_menu").style.opacity = '0.5';
}
if(tautulli_ip === '' || tautulli_apikey === '' || tautulli_length === '' || tautulli_port == 0 || tautulli_length == 0) {
document.getElementById("set_tautulli_settings").style.border = '0.15em dashed var(--red)';
document.getElementById("caching_menu").disabled = true;
document.getElementById("caching_menu").style.opacity = '0.5';
}
if(!use_logs) {
document.getElementById("log_menu").disabled = true;
document.getElementById("log_menu").style.opacity = '0.5';
}
}
function set_tautulli_settings() {
topFunction();
var html = '<div class="form-group newline">';
html += '<button class="form-control btn" name="admin_menu_return_button" id="admin_menu_return_button" onclick="get_config(get_cookie(\'wrapperr-admin\'));"><img src="../assets/trash.svg" class="btn_logo"></img><p2 id="admin_menu_return_button_text">Return</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<form id="set_tautulli_form" onsubmit="return false;">'
html += '<div class="form-group">';
html += '<label for="tautulli_apikey" title="The API key is needed for Plex-Wrapped to interact with Tautulli. Commonly found at Tautulli->Settings->Web Interface->API Key.">Tautulli API key:</label>';
html += '<input type="text" class="form-control" id="tautulli_apikey" value="' + tautulli_apikey + '" autocomplete="off" required placeholder="" /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="tautulli_ip" title="The IP address or domain that connects to Tautulli. No subfolders, as this is another setting, but subdomains can be defined.">IP or domain for Tautulli connection:</label>';
html += '<input type="text" class="form-control" id="tautulli_ip" value="' + tautulli_ip + '" required placeholder="" /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="tautulli_port" title="The port Tautulli uses for connections. Typically 80 or 443 if a domain is used.">Port for Tautulli:</label>';
html += '<input type="number" class="form-control" id="tautulli_port" value="' + tautulli_port + '" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="tautulli_length" title="The max amount of entries Tautulli responds with during API calls. Typically doesn\'t need to be changed, but if you have more than 5000 entries in a day, they won\'t be loaded.">Tautlli item length:</label>';
html += '<input type="number" min="0" class="form-control" id="tautulli_length" value="' + tautulli_length + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="tautulli_root" title="Subfolder for Tautulli, no slashes needed at the beginning or end. It is the folder accessed after the main IP/domain. For example: \'tautulli.com/subfolder\' would mean you enter \'subfolder\' here.">Tautulli URL Base: (Optional)</label>';
html += '<input type="text" class="form-control" id="tautulli_root" value="' + tautulli_root + '" autocomplete="off" placeholder=""/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="tautulli_libraries" title="Comma separated list of ID\'s to use for statistics. If none are given, it will search all.">Library ID\'s to use: (Optional)</label>';
html += '<input type="text" class="form-control" id="tautulli_libraries" value="' + tautulli_libraries + '" autocomplete="off" placeholder=""/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="tautulli_https" title="Enable if your connection uses HTTPS.">Use HTTPS:</label>';
html += '<input type="checkbox" class="form-control" id="tautulli_https" ';
if(tautulli_https) {
html += 'checked="' + tautulli_https + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="tautulli_grouping" title="If Tautulli should group related plays into one entry.">Use Tautulli grouping:</label>';
html += '<input type="checkbox" class="form-control" id="tautulli_grouping" ';
if(tautulli_grouping) {
html += 'checked="' + tautulli_grouping + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button style="background-color: lightgrey;" type="button" class="form-control btn" id="test_connection" onclick="test_tautulli_connection()"><img src="../assets/synchronize.svg" class="btn_logo"><p2 id="test_tautulli_text">Test Tautulli connection</p2></button>';
html += '</div>';
html += '<div class="form-group newline" title="Clear the cache now to include the newest settings.">';
html += '<label for="clear_cache">Clear cache now:<br>';
html += '<input type="checkbox" class="form-control" id="clear_cache" checked /></label>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button type="submit" class="form-control btn" onclick="set_tautulli_settings_call();" id="set_tautulli_form_button"><img src="../assets/done.svg" class="btn_logo"></img><p2 id="set_tautulli_form_button_text">Save</p2></button>';
html += '</div>';
html += '</form>';
document.getElementById("setup").innerHTML = html;
}
function set_tautulli_settings_call() {
document.getElementById("set_tautulli_form_button").disabled = true;
document.getElementById("set_tautulli_form_button").style.opacity = '0.5';
tautulli_apikey = document.getElementById('tautulli_apikey').value;
tautulli_ip = document.getElementById('tautulli_ip').value;
tautulli_port = parseInt(document.getElementById('tautulli_port').value);
tautulli_length = parseInt(document.getElementById('tautulli_length').value);
tautulli_root = document.getElementById('tautulli_root').value;
tautulli_libraries = document.getElementById('tautulli_libraries').value;
tautulli_grouping = document.getElementById('tautulli_grouping').checked;
tautulli_https = document.getElementById('tautulli_https').checked;
clear_cache = document.getElementById('clear_cache').checked;
if(tautulli_apikey === '') {
document.getElementById("set_tautulli_form_button").disabled = false;
document.getElementById("set_tautulli_form_button").style.opacity = '1';
alert('API key is required for Tautulli to function.');
document.getElementById('tautulli_apikey').focus();
return;
}
if(tautulli_ip === '') {
document.getElementById("set_tautulli_form_button").disabled = false;
document.getElementById("set_tautulli_form_button").style.opacity = '1';
alert('Tautulli IP is required for Tautulli to function.');
document.getElementById('tautulli_ip').focus();
return;
}
if(tautulli_length == 0) {
document.getElementById("set_tautulli_form_button").disabled = false;
document.getElementById("set_tautulli_form_button").style.opacity = '1';
alert('Tautulli item length is required for Tautulli to function.');
document.getElementById('tautulli_length').focus();
return;
}
if(tautulli_port == 0) {
document.getElementById("set_tautulli_form_button").disabled = false;
document.getElementById("set_tautulli_form_button").style.opacity = '1';
alert('Tautulli port is required for Tautulli to function. Use 80 for HTTP, 443 for HTTPS.');
document.getElementById('tautulli_port').focus();
return;
}
tautulli_settings_form = {
"clear_cache" : clear_cache,
"data_type" : "tautulli_config",
"tautulli_config" : {
"tautulli_apikey" : tautulli_apikey,
"tautulli_ip" : tautulli_ip,
"tautulli_port" : tautulli_port,
"tautulli_length" : tautulli_length,
"tautulli_root" : tautulli_root,
"tautulli_libraries" : tautulli_libraries,
"tautulli_grouping" : tautulli_grouping,
"tautulli_https" : tautulli_https
},
"wrapperr_data" : {},
"wrapperr_customize" : {}
};
var tautulli_settings_data = JSON.stringify(tautulli_settings_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
alert('Failed to parse API response.');
console.log('Failed to parse API response. Response: ' + this.responseText)
document.getElementById("set_tautulli_form_button").disabled = false;
document.getElementById("set_tautulli_form_button").style.opacity = '1';
}
if(result.error) {
alert(result.message);
document.getElementById("set_tautulli_form_button").disabled = false;
document.getElementById("set_tautulli_form_button").style.opacity = '1';
} else {
get_config(get_cookie('wrapperr-admin'));
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/set/config");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send(tautulli_settings_data);
return;
}
function set_wrapperr_settings() {
topFunction();
var html = '<div class="form-group newline">';
html += '<button class="form-control btn" name="admin_menu_return_button" id="admin_menu_return_button" onclick="get_config(get_cookie(\'wrapperr-admin\'));"><img src="../assets/trash.svg" class="btn_logo"></img><p2 id="admin_menu_return_button_text">Return</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<form id="wrapperr_settings_form" onsubmit="return false;">'
var wrapped_start_obj = new Date(wrapped_start);
var temp_date = wrapped_start_obj.toLocaleString("sv-SE", {
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit"
}).replace(" ", "T");
html += '<div class="form-group newline">';
html += '<div class="warning">!<br>The more unique days in the wrapped period, the more Tautulli API calls. It is recommended to enable "Cache results for later use" to prevent long load times.</div>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapped_start" title="The start of the period you want wrapped.">Start of wrapped period:<br>';
html += '<input type="datetime-local" class="form-control" id="wrapped_start" value="' + temp_date + '" required /><br>';
html += '</div>';
var wrapped_end_obj = new Date(wrapped_end);
var temp_date = wrapped_end_obj.toLocaleString("sv-SE", {
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit"
}).replace(" ", "T");
html += '<div class="form-group">';
html += '<label for="wrapped_end" title="The end of your wrapped period. All data until this point is viable.">End of wrapped period:<br>';
html += '<input type="datetime-local" class="form-control" id="wrapped_end" value="' + temp_date + '" required /></label>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="timezone" title="The timezone the data is located in, like \'Europe/Oslo\'. Type it exactly as it is specified in the PHP documentation.">Timezone: <a href="https://en.wikipedia.org/wiki/List_of_tz_database_time_zones" target="_blank">(List)</a></label>';
html += '<input type="text" class="form-control" id="timezone" value="' + timezone + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="application_name_str" title="Title of application shown on the pages. Replaces Wrapperr.">Application Name: (Optional)</label>';
html += '<input type="text" class="form-control" id="application_name_str" value="' + application_name_str + '" autocomplete="off" placeholder=""/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="application_url_str" title="The domain/URL for Wrapperr. For example \'https://wrapperr-is-cool.example\'.">Wrapperr URL: (Optional)</label>';
html += '<input type="text" class="form-control" id="application_url_str" value="' + application_url_str + '" autocomplete="off" placeholder=""/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_root" title="Subfolder for Wrapperr, no slashes needed at the beginning or end. It is the folder accessed after the main IP/domain. For example: \'mycooldomain.com/wrapperr\' would mean you enter \'wrapperr\' here.">Wrapperr URL Base: (Optional)</label>';
html += '<input type="text" class="form-control" id="wrapperr_root" value="' + wrapperr_root + '" autocomplete="off" placeholder=""/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="create_share_links" title="Grants users the ability to create a URL for sharing. URL is valid for 7 days.">Allow shareable URL creation:<br>';
html += '<input type="checkbox" class="form-control" id="create_share_links" ';
if(create_share_links) {
html += 'checked="' + create_share_links + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="use_logs" title="Logs every API action into a log-file in the config folder. Requires a Wrapperr restart.">Log API actions:<br>';
html += '<input type="checkbox" class="form-control" id="use_logs" ';
if(use_logs) {
html += 'checked="' + use_logs + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="plex_auth" title="Whether users can unwrap stats using any given Plex username/e-mail or by signing into Plex.">Use Plex Auth:<br>';
html += '<input type="checkbox" class="form-control" id="plex_auth" ';
if(plex_auth) {
html += 'checked="' + plex_auth + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="winter_theme" title="Disable if you don\'t like snow :(">Winter theme:<br>';
html += '<input type="checkbox" class="form-control" id="winter_theme" ';
if(winter_theme) {
html += 'checked="' + winter_theme + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<div class="warning">!<br>Have this enabled to ensure short load times for users. Especially if the wrapped period is long.</div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<label for="use_cache" title="Caches your results in cache.json for later use.">Cache results for later use:<br>';
html += '<input type="checkbox" class="form-control" id="use_cache" ';
if(use_cache) {
html += 'checked="' + use_cache + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group newline" title="Clear the cache now to include the newest settings.">';
html += '<label for="clear_cache">Clear cache now:<br>';
html += '<input type="checkbox" class="form-control" id="clear_cache" checked /></label>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button type="submit" class="form-control btn" onclick="set_wrapperr_settings_call();" id="set_wrapperr_settings_form_button"><img src="../assets/done.svg" class="btn_logo"></img><p2 id="set_wrapperr_settings_form_button_text">Save</p2></button>';
html += '</div>';
html += '</form>';
document.getElementById("setup").innerHTML = html;
}
function set_wrapperr_settings_call() {
document.getElementById("set_wrapperr_settings_form_button").disabled = true;
document.getElementById("set_wrapperr_settings_form_button").style.opacity = '0.5';
wrapped_start = new Date(document.getElementById('wrapped_start').value);
wrapped_end = new Date(document.getElementById('wrapped_end').value);
use_cache = document.getElementById('use_cache').checked;
use_logs = document.getElementById('use_logs').checked;
plex_auth = document.getElementById('plex_auth').checked;
wrapperr_root = document.getElementById('wrapperr_root').value;
application_name_str = document.getElementById('application_name_str').value;
application_url_str = document.getElementById('application_url_str').value;
create_share_links = document.getElementById('create_share_links').checked;
timezone = document.getElementById('timezone').value;
clear_cache = document.getElementById('clear_cache').checked;
winter_theme = document.getElementById('winter_theme').checked;
if(timezone === '') {
document.getElementById("set_wrapperr_settings_form_button").disabled = false;
document.getElementById("set_wrapperr_settings_form_button").style.opacity = '1';
alert('Timezone is required for Wrapperr to function.');
document.getElementById('timezone').focus();
return;
}
if(wrapped_end < wrapped_start) {
document.getElementById("set_wrapperr_customization_form_button").disabled = false;
document.getElementById("set_wrapperr_customization_form_button").style.opacity = '1';
alert('The wrapped end period must be later than the wrapped start period.');
document.getElementById('wrapped_end').focus();
return;
}
if(wrapped_end === '') {
document.getElementById("set_wrapperr_customization_form_button").disabled = false;
document.getElementById("set_wrapperr_customization_form_button").style.opacity = '1';
alert('Ending of wrapped period is required for Wrapperr to function.');
document.getElementById('wrapped_end').focus();
return;
}
if(wrapped_start === '') {
document.getElementById("set_wrapperr_customization_form_button").disabled = false;
document.getElementById("set_wrapperr_customization_form_button").style.opacity = '1';
alert('Start of wrapped period is required for Wrapperr to function.');
document.getElementById('wrapped_start').focus();
return;
}
wrapperr_settings_form = {
"clear_cache" : clear_cache,
"data_type" : "wrapperr_data",
"tautulli_config" : {},
"wrapperr_customize" : {},
"wrapperr_data" : {
"use_cache" : use_cache,
"use_logs" : use_logs,
"plex_auth" : plex_auth,
"wrapperr_root" : wrapperr_root,
"create_share_links" : create_share_links,
"timezone" : timezone,
"application_name" : application_name_str,
"application_url" : application_url_str,
"wrapped_start" : Math.round(wrapped_start.getTime() / 1000),
"wrapped_end" : Math.round(wrapped_end.getTime() / 1000),
"winter_theme" : winter_theme
}
};
var wrapperr_settings_data = JSON.stringify(wrapperr_settings_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
alert('Failed to parse API response.');
console.log('Failed to parse API response. Response: ' + this.responseText);
document.getElementById("set_wrapperr_settings_form_button").disabled = false;
document.getElementById("set_wrapperr_settings_form_button").style.opacity = '1';
}
if(result.error) {
alert(result.message);
document.getElementById("set_wrapperr_settings_form_button").disabled = false;
document.getElementById("set_wrapperr_settings_form_button").style.opacity = '1';
} else {
get_config(get_cookie('wrapperr-admin'));
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/set/config");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send(wrapperr_settings_data);
return;
}
function set_wrapperr_customization() {
topFunction();
var html = '<div class="form-group newline">';
html += '<button class="form-control btn" name="admin_menu_return_button" id="admin_menu_return_button" onclick="get_config(get_cookie(\'wrapperr-admin\'));"><img src="../assets/trash.svg" class="btn_logo"></img><p2 id="admin_menu_return_button_text">Return</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<form id="wrapperr_customization_form" onsubmit="return false;">'
html += '<div class="form-group">';
html += '<label for="stats_order_by_plays" title="Whether top lists can be ordered by plays.">Order lists by plays:<br>';
html += '<input type="checkbox" class="form-control" id="stats_order_by_plays" ';
if(stats_order_by_plays) {
html += 'checked="' + stats_order_by_plays + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="stats_order_by_duration" title="Whether top lists can be ordered by duration. Automatically enabled if Wrapperr can\'t order by plays.">Order lists by duration:<br>';
html += '<input type="checkbox" class="form-control" id="stats_order_by_duration" ';
if(stats_order_by_duration) {
html += 'checked="' + stats_order_by_duration + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_front_page_title" title="Introduction title that is shown on top of the front page.">Introduction title for the front page:<br>';
html += '<textarea cols="40" rows="5" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 5em;" id="wrapperr_front_page_title" name="wrapperr_front_page_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_front_page_subtitle" title="Introduction subtitle text that is shown on the front page.">Introduction subtitle for the front page:<br>';
html += '<textarea cols="40" rows="5" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 5em;" id="wrapperr_front_page_subtitle" name="wrapperr_front_page_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="stats_intro_title" title="Introduction title that is shown when the statistics are done loading.">Introduction title for statistics page:<br>';
html += '<textarea cols="40" rows="5" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 5em;" id="stats_intro_title" name="stats_intro_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="stats_intro_subtitle" title="Introduction subtitle text that is shown when the statistics are done loading. Could be used to inform about chosen timeframe.">Introduction subtitle for statistics page:<br>';
html += '<textarea cols="40" rows="5" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 5em;" id="stats_intro_subtitle" name="stats_intro_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<label for="get_user_movie_stats" title="Includes movie statistics in your wrapped period.">Get users movie statistics:<br>';
html += '<input type="checkbox" class="form-control" id="get_user_movie_stats" ';
if(get_user_movie_stats) {
html += 'checked="' + get_user_movie_stats + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form_hidden" id="get_user_movie_stats_custom">';
html += '<div class="form_block" id="plural">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_title" title="Title on top of this section.">Movies title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_title" name="get_user_movie_stats_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_subtitle" title="Subtitle underneath title on top of this section.">Movies subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_subtitle" name="get_user_movie_stats_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_subsubtitle" title="Sub-subtitle underneath subtitle on top of this section.">Movies sub-subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_subsubtitle" name="get_user_movie_stats_subsubtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="singular">';
html += '<div class="form-group" id="singular">';
html += '<label for="get_user_movie_stats_subtitle_one" title="Subtitle underneath title on top of this section.">Movies subtitle for one movie:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_subtitle_one" name="get_user_movie_stats_subtitle_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_subsubtitle_one" title="Sub-subtitle underneath subtitle on top of this section.">Movies sub-subtitle for one movie:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_subsubtitle_one" name="get_user_movie_stats_subsubtitle_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="none">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_subtitle_none" title="Subtitle underneath title on top of this section.">Movies subtitle for no movies:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_subtitle_none" name="get_user_movie_stats_subtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_subsubtitle_none" title="Sub-subtitle underneath subtitle on top of this section.">Movies sub-subtitle for no movies:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_subsubtitle_none" name="get_user_movie_stats_subsubtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_top_movie" title="Custom title of the list of top movies (singular).">Title of top movie list:<br>';
html += '<input type="text" class="form-control" id="get_user_movie_stats_top_movie" value="' + get_user_movie_stats_top_movie + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_top_movie_plural" title="Custom title of the list of top movies (plural).">Title of top movies list:<br>';
html += '<input type="text" class="form-control" id="get_user_movie_stats_top_movie_plural" value="' + get_user_movie_stats_top_movie_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_movie_completion_title" title="Title stating the completion of the seen movie.">Movie completion title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_movie_completion_title" name="get_user_movie_stats_movie_completion_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_movie_completion_title_plural" title="Title stating the average completion of the seen movies.">Movies average completion title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_movie_completion_title_plural" name="get_user_movie_stats_movie_completion_title_plural" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_movie_completion_subtitle" title="Subtitle underneath the movie-completion title.">Movies/movie completion subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_movie_completion_subtitle" name="get_user_movie_stats_movie_completion_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="plural">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_pause_title" title="Title of the paused movie section.">Movie paused title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_pause_title" name="get_user_movie_stats_pause_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_pause_subtitle" title="Subtitle of the paused movie section.">Movie paused subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_pause_subtitle" name="get_user_movie_stats_pause_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="singular">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_pause_title_one" title="Title of the paused movie section when one movie was watched, but still paused.">One movie paused title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_pause_title_one" name="get_user_movie_stats_pause_title_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_pause_subtitle_one" title="Subtitle of the paused movie section when one movie was watched, but still paused paused.">One movie paused subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_pause_subtitle_one" name="get_user_movie_stats_pause_subtitle_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="none">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_pause_title_none" title="Title of the paused movie section when no movies were ever paused.">No movie paused title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_pause_title_none" name="get_user_movie_stats_pause_title_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_pause_subtitle_none" title="Subtitle of the paused movie section when no movies were ever paused.">No movie paused subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_pause_subtitle_none" name="get_user_movie_stats_pause_subtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_oldest_title" title="Title of the oldest movie section.">Movie oldest title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_oldest_title" name="get_user_movie_stats_oldest_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_oldest_subtitle" title="Subtitle of the oldest movie section. Applied if the other spesfic ones are not applicable.">Movie oldest subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_oldest_subtitle" name="get_user_movie_stats_oldest_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_oldest_subtitle_pre_1950" title="Subtitle of the oldest movie section. Applied if movie is older than 1950.">Movie oldest subtitle (<1950):<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_oldest_subtitle_pre_1950" name="get_user_movie_stats_oldest_subtitle_pre_1950" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_oldest_subtitle_pre_1975" title="Subtitle of the oldest movie section. Applied if movie is older than 1975.">Movie oldest subtitle (<1975):<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_oldest_subtitle_pre_1975" name="get_user_movie_stats_oldest_subtitle_pre_1975" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_oldest_subtitle_pre_2000" title="Subtitle of the oldest movie section. Applied if movie is older than 2000.">Movie oldest subtitle (<2000):<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_oldest_subtitle_pre_2000" name="get_user_movie_stats_oldest_subtitle_pre_2000" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_movie_stats_spent_title" title="Title of the time spent on movies section.">Movie spent title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_movie_stats_spent_title" name="get_user_movie_stats_spent_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" name="get_user_movie_stats_custom_button" id="get_user_movie_stats_custom_button" onclick="toggle_hidden_form(\'get_user_movie_stats_custom\')"><img src="../assets/tweak.svg" class="btn_logo"></img><p2 id="get_user_movie_stats_custom_button_text">Custom text</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats" title="Includes show statistics in your wrapped period.">Get users show statistics:<br>';
html += '<input type="checkbox" class="form-control" id="get_user_show_stats" ';
if(get_user_show_stats) {
html += 'checked="' + get_user_show_stats + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_buddy" title="Includes the users top show-buddy in your wrapped period. Requires show stats.">Get users show-buddy:<br>';
html += '<input type="checkbox" class="form-control" id="get_user_show_stats_buddy" ';
if(get_user_show_stats_buddy) {
html += 'checked="' + get_user_show_stats_buddy + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '</div>';
html += '<div class="form_hidden" id="get_user_show_stats_custom">';
html += '<div class="form_block" id="plural">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_title" title="Title on top of this section.">Shows title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_title" name="get_user_show_stats_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_subtitle" title="Subtitle underneath title on top of this section.">Shows subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_subtitle" name="get_user_show_stats_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_subsubtitle" title="Sub-subtitle underneath subtitle on top of this section.">Shows sub-subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_subsubtitle" name="get_user_show_stats_subsubtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="singular">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_subtitle_one" title="Subtitle underneath title on top of this section.">Shows subtitle for one show:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_subtitle_one" name="get_user_show_stats_subtitle_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_subsubtitle_one" title="Sub-subtitle underneath subtitle on top of this section.">Shows sub-subtitle for one show:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_subsubtitle_one" name="get_user_show_stats_subsubtitle_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="none">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_subtitle_none" title="Subtitle underneath title on top of this section.">Shows subtitle for no shows:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_subtitle_none" name="get_user_show_stats_subtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_subsubtitle_none" title="Sub-subtitle underneath subtitle on top of this section.">Shows sub-subtitle for no shows:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_subsubtitle_none" name="get_user_show_stats_subsubtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_top_show" title="Custom title of the list of top show (singular).">Title of top show list:<br>';
html += '<input type="text" class="form-control" id="get_user_show_stats_top_show" value="' + get_user_show_stats_top_show + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_top_show_plural" title="Custom title of the list of top shows (plural).">Title of top shows list:<br>';
html += '<input type="text" class="form-control" id="get_user_show_stats_top_show_plural" value="' + get_user_show_stats_top_show_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_most_played_title" title="Title on top of this section showing the top played episode.">Shows title for top episode:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_most_played_title" name="get_user_show_stats_most_played_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_most_played_subtitle" title="Subtitle underneath the title of this section.">Shows subtitle for top episode:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_most_played_subtitle" name="get_user_show_stats_most_played_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_buddy_title" title="Title on top of this section showing the top show and the buddy who watches it as well.">Shows title buddy section:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_buddy_title" name="get_user_show_stats_buddy_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_buddy_subtitle" title="Subtitle underneath the title of this section.">Shows subtitle buddy section:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_buddy_subtitle" name="get_user_show_stats_buddy_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="none">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_buddy_title_none" title="Title on top of this section showing the top show and the buddy who watches it as well, only, no buddy could be found.">Shows title buddy section (none):<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_buddy_title_none" name="get_user_show_stats_buddy_title_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_buddy_subtitle_none" title="Subtitle underneath the title of this section.">Shows subtitle buddy section (none):<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_buddy_subtitle_none" name="get_user_show_stats_buddy_subtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_show_stats_spent_title" title="Title of the time spent on shows section.">Show spent title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_show_stats_spent_title" name="get_user_show_stats_spent_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" name="get_user_show_stats_custom_button" id="get_user_show_stats_custom_button" onclick="toggle_hidden_form(\'get_user_show_stats_custom\')"><img src="../assets/tweak.svg" class="btn_logo"></img><p2 id="get_user_show_stats_custom_button_text">Custom text</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<label for="get_user_music_stats" title="Includes music statistics in your wrapped period.">Get users music statistics:<br>';
html += '<input type="checkbox" class="form-control" id="get_user_music_stats" ';
if(get_user_music_stats) {
html += 'checked="' + get_user_music_stats + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form_hidden" id="get_user_music_stats_custom">';
html += '<div class="form_block">';
html += '<div class="form-group" id="plural">';
html += '<label for="get_user_music_stats_title" title="Title on top of this section.">Music title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_title" name="get_user_music_stats_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_subtitle" title="Subtitle underneath title on top of this section.">Music subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_subtitle" name="get_user_music_stats_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_subsubtitle" title="Sub-subtitle underneath subtitle on top of this section.">Music sub-subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_subsubtitle" name="get_user_music_stats_subsubtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="singular">';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_subtitle_one" title="Subtitle underneath title on top of this section.">Music subtitle for one track:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_subtitle_one" name="get_user_music_stats_subtitle_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_subsubtitle_one" title="Sub-subtitle underneath subtitle on top of this section.">Music sub-subtitle for one track:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_subsubtitle_one" name="get_user_music_stats_subsubtitle_one" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="none">';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_subtitle_none" title="Subtitle underneath title on top of this section.">Music subtitle for no tracks:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_subtitle_none" name="get_user_music_stats_subtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_subsubtitle_none" title="Sub-subtitle underneath subtitle on top of this section.">Music sub-subtitle for no tracks:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_subsubtitle_none" name="get_user_music_stats_subsubtitle_none" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="singular">';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_top_track" title="Custom title of the list of top track (singular).">Title of top track list:<br>';
html += '<input type="text" class="form-control" id="get_user_music_stats_top_track" value="' + get_user_music_stats_top_track + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="plural">';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_top_track_plural" title="Custom title of the list of top tracks (plural).">Title of top tracks list:<br>';
html += '<input type="text" class="form-control" id="get_user_music_stats_top_track_plural" value="' + get_user_music_stats_top_track_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_top_album_plural" title="Custom title of the list of top albums (plural).">Title of top albums list:<br>';
html += '<input type="text" class="form-control" id="get_user_music_stats_top_album_plural" value="' + get_user_music_stats_top_album_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_top_artist_plural" title="Custom title of the list of top artists (plural).">Title of top artists list:<br>';
html += '<input type="text" class="form-control" id="get_user_music_stats_top_artist_plural" value="' + get_user_music_stats_top_artist_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_oldest_album_title" title="Title on top of this section.">Music title for oldest album:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_oldest_album_title" name="get_user_music_stats_oldest_album_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_oldest_album_subtitle" title="Subtitle underneath title of this section.">Music subtitle for oldest album:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_oldest_album_subtitle" name="get_user_music_stats_oldest_album_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_spent_title" title="Title on top of this section showing time spent listening to music.">Music spent title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_spent_title" name="get_user_music_stats_spent_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_user_music_stats_spent_subtitle" title="Subtitle underneath title of this section.">Music spent subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_user_music_stats_spent_subtitle" name="get_user_music_stats_spent_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" name="get_user_music_stats_custom_button" id="get_user_music_stats_custom_button" onclick="toggle_hidden_form(\'get_user_music_stats_custom\')"><img src="../assets/tweak.svg" class="btn_logo"></img><p2 id="get_user_music_stats_custom_button_text">Custom text</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_movies" title="Includes server-wide movie statistics in your wrapped period.">Get server-wide movie statistics:<br>';
html += '<input type="checkbox" class="form-control" id="get_year_stats_movies" ';
if(get_year_stats_movies) {
html += 'checked="' + get_year_stats_movies + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_shows" title="Includes server-wide show statistics in your wrapped period.">Get server-wide show statistics:<br>';
html += '<input type="checkbox" class="form-control" id="get_year_stats_shows" ';
if(get_year_stats_shows) {
html += 'checked="' + get_year_stats_shows + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_music" title="Includes server-wide music statistics in your wrapped period.">Get server-wide music statistics:<br>';
html += '<input type="checkbox" class="form-control" id="get_year_stats_music" ';
if(get_year_stats_music) {
html += 'checked="' + get_year_stats_music + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_leaderboard" title="Creates a user leaderboard based on the server-wide statistics in your wrapped period.">Get server-wide leaderboard rankings:<br>';
html += '<input type="checkbox" class="form-control" id="get_year_stats_leaderboard" ';
if(get_year_stats_leaderboard) {
html += 'checked="' + get_year_stats_leaderboard + '" ';
}
html += '/><br>';
html += '</div>';
html += '<div class="form-group newline">';
html += '</div>';
html += '<div class="form_hidden" id="get_year_stats_custom">';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_year_stats_title" title="Title on top of this section.">Server-wide title:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_year_stats_title" name="get_year_stats_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_subtitle" title="Subtitle underneath title on top of this section.">Server-wide subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_year_stats_subtitle" name="get_year_stats_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_subsubtitle" title="Sub-subtitle underneath subtitle on top of this section.">Server-wide sub-subtitle:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_year_stats_subsubtitle" name="get_year_stats_subsubtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '<div class="form_block" id="">';
html += '<div class="form-group">';
html += '<label for="get_year_stats_movies_title" title="Custom title of the list of top movies.">Title of top movies list:<br>';
html += '<input type="text" class="form-control" id="get_year_stats_movies_title" value="' + get_year_stats_movies_title + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_shows_title" title="Custom title of the list of top shows.">Title of top shows list:<br>';
html += '<input type="text" class="form-control" id="get_year_stats_shows_title" value="' + get_year_stats_shows_title + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_music_title" title="Custom title of the list of top artists.">Title of top artists list:<br>';
html += '<input type="text" class="form-control" id="get_year_stats_music_title" value="' + get_year_stats_music_title + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_leaderboard_title" title="Custom title of the list of top users.">Title of top users list:<br>';
html += '<input type="text" class="form-control" id="get_year_stats_leaderboard_title" value="' + get_year_stats_leaderboard_title + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="get_year_stats_movies_duration_title" title="Title on top of this section showing duration spent on movies.">Server-wide movie duration:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_year_stats_movies_duration_title" name="get_year_stats_movies_duration_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_shows_duration_title" title="Title on top of this section showing duration spent on shows.">Server-wide show duration:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_year_stats_shows_duration_title" name="get_year_stats_shows_duration_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_music_duration_title" title="Title on top of this section showing duration spent on music.">Server-wide music duration:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_year_stats_music_duration_title" name="get_year_stats_music_duration_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="get_year_stats_duration_sum_title" title="Title on top of this section showing duration spent on all categories.">Server-wide content duration:<br>';
html += '<textarea cols="40" rows="2" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 2em;" id="get_year_stats_duration_sum_title" name="get_year_stats_duration_sum_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '</div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" name="get_year_stats_custom_button" id="get_year_stats_custom_button" onclick="toggle_hidden_form(\'get_year_stats_custom\')"><img src="../assets/tweak.svg" class="btn_logo"></img><p2 id="get_year_stats_custom_button_text">Custom text</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="stats_outro_title" title="Title that is shown at the bottom, when the statistics are done.">Outro title for statistics page:<br>';
html += '<textarea cols="40" rows="5" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 5em;" id="stats_outro_title" name="stats_outro_title" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="stats_outro_subtitle" title="Subtitle that is shown at the bottom, when the statistics are done.">Outro subtitle for statistics page:<br>';
html += '<textarea cols="40" rows="5" class="form-control" style="overflow-x: hidden;resize:vertical;min-height: 5em;" id="stats_outro_subtitle" name="stats_outro_subtitle" value="" autocomplete="off"></textarea></label>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form_hidden" id="wrapperr_language">';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="wrapperr_and" title="Word alternative for when \'and\' appears.">Alternative for \'and\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_and" value="' + wrapperr_and + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="wrapperr_play" title="Word alternative for when \'play\' appears.">Alternative for \'play\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_play" value="' + wrapperr_play + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_play_plural" title="Word alternative for when \'plays\' appears.">Alternative for \'plays\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_play_plural" value="' + wrapperr_play_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="wrapperr_day" title="Word alternative for when \'day\' appears.">Alternative for \'day\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_day" value="' + wrapperr_day + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_day_plural" title="Word alternative for when \'days\' appears.">Alternative for \'days\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_day_plural" value="' + wrapperr_day_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="wrapperr_hour" title="Word alternative for when \'hour\' appears.">Alternative for \'hour\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_hour" value="' + wrapperr_hour + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_hour_plural" title="Word alternative for when \'hours\' appears.">Alternative for \'hours\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_hour_plural" value="' + wrapperr_hour_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="wrapperr_minute" title="Word alternative for when \'minute\' appears.">Alternative for \'minute\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_minute" value="' + wrapperr_minute + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_minute_plural" title="Word alternative for when \'minutes\' appears.">Alternative for \'minutes\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_minute_plural" value="' + wrapperr_minute_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="wrapperr_second" title="Word alternative for when \'second\' appears.">Alternative for \'second\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_second" value="' + wrapperr_second + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_second_plural" title="Word alternative for when \'seconds\' appears.">Alternative for \'seconds\':<br>';
html += '<input type="text" class="form-control" id="wrapperr_second_plural" value="' + wrapperr_second_plural + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '<div class="form_block">';
html += '<div class="form-group">';
html += '<label for="wrapperr_sort_plays" title="Text alternative for \'Sort by plays\' button.">\'Sort by plays\' alternative:<br>';
html += '<input type="text" class="form-control" id="wrapperr_sort_plays" value="' + wrapperr_sort_plays + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '<div class="form-group">';
html += '<label for="wrapperr_sort_duration" title="Text alternative for \'Sort by duration\' button.">\'Sort by duration\' alternative:<br>';
html += '<input type="text" class="form-control" id="wrapperr_sort_duration" value="' + wrapperr_sort_duration + '" autocomplete="off" placeholder="" required /><br>';
html += '</div>';
html += '</div>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button class="form-control btn" name="wrapperr_language_button" id="get_user_show_stats_custom_button" onclick="toggle_hidden_form(\'wrapperr_language\')"><img src="../assets/tweak.svg" class="btn_logo"></img><p2 id="wrapperr_language_button_text">Custom language</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += '<div class="form-group newline" title="Clear the cache now to include the newest settings.">';
html += '<label for="clear_cache">Clear cache now:<br>';
html += '<input type="checkbox" class="form-control" id="clear_cache" checked /></label>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<button type="submit" class="form-control btn" onclick="set_wrapperr_customization_call();" id="set_wrapperr_customization_form_button"><img src="../assets/done.svg" class="btn_logo"></img><p2 id="set_wrapperr_customization_form_button_text">Save</p2></button>';
html += '</div>';
html += '</form>';
// Place content from config
document.getElementById("setup").innerHTML = html;
document.getElementById("wrapperr_front_page_title").value = wrapperr_front_page_title;
document.getElementById("wrapperr_front_page_subtitle").value = wrapperr_front_page_subtitle;
document.getElementById("stats_intro_title").value = stats_intro_title;
document.getElementById("stats_intro_subtitle").value = stats_intro_subtitle;
document.getElementById("stats_outro_title").value = stats_outro_title;
document.getElementById("stats_outro_subtitle").value = stats_outro_subtitle;
document.getElementById("get_user_movie_stats_title").value = get_user_movie_stats_title;
document.getElementById("get_user_movie_stats_subtitle").value = get_user_movie_stats_subtitle;
document.getElementById("get_user_movie_stats_subsubtitle").value = get_user_movie_stats_subsubtitle;
document.getElementById("get_user_movie_stats_subtitle_one").value = get_user_movie_stats_subtitle_one;
document.getElementById("get_user_movie_stats_subsubtitle_one").value = get_user_movie_stats_subsubtitle_one;
document.getElementById("get_user_movie_stats_subtitle_none").value = get_user_movie_stats_subtitle_none;
document.getElementById("get_user_movie_stats_subsubtitle_none").value = get_user_movie_stats_subsubtitle_none;
document.getElementById("get_user_movie_stats_movie_completion_title").value = get_user_movie_stats_movie_completion_title;
document.getElementById("get_user_movie_stats_movie_completion_title_plural").value = get_user_movie_stats_movie_completion_title_plural;
document.getElementById("get_user_movie_stats_movie_completion_subtitle").value = get_user_movie_stats_movie_completion_subtitle;
document.getElementById("get_user_movie_stats_pause_title").value = get_user_movie_stats_pause_title;
document.getElementById("get_user_movie_stats_pause_subtitle").value = get_user_movie_stats_pause_subtitle;
document.getElementById("get_user_movie_stats_pause_title_one").value = get_user_movie_stats_pause_title_one;
document.getElementById("get_user_movie_stats_pause_subtitle_one").value = get_user_movie_stats_pause_subtitle_one;
document.getElementById("get_user_movie_stats_pause_title_none").value = get_user_movie_stats_pause_title_none;
document.getElementById("get_user_movie_stats_pause_subtitle_none").value = get_user_movie_stats_pause_subtitle_none;
document.getElementById("get_user_movie_stats_oldest_title").value = get_user_movie_stats_oldest_title;
document.getElementById("get_user_movie_stats_oldest_subtitle").value = get_user_movie_stats_oldest_subtitle;
document.getElementById("get_user_movie_stats_oldest_subtitle_pre_1950").value = get_user_movie_stats_oldest_subtitle_pre_1950;
document.getElementById("get_user_movie_stats_oldest_subtitle_pre_1975").value = get_user_movie_stats_oldest_subtitle_pre_1975;
document.getElementById("get_user_movie_stats_oldest_subtitle_pre_2000").value = get_user_movie_stats_oldest_subtitle_pre_2000;
document.getElementById("get_user_movie_stats_spent_title").value = get_user_movie_stats_spent_title;
document.getElementById("get_user_show_stats_title").value = get_user_show_stats_title;
document.getElementById("get_user_show_stats_subtitle").value = get_user_show_stats_subtitle;
document.getElementById("get_user_show_stats_subsubtitle").value = get_user_show_stats_subsubtitle;
document.getElementById("get_user_show_stats_subtitle_one").value = get_user_show_stats_subtitle_one;
document.getElementById("get_user_show_stats_subsubtitle_one").value = get_user_show_stats_subsubtitle_one;
document.getElementById("get_user_show_stats_subtitle_none").value = get_user_show_stats_subtitle_none;
document.getElementById("get_user_show_stats_subsubtitle_none").value = get_user_show_stats_subsubtitle_none;
document.getElementById("get_user_show_stats_most_played_title").value = get_user_show_stats_most_played_title;
document.getElementById("get_user_show_stats_most_played_subtitle").value = get_user_show_stats_most_played_subtitle;
document.getElementById("get_user_show_stats_buddy_title").value = get_user_show_stats_buddy_title;
document.getElementById("get_user_show_stats_buddy_subtitle").value = get_user_show_stats_buddy_subtitle;
document.getElementById("get_user_show_stats_buddy_title_none").value = get_user_show_stats_buddy_title_none;
document.getElementById("get_user_show_stats_buddy_subtitle_none").value = get_user_show_stats_buddy_subtitle_none;
document.getElementById("get_user_show_stats_spent_title").value = get_user_show_stats_spent_title;
document.getElementById("get_user_music_stats_title").value = get_user_music_stats_title;
document.getElementById("get_user_music_stats_subtitle").value = get_user_music_stats_subtitle;
document.getElementById("get_user_music_stats_subsubtitle").value = get_user_music_stats_subsubtitle;
document.getElementById("get_user_music_stats_subtitle_one").value = get_user_music_stats_subtitle_one;
document.getElementById("get_user_music_stats_subsubtitle_one").value = get_user_music_stats_subsubtitle_one;
document.getElementById("get_user_music_stats_subtitle_none").value = get_user_music_stats_subtitle_none;
document.getElementById("get_user_music_stats_subsubtitle_none").value = get_user_music_stats_subsubtitle_none;
document.getElementById("get_user_music_stats_spent_title").value = get_user_music_stats_spent_title;
document.getElementById("get_user_music_stats_spent_subtitle").value = get_user_music_stats_spent_subtitle;
document.getElementById("get_user_music_stats_oldest_album_title").value = get_user_music_stats_oldest_album_title;
document.getElementById("get_user_music_stats_oldest_album_subtitle").value = get_user_music_stats_oldest_album_subtitle;
document.getElementById("get_year_stats_title").value = get_year_stats_title;
document.getElementById("get_year_stats_subtitle").value = get_year_stats_subtitle;
document.getElementById("get_year_stats_subsubtitle").value = get_year_stats_subsubtitle;
document.getElementById("get_year_stats_movies_duration_title").value = get_year_stats_movies_duration_title;
document.getElementById("get_year_stats_shows_duration_title").value = get_year_stats_shows_duration_title;
document.getElementById("get_year_stats_music_duration_title").value = get_year_stats_music_duration_title;
document.getElementById("get_year_stats_duration_sum_title").value = get_year_stats_duration_sum_title;
}
function toggle_hidden_form(div_id) {
var div = document.getElementById(div_id);
if(div.className === "form_shown") {
div.classList.remove('form_shown');
div.classList.add('form_hidden');
} else {
div.classList.remove('form_hidden');
div.classList.add('form_shown');
}
}
function set_wrapperr_customization_call() {
document.getElementById("set_wrapperr_customization_form_button").disabled = true;
document.getElementById("set_wrapperr_customization_form_button").style.opacity = '0.5';
wrapperr_front_page_title = document.getElementById('wrapperr_front_page_title').value;
wrapperr_front_page_subtitle = document.getElementById('wrapperr_front_page_subtitle').value;
stats_intro_title = document.getElementById('stats_intro_title').value;
stats_intro_subtitle = document.getElementById('stats_intro_subtitle').value;
stats_outro_title = document.getElementById('stats_outro_title').value;
stats_outro_subtitle = document.getElementById('stats_outro_subtitle').value;
stats_order_by_plays = document.getElementById('stats_order_by_plays').checked;
stats_order_by_duration = document.getElementById('stats_order_by_duration').checked;
get_user_movie_stats = document.getElementById('get_user_movie_stats').checked;
get_user_movie_stats_title = document.getElementById('get_user_movie_stats_title').value;
get_user_movie_stats_subtitle = document.getElementById('get_user_movie_stats_subtitle').value;
get_user_movie_stats_subsubtitle = document.getElementById('get_user_movie_stats_subsubtitle').value;
get_user_movie_stats_subtitle_one = document.getElementById('get_user_movie_stats_subtitle_one').value;
get_user_movie_stats_subsubtitle_one = document.getElementById('get_user_movie_stats_subsubtitle_one').value;
get_user_movie_stats_subtitle_none = document.getElementById('get_user_movie_stats_subtitle_none').value;
get_user_movie_stats_subsubtitle_none = document.getElementById('get_user_movie_stats_subsubtitle_none').value;
get_user_movie_stats_top_movie = document.getElementById('get_user_movie_stats_top_movie').value;
get_user_movie_stats_top_movie_plural = document.getElementById('get_user_movie_stats_top_movie_plural').value;
get_user_movie_stats_movie_completion_title = document.getElementById('get_user_movie_stats_movie_completion_title').value;
get_user_movie_stats_movie_completion_title_plural = document.getElementById('get_user_movie_stats_movie_completion_title_plural').value;
get_user_movie_stats_movie_completion_subtitle = document.getElementById('get_user_movie_stats_movie_completion_subtitle').value;
get_user_movie_stats_pause_title = document.getElementById('get_user_movie_stats_pause_title').value;
get_user_movie_stats_pause_subtitle = document.getElementById('get_user_movie_stats_pause_subtitle').value;
get_user_movie_stats_pause_title_one = document.getElementById('get_user_movie_stats_pause_title_one').value;
get_user_movie_stats_pause_subtitle_one = document.getElementById('get_user_movie_stats_pause_subtitle_one').value;
get_user_movie_stats_pause_title_none = document.getElementById('get_user_movie_stats_pause_title_none').value;
get_user_movie_stats_pause_subtitle_none = document.getElementById('get_user_movie_stats_pause_subtitle_none').value;
get_user_movie_stats_oldest_title = document.getElementById('get_user_movie_stats_oldest_title').value;
get_user_movie_stats_oldest_subtitle = document.getElementById('get_user_movie_stats_oldest_subtitle').value;
get_user_movie_stats_oldest_subtitle_pre_1950 = document.getElementById('get_user_movie_stats_oldest_subtitle_pre_1950').value;
get_user_movie_stats_oldest_subtitle_pre_1975 = document.getElementById('get_user_movie_stats_oldest_subtitle_pre_1975').value;
get_user_movie_stats_oldest_subtitle_pre_2000 = document.getElementById('get_user_movie_stats_oldest_subtitle_pre_2000').value;
get_user_movie_stats_spent_title = document.getElementById('get_user_movie_stats_spent_title').value;
get_user_show_stats = document.getElementById('get_user_show_stats').checked;
get_user_show_stats_buddy = document.getElementById('get_user_show_stats_buddy').checked;
get_user_show_stats_title = document.getElementById('get_user_show_stats_title').value;
get_user_show_stats_subtitle = document.getElementById('get_user_show_stats_subtitle').value;
get_user_show_stats_subsubtitle = document.getElementById('get_user_show_stats_subsubtitle').value;
get_user_show_stats_subtitle_one = document.getElementById('get_user_show_stats_subtitle_one').value;
get_user_show_stats_subsubtitle_one = document.getElementById('get_user_show_stats_subsubtitle_one').value;
get_user_show_stats_subtitle_none = document.getElementById('get_user_show_stats_subtitle_none').value;
get_user_show_stats_subsubtitle_none = document.getElementById('get_user_show_stats_subsubtitle_none').value;
get_user_show_stats_top_show = document.getElementById('get_user_show_stats_top_show').value;
get_user_show_stats_top_show_plural = document.getElementById('get_user_show_stats_top_show_plural').value;
get_user_show_stats_most_played_title = document.getElementById('get_user_show_stats_most_played_title').value;
get_user_show_stats_most_played_subtitle = document.getElementById('get_user_show_stats_most_played_subtitle').value;
get_user_show_stats_buddy_title = document.getElementById('get_user_show_stats_buddy_title').value;
get_user_show_stats_buddy_subtitle = document.getElementById('get_user_show_stats_buddy_subtitle').value;
get_user_show_stats_buddy_title_none = document.getElementById('get_user_show_stats_buddy_title_none').value;
get_user_show_stats_buddy_subtitle_none = document.getElementById('get_user_show_stats_buddy_subtitle_none').value;
get_user_show_stats_spent_title = document.getElementById('get_user_show_stats_spent_title').value;
get_user_music_stats = document.getElementById('get_user_music_stats').checked;
get_user_music_stats_title = document.getElementById('get_user_music_stats_title').value;
get_user_music_stats_subtitle = document.getElementById('get_user_music_stats_subtitle').value;
get_user_music_stats_subsubtitle = document.getElementById('get_user_music_stats_subsubtitle').value;
get_user_music_stats_subtitle_one = document.getElementById('get_user_music_stats_subtitle_one').value;
get_user_music_stats_subsubtitle_one = document.getElementById('get_user_music_stats_subsubtitle_one').value;
get_user_music_stats_subtitle_none = document.getElementById('get_user_music_stats_subtitle_none').value;
get_user_music_stats_subsubtitle_none = document.getElementById('get_user_music_stats_subsubtitle_none').value;
get_user_music_stats_top_track = document.getElementById('get_user_music_stats_top_track').value;
get_user_music_stats_top_track_plural = document.getElementById('get_user_music_stats_top_track_plural').value;
get_user_music_stats_top_album_plural = document.getElementById('get_user_music_stats_top_album_plural').value;
get_user_music_stats_top_artist_plural = document.getElementById('get_user_music_stats_top_artist_plural').value;
get_user_music_stats_spent_title = document.getElementById('get_user_music_stats_spent_title').value;
get_user_music_stats_spent_subtitle = document.getElementById('get_user_music_stats_spent_subtitle').value;
get_user_music_stats_oldest_album_title = document.getElementById('get_user_music_stats_oldest_album_title').value;
get_user_music_stats_oldest_album_subtitle = document.getElementById('get_user_music_stats_oldest_album_subtitle').value;
get_year_stats_title = document.getElementById('get_year_stats_title').value;
get_year_stats_subtitle = document.getElementById('get_year_stats_subtitle').value;
get_year_stats_subsubtitle = document.getElementById('get_year_stats_subsubtitle').value;
get_year_stats_movies = document.getElementById('get_year_stats_movies').checked;
get_year_stats_movies_title = document.getElementById('get_year_stats_movies_title').value;
get_year_stats_movies_duration_title = document.getElementById('get_year_stats_movies_duration_title').value;
get_year_stats_shows = document.getElementById('get_year_stats_shows').checked;
get_year_stats_shows_title = document.getElementById('get_year_stats_shows_title').value;
get_year_stats_shows_duration_title = document.getElementById('get_year_stats_shows_duration_title').value;
get_year_stats_music = document.getElementById('get_year_stats_music').checked;
get_year_stats_music_title = document.getElementById('get_year_stats_music_title').value;
get_year_stats_music_duration_title = document.getElementById('get_year_stats_music_duration_title').value;
get_year_stats_leaderboard = document.getElementById('get_year_stats_leaderboard').checked;
get_year_stats_leaderboard_title = document.getElementById('get_year_stats_leaderboard_title').value;
get_year_stats_duration_sum_title = document.getElementById('get_year_stats_duration_sum_title').value;
clear_cache = document.getElementById('clear_cache').checked;
wrapperr_and = document.getElementById("wrapperr_and").value;
wrapperr_play = document.getElementById("wrapperr_play").value;
wrapperr_play_plural = document.getElementById("wrapperr_play_plural").value;
wrapperr_day = document.getElementById("wrapperr_day").value;
wrapperr_day_plural = document.getElementById("wrapperr_day_plural").value;
wrapperr_hour = document.getElementById("wrapperr_hour").value;
wrapperr_hour_plural = document.getElementById("wrapperr_hour_plural").value;
wrapperr_minute = document.getElementById("wrapperr_minute").value;
wrapperr_minute_plural = document.getElementById("wrapperr_minute_plural").value;
wrapperr_second = document.getElementById("wrapperr_second").value;
wrapperr_second_plural = document.getElementById("wrapperr_second_plural").value;
wrapperr_sort_plays = document.getElementById("wrapperr_sort_plays").value;
wrapperr_sort_duration = document.getElementById("wrapperr_sort_duration").value;
wrapperr_customization_form = {
"clear_cache" : clear_cache,
"data_type" : "wrapperr_customize",
"tautulli_config" : {},
"wrapperr_data" : {},
"wrapperr_customize" : {
"wrapperr_front_page_title" : wrapperr_front_page_title,
"wrapperr_front_page_subtitle" : wrapperr_front_page_subtitle,
"stats_intro_title" : stats_intro_title,
"stats_intro_subtitle" : stats_intro_subtitle,
"stats_outro_title" : stats_outro_title,
"stats_outro_subtitle" : stats_outro_subtitle,
"stats_order_by_plays" : stats_order_by_plays,
"stats_order_by_duration" : stats_order_by_duration,
"get_user_movie_stats" : get_user_movie_stats,
"get_user_movie_stats_title" : get_user_movie_stats_title,
"get_user_movie_stats_subtitle" : get_user_movie_stats_subtitle,
"get_user_movie_stats_subsubtitle" : get_user_movie_stats_subsubtitle,
"get_user_movie_stats_subtitle_one" : get_user_movie_stats_subtitle_one,
"get_user_movie_stats_subsubtitle_one" : get_user_movie_stats_subsubtitle_one,
"get_user_movie_stats_subtitle_none" : get_user_movie_stats_subtitle_none,
"get_user_movie_stats_subsubtitle_none" : get_user_movie_stats_subsubtitle_none,
"get_user_movie_stats_top_movie" : get_user_movie_stats_top_movie,
"get_user_movie_stats_top_movie_plural" : get_user_movie_stats_top_movie_plural,
"get_user_movie_stats_movie_completion_title" : get_user_movie_stats_movie_completion_title,
"get_user_movie_stats_movie_completion_title_plural" : get_user_movie_stats_movie_completion_title_plural,
"get_user_movie_stats_movie_completion_subtitle" : get_user_movie_stats_movie_completion_subtitle,
"get_user_movie_stats_pause_title" : get_user_movie_stats_pause_title,
"get_user_movie_stats_pause_subtitle" : get_user_movie_stats_pause_subtitle,
"get_user_movie_stats_pause_title_one" : get_user_movie_stats_pause_title_one,
"get_user_movie_stats_pause_subtitle_one" : get_user_movie_stats_pause_subtitle_one,
"get_user_movie_stats_pause_title_none" : get_user_movie_stats_pause_title_none,
"get_user_movie_stats_pause_subtitle_none" : get_user_movie_stats_pause_subtitle_none,
"get_user_movie_stats_oldest_title" : get_user_movie_stats_oldest_title,
"get_user_movie_stats_oldest_subtitle" : get_user_movie_stats_oldest_subtitle,
"get_user_movie_stats_oldest_subtitle_pre_1950" : get_user_movie_stats_oldest_subtitle_pre_1950,
"get_user_movie_stats_oldest_subtitle_pre_1975" : get_user_movie_stats_oldest_subtitle_pre_1975,
"get_user_movie_stats_oldest_subtitle_pre_2000" : get_user_movie_stats_oldest_subtitle_pre_2000,
"get_user_movie_stats_spent_title" : get_user_movie_stats_spent_title,
"get_user_show_stats" : get_user_show_stats,
"get_user_show_stats_buddy" : get_user_show_stats_buddy,
"get_user_show_stats_title" : get_user_show_stats_title,
"get_user_show_stats_subtitle" : get_user_show_stats_subtitle,
"get_user_show_stats_subsubtitle" : get_user_show_stats_subsubtitle,
"get_user_show_stats_subtitle_one" : get_user_show_stats_subtitle_one,
"get_user_show_stats_subsubtitle_one" : get_user_show_stats_subsubtitle_one,
"get_user_show_stats_subtitle_none" : get_user_show_stats_subtitle_none,
"get_user_show_stats_subsubtitle_none" : get_user_show_stats_subsubtitle_none,
"get_user_show_stats_top_show" : get_user_show_stats_top_show,
"get_user_show_stats_top_show_plural" : get_user_show_stats_top_show_plural,
"get_user_show_stats_spent_title" : get_user_show_stats_spent_title,
"get_user_show_stats_most_played_title" : get_user_show_stats_most_played_title,
"get_user_show_stats_most_played_subtitle" : get_user_show_stats_most_played_subtitle,
"get_user_show_stats_buddy_title" : get_user_show_stats_buddy_title,
"get_user_show_stats_buddy_subtitle" : get_user_show_stats_buddy_subtitle,
"get_user_show_stats_buddy_title_none" : get_user_show_stats_buddy_title_none,
"get_user_show_stats_buddy_subtitle_none" : get_user_show_stats_buddy_subtitle_none,
"get_user_music_stats" : get_user_music_stats,
"get_user_music_stats_title" : get_user_music_stats_title,
"get_user_music_stats_subtitle" : get_user_music_stats_subtitle,
"get_user_music_stats_subsubtitle" : get_user_music_stats_subsubtitle,
"get_user_music_stats_subtitle_one" : get_user_music_stats_subtitle_one,
"get_user_music_stats_subsubtitle_one" : get_user_music_stats_subsubtitle_one,
"get_user_music_stats_subtitle_none" : get_user_music_stats_subtitle_none,
"get_user_music_stats_subsubtitle_none" : get_user_music_stats_subsubtitle_none,
"get_user_music_stats_top_track" : get_user_music_stats_top_track,
"get_user_music_stats_top_track_plural" : get_user_music_stats_top_track_plural,
"get_user_music_stats_top_album_plural" : get_user_music_stats_top_album_plural,
"get_user_music_stats_top_artist_plural" : get_user_music_stats_top_artist_plural,
"get_user_music_stats_spent_title" : get_user_music_stats_spent_title,
"get_user_music_stats_spent_subtitle" : get_user_music_stats_spent_subtitle,
"get_user_music_stats_oldest_album_title" : get_user_music_stats_oldest_album_title,
"get_user_music_stats_oldest_album_subtitle" : get_user_music_stats_oldest_album_subtitle,
"get_year_stats_title" : get_year_stats_title,
"get_year_stats_subtitle" : get_year_stats_subtitle,
"get_year_stats_subsubtitle" : get_year_stats_subsubtitle,
"get_year_stats_movies" : get_year_stats_movies,
"get_year_stats_movies_title" : get_year_stats_movies_title,
"get_year_stats_movies_duration_title" : get_year_stats_movies_duration_title,
"get_year_stats_shows" : get_year_stats_shows,
"get_year_stats_shows_title" : get_year_stats_shows_title,
"get_year_stats_shows_duration_title" : get_year_stats_shows_duration_title,
"get_year_stats_music" : get_year_stats_music,
"get_year_stats_music_title" : get_year_stats_music_title,
"get_year_stats_music_duration_title" : get_year_stats_music_duration_title,
"get_year_stats_leaderboard" : get_year_stats_leaderboard,
"get_year_stats_leaderboard_title" : get_year_stats_leaderboard_title,
"get_year_stats_duration_sum_title" : get_year_stats_duration_sum_title,
"wrapperr_and" : wrapperr_and,
"wrapperr_play" : wrapperr_play,
"wrapperr_play_plural" : wrapperr_play_plural,
"wrapperr_day" : wrapperr_day,
"wrapperr_day_plural" : wrapperr_day_plural,
"wrapperr_hour" : wrapperr_hour,
"wrapperr_hour_plural" : wrapperr_hour_plural,
"wrapperr_minute" : wrapperr_minute,
"wrapperr_minute_plural" : wrapperr_minute_plural,
"wrapperr_second" : wrapperr_second,
"wrapperr_second_plural" : wrapperr_second_plural,
"wrapperr_sort_plays" : wrapperr_sort_plays,
"wrapperr_sort_duration" : wrapperr_sort_duration
}
};
var wrapperr_customization_data = JSON.stringify(wrapperr_customization_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
alert('Failed to parse API response.');
console.log('Failed to parse API response. Response: ' + this.responseText);
document.getElementById("set_wrapperr_customization_form_button").disabled = false;
document.getElementById("set_wrapperr_customization_form_button").style.opacity = '1';
}
if(result.error) {
alert(result.message);
document.getElementById("set_wrapperr_customization_form_button").disabled = false;
document.getElementById("set_wrapperr_customization_form_button").style.opacity = '1';
} else {
get_config(get_cookie('wrapperr-admin'));
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/set/config");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send(wrapperr_customization_data);
return;
}
function caching_menu() {
var html = '<div class="form-group newline">';
html += '<button class="form-control btn" name="admin_menu_return_button" id="admin_menu_return_button" onclick="get_config(get_cookie(\'wrapperr-admin\'));"><img src="../assets/trash.svg" class="btn_logo"></img><p2 id="admin_menu_return_button_text">Return</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += `
<form id='stats_form' class='form' onsubmit='return false' action="" method="post">
<div class='form-group newline'>
<h3>
Caching Tautulli data for later use to prevent long load times.
</h3>
<div class="form_hidden" id="caching_desc">
<p style="font-size:1em;">
When you configured a wrapped period, you set the number of days to process. Each unique day in that period is a new API request to Tautulli, which holds the data which needs processing.
<br>
<br>
Wrapperr can cache data from Tautulli to decrease load times, but it needs to be loaded once. If the time frame is long this can take several minutes. Instead of loading your own stats, you can perform caching here. Afterward, everything is cached and saved. Only additional/new data is downloaded on future Wrapperr usage.
<br>
<br>
The loop used on this page ensures the cache is saved after a certain amount of days are downloaded. If the value below is set to 50, it will save the cache for every 50 days downloaded.
<br>
<br>
</p>
</div>
<div class="form-group newline">
<button class="form-control btn" name="get_user_show_stats_custom_button" id="get_user_show_stats_custom_button" onclick="toggle_hidden_form(\'caching_desc\')"><img src="../assets/about.svg" class="btn_logo"></img><p2 id="get_user_show_stats_custom_button_text">Info</p2></button>
</div>
</div>
<div class='form-group newline'>
<label for="days" title="">Days between safety-save of cache:</label>
<input type="number" class='form-control' name="days" id="days" minlenght='1' value='50' autocomplete="off" required />
</div>
<div class="form-group newline">
<button class="form-control btn" name="cache_button" id="cache_button" onclick="cache_initiate();"><img src="../assets/download.svg" class="btn_logo"></img><p2 id="cache_button_text">Cache</p2></button>
</div>
<div id="cache"></div>
</form>
`;
document.getElementById("setup").innerHTML = html;
}
function add_to_cache_log(log_message, state, color) {
var today = new Date();
var time = pad_number(today.getHours(), 2) + ":" + pad_number(today.getMinutes(), 2) + ":" + pad_number(today.getSeconds(), 2);
if(state) {
style = 'color:' + color + ';';
} else {
style = '';
}
var tablerow = `
<tr class='cacher-tr'>
<td class='cacher-td'>` + time + `</td>
<td class='cacher-td' style='` + style + `'>` + log_message + `</td>
</tr>
`;
document.getElementById('cache_results_body').innerHTML += tablerow
}
function cache_initiate() {
var days = parseInt(document.getElementById('days').value);
var html = `
<form id='stats_form' class='form' onsubmit='return false' action="" method="post">
<div class='form-group newline'>
<img id="loading_icon" src="../assets/loading.gif" style="border-radius: 25px; background-color: white; padding: 1em; width: 4em; height: 4em; display: inline;">
</div>
<h3>Caching log:</h3>
<div id="cache_results" style="max-height: 15em; overflow-y: scroll;">
<table class='cacher-table'>
<tbody id="cache_results_body">
<tr>
<th class='cacher-th' style='width: 25%'>Time</th>
<th class='cacher-th' style='width: 75%'>Message</th>
</tr>
</tbody>
</table
</div>
</form>
`;
document.getElementById('cache').innerHTML = html;
add_to_cache_log('Creating new cache request. Maximum ' + days + ' days.')
get_stats(days);
}
function cache_log(days, result, complete) {
if(result) {
add_to_cache_log('Completed caching with a maximum of ' + days + ' days.', false, '');
} else {
add_to_cache_log('Error caching ' + days + ' days. Stopping.', true, 'var(--red)');
document.getElementById('loading_icon').style.display = "none";
document.getElementById("cache_button").disabled = false;
document.getElementById("cache_button").style.opacity = '1';
}
if(complete) {
add_to_cache_log('Finished caching request.', true, 'var(--green)');
document.getElementById('loading_icon').style.display = "none";
document.getElementById("cache_button").disabled = false;
document.getElementById("cache_button").style.opacity = '1';
} else {
add_to_cache_log('Requesting new cache from Wrapperr. Maximum ' + days + ' days.', false, '');
}
var cache_results = document.getElementById("cache_results");
cache_results.scrollTop = cache_results.scrollHeight;
}
function get_stats(days) {
document.getElementById("cache_button").disabled = true;
document.getElementById("cache_button").style.opacity = '0.5';
stats_form = {
"caching" : true,
"cache_limit" : days
};
var stats_data = JSON.stringify(stats_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
if(this.responseText.includes('Maximum execution time of')) {
cache_log(days, false, true);
document.getElementById("cache_button").disabled = false;
document.getElementById("cache_button").style.opacity = '1';
alert('PHP runtime was exceeded and stopped execution. Lower days cached to prevent this.');
console.log('Failed to parse API response. Error: ' + this.responseText);
} else {
cache_log(days, false, true);
alert('Failed to parse API response.');
console.log('Failed to parse API response. Error: ' + this.responseText);
document.getElementById("cache_button").disabled = false;
document.getElementById("cache_button").style.opacity = '1';
}
return;
}
if(result.error) {
alert(result.message);
cache_log(days, false, true);
} else {
if(!result.data) {
cache_log(days, true, result.data);
get_stats(days);
} else {
cache_log(days, true, result.data);
}
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", root + "api/get/statistics", );
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send(stats_data);
return;
}
function log_menu() {
var html = '<div class="form-group newline">';
html += '<button class="form-control btn" name="admin_menu_return_button" id="admin_menu_return_button" onclick="get_config(get_cookie(\'wrapperr-admin\'));"><img src="../assets/trash.svg" class="btn_logo"></img><p2 id="admin_menu_return_button_text">Return</p2></button>';
html += '</div>';
html += '<div class="form-group newline">';
html += '<hr>';
html += '</div>';
html += `
<form id='stats_form' class='form' onsubmit='return false' action="" method="post">
<div class='form-group newline'>
<h3>
Wrapperr log file
</h3>
<p id='log_result_text'>
</p>
</div>
<div id="cache">
<div id="log_results" style="max-height: 15em; overflow-y: scroll;">
<table class='log-table'>
<tbody id="log_results_body">
<tr>
<th class='log-th' style='width: 15%'>Date</th>
<th class='log-th' style='width: 15%'>Time</th>
<th class='log-th' style='width: 70%'>Message</th>
</tr>
</tbody>
</table>
</div>
</div>
<div class="form-group newline">
<button class="form-control btn" name="log_button" id="log_button" onclick="get_log();" style="opacity: 0.5;" disabled><img src="../assets/synchronize.svg" class="btn_logo"></img><p2 id="cache_button_text">Refresh</p2></button>
</div>
</form>
`;
document.getElementById("setup").innerHTML = html;
get_log();
}
function get_log() {
document.getElementById("log_button").disabled = true;
document.getElementById("log_button").style.opacity = '0.5';
log_data_form = {};
var log_data_data = JSON.stringify(log_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
alert('Failed to parse API response.');
console.log('Failed to parse API response. Error: ' + this.responseText);
document.getElementById("log_button").disabled = false;
document.getElementById("log_button").style.opacity = '1';
return;
}
if(result.error) {
document.getElementById("log_button").disabled = false;
document.getElementById("log_button").style.opacity = '1';
alert(result.message);
} else {
document.getElementById("log_button").disabled = false;
document.getElementById("log_button").style.opacity = '1';
log_form(result.data, result.limit);
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", root + "api/get/log", );
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send(log_data_data);
return;
}
function log_form(log_lines_array, limit) {
var log_table = `
<tr>
<th class='log-th' style='width: 15%'>Date</th>
<th class='log-th' style='width: 15%'>Time</th>
<th class='log-th' style='width: 70%'>Message</th>
</tr>
`;
for(index = 0; index < log_lines_array.length; index++) {
var tablerow = `
<tr class='cacher-tr'>
<td class='cacher-td'>` + log_lines_array[index].date + `</td>
<td class='cacher-td'>` + log_lines_array[index].time + `</td>
<td class='cacher-td'>` + log_lines_array[index].message + `</td>
</tr>
`;
log_table += tablerow
}
document.getElementById('log_results_body').innerHTML = log_table
document.getElementById('log_result_text').innerHTML = 'Retrieved last ' + limit + ' lines.';
var log_results = document.getElementById("log_results");
log_results.scrollTop = log_results.scrollHeight;
}
function test_tautulli_connection() {
document.getElementById("test_connection").disabled = true;
document.getElementById("test_connection").style.opacity = '0.5';
var button = document.getElementById('test_connection');
button.style.backgroundColor = 'lightgrey';
https_temp = document.getElementById('tautulli_https').checked;
ip_temp = document.getElementById('tautulli_ip').value;
root_temp = document.getElementById('tautulli_root').value;
port_temp = parseInt(document.getElementById('tautulli_port').value);
api_temp = document.getElementById('tautulli_apikey').value;
config_form = {"tautulli_https" : https_temp, "tautulli_apikey" : api_temp, "tautulli_port" : port_temp, "tautulli_root" : root_temp, "tautulli_ip" : ip_temp};
var config_data = JSON.stringify(config_form);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
console.log('Failed to parse API response. Response: ' + this.responseText)
alert('Failed to parse API response.');
button.style.backgroundColor = 'var(--red)';
document.getElementById("test_connection").disabled = false;
document.getElementById("test_connection").style.opacity = '1';
}
if(result.error) {
button.style.backgroundColor = 'var(--red)';
document.getElementById("test_connection").disabled = false;
document.getElementById("test_connection").style.opacity = '1';
alert(result.message);
return
}
if(result.data) {
button.style.backgroundColor = 'var(--green)';
document.getElementById("test_connection").disabled = false;
document.getElementById("test_connection").style.opacity = '1';
} else {
button.style.backgroundColor = 'var(--red)';
document.getElementById("test_connection").disabled = false;
document.getElementById("test_connection").style.opacity = '1';
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", root + 'api/get/tautulli-connection');
xhttp.send(config_data);
}
function get_wrapper_version() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
console.log('Failed to parse Wrapperr version. Response: ' + this.responseText)
}
if(!result.error) {
document.getElementById('github_link').innerHTML = 'GitHub (' + result.wrapperr_version + ')';
if(result.application_name && result.application_name !== '') {
document.getElementById('application_name').innerHTML = result.application_name + ' Setup';
document.title = result.application_name;
}
}
} else if(this.readyState == 4 && this.status !== 200) {
var html = '<h2>' + this.status + ' Error</h2>';
html += '<p>The API did not respond correctly.</p>';
document.getElementById("setup").innerHTML = html;
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/get/wrapperr-version");
xhttp.send();
return;
}
// Get admin configuration state
function get_admin_state() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
console.log('Failed to parse API response. Response: ' + this.responseText)
}
if(result.error) {
console.log(result.message);
} else if(!result.data) {
first_time = true;
set_password_form();
} else {
cookie = get_cookie('wrapperr-admin');
if(cookie) {
validate_cookie_admin(cookie);
} else {
login_menu();
}
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/get/admin-state");
xhttp.send();
return;
}
// Validate admin login
function validate_cookie_admin(cookie) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
try {
var result= JSON.parse(this.responseText);
} catch(error) {
console.log('Failed to parse API response. Response: ' + this.responseText)
}
if(result.error) {
set_cookie("wrapperr-admin", "", 1);
login_menu();
document.getElementById("password_login_form_error").innerHTML = result.message;
} else {
get_config(get_cookie('wrapperr-admin'));
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/validate/admin");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send();
return;
}
// Get config for admin to configure
function get_config(cookie) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var result = JSON.parse(this.responseText);
if(result.error) {
alert(result.message);
location.reload();
} else {
tautulli_apikey = result.data.tautulli_config.tautulli_apikey;
tautulli_ip = result.data.tautulli_config.tautulli_ip;
tautulli_port = result.data.tautulli_config.tautulli_port;
tautulli_length = result.data.tautulli_config.tautulli_length;
tautulli_root = result.data.tautulli_config.tautulli_root;
tautulli_libraries = result.data.tautulli_config.tautulli_libraries;
tautulli_grouping = result.data.tautulli_config.tautulli_grouping;
tautulli_https = result.data.tautulli_config.tautulli_https;
timezone = result.data.timezone;
create_share_links = result.data.create_share_links;
plex_auth = result.data.plex_auth;
use_cache = result.data.use_cache;
use_logs = result.data.use_logs;
clientID = result.data.clientID;
wrapperr_root = result.data.wrapperr_root;
application_name_str = result.data.application_name;
application_url_str = result.data.application_url;
winter_theme = result.data.winter_theme;
wrapped_start = new Date(0);
wrapped_start.setUTCSeconds(result.data.wrapped_start);
wrapped_end = new Date(0);
wrapped_end.setUTCSeconds(result.data.wrapped_end);
stats_order_by_plays = result.data.wrapperr_customize.stats_order_by_plays;
stats_order_by_duration = result.data.wrapperr_customize.stats_order_by_duration;
wrapperr_front_page_title = result.data.wrapperr_customize.wrapperr_front_page_title;
wrapperr_front_page_subtitle = result.data.wrapperr_customize.wrapperr_front_page_subtitle;
stats_intro_title = result.data.wrapperr_customize.stats_intro_title;
stats_intro_subtitle = result.data.wrapperr_customize.stats_intro_subtitle;
stats_outro_title = result.data.wrapperr_customize.stats_outro_title;
stats_outro_subtitle = result.data.wrapperr_customize.stats_outro_subtitle;
get_user_movie_stats = result.data.wrapperr_customize.get_user_movie_stats;
get_user_movie_stats_title = result.data.wrapperr_customize.get_user_movie_stats_title;
get_user_movie_stats_subtitle = result.data.wrapperr_customize.get_user_movie_stats_subtitle;
get_user_movie_stats_subsubtitle = result.data.wrapperr_customize.get_user_movie_stats_subsubtitle;
get_user_movie_stats_subtitle_one = result.data.wrapperr_customize.get_user_movie_stats_subtitle_one;
get_user_movie_stats_subsubtitle_one = result.data.wrapperr_customize.get_user_movie_stats_subsubtitle_one;
get_user_movie_stats_subtitle_none = result.data.wrapperr_customize.get_user_movie_stats_subtitle_none;
get_user_movie_stats_subsubtitle_none = result.data.wrapperr_customize.get_user_movie_stats_subsubtitle_none;
get_user_movie_stats_top_movie = result.data.wrapperr_customize.get_user_movie_stats_top_movie;
get_user_movie_stats_top_movie_plural = result.data.wrapperr_customize.get_user_movie_stats_top_movie_plural;
get_user_movie_stats_movie_completion_title = result.data.wrapperr_customize.get_user_movie_stats_movie_completion_title;
get_user_movie_stats_movie_completion_title_plural = result.data.wrapperr_customize.get_user_movie_stats_movie_completion_title_plural;
get_user_movie_stats_movie_completion_subtitle = result.data.wrapperr_customize.get_user_movie_stats_movie_completion_subtitle;
get_user_movie_stats_pause_title = result.data.wrapperr_customize.get_user_movie_stats_pause_title;
get_user_movie_stats_pause_subtitle = result.data.wrapperr_customize.get_user_movie_stats_pause_subtitle;
get_user_movie_stats_pause_title_one = result.data.wrapperr_customize.get_user_movie_stats_pause_title_one;
get_user_movie_stats_pause_subtitle_one = result.data.wrapperr_customize.get_user_movie_stats_pause_subtitle_one;
get_user_movie_stats_pause_title_none = result.data.wrapperr_customize.get_user_movie_stats_pause_title_none;
get_user_movie_stats_pause_subtitle_none = result.data.wrapperr_customize.get_user_movie_stats_pause_subtitle_none;
get_user_movie_stats_oldest_title = result.data.wrapperr_customize.get_user_movie_stats_oldest_title;
get_user_movie_stats_oldest_subtitle = result.data.wrapperr_customize.get_user_movie_stats_oldest_subtitle;
get_user_movie_stats_oldest_subtitle_pre_1950 = result.data.wrapperr_customize.get_user_movie_stats_oldest_subtitle_pre_1950;
get_user_movie_stats_oldest_subtitle_pre_1975 = result.data.wrapperr_customize.get_user_movie_stats_oldest_subtitle_pre_1975;
get_user_movie_stats_oldest_subtitle_pre_2000 = result.data.wrapperr_customize.get_user_movie_stats_oldest_subtitle_pre_2000;
get_user_movie_stats_spent_title = result.data.wrapperr_customize.get_user_movie_stats_spent_title;
get_user_show_stats = result.data.wrapperr_customize.get_user_show_stats;
get_user_show_stats_buddy = result.data.wrapperr_customize.get_user_show_stats_buddy;
get_user_show_stats_title = result.data.wrapperr_customize.get_user_show_stats_title;
get_user_show_stats_subtitle = result.data.wrapperr_customize.get_user_show_stats_subtitle;
get_user_show_stats_subsubtitle = result.data.wrapperr_customize.get_user_show_stats_subsubtitle;
get_user_show_stats_subtitle_one = result.data.wrapperr_customize.get_user_show_stats_subtitle_one;
get_user_show_stats_subsubtitle_one = result.data.wrapperr_customize.get_user_show_stats_subsubtitle_one;
get_user_show_stats_subtitle_none = result.data.wrapperr_customize.get_user_show_stats_subtitle_none;
get_user_show_stats_subsubtitle_none = result.data.wrapperr_customize.get_user_show_stats_subsubtitle_none;
get_user_show_stats_top_show = result.data.wrapperr_customize.get_user_show_stats_top_show;
get_user_show_stats_top_show_plural = result.data.wrapperr_customize.get_user_show_stats_top_show_plural;
get_user_show_stats_spent_title = result.data.wrapperr_customize.get_user_show_stats_spent_title;
get_user_show_stats_most_played_title = result.data.wrapperr_customize.get_user_show_stats_most_played_title;
get_user_show_stats_most_played_subtitle = result.data.wrapperr_customize.get_user_show_stats_most_played_subtitle;
get_user_show_stats_buddy_title = result.data.wrapperr_customize.get_user_show_stats_buddy_title;
get_user_show_stats_buddy_subtitle = result.data.wrapperr_customize.get_user_show_stats_buddy_subtitle;
get_user_show_stats_buddy_title_none = result.data.wrapperr_customize.get_user_show_stats_buddy_title_none;
get_user_show_stats_buddy_subtitle_none = result.data.wrapperr_customize.get_user_show_stats_buddy_subtitle_none;
get_user_music_stats = result.data.wrapperr_customize.get_user_music_stats;
get_user_music_stats_title = result.data.wrapperr_customize.get_user_music_stats_title;
get_user_music_stats_subtitle = result.data.wrapperr_customize.get_user_music_stats_subtitle;
get_user_music_stats_subsubtitle = result.data.wrapperr_customize.get_user_music_stats_subsubtitle;
get_user_music_stats_subtitle_one = result.data.wrapperr_customize.get_user_music_stats_subtitle_one;
get_user_music_stats_subsubtitle_one = result.data.wrapperr_customize.get_user_music_stats_subsubtitle_one;
get_user_music_stats_subtitle_none = result.data.wrapperr_customize.get_user_music_stats_subtitle_none;
get_user_music_stats_subsubtitle_none = result.data.wrapperr_customize.get_user_music_stats_subsubtitle_none;
get_user_music_stats_top_track = result.data.wrapperr_customize.get_user_music_stats_top_track;
get_user_music_stats_top_track_plural = result.data.wrapperr_customize.get_user_music_stats_top_track_plural;
get_user_music_stats_top_album_plural = result.data.wrapperr_customize.get_user_music_stats_top_album_plural;
get_user_music_stats_top_artist_plural = result.data.wrapperr_customize.get_user_music_stats_top_artist_plural;
get_user_music_stats_spent_title = result.data.wrapperr_customize.get_user_music_stats_spent_title;
get_user_music_stats_spent_subtitle = result.data.wrapperr_customize.get_user_music_stats_spent_subtitle;
get_user_music_stats_oldest_album_title = result.data.wrapperr_customize.get_user_music_stats_oldest_album_title;
get_user_music_stats_oldest_album_subtitle = result.data.wrapperr_customize.get_user_music_stats_oldest_album_subtitle;
get_year_stats_title = result.data.wrapperr_customize.get_year_stats_title;
get_year_stats_subtitle = result.data.wrapperr_customize.get_year_stats_subtitle;
get_year_stats_subsubtitle = result.data.wrapperr_customize.get_year_stats_subsubtitle;
get_year_stats_movies = result.data.wrapperr_customize.get_year_stats_movies;
get_year_stats_movies_title = result.data.wrapperr_customize.get_year_stats_movies_title;
get_year_stats_movies_duration_title = result.data.wrapperr_customize.get_year_stats_movies_duration_title;
get_year_stats_shows = result.data.wrapperr_customize.get_year_stats_shows;
get_year_stats_shows_title = result.data.wrapperr_customize.get_year_stats_shows_title;
get_year_stats_shows_duration_title = result.data.wrapperr_customize.get_year_stats_shows_duration_title;
get_year_stats_music = result.data.wrapperr_customize.get_year_stats_music;
get_year_stats_music_title = result.data.wrapperr_customize.get_year_stats_music_title;
get_year_stats_music_duration_title = result.data.wrapperr_customize.get_year_stats_music_duration_title;
get_year_stats_leaderboard = result.data.wrapperr_customize.get_year_stats_leaderboard;
get_year_stats_leaderboard_title = result.data.wrapperr_customize.get_year_stats_leaderboard_title;
get_year_stats_duration_sum_title = result.data.wrapperr_customize.get_year_stats_duration_sum_title;
wrapperr_and = result.data.wrapperr_customize.wrapperr_and;
wrapperr_play = result.data.wrapperr_customize.wrapperr_play;
wrapperr_play_plural = result.data.wrapperr_customize.wrapperr_play_plural;
wrapperr_day = result.data.wrapperr_customize.wrapperr_day;
wrapperr_day_plural = result.data.wrapperr_customize.wrapperr_day_plural;
wrapperr_hour = result.data.wrapperr_customize.wrapperr_hour;
wrapperr_hour_plural = result.data.wrapperr_customize.wrapperr_hour_plural;
wrapperr_minute = result.data.wrapperr_customize.wrapperr_minute;
wrapperr_minute_plural = result.data.wrapperr_customize.wrapperr_minute_plural;
wrapperr_second = result.data.wrapperr_customize.wrapperr_second;
wrapperr_second_plural = result.data.wrapperr_customize.wrapperr_second_plural;
wrapperr_sort_plays = result.data.wrapperr_customize.wrapperr_sort_plays;
wrapperr_sort_duration = result.data.wrapperr_customize.wrapperr_sort_duration;
username = result.username;
admin_menu();
}
}
};
xhttp.withCredentials = true;
xhttp.open("post", "/api/get/config");
xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhttp.setRequestHeader("Authorization", "Bearer " + cookie);
xhttp.send();
}