diff --git a/README.md b/README.md index b5787ec..90fe981 100644 --- a/README.md +++ b/README.md @@ -1,14 +1,14 @@ Work in progress. An attempt to write a [Language Server Protocol](https://en.wikipedia.org/wiki/Language_Server_Protocol) server for and in XQuery 4.0. It tracks the draft specifications at https://qt4cg.org/ -It written for BaseX 12.0 and uses the [BaseX websocket](https://docs.basex.org/main/WebSockets) feature. See [The WebSocket Protocol +It written for BaseX 12.0 and uses the [BaseX websocket](https://docs.basex.org/main/WebSockets) for transport. See [The WebSocket Protocol RFC 6455](https://www.rfc-editor.org/rfc/rfc6455.html) # Demo The demo makes use of `Docker` or `Podman` for ease of setup. This is not a requirement to use the software. -1 Clone this repo -2. Run `docker compose up -d` The LSP server shall now running on port 3000 (edit `compose.yaml` to change port) +1. Clone this repostory. +2. Run `docker compose up -d` The LSP server should now now running on port 3000 (edit `compose.yaml` to change port) 3. In a browser navigate to `http://localhost:3000/static/clients/codemirror/` to see the CodeMirror 6 demo. In principle, the LSP can be used in any environment that can make use of a LSP server accessed via a websocket. @@ -74,7 +74,7 @@ sequenceDiagram ``` #### XQuery 4.0 parser -The ebnf is taken from Gunther Rademacher's rex-parser-generator +The Ebnf is taken from Gunther Rademacher's rex-parser-generator [XQuery-40.ebnf](https://github.com/GuntherRademacher/rex-parser-generator/blob/main/docs/sample-grammars/XQuery-40.ebnf) The script [scripts/rex.xq](scripts/rex.xq) can generate XQuery or Java parser code from this. diff --git a/compose.yaml b/compose.yaml index e95a1d3..686d92f 100644 --- a/compose.yaml +++ b/compose.yaml @@ -13,6 +13,7 @@ services: - ./webapp/custom:/srv/basex/lib/custom:ro # jars - ./webapp/lsp:/srv/basex/webapp/lsp - ./webapp/static/clients:/srv/basex/webapp/static/clients:ro + - webawesome:/srv/basex/webapp/static/webawesome:ro - ./webapp/lsp-manager:/srv/basex/webapp/lsp-manager # - ./repo:/srv/basex/repo environment: @@ -20,4 +21,6 @@ services: - "SERVER_OPTS= " volumes: - basex-lsp: + basex-lsp: + webawesome: # + external: true diff --git a/webapp/static/clients/codemirror/icons.js b/webapp/static/clients/codemirror/icons.js index 26b1d8c..7f2e986 100644 --- a/webapp/static/clients/codemirror/icons.js +++ b/webapp/static/clients/codemirror/icons.js @@ -1,6 +1,14 @@ import { registerIconLibrary } from '/static/clients/quietui@1.6.2/dist/quiet.loader.js'; - registerIconLibrary('codicon', { - resolve: (name, family) => { - return `/static/clients/codicon@0.0.40/icons/${name}.svg` - }}); \ No newline at end of file +registerIconLibrary('tabler', { + resolver: name => `https://cdn.jsdelivr.net/npm/@tabler/icons@1.68.0/icons/${name}.svg`, + mutator: svg => { + svg.style.fill = 'none'; + svg.setAttribute('stroke', 'currentColor'); + } +}); +registerIconLibrary('codicon', { + resolve: (name, family) => { + return `/static/clients/codicon@0.0.40/icons/${name}.svg` + } +}); \ No newline at end of file diff --git a/webapp/static/clients/codemirror/styles.css b/webapp/static/clients/codemirror/styles.css index 3104643..d7550f6 100644 --- a/webapp/static/clients/codemirror/styles.css +++ b/webapp/static/clients/codemirror/styles.css @@ -1,5 +1,5 @@ -@import url("../bootstrap-icons.min.css"); +//@import url("../bootstrap-icons.min.css"); html { height: 100%;} body { min-height: 100vh; } diff --git a/webapp/static/clients/codemirror/webawesome.css b/webapp/static/clients/codemirror/webawesome.css new file mode 100644 index 0000000..01e8b00 --- /dev/null +++ b/webapp/static/clients/codemirror/webawesome.css @@ -0,0 +1,122 @@ + + +:root { + color-scheme: light dark; + --quiet-primary-seed: #e98d61; + --quiet-content-spacing: 0.75rem; + --quiet-form-control-height-md:0.9rem; + --quiet-focus-width: 2px; + --quiet-focus-offset: 0px; +} + + + + +form header { + background-color: burlywood; +} + +.page-wrap { + background: white; + height: 100vh ; + + + display: grid; + grid-template-columns: minmax(10px, 1fr) minmax(10px, 4fr); + grid-template-rows: min-content min-content 1fr min-content; + + + + + details { + + } + + details[open] { + flex-grow: 1; + overflow: hidden; + } + + summary { + background-color: var(--quiet-neutral-fill-softer); + } + + /* Set editor dimensions */ + #editor { + max-width: 100%; + overflow: hidden; + height: 75cqh; + } + + /* Stretch editor to fit inside its containing div */ + .cm-editor { + height: 100%; + width: 100%; + overflow: auto; + } + + details[open]::details-content { + padding: 0.1em; + border: thin solid grey; + overflow: auto; + } + + ::backdrop { + backdrop-filter: blur(2px); + } + + @media (max-width: 600px) { + grid-template-columns: 100%; + grid-template-rows: auto; + + >* { + grid-column: 1 / -1 !important; + grid-row: auto !important; + } + } +} + +#tConnect:state(unchecked) { + outline: dashed 4px deeppink; + outline-offset: 4px; +} + +.page-header { + grid-column: 1 / -1; + display: flex; + justify-content: space-between; + background: red; +} + +.page-sidebar { + grid-column: 1 / 2; + grid-row: 2 / 4; + display: flex; + flex-direction: column; + + details { + display: flex; + flex-direction: column; + + } +} + +.page-nav { + grid-column: 2 / 3; + background: red; + +} + +.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; + padding:2px; +} \ No newline at end of file diff --git a/webapp/static/clients/codemirror/webawesome.html b/webapp/static/clients/codemirror/webawesome.html new file mode 100644 index 0000000..da4ce3e --- /dev/null +++ b/webapp/static/clients/codemirror/webawesome.html @@ -0,0 +1,345 @@ + + + + +
+ + +