diff --git a/core/client.js b/core/client.js index d49a7af0..6e6e0b5a 100644 --- a/core/client.js +++ b/core/client.js @@ -443,18 +443,59 @@ function api_localStorageGet(key, value) { function api_requestPermission(permission, id) { let permissions = document.getElementById('permissions'); + + let container = document.createElement('div'); + container.classList.add('permissions_contents'); + let div = document.createElement('div'); - div.appendChild(document.createTextNode(permission)); - for (let action of ['allow', 'allow once', 'deny once', 'deny']) { + div.appendChild(document.createTextNode('This app is requesting the following permission:')); + let span = document.createElement('span'); + span.style = 'font-weight: bold'; + span.appendChild(document.createTextNode(permission)); + div.appendChild(span); + container.appendChild(div); + + div = document.createElement('div'); + div.style = 'padding: 1em'; + let check = document.createElement('input'); + check.id = 'permissions_remember_check'; + check.type = 'checkbox'; + div.appendChild(check); + let label = document.createElement('label'); + label.htmlFor = check.id; + label.appendChild(document.createTextNode('Remember this decision.')); + div.appendChild(label); + container.appendChild(div); + + const k_options = [ + { + text: '✅ Allow', + grant: ['allow once', 'allow'], + + }, + { + text: '❌ Deny', + grant: ['deny once', 'deny'], + }, + ]; + + div = document.createElement('div'); + for (let option of k_options) { let button = document.createElement('button'); - button.innerText = action; + button.innerText = option.text; button.onclick = function() { - send({action: 'permission', id: id, granted: action}); - permissions.removeChild(div); + send({action: 'permission', id: id, granted: option.grant[check.checked ? 1 : 0]}); + while (permissions.firstChild) { + permissions.removeChild(permissions.firstChild); + } + permissions.style.visibility = 'hidden'; } div.appendChild(button); } - permissions.appendChild(div); + container.appendChild(div); + + permissions.appendChild(container); + permissions.style.visibility = 'visible'; } function receive(message) { diff --git a/core/style.css b/core/style.css index fce6e825..99fc838d 100644 --- a/core/style.css +++ b/core/style.css @@ -253,3 +253,23 @@ kbd { padding: 2px 4px; white-space: nowrap; } + +#permissions { + visibility: hidden; + position: absolute; + display: block; + top: 0; + z-index: 100; + display: flex; + justify-content: center; + width: 100%; +} + +.permissions_contents { + background-color: #444; + border-left: 4px solid #fff; + border-right: 4px solid #fff; + border-bottom: 4px solid #fff; + padding: 1em; + margin: 0 auto; +}