Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Same color line numbers as text in array editor #697

Merged
merged 1 commit into from
May 5, 2021
Merged

Same color line numbers as text in array editor #697

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.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 16 additions & 16 deletions src/ed.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
iconsInSuggestions: false,
language: 'apl',
lineHeight: fs + 2,
lineNumbers: D.prf.lineNums() ? (x => `[${x - 1}]`) : 'off',
lineNumbers: D.prf.lineNums() ? ((x) => `[${x - 1}]`) : 'off',
matchBrackets: !!D.prf.matchBrackets(),
minimap: {
enabled: D.prf.minimapEnabled(),
Expand All @@ -68,8 +68,7 @@
useTabStops: false,
wordBasedSuggestions: false,
wordSeparators: D.wordSeparators,
unusualLineTerminators: 'off', // iss646: Prevent message prompt about unusual line endings

unusualLineTerminators: 'off', // iss646: Prevent message prompt about unusual line endings
});
ed.me = me;
ed.me_ready = new Promise((resolve) => {
Expand Down Expand Up @@ -141,7 +140,7 @@
}
return !0;
});
ed.setPendent = $.debounce(100, x => ed.dom.classList.toggle('pendent', x));
ed.setPendent = $.debounce(100, (x) => ed.dom.classList.toggle('pendent', x));
ed.setTC(!!ed.tc);
ed.setLN(D.prf.lineNums());
ed.firstOpen = true;
Expand All @@ -154,8 +153,8 @@
const ed = this;
const model = ed.me.getModel();
ed.stop = new Set(model.getAllDecorations()
.filter(d => d.options.glyphMarginClassName === 'breakpoint')
.map(d => d.range.startLineNumber - 1));
.filter((d) => d.options.glyphMarginClassName === 'breakpoint')
.map((d) => d.range.startLineNumber - 1));
},
cursorActivity(e) { // handle "cursor activity" event
// xline:the line number of the empty line inserted when you press <down> at eof
Expand Down Expand Up @@ -202,7 +201,7 @@
},
setLN(x) { // update the display of line numbers and the state of the "[...]" button
const ed = this;
ed.me.updateOptions({ lineNumbers: D.prf.lineNums() ? (l => `[${l - 1}]`) : 'off' });
ed.me.updateOptions({ lineNumbers: D.prf.lineNums() ? ((l) => `[${l - 1}]`) : 'off' });
ed.dom.querySelector('.tb_LN').classList.toggle('pressed', !!x);
},
setTC(x) {
Expand All @@ -222,7 +221,7 @@
},
setStop() {
const ed = this;
ed.stopDecorations = [...ed.stop].map(x => ({
ed.stopDecorations = [...ed.stop].map((x) => ({
range: new monaco.Range(x + 1, 1, x + 1, 1),
options: {
isWholeLine: false,
Expand All @@ -247,7 +246,7 @@
saveScrollPos() { },
restoreScrollPos() { },
updateSIStack(x) {
this.dom.querySelector('.si_stack').innerHTML = x.stack.map(o => `<option>${o}`).join('');
this.dom.querySelector('.si_stack').innerHTML = x.stack.map((o) => `<option>${o}`).join('');
},
stateChanged() {
const w = this;
Expand All @@ -261,8 +260,8 @@
ed.name = ee.name;
// Check if a filename for a source file is provided.
// Make sure it isn't duplicated in the existing name.
if (ee.filename && (ed.name.indexOf(ee.filename) == -1 )) {
ed.name = ed.name.concat(" in ", ee.filename)
if (ee.filename && (ed.name.indexOf(ee.filename) === -1)) {
ed.name = ed.name.concat(' in ', ee.filename);
}
ed.container && ed.container.setTitle(ed.name);
D.ide.floating && $('title', ed.dom.ownerDocument).text(`${ed.name} - ${ed.ide.caption}`);
Expand All @@ -289,7 +288,8 @@
me.setModel(monaco.editor.createModel(ed.oText, null, monaco.Uri.file(ee.name)));
} else {
monaco.editor.setModelLanguage(model, ed.isCode && !ed.isReadOnlyEntity ? 'apl' : 'plaintext');
etype && ed.dom.classList.toggle(etype, true);
ed.dom.classList.remove('charmat', 'chararr', 'numarr', 'mixarr', 'charvecvec', 'quador', 'charvec');
etype && ed.dom.classList.add(etype);
}
me.updateOptions({ folding: ed.isCode && !!D.prf.fold() });
if (ed.isCode && D.prf.indentOnOpen()) ed.RD(me);
Expand Down Expand Up @@ -517,7 +517,7 @@
const a = s.split(';');
const head = a[0].replace(/\s+$/, '');
let tail = a.length > 1 ? a.slice(1) : [];
tail = tail.map(x => x.replace(/\s+/g, ''));
tail = tail.map((x) => x.replace(/\s+/g, ''));
const i = tail.indexOf(name); i < 0 ? tail.push(name) : tail.splice(i, 1);
const text = [head].concat(tail.sort()).join(';') + (com || '');
me.executeEdits('D', [{ range: new monaco.Range(l + 1, 1, l + 1, lt.length + 1), text }]);
Expand All @@ -544,13 +544,13 @@
endLineNumber: q.lineNumber,
endColumn: q.column,
}, monaco.editor.EndOfLinePreference.LF).split('\n'); // l:lines
const u = l.map(x => x.replace(/'[^']*'?/g, y => ' '.repeat(y.length))); // u:scrubbed strings
const c = u.map(x => x.indexOf('⍝')); // c:column index of ⍝
const u = l.map((x) => x.replace(/'[^']*'?/g, (y) => ' '.repeat(y.length))); // u:scrubbed strings
const c = u.map((x) => x.indexOf('⍝')); // c:column index of ⍝
return {
p, q, l, u, c,
};
});
const m = Math.max(...a.map(sel => Math.max(...sel.c)));
const m = Math.max(...a.map((sel) => Math.max(...sel.c)));
const edits = a.map((sel) => {
const r = sel.l.map((x, i) => {
const ci = sel.c[i];
Expand Down
73 changes: 37 additions & 36 deletions src/prf_col.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,31 @@
let H = {}; // H:reverse lookup dict for G
let M = {}; // H:reverse lookup dict for G
let q; // dict of DOM elements whose ids start with "col_", keyed by the rest of the id
// D.addSynGrps(...) is the API for extensions, see ../sample-extensions/syntax-in-comments.js
let scms; // all schemes (built-in and user-defined) as objects
let scm = {}; // the active scheme object
let me; // Monaco editor instance for displaying sample code
let sel; // the selected group's token type (.t)
// RGB() expands the hex representation of a colour, rgb() shrinks it
function RGB(x) {
const n = (x || '').length;
if (n === 6) return `#${x}`;
if (n === 3) return `#${x.replace(/(.)/g, '$1$1')}`;
return n === 1 ? `#${x.repeat(6)}` : x;
}
function RGBA(x, a) {
const r = RGB(x);
return `rgba(${[+`0x${r.slice(1, 3)}`, +`0x${r.slice(3, 5)}`, +`0x${r.slice(5, 7)}`, a]})`;
}
function RGBO(x, a) {
const o = a === undefined ? '' : `00${Math.round(a * 255).toString(16)}`.slice(-2);
return RGB(x) + o;
}
function rgb(x) {
if (!/^#.{6}$/.test(x)) return x;
const [, r, rr, g, gg, b, bb] = x;
if (r !== rr || g !== gg || b !== bb) return x.slice(1);
return r === g && g === b ? r : r + g + b;
}
function encScm(x) {
let s = '';
Object.keys(x).forEach((g) => {
Expand Down Expand Up @@ -46,7 +70,7 @@
}
}
if (!r.theme) { // check brightness and pick matching theme
const [rr, gg, bb] = RGB(r.norm.bg).match(/([0-9a-fA-F]{2})/g).map(c => parseInt(c, 16));
const [rr, gg, bb] = RGB(r.norm.bg).match(/([0-9a-fA-F]{2})/g).map((c) => parseInt(c, 16));
const lum = Math.sqrt((0.241 * rr * rr) + (0.691 * gg * gg) + (0.068 * bb * bb));
r.theme = lum < 130 ? 'dark' : 'light';
}
Expand Down Expand Up @@ -131,43 +155,18 @@
// ...
// }
// encScm() and decScm() convert between them
let scms; // all schemes (built-in and user-defined) as objects
let scm = {}; // the active scheme object
let me; // Monaco editor instance for displaying sample code
let sel; // the selected group's token type (.t)
// RGB() expands the hex representation of a colour, rgb() shrinks it
function RGB(x) {
const n = (x || '').length;
if (n === 6) return `#${x}`;
if (n === 3) return `#${x.replace(/(.)/g, '$1$1')}`;
return n === 1 ? `#${x.repeat(6)}` : x;
}
function RGBA(x, a) {
const r = RGB(x);
return `rgba(${[+`0x${r.slice(1, 3)}`, +`0x${r.slice(3, 5)}`, +`0x${r.slice(5, 7)}`, a]})`;
}
function RGBO(x, a) {
const o = a === undefined ? '' : `00${Math.round(a * 255).toString(16)}`.slice(-2);
return RGB(x) + o;
}
function rgb(x) {
if (!/^#.{6}$/.test(x)) return x;
const [, r, rr, g, gg, b, bb] = x;
if (r !== rr || g !== gg || b !== bb) return x.slice(1);
return r === g && g === b ? r : r + g + b;
}
function renderCSS(schema, isSample) {
return G.map((g) => {
const h = schema[g.t];
if (!h || !g.c) return '';
const els = g.c.split(',').map(x => (isSample ? '#nonexistent' : x)).join(',');
const els = g.c.split(',').map((x) => (isSample ? '#nonexistent' : x)).join(',');
const edmode = ['ca', 'cm', 'cv', 'cvv', 'ma', 'na', 'qor', 'dc'].includes(g.t);
let cls;
if (edmode) {
cls = `${els} .monaco-editor-background,${els} .monaco-editor .margin{`;
h.bg && (cls += `background-color:${RGB(h.bg)};`);
h.bg && (cls += `background-color:${RGBA(h.bg, h.bgo == null ? 0.5 : h.bgo)};`);
cls += `}${els} .monaco-editor span{`;
cls += `}${els} .monaco-editor span,${els} .monaco-editor .line-numbers{`;
h.fg && (cls += `color:${RGB(h.fg)};`);
h.fg && (cls += `color:${RGBA(h.fg, h.fgo == null ? 1 : h.fgo)};`);
h.B && (cls += 'font-weight:bold;');
Expand Down Expand Up @@ -220,7 +219,7 @@
}
}
});
const name = `my${schema.name.split('').map(x => `${x.codePointAt(0)}`).join('')}`;
const name = `my${schema.name.split('').map((x) => `${x.codePointAt(0)}`).join('')}`;
monaco.editor.defineTheme(name, {
base: schema.theme === 'light' ? 'vs' : 'vs-dark',
inherit: false,
Expand Down Expand Up @@ -386,7 +385,7 @@
fg && u.indexOf(fg) < 0 && u.push(fg);
});
u.sort(); // u:unique colours
q.list.innerHTML = u.map(x => `<option value=${x}>`).join('');
q.list.innerHTML = u.map((x) => `<option value=${x}>`).join('');
q.grp.innerHTML = G.map((g, i) => `<option value=${i}>${g.s}`).join('');
q.scm.onchange = () => {
scm = scms[+q.scm.selectedIndex];
Expand Down Expand Up @@ -447,7 +446,7 @@
fontSize: fs,
language: 'apl',
lineHeight: fs + 2,
lineNumbers: x => `[${x - 1}]`,
lineNumbers: (x) => `[${x - 1}]`,
minimap: { enabled: false },
matchBrackets: true,
mouseWheelZoom: false,
Expand All @@ -468,13 +467,15 @@
+ ':EndIf\n'
+ `${SC_MATCH}\n`,
});
D.prf.blockCursor(x => me.updateOptions({ cursorStyle: x ? 'block' : 'line' }));
D.prf.cursorBlinking(x => me.updateOptions({ cursorBlinking: x }));
D.prf.blockCursor((x) => me.updateOptions({ cursorStyle: x ? 'block' : 'line' }));
D.prf.cursorBlinking((x) => me.updateOptions({ cursorBlinking: x }));
let ss;
function selGrpFromPosition(p) {
const { lineNumber, column } = p;
const s = ss[lineNumber - 1];
const si = s.tokens.map(x => x.startIndex).findIndex(x => x >= column - 1);
const si = s.tokens
.map((x) => x.startIndex)
.findIndex((x) => x >= column - 1);
const t = s.tokens[si < 0 ? s.tokens.length - 1 : si - 1];
let sc = t ? t.scopes.slice(0, -4) : '';
while (!M[sc] && sc) sc = sc.slice(0, Math.max(0, sc.lastIndexOf('.')));
Expand Down Expand Up @@ -553,7 +554,7 @@
},
activate() { q.scm.focus(); },
save() {
D.prf.colourSchemes(scms.filter(x => !x.frz).map(encScm));
D.prf.colourSchemes(scms.filter((x) => !x.frz).map(encScm));
D.prf.colourScheme(scm.name);
},
resize() { },
Expand Down