[mod] settings apply
This commit is contained in:
parent
e38385b593
commit
4ccc684f89
9 changed files with 103 additions and 51 deletions
|
|
@ -1,23 +1,29 @@
|
||||||
|
|
||||||
import { EditorState, StateEffect } from '@codemirror/state';
|
import { EditorState, StateEffect, Compartment } from '@codemirror/state';
|
||||||
|
|
||||||
import { lineNumbers, highlightActiveLineGutter, highlightSpecialChars,
|
import {
|
||||||
|
lineNumbers, highlightActiveLineGutter, highlightSpecialChars,
|
||||||
drawSelection, rectangularSelection, crosshairCursor, highlightActiveLine,
|
drawSelection, rectangularSelection, crosshairCursor, highlightActiveLine,
|
||||||
keymap, dropCursor,EditorView} from '@codemirror/view';
|
keymap, dropCursor, EditorView
|
||||||
|
} from '@codemirror/view';
|
||||||
|
|
||||||
import { openSearchPanel, highlightSelectionMatches, searchKeymap } from '@codemirror/search';
|
import { openSearchPanel, highlightSelectionMatches, searchKeymap } from '@codemirror/search';
|
||||||
|
|
||||||
import { openLintPanel, lintGutter, lintKeymap, linter} from "@codemirror/lint"
|
import { openLintPanel, lintGutter, lintKeymap, linter } from "@codemirror/lint"
|
||||||
|
|
||||||
import { indentWithTab, history, defaultKeymap, historyKeymap } from '@codemirror/commands';
|
import { indentWithTab, history, defaultKeymap, historyKeymap } from '@codemirror/commands';
|
||||||
|
|
||||||
import { foldGutter, indentOnInput, indentUnit, bracketMatching, foldKeymap,
|
import {
|
||||||
syntaxHighlighting, defaultHighlightStyle , StreamLanguage } from '@codemirror/language';
|
foldGutter, indentOnInput, indentUnit, bracketMatching, foldKeymap,
|
||||||
|
syntaxHighlighting, defaultHighlightStyle, StreamLanguage
|
||||||
|
} from '@codemirror/language';
|
||||||
|
|
||||||
import { closeBrackets, autocompletion, closeBracketsKeymap, completionKeymap } from '@codemirror/autocomplete';
|
import { closeBrackets, autocompletion, closeBracketsKeymap, completionKeymap } from '@codemirror/autocomplete';
|
||||||
|
|
||||||
import { LSPClient, LSPPlugin, languageServerSupport, languageServerExtensions,
|
import {
|
||||||
formatDocument,formatKeymap } from "@codemirror/lsp-client";
|
LSPClient, LSPPlugin, languageServerSupport, languageServerExtensions,
|
||||||
|
formatDocument, formatKeymap
|
||||||
|
} from "@codemirror/lsp-client";
|
||||||
|
|
||||||
import { xQuery } from "@codemirror/legacy-modes/mode/xquery"
|
import { xQuery } from "@codemirror/legacy-modes/mode/xquery"
|
||||||
// Language
|
// Language
|
||||||
|
|
@ -25,12 +31,35 @@ import { xml } from "@codemirror/lang-xml";
|
||||||
|
|
||||||
import { showMinimap } from "@replit/codemirror-minimap"
|
import { showMinimap } from "@replit/codemirror-minimap"
|
||||||
let create = (v) => {
|
let create = (v) => {
|
||||||
const dom = document.createElement('div');
|
const dom = document.createElement('div');
|
||||||
return { dom }
|
return { dom }
|
||||||
|
}
|
||||||
|
const compartment = new Compartment();
|
||||||
|
let curOpts = {
|
||||||
|
lineWrap: true,
|
||||||
|
minimap: true
|
||||||
|
}
|
||||||
|
// array of extensions reflecting opts
|
||||||
|
function optExts(opts) {
|
||||||
|
let exts = []
|
||||||
|
if (opts.lineWrap) exts.push(EditorView.lineWrapping)
|
||||||
|
if (opts.minimap) exts.push(
|
||||||
|
showMinimap.compute(['doc'], (state) => {
|
||||||
|
return {
|
||||||
|
create,
|
||||||
|
/* optional showOverlay: 'mouse-over' */
|
||||||
|
displayText: 'characters'
|
||||||
|
|
||||||
|
}
|
||||||
|
}));
|
||||||
|
return exts
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function updateCompartment(opts) {
|
||||||
|
view.dispatch({
|
||||||
|
effects: [compartment.reconfigure(optExts(opts))]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// return promise with socket map or reject if no connect
|
// return promise with socket map or reject if no connect
|
||||||
function simpleWebSocketTransport(uri) {
|
function simpleWebSocketTransport(uri) {
|
||||||
|
|
@ -60,7 +89,7 @@ const baseExts = [
|
||||||
drawSelection(),
|
drawSelection(),
|
||||||
dropCursor(),
|
dropCursor(),
|
||||||
EditorState.allowMultipleSelections.of(true),
|
EditorState.allowMultipleSelections.of(true),
|
||||||
EditorView.lineWrapping,
|
|
||||||
keymap.of([indentWithTab]),
|
keymap.of([indentWithTab]),
|
||||||
indentOnInput(),
|
indentOnInput(),
|
||||||
syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
|
syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
|
||||||
|
|
@ -81,14 +110,7 @@ const baseExts = [
|
||||||
...lintKeymap
|
...lintKeymap
|
||||||
]),
|
]),
|
||||||
StreamLanguage.define(xQuery),
|
StreamLanguage.define(xQuery),
|
||||||
showMinimap.compute(['doc'], (state) => {
|
compartment.of(optExts(curOpts))
|
||||||
return {
|
|
||||||
create,
|
|
||||||
/* optional showOverlay: 'mouse-over' */
|
|
||||||
displayText: 'characters'
|
|
||||||
|
|
||||||
}
|
|
||||||
})
|
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -107,6 +129,8 @@ function listCommands(view) {
|
||||||
return commands;
|
return commands;
|
||||||
};
|
};
|
||||||
|
|
||||||
export { baseExts, EditorView, EditorState, StateEffect, LSPPlugin, LSPClient,
|
export {
|
||||||
openSearchPanel, openLintPanel, languageServerSupport, languageServerExtensions,
|
baseExts, EditorView, EditorState, StateEffect, LSPPlugin, LSPClient,
|
||||||
simpleWebSocketTransport, linter, formatDocument,keymap,formatKeymap, listCommands };
|
openSearchPanel, openLintPanel, languageServerSupport, languageServerExtensions,
|
||||||
|
simpleWebSocketTransport, linter, formatDocument, keymap, formatKeymap, listCommands, updateCompartment, curOpts
|
||||||
|
};
|
||||||
|
|
@ -19,11 +19,9 @@ declare function lsp-diags:list(
|
||||||
$text as xs:string,
|
$text as xs:string,
|
||||||
$xml as lsp-diags:ParseResult)
|
$xml as lsp-diags:ParseResult)
|
||||||
as map(*)*{
|
as map(*)*{
|
||||||
|
if($xml/self::ERROR)
|
||||||
if($xml/self::ERROR)
|
then lsp-diags:parse-error($text, $xml)
|
||||||
then lsp-diags:parse-error($text, $xml)
|
else lsp-diags:parse-xquery($text,$xml)
|
||||||
else lsp-diags:parse-xquery($text,$xml)
|
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
(:~
|
(:~
|
||||||
|
|
|
||||||
|
|
@ -29,7 +29,9 @@ body {
|
||||||
.navbar * {
|
.navbar * {
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
}
|
}
|
||||||
|
form header {
|
||||||
|
background-color: burlywood;
|
||||||
|
}
|
||||||
details {
|
details {
|
||||||
padding:2px;
|
padding:2px;
|
||||||
padding-left: 3px;
|
padding-left: 3px;
|
||||||
|
|
|
||||||
|
|
@ -176,10 +176,13 @@
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
|
|
||||||
<div class="mb-3 form-check">
|
<div class="mb-3 form-check">
|
||||||
<input name="wrap-lines" type="checkbox" class="form-check-input" id="exampleCheck1">
|
<input name="wrapLines" type="checkbox" class="form-check-input" id="lineWrap">
|
||||||
<label class="form-check-label" for="exampleCheck1">Wrap lines</label>
|
<label class="form-check-label" for="lineWrap">Wrap lines</label>
|
||||||
|
</div>
|
||||||
|
<div class="mb-3 form-check">
|
||||||
|
<input name="minimap" type="checkbox" class="form-check-input" id="minimap">
|
||||||
|
<label class="form-check-label" for="minimap">Show minimap</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
<div class="modal-footer">
|
||||||
<button type="submit" class="btn btn-primary">Apply</button>
|
<button type="submit" class="btn btn-primary">Apply</button>
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@ class ListComponent extends HTMLElement {
|
||||||
#iconKinds; //array from kind integer to codicon name
|
#iconKinds; //array from kind integer to codicon name
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.#shadow = this.attachShadow({ mode: "open" });
|
this.#shadow = this.attachShadow({ mode: "open" ,delegatesFocus: true});
|
||||||
this.#data = [];
|
this.#data = [];
|
||||||
this.#iconKinds = [];
|
this.#iconKinds = [];
|
||||||
this.render();
|
this.render();
|
||||||
|
|
@ -38,7 +38,7 @@ class ListComponent extends HTMLElement {
|
||||||
const shad=this.#shadow;
|
const shad=this.#shadow;
|
||||||
this.#data.forEach((item, index) => {
|
this.#data.forEach((item, index) => {
|
||||||
const listItem = document.createElement('li');
|
const listItem = document.createElement('li');
|
||||||
listItem.innerHTML = `<a><i class='codicon codicon-${this.#iconKinds[item.kind]}'></i>
|
listItem.innerHTML = `<a href="#"><i class='codicon codicon-${this.#iconKinds[item.kind]}'></i>
|
||||||
<span>${item.name} - ${item.detail}</span></a>`;
|
<span>${item.name} - ${item.detail}</span></a>`;
|
||||||
// Adding a click event listener for user interaction
|
// Adding a click event listener for user interaction
|
||||||
listItem.addEventListener('click', () => {
|
listItem.addEventListener('click', () => {
|
||||||
|
|
|
||||||
|
|
@ -31302,12 +31302,35 @@ ${text}</tr>
|
||||||
});
|
});
|
||||||
|
|
||||||
let create = (v) => {
|
let create = (v) => {
|
||||||
const dom = document.createElement('div');
|
const dom = document.createElement('div');
|
||||||
return { dom }
|
return { dom }
|
||||||
};
|
};
|
||||||
|
const compartment = new Compartment();
|
||||||
|
let curOpts = {
|
||||||
|
lineWrap: true,
|
||||||
|
minimap: true
|
||||||
|
};
|
||||||
|
// array of extensions reflecting opts
|
||||||
|
function optExts(opts) {
|
||||||
|
let exts = [];
|
||||||
|
if (opts.lineWrap) exts.push(EditorView.lineWrapping);
|
||||||
|
if (opts.minimap) exts.push(
|
||||||
|
showMinimap.compute(['doc'], (state) => {
|
||||||
|
return {
|
||||||
|
create,
|
||||||
|
/* optional showOverlay: 'mouse-over' */
|
||||||
|
displayText: 'characters'
|
||||||
|
|
||||||
|
}
|
||||||
|
}));
|
||||||
|
return exts
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateCompartment(opts) {
|
||||||
|
view.dispatch({
|
||||||
|
effects: [compartment.reconfigure(optExts(opts))]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// return promise with socket map or reject if no connect
|
// return promise with socket map or reject if no connect
|
||||||
function simpleWebSocketTransport(uri) {
|
function simpleWebSocketTransport(uri) {
|
||||||
|
|
@ -31336,7 +31359,7 @@ ${text}</tr>
|
||||||
drawSelection(),
|
drawSelection(),
|
||||||
dropCursor(),
|
dropCursor(),
|
||||||
EditorState.allowMultipleSelections.of(true),
|
EditorState.allowMultipleSelections.of(true),
|
||||||
EditorView.lineWrapping,
|
|
||||||
keymap.of([indentWithTab]),
|
keymap.of([indentWithTab]),
|
||||||
indentOnInput(),
|
indentOnInput(),
|
||||||
syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
|
syntaxHighlighting(defaultHighlightStyle, { fallback: true }),
|
||||||
|
|
@ -31357,14 +31380,7 @@ ${text}</tr>
|
||||||
...lintKeymap
|
...lintKeymap
|
||||||
]),
|
]),
|
||||||
StreamLanguage.define(xQuery),
|
StreamLanguage.define(xQuery),
|
||||||
showMinimap.compute(['doc'], (state) => {
|
compartment.of(optExts(curOpts))
|
||||||
return {
|
|
||||||
create,
|
|
||||||
/* optional showOverlay: 'mouse-over' */
|
|
||||||
displayText: 'characters'
|
|
||||||
|
|
||||||
}
|
|
||||||
})
|
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -31389,6 +31405,7 @@ ${text}</tr>
|
||||||
exports.LSPPlugin = LSPPlugin;
|
exports.LSPPlugin = LSPPlugin;
|
||||||
exports.StateEffect = StateEffect;
|
exports.StateEffect = StateEffect;
|
||||||
exports.baseExts = baseExts;
|
exports.baseExts = baseExts;
|
||||||
|
exports.curOpts = curOpts;
|
||||||
exports.formatDocument = formatDocument;
|
exports.formatDocument = formatDocument;
|
||||||
exports.formatKeymap = formatKeymap;
|
exports.formatKeymap = formatKeymap;
|
||||||
exports.keymap = keymap;
|
exports.keymap = keymap;
|
||||||
|
|
@ -31399,6 +31416,7 @@ ${text}</tr>
|
||||||
exports.openLintPanel = openLintPanel;
|
exports.openLintPanel = openLintPanel;
|
||||||
exports.openSearchPanel = openSearchPanel;
|
exports.openSearchPanel = openSearchPanel;
|
||||||
exports.simpleWebSocketTransport = simpleWebSocketTransport;
|
exports.simpleWebSocketTransport = simpleWebSocketTransport;
|
||||||
|
exports.updateCompartment = updateCompartment;
|
||||||
|
|
||||||
return exports;
|
return exports;
|
||||||
|
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -38,6 +38,7 @@ $("search").onclick = e => lsp.openSearchPanel(view);
|
||||||
|
|
||||||
$("fullscreen").onclick = e => $("editor").requestFullscreen();
|
$("fullscreen").onclick = e => $("editor").requestFullscreen();
|
||||||
|
|
||||||
|
|
||||||
$("wordAt").onclick = e => {
|
$("wordAt").onclick = e => {
|
||||||
let pos = view.state.selection.main.head;
|
let pos = view.state.selection.main.head;
|
||||||
let w = view.state.wordAt(pos);
|
let w = view.state.wordAt(pos);
|
||||||
|
|
@ -127,7 +128,13 @@ $("load").onchange = e => {
|
||||||
|
|
||||||
function updateSettings(event) {
|
function updateSettings(event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
alert("TODO");
|
console.log("COPTS",lsp.curOpts);
|
||||||
|
const opts={lineWrap: $("lineWrap").checked,
|
||||||
|
minimap:$("minimap").checked
|
||||||
|
}
|
||||||
|
console.log(opts)
|
||||||
|
lsp.updateCompartment(opts);
|
||||||
|
$('popSettings').hidePopover();
|
||||||
};
|
};
|
||||||
|
|
||||||
$("fSettings").addEventListener("submit", updateSettings);
|
$("fSettings").addEventListener("submit", updateSettings);
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue