quodatum/basex-lsp
1
0
Fork 0
Code Issues 14 Activity Actions

Compare commits

base: quodatum:e732d190e1e1c85dda87687d1cef6817c3630dbd
Branches Tags
quodatum:main
..
compare: quodatum:e63912740aadb7f9f29996fc0d8c0a9cb8e522be
Branches Tags
quodatum:main

No commits in common. "e732d190e1e1c85dda87687d1cef6817c3630dbd" and "e63912740aadb7f9f29996fc0d8c0a9cb8e522be" have entirely different histories.
e732d190e1 ... e63912740a

3 changed files with 112 additions and 135 deletions
Show stats Expand all files Collapse all files

12
webapp/static/clients/codemirror/grail.css
View file

@ -83,15 +83,11 @@ details[open]::details-content {
}
}
}
#tConnect:state(unchecked) {
outline: dashed 4px deeppink;
outline-offset: 4px;
}
.page-header {
grid-column: 1 / -1;
display:flex;
justify-content:space-between;
background: #ffcdd2;
}
.page-sidebar {
@ -114,13 +110,9 @@ details[open]::details-content {
.page-main {
grid-column: 2 / 3;
display: flex;
flex-direction: column;
}
.page-footer {
grid-column: 1 / -1;
background: #ffecb3;
display: flex;
justify-content: space-between;
}

93
webapp/static/clients/codemirror/grail.html
View file

@ -1,17 +1,12 @@
<!doctype html>
<html lang="en" class="quiet-cloak">
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Codemirror6 example using BaseX LSP</title>
<link rel="icon" type="image/png" href="../favicon.png" />
<!-- Quiet theme + autoloader -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.3.0/dist/themes/quiet.css">
<script type="module" src="https://cdn.jsdelivr.net/npm/@quietui/quiet-browser@1.3.0/dist/quiet.loader.js"></script>
<link href="../bootstrap@5.3.7.css" rel="stylesheet" />
<link rel="stylesheet" href="grail.css" />
</head>
@ -19,25 +14,25 @@
<div class="page-wrap">
<header class="page-header">
<nav class="navbar bg-body-tertiary">
<div class="container-fluid">
<a id="help" class="navbar-brand">XQuery 4.0 LSP client
<button id="popcon" popovertarget="popConnect" class="btn btn-danger">
<i class="codicon codicon-vm-outline"></i>
</button>
</a>
<ul class="nav nav-pills">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Editor</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/app/home" target="lsp">LSP Manager</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/dba/logs" target="dba">Dba</a>
</li>
<div>XQuery 4.0 LSP client </div>
<quiet-toggle-icon id="tConnect" label="Connection status" size="md"
style="--checked-color: green;--unchecked-color: red;">
<quiet-icon slot="unchecked" name="network-off" family="outline"></quiet-icon>
<quiet-icon slot="checked" name="network" family="outline"></quiet-icon>
</quiet-toggle-icon>
<quiet-button-group label="Links">
<quiet-button href="#" variant="primary" aria-current="page" size="sm">
Editor
</quiet-button>
<quiet-button href="/app/home" target="lsp" rel="noreferrer noopener" size="sm">
LSP Manager
</quiet-button>
<quiet-button href="/dba/logs" target="dba" rel="noreferrer noopener" size="sm">
Dba
</quiet-button>
</quiet-button-group>
</ul>
<select id="load">
<option selected value="">load..</option>
<optgroup label="XQuery3">
@ -62,22 +57,26 @@
generator.xquery</option>
</optgroup>
</select>
<button popovertarget="popAbout" type="button">
<button popovertarget="popAbout" type="button" class="btn btn-light">
<i class="codicon codicon-info"></i>
</button>
</div>
</nav>
</header>
<main class="page-main" style="overflow: auto;">
<quiet-toolbar>
<quiet-button-group>
<nav class="page-nav">
<div class="navbar py-0 bg-light">
<div class="btn-group mr-2" role="group" aria-label="First group">
<label for="file">File:</label>
<input id="iFile" type="url" value="file:///some/file.xqm" />
<label for="symbols">Symbols:</label><select id="symbols" disabled="disabled"></select>
</quiet-button-group>
<quiet-button-group>
</div>
<div class="btn-group btn-group-sm " role="group" aria-label="Second group">
<button id="search" title="Search" type="button" class="btn btn-light"><i
class="codicon codicon-search"></i></button>
@ -100,9 +99,9 @@
</button>
<button type="button" class="btn btn-light" popovertarget="popSettings" title="Settings">
<i class="codicon codicon-settings"></i></button>
</quiet-button-group>
</div>
<quiet-button-group>
<div class="btn-group" role="group" aria-label="Third group">
<button id="fullscreen" title="Full screen editor" type="button" class="btn btn-light">
<i class="codicon codicon-screen-full"></i>
</button>
@ -112,7 +111,7 @@
<button id="bnRead" type="button" class="btn btn-light" title="LOad local file"><i
class="codicon codicon-cloud-upload"></i></button>
<input type="file" id="fileElem" multiple accept="*/*" style="display: none;" />
<input type="file" id="fileElem" multiple accept="*/*" style="display: none;"/>
<button id="bnSave" type="button" class="btn btn-light" title="save view">
<i class="codicon codicon-git-stash"></i></button>
@ -121,10 +120,9 @@
<i class="codicon codicon-git-stash-pop"></i></button>
<button id="bnWordAt" type="button" class="btn btn-light" title="word at">
<i class="codicon codicon-whole-word"></i></button>
</quiet-button-group>
</quiet-toolbar>
</div>
</div>
</nav>
<!-- Editor goes in here -->
<div id="editor"></div>
</main>
@ -132,8 +130,7 @@
<aside class="page-sidebar">
<details id="workspacePanel" open="open">
<summary class='bg-info'>Workspace <i class='codicon codicon-kebab-vertical' style="float:right"></i>
</summary>
<summary class='bg-info'>Workspace <i class='codicon codicon-kebab-vertical' style="float:right"></i></summary>
<ul id="traffic" style="overflow: scroll;">
@ -155,30 +152,16 @@
</aside>
<footer class="page-footer">
<select id="language">
Footer <select id="language">
<option selected>Language</option>
<option value="plaintext">plaintext</option>
<option value="xquery">xquery</option>
<option value="xml">xml</option>
</select>
<quiet-relative-time live id="relative-time__live" style="width:10em;"></quiet-relative-time>
<quiet-dropdown id="dropdown__checkboxes">
<quiet-button slot="trigger"><i class='codicon codicon-kebab-vertical'></i></quiet-button>
<quiet-dropdown-item type="checkbox" value="canvas" checked>Show canvas</quiet-dropdown-item>
<quiet-dropdown-item type="checkbox" value="grid" checked>Show grid</quiet-dropdown-item>
<quiet-dropdown-item type="checkbox" value="source">Show source</quiet-dropdown-item>
<quiet-divider></quiet-divider>
<quiet-dropdown-item value="preferences">Preferences…</quiet-dropdown-item>
</quiet-dropdown>
</footer>
</div>
<!-- dialogs -->
<!-- Popovers -->
<dialog id="popConnect" popover>
<form>

70
webapp/static/clients/codemirror/script.js
View file

@ -5,8 +5,8 @@ const view = new lsp.EditorView({
let doc = "xquery version '3.1';\n(:~ comment:)\nmodule namespace pdfbox='ns';\n";
var client;
var extLint;
var workspace = {
"file:///some/file.xqm": null
var workspace={
"file:///some/file.xqm":null
};
function $(id) { return document.getElementById(id) };
@ -62,20 +62,20 @@ $("symbols2").onclick = e => {
$("cmdList").onclick = e => {
let cmds = lsp.listCommands(view);
let result = "";
let result="";
[...cmds.keys()].sort().forEach(key => {
result += `<li>${key} ${cmds.get(key).key}</li>`
result+=`<li>${key} ${cmds.get(key).key}</li>`
});
$("popHelpInfo").innerHTML = `<ul>${result}</ul>`
$("popHelpInfo").innerHTML=`<ul>${result}</ul>`
$("popCmds").showPopover()
};
$("symList").addEventListener("itemSelected", e => {
const sel = e.detail.selectionRange;
console.log("SYM selection range", sel);
const an = 17 * e.detail.kind
view.dispatch({ selection: { anchor: an, head: an + 34 }, scrollIntoView: true });
const sel=e.detail.selectionRange;
console.log("SYM selection range",sel);
const an=17*e.detail.kind
view.dispatch({selection: {anchor: an,head:an+34},scrollIntoView:true});
});
$("lint").onclick = async e => {
@ -84,21 +84,16 @@ $("lint").onclick = async e => {
};
$("sync").onclick = e => { client.sync(); console.log("XXXsync"); };
// state a state
$("bnSave").onclick = e => { workspace[iFile] = view.state; };
$("bnLoad").onclick = e => { const v = workspace[iFile]; if (v) view.setState(v) };
// select local file
$("bnRead").onclick = e => { $("fileElem").click(); };
$("fileElem").onchange = e => {
let fr = new FileReader();
fr.onload = function () {
alert(fr.result);
}
fr.readAsText(e.target.files[0]);
};
$("format").onclick = e => { console.log("FMT", lsp.formatDocument(view)); };
$("bnSave").onclick = e => { workspace[iFile]=view.state; };
$("bnLoad").onclick = e => { const v=workspace[iFile];if(v)view.setState(v)};
$("bnRead").onclick = e => { const c=$("fileElem");
c.click();
const f=c.files[0];
if(!f)return;
c.value=null;
alert(f.name);
};
$("format").onclick = e => { console.log("FMT", lsp.formatDocument(view));};
$("load").onchange = e => {
const url = e.target.value;
@ -119,10 +114,8 @@ $("load").onchange = e => {
});
$("load").value = "";
};
$("tConnect").addEventListener('quiet-change', event => {
$("popConnect").showPopover()
});
$("msgIcon").onclick = e => {
$("msgIcon").onclick=e=>{
e.preventDefault();
alert("NOT YET")
};
@ -156,7 +149,7 @@ function connect() {
client = new lsp.LSPClient({ extensions: lsp.languageServerExtensions() });
client.connect(transport);
$("popConnect").hidePopover();
$("tConnect").checked=true;
connectStatus(true);
let extLsp = client.plugin(file, "xquery");
view.dispatch({
@ -167,14 +160,23 @@ function connect() {
})
.catch(e => {
console.log(e);
$("tConnect").checked=false;
connectStatus(false);
alert("connection failed: " + server)
});
};
function connectStatus(bool) {
if (bool) {
$("popcon").querySelector("i").classList.value = "codicon codicon-vm-active";
$("popcon").classList.remove("btn-danger")
$("popcon").classList.add("btn-success")
} else {
$("popcon").querySelector("i").classList.value = "codicon codicon-vm-outline";
$("popcon").classList.add("btn-danger")
$("popcon").classList.remove("btn-success")
}
};
function incoming(msg) {
const rpc = JSON.parse(msg);
@ -185,10 +187,10 @@ function incoming(msg) {
function log(rpc) {
console.log("<-", rpc)
if (rpc.id) return;
const when = (new Date()).toISOString();
const msg = { name: rpc.method, detail: when.substring(1 + when.indexOf("T")), kind: 23 /* event */ };
const when=(new Date()).toISOString();
const msg = {name:rpc.method, detail:when.substring(1+when.indexOf("T")), kind:23 /* event */ };
//name,details,kind
$("msgList").setData([msg], true)
$("msgList").setData([msg],true)
};
function formFromStore(name) {