Now works in insecure contexts
This commit is contained in:
parent
3ea14f1353
commit
822327edfc
File diff suppressed because it is too large
Load Diff
|
|
@ -16,7 +16,7 @@
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<main title = "main content">
|
<main title = "main content">
|
||||||
<div id = "perma-widget" hidden>
|
<div id = "perma-widget">
|
||||||
<div id = "sidebar-toggle-wrapper">
|
<div id = "sidebar-toggle-wrapper">
|
||||||
<label for = "sidebar-toggler" id = "sidebar-toggler-button" title = "Toggle sidebar" tabindex = "0">☰</label>
|
<label for = "sidebar-toggler" id = "sidebar-toggler-button" title = "Toggle sidebar" tabindex = "0">☰</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -28,15 +28,11 @@
|
||||||
<input type = "checkbox" id = "sidebar-toggler" hidden checked />
|
<input type = "checkbox" id = "sidebar-toggler" hidden checked />
|
||||||
<aside>
|
<aside>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Foo</li>
|
<li><a id = "showActions">Actions</a></li>
|
||||||
<li>Bar</li>
|
<li><a id = "showLogs">Logs</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</aside>
|
</aside>
|
||||||
</div>
|
</div>
|
||||||
<fieldset id = "section-switcher" title = "Sections">
|
|
||||||
<button id = "showActions">Actions</button>
|
|
||||||
<button id = "showLogs">Logs</button>
|
|
||||||
</fieldset>
|
|
||||||
|
|
||||||
<section id = "contentLogs" title = "Logs" hidden>
|
<section id = "contentLogs" title = "Logs" hidden>
|
||||||
<table title = "Logs">
|
<table title = "Logs">
|
||||||
|
|
@ -136,7 +132,7 @@
|
||||||
<template id = "tplActionButton">
|
<template id = "tplActionButton">
|
||||||
<div>
|
<div>
|
||||||
<button>
|
<button>
|
||||||
<span role = "icon" title = "button icon" class = "icon">💩</span>
|
<span role = "icon" title = "action button icon" class = "icon">💩</span>
|
||||||
<span role = "title" class = "title">Untitled Button</span>
|
<span role = "title" class = "title">Untitled Button</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -53,6 +53,14 @@ class ActionButton extends window.HTMLElement {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getUniqueId() {
|
||||||
|
if (window.isSecureContext) {
|
||||||
|
return window.crypto.randomUUID()
|
||||||
|
} else {
|
||||||
|
return Date.now()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
startAction (actionArgs) {
|
startAction (actionArgs) {
|
||||||
// this.btn.disabled = true
|
// this.btn.disabled = true
|
||||||
// this.isWaiting = true
|
// this.isWaiting = true
|
||||||
|
|
@ -68,7 +76,7 @@ class ActionButton extends window.HTMLElement {
|
||||||
const startActionArgs = {
|
const startActionArgs = {
|
||||||
actionName: this.btn.title,
|
actionName: this.btn.title,
|
||||||
arguments: actionArgs,
|
arguments: actionArgs,
|
||||||
uuid: window.crypto.randomUUID()
|
uuid: this.getUniqueId()
|
||||||
}
|
}
|
||||||
|
|
||||||
const btnExecution = document.createElement('execution-button')
|
const btnExecution = document.createElement('execution-button')
|
||||||
|
|
|
||||||
|
|
@ -90,7 +90,7 @@ function processWebuiSettingsJson (settings) {
|
||||||
document.querySelector('#available-version').hidden = false
|
document.querySelector('#available-version').hidden = false
|
||||||
}
|
}
|
||||||
|
|
||||||
document.querySelector('#section-switcher').hidden = !settings.ShowNavigation
|
document.querySelector('#perma-widget').hidden = !settings.ShowNavigation
|
||||||
document.querySelector('footer[title="footer"]').hidden = !settings.ShowFooter
|
document.querySelector('footer[title="footer"]').hidden = !settings.ShowFooter
|
||||||
|
|
||||||
if (settings.PageTitle) {
|
if (settings.PageTitle) {
|
||||||
|
|
|
||||||
|
|
@ -33,7 +33,7 @@ fieldset#root-group {
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
display: inline;
|
display: inline;
|
||||||
padding-left: 1em;
|
padding-left: .5em;
|
||||||
font-size: small;
|
font-size: small;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -42,12 +42,11 @@ label#sidebar-toggler-button {
|
||||||
left: 0.5em;
|
left: 0.5em;
|
||||||
height: 2em;
|
height: 2em;
|
||||||
width: 2em;
|
width: 2em;
|
||||||
border-radius: 50%;
|
|
||||||
background-color: white;
|
background-color: white;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
display: inline-grid;
|
display: inline-grid;
|
||||||
place-items: center;
|
place-items: center;
|
||||||
padding: 0;
|
padding: .2em;
|
||||||
box-shadow: 0 0 5px 0 #444;
|
box-shadow: 0 0 5px 0 #444;
|
||||||
color: #666;
|
color: #666;
|
||||||
}
|
}
|
||||||
|
|
@ -291,6 +290,7 @@ img.logo {
|
||||||
|
|
||||||
main {
|
main {
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
|
padding-top: 3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
summary {
|
summary {
|
||||||
|
|
@ -320,6 +320,8 @@ label {
|
||||||
|
|
||||||
#perma-widget {
|
#perma-widget {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
top: 1em;
|
||||||
|
left: 1em;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue