Fixed LSP Setting window loading JSON to HTML

This commit is contained in:
itdominator 2024-04-05 22:44:24 -05:00
parent 4fe2c7ed8f
commit 99e9e9d3ef
5 changed files with 166 additions and 74 deletions

View File

@ -74,6 +74,7 @@
</div>
<div class="modal-footer">
<button onclick="loadSettingsFileToUI()">Load LSP Settings</button>
<button onclick="loadPythonLSPFromBlobURLs()">Load LSP Client</button>
</div>
</div>
@ -94,14 +95,14 @@
</div>
</section>
</template>
<template id="input-list-template">
<template id="input-dict-template">
<style>
ul, li {
list-style: none;
}
ul {
padding: 5px;
padding-left: 2em;
}
.selected {
@ -109,7 +110,27 @@
}
</style>
<section>
<h1 id="title"></h1>
<h3 id="title"></h3>
<ul id="input-dict">
</ul>
</section>
</template>
<template id="input-list-template">
<style>
ul, li {
list-style: none;
}
ul {
padding-left: 2em;
}
.selected {
background-color: rgba(255, 255, 255, 0.64);
}
</style>
<section>
<h3 id="title"></h3>
<ul id="input-list">
</ul>
</section>
@ -125,6 +146,12 @@
<input id="input-entry" />
</li>
</template>
<template id="input-checkbox-template">
<style>
</style>
<label id="title" for="input-checkbox"></label>
<input id="input-checkbox" type="checkbox"/>
</template>

View File

@ -33,6 +33,41 @@ class LspConfigContainer extends HTMLElement {
}
}
class InputDictContainer extends HTMLElement {
constructor() {
super();
}
loadShaddowRoot(tag = "input-dict-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("input-dict").appendChild(elm);
}
remove(elm = null) {
if (!elm) return;
this.shadowRoot.getElementById("input-dict").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();
@ -68,7 +103,6 @@ class InputListContainer extends HTMLElement {
}
}
class InputListItemContainer extends HTMLElement {
constructor() {
super();
@ -84,7 +118,6 @@ class InputListItemContainer extends HTMLElement {
setTitle(textStr = "") {
if (Object.getPrototypeOf(textStr) !== String.prototype) return;
this.shadowRoot.getElementById("title").innerText = textStr;
}
@ -94,7 +127,6 @@ class InputListItemContainer extends HTMLElement {
setText(textStr = "") {
if (Object.getPrototypeOf(textStr) !== String.prototype) return;
this.shadowRoot.getElementById("input-entry").value = textStr;
}
@ -107,6 +139,44 @@ class InputListItemContainer extends HTMLElement {
}
}
class InputCheckboxContainer extends HTMLElement {
constructor() {
super();
}
loadShaddowRoot(tag = "input-checkbox-template") {
let template = document.getElementById(tag);
let templateContent = template.content;
const shadowRoot = this.attachShadow({ mode: "open" });
shadowRoot.appendChild( templateContent.cloneNode(true) );
}
setTitle(textStr = "") {
if (Object.getPrototypeOf(textStr) !== String.prototype) return;
this.shadowRoot.getElementById("title").innerText = textStr;
}
toggle() {
let elm = this.shadowRoot.getElementById("input-checkbox");
elm.checked = !elm.checked;
}
on() {
let elm = this.shadowRoot.getElementById("input-checkbox").checked = true;
}
off() {
let elm = this.shadowRoot.getElementById("input-checkbox").checked = false;
}
serialize() {
return this.shadowRoot.getElementById("input-checkbox").value;
}
}
class LspConfig extends LspConfigContainer {
constructor() {
@ -115,6 +185,13 @@ class LspConfig extends LspConfigContainer {
}
}
class InputDict extends InputDictContainer {
constructor() {
super();
this.loadShaddowRoot();
}
}
class InputList extends InputListContainer {
constructor() {
super();
@ -128,3 +205,10 @@ class InputListItem extends InputListItemContainer {
this.loadShaddowRoot();
}
}
class InputCheckbox extends InputCheckboxContainer {
constructor() {
super();
this.loadShaddowRoot();
}
}

View File

@ -17,8 +17,10 @@ window.onload = (eve) => {
const defineCustomElements = () => {
customElements.define("lsp-config", LspConfig, { extends: 'div' });
customElements.define("input-dict", InputDict, { extends: 'ul' });
customElements.define("input-list", InputList, { extends: 'ul' });
customElements.define("input-list-item", InputListItem, { extends: 'li' });
customElements.define("input-checkbox", InputCheckbox, { extends: 'input' });
}
const loadLSPClientJSFiles = () => {

View File

@ -28,7 +28,7 @@ const loadPythonLSPFromBlobURLs = () => {
modes: "python|python3",
type: "socket", // "socket|worker"
socket: new WebSocket( "${ lspServersConfig['python']['socket'] }" ),
initializationOptions: ${ JSON.stringify( lspServersConfig['python']['initialization_options'] ) }
initializationOptions: ${ JSON.stringify( lspServersConfig['python']['initialization-options'] ) }
}
);
}()
@ -67,7 +67,7 @@ const loadPythonLSPFromNetwork = () => {
modes: "python|python3",
type: "socket", // "socket|worker"
socket: new WebSocket( "${ lspServersConfig['python']['socket'] }" ),
initializationOptions: ${ JSON.stringify( lspServersConfig['python']['initialization_options'] ) }
initializationOptions: ${ JSON.stringify( lspServersConfig['python']['initialization-options'] ) }
});
}()
`;
@ -89,125 +89,104 @@ const loadPythonLSPFromNetwork = () => {
const loadSettingsFileToUI = async () => {
generateElement(lspServersConfig);
let config = lspServersConfig;
let languages = Object.keys(config);
// let config = lspServersConfig;
// let keys = Object.keys(lspServersConfig);
clearChildNodes(lspSettingsUI);
for (let i = 0; i < languages.length; i++) {
let elm = document.createElement("lsp-config");
let lang = languages[i];
// for (let i = 0; i < languages.length; i++) {
// let elm = document.createElement("lsp-config");
// let lang = languages[i];
elm.setTitle(lang);
lspSettingsUI.appendChild( elm );
// elm.setTitle(lang);
// lspSettingsUI.appendChild( elm );
// generateElement(lang, elm, lspServersConfig[lang]);
// }
generateElement(config[lang], "", elm);
}
}
const saveSettingsFileFromUI = () => {
console.log("Stub...");
}
const generateElement = (config = {}, parent = "", elm = null) => {
const proto = Object.getPrototypeOf(config)
console.log(config, parent, elm);
const proto = Object.getPrototypeOf(config);
switch (proto) {
case String.prototype:
handleString(config, elm);
// lspSettingsUI.appendChild( target );
handleString(config, parent, elm);
break;
case Array.prototype:
handleList(config, elm);
// lspSettingsUI.appendChild( target );
handleList(config, parent, elm);
break;
case Boolean.prototype:
handleBoolean(config, parent, elm);
break;
case Map.prototype:
console.log("Map generatable HTML type stub...");
break;
default:
if ( isDict(config) ) {
if (parent === "" && elm === null) {
handleRoot(config);
// let elm = document.createElement("lsp-config");
// let lang = languages[i];
break;
}
handleDictionary(config, elm);
// target = handleDictionary(config, elm);
// lspSettingsUI.appendChild( target );
// let elm = document.createElement("lsp-config");
// let lang = languages[i];
handleDictionary(config, parent, elm);
break;
}
console.log("No generatable HTML type...")
console.log("No generatable HTML type...");
}
}
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);
const handleDictionary = (config, parent, elm) => {
let listElm = document.createElement("input-dict");
let keys = Object.keys(config);
listElm.setTitle( parent );
for (let i = 0; i < keys.length; i++) {
let key = keys[i];
generateElement(config[key], key, elm);
generateElement(config[key], key, listElm);
}
elm.append(listElm);
return elm;
}
const handleList = (config, elm) => {
const handleList = (config, parent, elm) => {
let listElm = document.createElement("input-list");
listElm.setTitle( parent );
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);
const handleString = (config, parent, elm) => {
let inputElm = document.createElement("input-list-item");
inputElm.setTitle(parent);
inputElm.setText(config);
elm.append(inputElm);
}
const handleBoolean = (config, parent, elm) => {
let inputElm = document.createElement("input-checkbox");
inputElm.setTitle(parent);
(config === true) ? inputElm.on() : inputElm.off();
elm.append(inputElm);
}

View File

@ -4,14 +4,14 @@
"alt-command": "",
"command": "",
"socket": "ws://127.0.0.1:3030/?name=shell",
"initialization_options": {}
"initialization-options": {}
},
"python": {
"info": "https://github.com/python-lsp/python-lsp-server",
"alt-command": "pylsp --ws --port 3030",
"command": "lsp-ws-proxy --listen 3030 -- pylsp",
"socket": "ws://127.0.0.1:3030/?name=pylsp",
"initialization_options": {
"initialization-options": {
"pylsp.plugins.rope_autoimport.enabled": true,
"pylsp.plugins.rope_completion.enabled": true,
"pylsp.plugins.rope_completion.eager": true,
@ -26,7 +26,7 @@
"alt-command": "jedi-language-server",
"command": "lsp-ws-proxy --listen 3030 -- jedi-language-server",
"socket": "ws://127.0.0.1:3030/?name=jedi-language-server",
"initialization_options": {
"initialization-options": {
"jediSettings": {
"autoImportModules": [],
"caseInsensitiveCompletion": true,
@ -53,20 +53,20 @@
"alt-command": "clangd",
"command": "lsp-ws-proxy --listen 3030 -- clangd",
"socket": "ws://127.0.0.1:3030/?name=clangd",
"initialization_options": {}
"initialization-options": {}
},
"cpp": {
"info": "https://clangd.llvm.org/",
"alt-command": "clangd",
"command": "lsp-ws-proxy --listen 3030 -- clangd",
"socket": "ws://127.0.0.1:3030/?name=clangd",
"initialization_options": {}
"initialization-options": {}
},
"java": {
"info": "https://download.eclipse.org/jdtls/",
"alt-command": "java-language-server",
"command": "lsp-ws-proxy --listen 3030 -- java-language-server",
"socket": "ws://127.0.0.1:3030/?name=java-language-server",
"initialization_options": {}
"initialization-options": {}
}
}