mirror of
https://github.com/danieladov/jellyfin-plugin-skin-manager.git
synced 2026-01-18 16:37:31 +01:00
122 lines
5.2 KiB
HTML
122 lines
5.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>Skin Manager</title>
|
|
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="skinManagerPage" data-role="page"
|
|
class="page type-interior pluginConfigurationPage tbsConfigurationPage withTabs"
|
|
data-require="emby-input,emby-button" data-controller="__plugin/fontpicker.js">
|
|
<script src="/web/configurationpage?name=controls.Control.js"></script>
|
|
<script src="/web/configurationpage?name=controls.ColorControl.js"></script>
|
|
<script src="/web/configurationpage?name=controls.SliderControl.js"></script>
|
|
<script src="/web/configurationpage?name=controls.CheckBoxControl.js"></script>
|
|
<script src="/web/configurationpage?name=controls.NumberControl.js"></script>
|
|
<script src="/web/configurationpage?name=controls.SelectControl.js"></script>
|
|
<script src="/web/configurationpage?name=controls.FontPickerControl.js"></script>
|
|
<script src="/web/configurationpage?name=controls.TextAreaControl.js"></script>
|
|
<script src="/web/configurationpage?name=controls.Category.js"></script>
|
|
<script src="/web/configurationpage?name=skin.js"></script>
|
|
<script src="/web/configurationpage?name=fontpicker.js"></script>
|
|
<script src="/web/configurationpage?name=colorpicker.js"></script>
|
|
<script src="/web/configurationpage?name=MainController.js"></script>
|
|
<script src="/web/configurationpage?name=common.js"></script>
|
|
<script src="/web/configurationpage?name=ConfigController.js"></script>
|
|
|
|
|
|
<link rel="stylesheet" href="/web/configurationpage?name=style.css" />
|
|
|
|
<div data-role="content">
|
|
<div class="content-primary">
|
|
<div class="tbsConfigurationPage">
|
|
<div class="sectionTitleContainer flex align-items-center">
|
|
<h2 class="sectionTitle">Skin Manager</h2>
|
|
<a is="emby-linkbutton" class="raised button-alt headerHelpButton emby-button" target="_blank"
|
|
href="https://prayag17.github.io/jellyfin-plugin-skin-manager/src/html/help.html">Help</a>
|
|
</div>
|
|
<div class="verticalSection">
|
|
<p>Select the skin you want to install and click Set Skin</p>
|
|
<br />
|
|
</div>
|
|
<div class="allOptions">
|
|
<div class="selectContainer">
|
|
<label for="css">Skin</label>
|
|
<select is="emby-select" id="cssOptions"></select>
|
|
<br />
|
|
<div class="fieldDescription" id="description"></div>
|
|
</div>
|
|
<button is="emby-button" type="button" class="raised block" id="setSkin"><span>Set
|
|
Skin</span></button>
|
|
<br />
|
|
<div class="checkboxList checkboxList-verticalwrap" id="options"></div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
var data;
|
|
var fonts;
|
|
let skin;
|
|
var skins = [];
|
|
|
|
console.log("Main page loaded");
|
|
const setSkinManagerTabs = function () {
|
|
LibraryMenu.setTabs('skin manager', 0, getTabs);
|
|
};
|
|
if (!window.SkinManagerMainViewListener) {
|
|
window.SkinManagerMainViewListener = function (e) {
|
|
if (e.target && e.target.id === 'skinManagerPage') {
|
|
setSkinManagerTabs();
|
|
}
|
|
};
|
|
document.addEventListener('viewshow', window.SkinManagerMainViewListener);
|
|
}
|
|
setSkinManagerTabs();
|
|
|
|
//initWithDebug()
|
|
const controller = new MainController("url/del/json.json");
|
|
controller.initDebug();
|
|
|
|
|
|
|
|
|
|
function printCss() {
|
|
console.log(skin.generateCSS());
|
|
}
|
|
|
|
</script>
|
|
<script type="text/javascript">
|
|
var plugin = {
|
|
guid: "e9ca8b8e-ca6d-40e7-85dc-58e536df8eb3",
|
|
};
|
|
$("#configPage").on("pageshow", function () {
|
|
Dashboard.showLoadingMsg();
|
|
ApiClient.getPluginConfiguration(plugin.guid).then(function (config) {
|
|
$("#cssOptions").val(config.selectedCss).change();
|
|
Dashboard.hideLoadingMsg();
|
|
});
|
|
});
|
|
$("#configForm").on("submit", function () {
|
|
Dashboard.showLoadingMsg();
|
|
ApiClient.getPluginConfiguration(plugin.guid).then(function (config) {
|
|
config.selectedCss = $("#cssOptions").val();
|
|
ApiClient.updatePluginConfiguration(plugin.guid, config).then(
|
|
function (result) {
|
|
Dashboard.processPluginConfigurationUpdateResult(result);
|
|
}
|
|
);
|
|
});
|
|
return false;
|
|
});
|
|
</script>
|
|
|
|
|
|
</div>
|
|
</body>
|
|
|
|
</html> |