332 lines
No EOL
14 KiB
HTML
332 lines
No EOL
14 KiB
HTML
<!doctype html>
|
|
<html lang="en" class="wa-cloak wa-theme-default wa-palette-default wa-brand-blue wa-light">
|
|
|
|
<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="stylesheet" href="../../webawesome/dist-cdn/styles/webawesome.css" />
|
|
<link rel="icon" type="image/png" href="../favicon.png" />
|
|
|
|
<script type="module" src="wa-setup.js"></script>
|
|
<link rel="stylesheet" href="wa.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<div class="page-wrap">
|
|
<header class="page-header">
|
|
<wa-dropdown>
|
|
<wa-button slot="trigger" with-caret>File</wa-button>
|
|
<wa-dropdown-item id="bnNew">
|
|
<wa-icon slot="icon" library="tabler" name="file"></wa-icon>New...
|
|
<div slot="details">empty document</div>
|
|
</wa-dropdown-item>
|
|
|
|
<wa-dropdown-item id="bnRead">
|
|
<wa-icon slot="icon" library="tabler" name="folder-open"></wa-icon>Open...
|
|
<div slot="details">a local file</div>
|
|
</wa-dropdown-item>
|
|
<input type="file" id="fileElem" multiple accept="*/*" style="display: none;" />
|
|
|
|
<wa-dropdown-item id="popover__url">
|
|
<wa-icon slot="icon" library="tabler" name="link"></wa-icon>Fetch...
|
|
<div slot="details">a url from the internet</div>
|
|
</wa-dropdown-item>
|
|
</wa-dropdown>
|
|
|
|
<div>
|
|
<span class="h4">XQuery 4.0 LSP client</span>
|
|
|
|
<wa-button id="bConnect" variant="danger">
|
|
<wa-icon library="tabler" name="network-off"></wa-icon>
|
|
</wa-button>
|
|
<wa-tooltip id="tipConnect" for="bConnect">Not connected</wa-tooltip>
|
|
</div>
|
|
|
|
|
|
<wa-button-group>
|
|
<wa-dropdown>
|
|
<wa-button slot="trigger" with-caret>Dev tools</wa-button>
|
|
<wa-dropdown-item>
|
|
<wa-icon slot="icon" library="tabler" name="external-link"></wa-icon>
|
|
<a href="/app/home" target="lsp" rel="noreferrer noopener">LSP Manager</a>
|
|
</wa-dropdown-item>
|
|
<wa-dropdown-item>
|
|
<wa-icon slot="icon" library="tabler" name="external-link"></wa-icon>
|
|
<a href="/dba/logs" target="dba" rel="noreferrer noopener">Dba</a>
|
|
</wa-dropdown-item>
|
|
<wa-divider></wa-divider>
|
|
</wa-dropdown>
|
|
<button popovertarget="popAbout" type="button">
|
|
<wa-icon library="tabler" name="help" label="Home" slot="start"></wa-icon>
|
|
</button>
|
|
</wa-button-group>
|
|
</header>
|
|
|
|
|
|
<main id="main" class="page-main" style="overflow: auto;">
|
|
<div class="wa-split " style="font-size: 24px;">
|
|
|
|
<wa-button-group>
|
|
<wa-button id="search" title="Search" icon-label="search">
|
|
<wa-icon name="search"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="lint" title="Display diagnostics" icon-label="diagnostics">
|
|
<wa-icon library="tabler" name="message-report"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="symbols2" title="symbols" icon-label="Symbols">
|
|
<wa-icon library="tabler" name="icons"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="format" type="button" title="Format (Shift-Alt-f)" icon-label="Format">
|
|
<wa-icon library="tabler" name="align-justified"></wa-icon>
|
|
</wa-button>
|
|
|
|
</wa-button-group>
|
|
|
|
<wa-button-group>
|
|
<wa-button id="sync" title="Sync changes to server">
|
|
<wa-icon library="codicon" name="sync"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="cmdList" title="Command and key mapping help">
|
|
<wa-icon library="codicon" name="record-keys"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="popover__settings" title="Settings">
|
|
<wa-icon library="codicon" name="settings"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="fullscreen" title="Full screen editor">
|
|
<wa-icon library="codicon" name="screen-full"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="bnSave" title="save view">
|
|
<wa-icon library="codicon" name="git-stash"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="bnLoad" title="load view">
|
|
<wa-icon library="codicon" name="git-stash-pop"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="bnWordAt" type="wa-button" title="word at">
|
|
<wa-icon library="codicon" name="whole-word"></wa-icon>
|
|
</wa-button>
|
|
|
|
<wa-button id="bnDebug" title="Debug " icon-label="debug">
|
|
<wa-icon library="codicon" name="debug"></wa-icon>
|
|
</wa-button>
|
|
</wa-button-group>
|
|
|
|
<div></div>
|
|
</div>
|
|
|
|
<!-- Editor goes in here -->
|
|
<div id="editor"></div>
|
|
</main>
|
|
|
|
<aside class="page-sidebar">
|
|
|
|
<details id="workspacePanel" open="open">
|
|
<summary class='bg-info'>WORKSPACE
|
|
<wa-icon library="codicon" name="kebab-vertical" style="float:right"></wa-icon>
|
|
</summary>
|
|
<div style="overflow: scroll;">
|
|
<wa-tree id="workspace" selection="single">
|
|
<wa-tree-item>file:///some/file.xqm</wa-tree-item>
|
|
</wa-tree>
|
|
</div>
|
|
|
|
</details>
|
|
|
|
<details id="symPanel">
|
|
<summary>OUTLINE
|
|
<wa-dropdown id="symOptions" style="display:inline-block;float:right;">
|
|
<wa-icon id="symTrigger" library="tabler" name="dots-vertical" slot="trigger"></wa-icon>
|
|
<wa-dropdown-item type="checkbox" value="canvas" checked>Follow cursor</wa-dropdown-item>
|
|
|
|
<wa-divider></wa-divider>
|
|
<wa-dropdown-item type="checkbox" value="position" checked>sort by:
|
|
Position</wa-dropdown-item>
|
|
<wa-dropdown-item type="checkbox" value="name">sort by: Name</wa-dropdown-item>
|
|
<wa-dropdown-item type="checkbox" value="category">sort by: Category</wa-dropdown-item>
|
|
</wa-dropdown>
|
|
</summary>
|
|
<qd-list id="symList" style="flex-grow:1;"></qd-list>
|
|
</details>
|
|
|
|
<details id="msgPanel">
|
|
<summary>MESSAGES
|
|
<i id="msgIcon" class='codicon codicon-kebab-vertical' style="float:right"></i>
|
|
</summary>
|
|
<qd-list id="msgList" style="flex-grow:1;"></qd-list>
|
|
</details>
|
|
</aside>
|
|
|
|
<footer class="page-footer">
|
|
<div style="display:flex;">
|
|
|
|
<div>
|
|
<label for="iFile">File:</label>
|
|
<input id="iFile" type="url" value="file:///some/file.xqm"
|
|
style="width:20em;display:inline-block;" />
|
|
|
|
<label for="symbols">Symbols:</label>
|
|
<select id="symbols" disabled="disabled" style="width:10em;display:inline-block;"></select>
|
|
</div>
|
|
</div>
|
|
<wa-relative-time live id="relative-time__live" sync second="numeric" format='short'
|
|
style="width:10em;"></wa-relative-time>
|
|
<select id="language" style="width:10em;display:inline-block;">
|
|
<option selected>Language</option>
|
|
<option value="plaintext">plaintext</option>
|
|
<option value="xquery">xquery</option>
|
|
<option value="xml">xml</option>
|
|
</select>
|
|
|
|
</footer>
|
|
</div>
|
|
|
|
|
|
<!-- dialogs -->
|
|
<wa-popover id="popWeb" for="popover__url">
|
|
<div style="display:flex;background: #ffecb3;">
|
|
<div style="flex: 1 1 auto;">Load a document from the web</div>
|
|
<wa-button icon-label="Close" appearance="text" data-popover="close">
|
|
<wa-icon name="circle-xmark" library="system"></wa-icon>
|
|
</wa-button>
|
|
</div>
|
|
|
|
<form id="popUrl">
|
|
<wa-input type="url" name="url" label="URL to fetch" placeholder="http://..." with-clear required
|
|
style="width: 20em;">
|
|
|
|
<datalist>
|
|
|
|
<option
|
|
value="https://raw.githubusercontent.com/Quodatum/xqdoca/refs/heads/master/src/main/lib/model.xqm">
|
|
model.xqm (Quodatum/xqdoca)</option>
|
|
<option
|
|
value="https://git.quodatum.duckdns.org/api/v1/repos/quodatum/basex-lsp/raw/webapp/lsp/lsp-text.xqm">
|
|
lsp-text.xqm (quodatum/basex-lsp FORGEIO)</option>
|
|
<option
|
|
value="https://git.quodatum.duckdns.org/api/v1/repos/quodatum/basex-lsp/raw/webapp/lsp/set.xqm">
|
|
set.xqm (quodatum/basex-lsp FORGEIO)</option>
|
|
|
|
<option
|
|
value="https://raw.githubusercontent.com/dnovatchev/Articles/refs/heads/main/Generators/Code/generator.xq">
|
|
generator.xquery</option>
|
|
</datalist>
|
|
</wa-input>
|
|
<wa-button type="submit" variant="primary">Fetch</wa-button>
|
|
<hr />
|
|
<wa-tree id="samples" selection="leaf">
|
|
<wa-tree-item>
|
|
XQuery 3.1
|
|
<wa-tree-item
|
|
data-href="https://raw.githubusercontent.com/expkg-zone58/pdfbox/refs/heads/main/src/Pdfbox3.xqm">Pdfbox3.xqm
|
|
(expkg-zone58/pdfbox)</wa-tree-item>
|
|
<wa-tree-item
|
|
data-href="https://raw.githubusercontent.com/Quodatum/xqdoca/refs/heads/master/src/main/lib/model.xqm">
|
|
model.xqm (Quodatum/xqdoca)</option></wa-tree-item>
|
|
<wa-tree-item>Item X</wa-tree-item>
|
|
</wa-tree-item>
|
|
<wa-tree-item>
|
|
XQuery 4
|
|
<wa-tree-item>Item B</wa-tree-item>
|
|
<wa-tree-item>Item C</wa-tree-item>
|
|
</wa-tree-item>
|
|
<wa-tree-item>Item 2</wa-tree-item>
|
|
<wa-tree-item>Item 3</wa-tree-item>
|
|
</wa-tree>
|
|
|
|
|
|
</form>
|
|
|
|
</wa-popover>
|
|
|
|
|
|
|
|
|
|
<!-- Popovers -->
|
|
|
|
<dialog id="popConnect" popover>
|
|
<form>
|
|
<header>Connect to LSP
|
|
<button type="button" class="btn-close" aria-label="Close"
|
|
onclick="$('popConnect').hidePopover(); "></button>
|
|
</header>
|
|
<div class="modal-body">
|
|
<div id="state">🔴</div>
|
|
<input id="iServer" type="text" style="width:25em" />
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button id="connect">connect</button>
|
|
</div>
|
|
</form>
|
|
</dialog>
|
|
|
|
<dialog id="popCmds" popover>
|
|
<form>
|
|
<header>Commands and keys
|
|
<button type="button" class="btn-close" aria-label="Close"
|
|
onclick="$('popCmds').hidePopover(); "></button>
|
|
</header>
|
|
<div id="popHelpInfo" class="modal-body" style="height: 50vh;overflow:scroll;">
|
|
|
|
</div>
|
|
<div class="modal-footer">
|
|
|
|
</div>
|
|
</form>
|
|
</dialog>
|
|
<dialog id="popAbout" popover>
|
|
<form>
|
|
<header>Help</header>
|
|
<div class="modal-body" style="height: 50vh;overflow:scroll;">
|
|
<p>TODO help info</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
|
|
</div>
|
|
</form>
|
|
</dialog>
|
|
<!-- <popup-info id="popHelp">hhhh</popup-info> -->
|
|
|
|
<wa-popover for="popover__settings">
|
|
<form id="fSettings">
|
|
<header>Editor configuration
|
|
<button type="button" class="btn-close" aria-label="Close"
|
|
onclick="$('popSettings').hidePopover(); "></button>
|
|
</header>
|
|
<div class="modal-body">
|
|
|
|
<div class="mb-3 form-check">
|
|
<input name="wrapLines" type="checkbox" class="form-check-input" id="lineWrap">
|
|
<label class="form-check-label" for="lineWrap">Wrap lines</label>
|
|
</div>
|
|
<div class="mb-3 form-check">
|
|
<input name="highlightWhitespace" type="checkbox" class="form-check-input" id="highlightWhitespace">
|
|
<label class="form-check-label" for="highlightWhitespace">highlight Whitespace</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 class="modal-footer">
|
|
<button type="submit" class="btn btn-primary">Apply</button>
|
|
</div>
|
|
</form>
|
|
</wa-popover>
|
|
<!-- CodeMirror 6 -->
|
|
<script src="./lsp.bundle.js"></script>
|
|
<script src="./script.js"></script>
|
|
<script src="./wc-qd-list.js"></script>
|
|
|
|
</body>
|
|
|
|
</html> |