Skip to content
This repository has been archived by the owner on Nov 3, 2021. It is now read-only.

Bug 810237 - [Homescreen] BB deleting apps [r=etienne] #6319

Merged
merged 1 commit into from Nov 19, 2012
Merged

Bug 810237 - [Homescreen] BB deleting apps [r=etienne] #6319

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
21 changes: 17 additions & 4 deletions apps/homescreen/index.html
View file
Open in desktop
Expand Up @@ -3,7 +3,6 @@
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="style/request.css"/>
<link rel="stylesheet" type="text/css" href="style/homescreen.css"/>
<link rel="stylesheet" type="text/css" href="style/grid.css"/>
<link rel="stylesheet" type="text/css" href="style/dragdrop.css"/>
Expand All @@ -15,11 +14,12 @@
<script type="text/javascript" src="shared/js/l10n.js"></script>
<script type="text/javascript" src="shared/js/l10n_date.js"></script>

<link rel="stylesheet" type="text/css" href="/shared/style_unstable/progress_activity.css">

<link rel="stylesheet" type="text/css" href="shared/style_unstable/progress_activity.css">
<link rel="stylesheet" type="text/css" href="shared/style/buttons.css">
<link rel="stylesheet" type="text/css" href="shared/style/headers.css">
<link rel="stylesheet" type="text/css" href="shared/style/input_areas.css">
<link rel="stylesheet" type="text/css" href="shared/style/confirm.css">
<link rel="stylesheet" type="text/css" href="style/request.css"/>

<!-- Specific code -->
<script type="text/javascript" defer src="js/request.js"></script>
Expand Down Expand Up @@ -63,6 +63,19 @@ <h1 data-l10n-id="add-to-home-screen">Add to Home Screen</h1>
</form>
</section>

<section id="delete-dialog">
<form role="dialog" data-type="confirm">
<section>
<h1 id="delete-dialog-title"></h1>
<p id="delete-dialog-message"></p>
</section>
<menu>
<button id="delete-dialog-cancel-button"></button>
<button id="delete-dialog-confirm-button" class="danger"></button>
</menu>
</form>
</section>

<header id="paginationBar">
<div class="paginationScroller" role="slider" aria-valuemin="0" aria-valuenow="0" aria-valuemax="0" aria-controls="icongrid"></div>
</header>
Expand Down Expand Up @@ -108,7 +121,7 @@ <h1 id="search-title"></h1>
<ul id="evmeAppsList"></ul>
</div>
</div>

<div id="shortcuts">
<div id="shortcuts-list">
<ul id="shortcuts-items"></ul>
Expand Down
30 changes: 20 additions & 10 deletions apps/homescreen/js/homescreen.js
View file
Open in desktop
Expand Up @@ -27,7 +27,7 @@ const Homescreen = (function() {
if (Homescreen.isInEditMode()) {
Homescreen.setMode('normal');
GridManager.markDirtyState();
Permissions.hide();
UninstallDialog.hide();
GridManager.goToPage(GridManager.pageHelper.getCurrentPageNumber());
} else {
GridManager.goToPage(1);
Expand Down Expand Up @@ -61,22 +61,32 @@ const Homescreen = (function() {
* The application object.
*/
showAppDialog: function h_showAppDialog(app) {
var title, body, yesLabel;
var title, body;
var cancel = {
title: _('cancel'),
callback: UninstallDialog.hide
};

var confirm = {
callback: function onAccept() {
UninstallDialog.hide();
app.uninstall();
}
};

// Show a different prompt if the user is trying to remove
// a bookmark shortcut instead of an app.
if (app.isBookmark) {
title = _('remove-title', { name: app.manifest.name });
body = '';
yesLabel = _('remove');
title = _('remove-title-2', { name: app.manifest.name });
body = _('remove-body', { name: app.manifest.name });
confirm.title = _('remove');
} else {
title = _('delete-title', { name: app.manifest.name });
body = _('delete-body', { name: app.manifest.name });
yesLabel = _('delete');
confirm.title = _('delete');
}

Permissions.show(title, body, yesLabel, _('cancel'),
function onAccept() { app.uninstall() },
function onCancel() {});
UninstallDialog.show(title, body, cancel, confirm);
},

isInEditMode: function() {
Expand All @@ -87,4 +97,4 @@ const Homescreen = (function() {
mode = document.body.dataset.mode = newMode;
}
};
})();
})();
125 changes: 20 additions & 105 deletions apps/homescreen/js/request.js
View file
Open in desktop
@@ -1,122 +1,37 @@

'use strict';

var Permissions = (function() {
// A queue of pending requests.
// Callers must be careful not to create an infinite loop!
var pending = [];
var UninstallDialog = (function() {

var screen = null;
var dialog = null;
var header = null;
var message = null;
var yes = null;
var no = null;
var dialog = document.getElementById('delete-dialog');

return {
hide: function permissions_hide() {
if (screen === null)
return;

document.body.removeChild(screen);
screen = null;
dialog = null;
header = null;
message = null;
yes = null;
no = null;
pending = [];
},

show: function permissions_show(
title, msg, yeslabel, nolabel, yescallback, nocallback) {
if (screen === null) {
screen = document.createElement('div');
screen.id = 'permission-screen';

dialog = document.createElement('div');
dialog.id = 'permission-dialog';
screen.appendChild(dialog);
var titleElem = document.getElementById('delete-dialog-title');
var messageElem = document.getElementById('delete-dialog-message');

header = document.createElement('p');
header.id = 'permission-title';
dialog.appendChild(header);
var cancelButton = document.getElementById('delete-dialog-cancel-button');
var confirmButton = document.getElementById('delete-dialog-confirm-button');

message = document.createElement('p');
message.id = 'permission-message';
dialog.appendChild(message);

no = document.createElement('button');
no.id = 'permission-no';
dialog.appendChild(no);

yes = document.createElement('button');
yes.id = 'permission-yes';
dialog.appendChild(yes);

document.body.appendChild(screen);
}
return {
hide: function dialog_hide() {
dialog.classList.remove('visible');
},

// If there is already a pending permission request, queue this one
if (screen.classList.contains('visible')) {
pending.push({
header: title,
message: msg,
yeslabel: yeslabel,
nolabel: nolabel,
yescallback: yescallback,
nocallback: nocallback
});
return;
}
show: function dialog_show(title, msg, cancel, confirm) {
titleElem.textContent = title;
messageElem.textContent = msg;

// Put the message in the dialog.
// Note plain text since this may include text from
// untrusted app manifests, for example.
header.textContent = title;
message.textContent = msg;
yes.textContent = yeslabel;
no.textContent = nolabel;
cancelButton.textContent = cancel.title;
confirmButton.textContent = confirm.title;

// Make the screen visible
screen.classList.add('visible');
// Put the dialog in the middle of the screen
dialog.style.marginTop = -dialog.offsetHeight / 2 + 'px';
cancelButton.onclick = confirmButton.onclick = clickHandler;

// This is the event listener function for the buttons
function clickHandler(evt) {
// cleanup the event handlers
yes.removeEventListener('click', clickHandler);
no.removeEventListener('click', clickHandler);

// Hide the dialog
screen.classList.remove('visible');

// Call the appropriate callback, if it is defined
if (evt.target === yes && yescallback) {
yescallback();
} else if (evt.target === no && nocallback) {
nocallback();
}

// And if there are pending permission requests, trigger the next one
if (pending.length > 0) {
var request = pending.shift();
window.setTimeout(function() {
Permissions.show(request.header,
request.message,
request.yeslabel,
request.nolabel,
request.yescallback,
request.nocallback);
});
}
evt.target === confirmButton ? confirm.callback() : cancel.callback();
return false;
}

// Set event listeners for the yes and no buttons
yes.addEventListener('click', clickHandler);
no.addEventListener('click', clickHandler);
dialog.classList.add('visible');
}
};
}());

}());
3 changes: 2 additions & 1 deletion apps/homescreen/locales/homescreen.en-US.properties
View file
Open in desktop
Expand Up @@ -18,7 +18,8 @@ delete=Delete
cancel=Cancel

# Prompt that appears when a user tries to remove a site saved to the homescreen.
remove-title=Remove {{name}} from the homescreen?
remove-title-2=Remove {{name}}
remove-body=Remove {{name}} from the homescreen?
remove=Remove

# Evme
Expand Down
66 changes: 8 additions & 58 deletions apps/homescreen/style/request.css
View file
Open in desktop
@@ -1,63 +1,13 @@
#permission-screen {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
form[role="dialog"][data-type="confirm"] {
z-index: 20001; /* just below the sleep menu */
pointer-events: none;
display: none;
}

#permission-screen.visible {
pointer-events: auto;
display: block;
}

#permission-dialog {
position: absolute;
top: 45%; /* 10% is the dock */
width: 100%;
background-color: rgba(0,0,0,0.9);
border-top: 0.1rem solid rgba(256,256,256,0.9);
-moz-box-sizing: border-box;
padding: 1rem 1.5rem;
box-shadow:0 1rem 2rem #000;
}

#permission-title {
font-size: 2.2rem;
font-weight: bold;
color: #51b2c7;
margin: 0 0 0.5rem 0;
padding: 0;
}

#permission-message {
font-size: 1.6rem;
color: #fff;
margin: 0 0 1.5rem 0;
padding: 0;
}

#permission-dialog button {
font-size: 1.6rem;
font-weight: bold;
width: -moz-calc(50% - 0.75rem);
height: 4rem;
border-radius: 0.2rem;
color: #000;
border: 0;
text-align: left;
margin: 0;
padding: 0 0 0 1.25rem;
}

#permission-yes {
background-color: #51b2c7;
float: right;
#delete-dialog {
visibility: hidden;
pointer-events: none;
}

#permission-no {
background-color: #fff;
}
#delete-dialog.visible {
visibility: visible;
pointer-events: auto;
}