Make requesting permissions appear less terrible.
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3952 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
parent
eca3696740
commit
58196c4ac0
@ -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) {
|
||||
|
@ -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;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user