WIP LSP config ui

This commit is contained in:
itdominator 2024-03-29 00:22:25 -05:00
parent 14100b09e3
commit b76b7ab780
5 changed files with 147 additions and 37 deletions

View File

@ -27,8 +27,7 @@
<!-- Buffers modal -->
<div class="modal" id="buffers-modal" tabindex="-1" role="dialog"
data-bs-theme="dark" data-bs-keyboard="false" data-bs-backdrop="static"
>
data-bs-theme="dark" data-bs-keyboard="false" data-bs-backdrop="static">
<div class="modal-dialog modal-xl" role="document">
<div class="modal-content">
<div class="modal-header">
@ -75,7 +74,7 @@
</div>
<div class="modal-footer">
<button onclick="loadPythonLSPFromBlobURLs()">Load LSP Client</button>
<button onclick="loadPythonLSPFromBlobURLs()">Load LSP Client</button>
</div>
</div>
</div>
@ -85,6 +84,16 @@
<!-- Template Tags... -->
<template id="lsp-config-template">
<style>
</style>
<section>
<div id="lsp-config" class="row">
<hr/>
<h2 id="title"></h2>
</div>
</section>
</template>
<template id="input-list-template">
<style>
ul, li {
@ -100,15 +109,15 @@
}
</style>
<section>
<hr/>
<h2 id="title"></h2>
<h1 id="title"></h1>
<ul id="input-list">
</ul>
</section>
</template>
<template id="input-list-item-template">
<style>
li {
ul, li {
list-style: none;
}
</style>
<li id="input-list-item">

View File

@ -1,3 +1,38 @@
class LspConfigContainer extends HTMLElement {
constructor() {
super();
}
loadShaddowRoot(tag = "lsp-config-template") {
let template = document.getElementById(tag);
let templateContent = template.content;
const shadowRoot = this.attachShadow({ mode: "open" });
shadowRoot.appendChild( templateContent.cloneNode(true) );
}
setTitle(title = "[NO TITLE]") {
this.shadowRoot.getElementById("title").innerText = title;
}
append(elm = null) {
if (!elm) return;
this.shadowRoot.getElementById("lsp-config").appendChild(elm);
}
remove(elm = null) {
if (!elm) return;
this.shadowRoot.getElementById("lsp-config").remove(elm);
}
serialize() {
let tags = this.shadowRoot.children;
for (var i = 0; i < tags.length; i++) {
data = tags[i].serialize();
}
}
}
class InputListContainer extends HTMLElement {
constructor() {
super();
@ -10,11 +45,11 @@ class InputListContainer extends HTMLElement {
const shadowRoot = this.attachShadow({ mode: "open" });
shadowRoot.appendChild( templateContent.cloneNode(true) );
}
setTitle(title = "[NO TITLE]") {
this.shadowRoot.getElementById("title").innerText = title;
}
append(elm = null) {
if (!elm) return;
this.shadowRoot.getElementById("input-list").appendChild(elm);
@ -33,6 +68,7 @@ class InputListContainer extends HTMLElement {
}
}
class InputListItemContainer extends HTMLElement {
constructor() {
super();
@ -72,6 +108,13 @@ class InputListItemContainer extends HTMLElement {
}
class LspConfig extends LspConfigContainer {
constructor() {
super();
this.loadShaddowRoot();
}
}
class InputList extends InputListContainer {
constructor() {
super();
@ -84,4 +127,4 @@ class InputListItem extends InputListItemContainer {
super();
this.loadShaddowRoot();
}
}
}

View File

@ -16,6 +16,7 @@ window.onload = (eve) => {
const defineCustomElements = () => {
customElements.define("lsp-config", LspConfig, { extends: 'div' });
customElements.define("input-list", InputList, { extends: 'ul' });
customElements.define("input-list-item", InputListItem, { extends: 'li' });
}

View File

@ -89,17 +89,20 @@ const loadPythonLSPFromNetwork = () => {
const loadSettingsFileToUI = async () => {
let languages = Object.keys(lspServersConfig);
generateElement(lspServersConfig);
for (let i = 0; i < languages.length; i++) {
let lang = languages[i];
let elm = document.createElement("input-list");
// let config = lspServersConfig;
// let keys = Object.keys(lspServersConfig);
elm.setTitle(lang);
lspSettingsUI.appendChild( elm );
// for (let i = 0; i < languages.length; i++) {
// let elm = document.createElement("lsp-config");
// let lang = languages[i];
generateElement(lang, elm, lspServersConfig[lang]);
}
// elm.setTitle(lang);
// lspSettingsUI.appendChild( elm );
// generateElement(lang, elm, lspServersConfig[lang]);
// }
}
@ -109,25 +112,21 @@ const saveSettingsFileFromUI = () => {
}
const generateElement = (parent, elm, config) => {
const generateElement = (config = {}, parent = "", elm = null) => {
const proto = Object.getPrototypeOf(config)
console.log(config, parent, elm);
switch (proto) {
case String.prototype:
let inputElm = document.createElement("input-list-item");
inputElm.setTitle(parent);
inputElm.setText(config);
elm.append(inputElm);
handleString(config, elm);
// lspSettingsUI.appendChild( target );
break;
case Array.prototype:
let inputListElm = document.createElement("input-list");
for (var i = 0; i < config.length; i++) {
let inputElm = document.createElement("input-list-item");
inputElm.setText( config[i] );
inputListElm.append(inputElm);
}
elm.append(inputListElm);
handleList(config, elm);
// lspSettingsUI.appendChild( target );
break;
case Boolean.prototype:
@ -138,13 +137,21 @@ const generateElement = (parent, elm, config) => {
break;
default:
if ( isDict(config) ) {
let keys = Object.keys(config);
if (parent === "" && elm === null) {
handleRoot(config);
// let elm = document.createElement("lsp-config");
// let lang = languages[i];
for (let i = 0; i < keys.length; i++) {
let key = keys[i];
generateElement(key, elm, config[key] );
break;
}
handleDictionary(config, elm);
// target = handleDictionary(config, elm);
// lspSettingsUI.appendChild( target );
// let elm = document.createElement("lsp-config");
// let lang = languages[i];
break;
}
@ -153,6 +160,54 @@ const generateElement = (parent, elm, config) => {
}
const isDict = (dict) => {
return typeof dict === "object" && !Array.isArray(dict);
};
const handleRoot = (config) => {
let keys = Object.keys(config);
for (let i = 0; i < keys.length; i++) {
let elm = document.createElement("lsp-config");
let key = keys[i];
elm.setTitle(key);
lspSettingsUI.appendChild( elm );
generateElement(config[key], key, elm);
}
}
const handleDictionary = (config, elm) => {
let keys = Object.keys(config);
for (let i = 0; i < keys.length; i++) {
let key = keys[i];
generateElement(config[key], key, elm);
}
}
const handleList = (config, elm) => {
let listElm = document.createElement("input-list");
for (var i = 0; i < config.length; i++) {
let inputElm = document.createElement("input-list-item");
inputElm.setText( config[i] );
listElm.append(inputElm);
}
elm.append(listElm);
return elm;
}
const handleString = (config, elm) => {
console.log(config, elm);
let inputElm = document.createElement("input-list-item");
inputElm.setTitle(parent);
inputElm.setText(config);
elm.append(inputElm);
}

View File

@ -45,7 +45,9 @@ const sendMessage = (topic = null, ftype = "", fhash = "", fpath = "", content =
messenger.backend.postMessage( JSON.stringify(messageBody) );
}
const sleep = ms => new Promise(r => setTimeout(r, ms));
const sleep = ms => new Promise(r => setTimeout(r, ms));
const isDict = (dict) => { return typeof dict === "object" && !Array.isArray(dict); };
const getSHA256Hash = async (input) => {
let textAsBuffer = new TextEncoder().encode(input);