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

simplify html for editor options: reuse the id

Browse Source
This commit is contained in:
tophf 2017-06-18 14:04:18 +03:00
parent 8e4b2fbbb0
commit f603d9b61f
2 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
edit.html
View File

@ -210,13 +210,13 @@
.CodeMirror-search-hint { .CodeMirror-search-hint {
color: #888; color: #888;
} }
body[data-highlight-selection-matches="token"] .cm-matchhighlight-approved .cm-matchhighlight, body[data-match-highlight="token"] .cm-matchhighlight-approved .cm-matchhighlight,
body[data-highlight-selection-matches="token"] .CodeMirror-selection-highlight-scrollbar { body[data-match-highlight="token"] .CodeMirror-selection-highlight-scrollbar {
animation: fadein-match-highlighter 1s cubic-bezier(.97,.01,.42,.98); animation: fadein-match-highlighter 1s cubic-bezier(.97,.01,.42,.98);
animation-fill-mode: both; animation-fill-mode: both;
} }
body[data-highlight-selection-matches="selection"] .cm-matchhighlight-approved .cm-matchhighlight, body[data-match-highlight="selection"] .cm-matchhighlight-approved .cm-matchhighlight,
body[data-highlight-selection-matches="selection"] .CodeMirror-selection-highlight-scrollbar { body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar {
background-color: rgba(1, 151, 193, 0.1); background-color: rgba(1, 151, 193, 0.1);
} }
@-webkit-keyframes highlight { @-webkit-keyframes highlight {
@ -693,33 +693,33 @@
<section id="options"> <section id="options">
<h2 id="options-heading" i18n-text="optionsHeading"></h2> <h2 id="options-heading" i18n-text="optionsHeading"></h2>
<div class="option"> <div class="option">
<input data-option="lineWrapping" id="editor.lineWrapping" type="checkbox"> <input id="editor.lineWrapping" type="checkbox">
<label id="lineWrapping-label" for="editor.lineWrapping" i18n-text="cm_lineWrapping"></label> <label id="lineWrapping-label" for="editor.lineWrapping" i18n-text="cm_lineWrapping"></label>
</div> </div>
<div class="option"> <div class="option">
<input data-option="smartIndent" id="editor.smartIndent" type="checkbox"> <input id="editor.smartIndent" type="checkbox">
<label id="smartIndent-label" for="editor.smartIndent" i18n-text="cm_smartIndent"></label> <label id="smartIndent-label" for="editor.smartIndent" i18n-text="cm_smartIndent"></label>
</div> </div>
<div class="option"> <div class="option">
<input data-option="indentWithTabs" id="editor.indentWithTabs" type="checkbox"> <input id="editor.indentWithTabs" type="checkbox">
<label id="indentWithTabs-label" for="editor.indentWithTabs" i18n-text="cm_indentWithTabs"></label> <label id="indentWithTabs-label" for="editor.indentWithTabs" i18n-text="cm_indentWithTabs"></label>
</div> </div>
<div class="option aligned"> <div class="option aligned">
<label id="tabSize-label" for="editor.tabSize" i18n-text="cm_tabSize"></label> <label id="tabSize-label" for="editor.tabSize" i18n-text="cm_tabSize"></label>
<input data-option="tabSize" id="editor.tabSize" type="number" min="0"> <input id="editor.tabSize" type="number" min="0">
</div> </div>
<div class="option aligned"> <div class="option aligned">
<label id="keyMap-label" for="editor.keyMap" i18n-text="cm_keyMap"></label> <label id="keyMap-label" for="editor.keyMap" i18n-text="cm_keyMap"></label>
<select data-option="keyMap" id="editor.keyMap"></select> <select id="editor.keyMap"></select>
<svg id="keyMap-help" class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg> <svg id="keyMap-help" class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
</div> </div>
<div class="option aligned"> <div class="option aligned">
<label id="theme-label" for="editor.theme" i18n-text="cm_theme"></label> <label id="theme-label" for="editor.theme" i18n-text="cm_theme"></label>
<select data-option="theme" id="editor.theme"></select> <select id="editor.theme"></select>
</div> </div>
<div class="option aligned"> <div class="option aligned">
<label id="highlight-label" for="editor.matchHighlight" i18n-text="cm_matchHighlight"></label> <label id="highlight-label" for="editor.matchHighlight" i18n-text="cm_matchHighlight"></label>
<select data-option="highlightSelectionMatches" id="editor.matchHighlight"> <select id="editor.matchHighlight">
<option i18n-text="cm_matchHighlightToken" value="token"> <option i18n-text="cm_matchHighlightToken" value="token">
<option i18n-text="cm_matchHighlightSelection" value="selection"> <option i18n-text="cm_matchHighlightSelection" value="selection">
<option i18n-text="genericDisabledLabel" value=""> <option i18n-text="genericDisabledLabel" value="">

4
edit.js
View File

@ -281,7 +281,7 @@ function initCodeMirror() {
function acmeEventListener(event) { function acmeEventListener(event) {
var el = event.target; var el = event.target;
var option = el.dataset.option; var option = el.id.replace(/^editor\./, '');
//console.log("acmeEventListener heard %s on %s", event.type, el.id); //console.log("acmeEventListener heard %s on %s", event.type, el.id);
if (!option) { if (!option) {
console.error("acmeEventListener: no 'cm_option' %O", el); console.error("acmeEventListener: no 'cm_option' %O", el);
@ -319,7 +319,7 @@ function acmeEventListener(event) {
}, 100); }, 100);
})(); })();
return; return;
case "highlightSelectionMatches": case "matchHighlight":
switch (value) { switch (value) {
case 'token': case 'token':
case 'selection': case 'selection':