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

fixup dc126e1b: more adjustments for persistent child in #installed

Browse Source 
* use .entry collection instead of installed.children
* adjust CSS counters

also:

* KeyboardEvent#code is checked first now - available since Chrome48 and FF32
* synthetic click event is cancelable, otherwise FF would open the editor in popup
This commit is contained in:
tophf 2017-12-14 05:50:58 +03:00
parent 1283e85a8e
commit 8dbdbe988f
2 changed files with 39 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
popup/hotkeys.js
View File

@ -3,6 +3,7 @@
// eslint-disable-next-line no-var
var hotkeys = (() => {
const entries = document.getElementsByClassName('entry');
let togglablesShown;
let togglables;
let enabled = false;
@ -36,41 +37,46 @@ var hotkeys = (() => {
return;
}
let entry;
const {which: k, key} = event;
if (key ? key >= '0' && key <= '9' : k >= 48 && k <= 57 || k >= 96 && k <= 105) {
// 0-9, numpad 0-9
const i = key === '0' ? 9 : key ? Number(key) - 1 : k === 48 || k === 96 ? 9 : k - (k > 96 ? 97 : 49);
entry = installed.children[i];
} else if (key ? key === '`' || key === '*' && !event.shiftKey : k === 192 || k === 106) {
// backtick ` and numpad *
const {which: k, key, code} = event;
if (code.startsWith('Digit') || code.startsWith('Numpad') && code.length === 7) {
entry = entries[(Number(code.slice(-1)) || 10) - 1];
} else if (
code === 'Backquote' || code === 'NumpadMultiply' ||
key && (key === '`' || key === '*') ||
k === 192 || k === 106) {
invertTogglables();
} else if (key ? key === '-' : k === 109) {
// numpad -
toggleState(installed.children, 'enabled', false);
} else if (key ? key === '+' : k === 107) {
// numpad +
toggleState(installed.children, 'disabled', true);
} else if (key ? key.length === 1 : k >= 65 && k <= 90) {
} else if (
code === 'NumpadSubtract' ||
key && key === '-' ||
k === 109) {
toggleState(entries, 'enabled', false);
} else if (
code === 'NumpadAdd' ||
key && key === '+' ||
k === 107) {
toggleState(entries, 'disabled', true);
} else if (
// any single character
key && key.length === 1 ||
k >= 65 && k <= 90) {
const letter = new RegExp(key ? '^' + key : '^\\x' + k.toString(16), 'i');
entry = [...installed.children].find(entry => letter.test(entry.textContent));
entry = [...entries].find(entry => letter.test(entry.textContent));
}
if (!entry) {
return;
}
const target = $(event.shiftKey ? '.style-edit-link' : '.checker', entry);
target.dispatchEvent(new MouseEvent('click'));
target.dispatchEvent(new MouseEvent('click', {cancelable: true}));
}
function getTogglables() {
const all = [...installed.children];
const enabled = [];
for (const entry of all) {
if (entry.classList.contains('enabled')) {
enabled.push(entry.id);
}
}
return enabled.length ? enabled : all.map(entry => entry.id);
const enabledOrAll = $('.entry.enabled') ? $$('.entry.enabled') : [...entries];
return enabledOrAll.map(entry => entry.id);
}
function countEnabledTogglables() {

15
popup/popup.css
View File

@ -184,11 +184,6 @@ html[style] .entry {
padding: 0 14px;
}
html[style] .entry:nth-child(-n+10):before,
html[style] .entry:nth-child(10):before {
right: 7px;
}
.entry .actions {
display: inline-flex;
}
@ -220,7 +215,7 @@ html[style] .entry:nth-child(10):before {
}
.entry:nth-child(-n+10):before,
.entry:nth-child(10):before {
.entry:nth-child(11):before {
counter-increment: style-number;
content: counter(style-number);
position: absolute;
@ -229,10 +224,16 @@ html[style] .entry:nth-child(10):before {
color: #aaa;
}
.entry:nth-child(10):before {
.entry:nth-child(11):before {
content: "0";
}
html[style*="border"] .entry:nth-child(-n+10):before,
html[style*="border"] .entry:nth-child(11):before {
/* the "show side borders" option adds 2px */
right: 7px;
}
.entry .actions {
margin-left: -1px;
margin-right: -1px;