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

[mod] quietui

Browse source
This commit is contained in:
Andy Bunce 2025-10-25 23:16:48 +01:00
parent ff67b936cc
commit e732d190e1
3 changed files with 129 additions and 111 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -83,11 +83,15 @@ details[open]::details-content {
}
}
}
#tConnect:state(unchecked) {
outline: dashed 4px deeppink;
outline-offset: 4px;
}
.page-header {
grid-column: 1 / -1;
background: #ffcdd2;
display:flex;
justify-content:space-between;
}
.page-sidebar {
@ -110,9 +114,13 @@ 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;
}

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

@ -1,12 +1,17 @@
<!doctype html>
<html lang="en">
<html lang="en" class="quiet-cloak">
<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" />
<link href="../bootstrap@5.3.7.css" rel="stylesheet" />
<!-- 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 rel="stylesheet" href="grail.css" />
</head>
@ -14,25 +19,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>
</ul>
<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>
<select id="load">
<option selected value="">load..</option>
<optgroup label="XQuery3">
@ -57,26 +62,22 @@
generator.xquery</option>
</optgroup>
</select>
<button popovertarget="popAbout" type="button" class="btn btn-light">
<button popovertarget="popAbout" type="button">
<i class="codicon codicon-info"></i>
</button>
</div>
</nav>
</header>
<main class="page-main" style="overflow: auto;">
<nav class="page-nav">
<div class="navbar py-0 bg-light">
<div class="btn-group mr-2" role="group" aria-label="First group">
<quiet-toolbar>
<quiet-button-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>
</div>
<div class="btn-group btn-group-sm " role="group" aria-label="Second group">
</quiet-button-group>
<quiet-button-group>
<button id="search" title="Search" type="button" class="btn btn-light"><i
class="codicon codicon-search"></i></button>
@ -99,9 +100,9 @@
</button>
<button type="button" class="btn btn-light" popovertarget="popSettings" title="Settings">
<i class="codicon codicon-settings"></i></button>
</div>
</quiet-button-group>
<div class="btn-group" role="group" aria-label="Third group">
<quiet-button-group>
<button id="fullscreen" title="Full screen editor" type="button" class="btn btn-light">
<i class="codicon codicon-screen-full"></i>
</button>
@ -120,9 +121,10 @@
<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>
</div>
</div>
</nav>
</quiet-button-group>
</quiet-toolbar>
<!-- Editor goes in here -->
<div id="editor"></div>
</main>
@ -130,7 +132,8 @@
<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;">
@ -152,16 +155,30 @@
</aside>
<footer class="page-footer">
Footer <select id="language">
<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>

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

@ -119,7 +119,9 @@ $("load").onchange = e => {
});
$("load").value = "";
};
$("tConnect").addEventListener('quiet-change', event => {
$("popConnect").showPopover()
});
$("msgIcon").onclick = e => {
e.preventDefault();
alert("NOT YET")
@ -154,7 +156,7 @@ function connect() {
client = new lsp.LSPClient({ extensions: lsp.languageServerExtensions() });
client.connect(transport);
$("popConnect").hidePopover();
connectStatus(true);
$("tConnect").checked=true;
let extLsp = client.plugin(file, "xquery");
view.dispatch({
@ -165,23 +167,14 @@ 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);