open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

popup: refactor click handlers

Browse Source
This commit is contained in:
tophf 2017-03-25 06:18:14 +03:00
parent b51c264c8b
commit 0f8fd5c07c
1 changed files with 31 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
popup.js
View File

@ -135,29 +135,6 @@ function showStyles(styles) {
function createStyleElement(style) { function createStyleElement(style) {
// reuse event listener function references
const listeners = createStyleElement.listeners = createStyleElement.listeners || {
checkboxClick() {
enableStyle(getClickedStyleId(event), this.checked)
.then(handleUpdate);
},
styleNameClick(event) {
this.checkbox.click();
event.preventDefault();
},
toggleClick(event) {
enableStyle(getClickedStyleId(event), this.matches('.enable'))
.then(handleUpdate);
},
deleteClick(event) {
confirmDelete(event).then(() => {
// update view with 'No styles installed for this site' message
if (!installed.children.length) {
showStyles([]);
}
});
}
};
const entry = template.style.cloneNode(true); const entry = template.style.cloneNode(true);
entry.setAttribute('style-id', style.id); entry.setAttribute('style-id', style.id);
Object.assign(entry, { Object.assign(entry, {
@ -171,7 +148,7 @@ function createStyleElement(style) {
Object.assign(checkbox, { Object.assign(checkbox, {
id: 'style-' + style.id, id: 'style-' + style.id,
checked: style.enabled, checked: style.enabled,
onclick: listeners.checkboxClick, onclick: EntryOnClick.toggle,
}); });
const editLink = $('.style-edit-link', entry); const editLink = $('.style-edit-link', entry);
@ -183,19 +160,45 @@ function createStyleElement(style) {
const styleName = $('.style-name', entry); const styleName = $('.style-name', entry);
Object.assign(styleName, { Object.assign(styleName, {
htmlFor: 'style-' + style.id, htmlFor: 'style-' + style.id,
onclick: listeners.styleNameClick, onclick: EntryOnClick.name,
}); });
styleName.checkbox = checkbox; styleName.checkbox = checkbox;
styleName.appendChild(document.createTextNode(style.name)); styleName.appendChild(document.createTextNode(style.name));
$('.enable', entry).onclick = listeners.toggleClick; $('.enable', entry).onclick = EntryOnClick.toggle;
$('.disable', entry).onclick = listeners.toggleClick; $('.disable', entry).onclick = EntryOnClick.toggle;
$('.delete', entry).onclick = listeners.deleteClick; $('.delete', entry).onclick = EntryOnClick.delete;
return entry; return entry;
} }
class EntryOnClick {
static name(event) {
this.checkbox.click();
event.preventDefault();
}
static toggle(event) {
saveStyle({
id: getClickedStyleId(event),
enabled: this.type == 'checkbox' ? this.checked : this.matches('.enable'),
});
}
static delete(event) {
confirmDelete(event).then(() => {
// update view with 'No styles installed for this site' message
if (!installed.children.length) {
showStyles([]);
}
});
}
}
function getClickedStyleId(event) { function getClickedStyleId(event) {
return (getClickedStyleElement(event) || {}).styleId; return (getClickedStyleElement(event) || {}).styleId;
} }