klbr/khoj
1
0
Fork 0
mirror of https://github.com/khoaliber/khoj.git synced 2026-03-09 13:25:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make raw data reactive to changes

Browse Source
This commit is contained in:
Saba
2021-11-27 19:17:15 -05:00
parent 7ffa70a001
commit f3b03ea5b7
3 changed files with 59 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/main.py
View File

@@ -36,6 +36,12 @@ def config():
print(config) print(config)
return config return config
@app.post('/config')
def config():
print("hello posted config")
print(config)
return config
@app.get('/search') @app.get('/search')
def search(q: str, n: Optional[int] = 5, t: Optional[SearchType] = None): def search(q: str, n: Optional[int] = 5, t: Optional[SearchType] = None):
if q is None or q == '': if q is None or q == '':

5
views/config.html
View File

@@ -4,10 +4,7 @@
<link rel="stylesheet" href="views/style.css"> <link rel="stylesheet" href="views/style.css">
</head> </head>
<body> <body>
<button type="button" id="show-config">Show Config</button> <form id="config-form">
<form id="config-form" style="display: none;">
<h1 id="config-title"></h1>
<h2>content-type</h2>
</form> </form>
</body> </body>
<script src="views/scripts/config.js"></script> <script src="views/scripts/config.js"></script>

84
views/scripts/config.js
View File

@@ -1,14 +1,25 @@
var showConfig = document.getElementById("show-config"); var showConfig = document.getElementById("show-config");
var rawConfig = {}; var rawConfig = {};
showConfig.addEventListener("click", () => { var configForm = document.getElementById("config-form");
var configForm = document.getElementById("config-form"); fetch("/config")
fetch("/config") .then(response => response.json())
.then(response => response.json()) .then(data => {
.then(data => { rawConfig = data;
rawConfig = data; configForm.style.display = "block";
configForm.style.display = "block"; processChildren(configForm, data);
processChildren(configForm, data);
var submitButton = document.createElement("button");
submitButton.type = "submit";
submitButton.innerHTML = "update";
configForm.appendChild(submitButton);
configForm.addEventListener("submit", (event) => {
event.preventDefault();
console.log("submitted!");
console.log(event);
console.log(configForm.children);
console.log(configForm.childNodes);
}); });
}); });
@@ -24,37 +35,46 @@ function processChildren(element, data) {
var value = document.createElement("span"); var value = document.createElement("span");
value.id = key+"-value"; value.id = key+"-value";
value.textContent = data[key]; value.textContent = data[key];
createEditButton(value); makeElementEditable(value, data, key);
value.addEventListener("click", (event) => {
var inputNewText = document.createElement("input");
inputNewText.type = "text";
inputNewText.class = "config-element-edit";
inputNewText.id = key+"-value";
console.log(value.parentNode);
console.log(value);
child.replaceChild(inputNewText, value);
console.log(event);
});
child.appendChild(value); child.appendChild(value);
} }
element.appendChild(child); element.appendChild(child);
// data[key] = "wassup?";
} }
console.log(data);
console.log(rawConfig);
} }
function createEditButton(parent) { function makeElementEditable(original, data, key) {
var editButton = document.createElement("button"); original.addEventListener("click", (event) => {
editButton.type = "button";
editButton.className = "config-edit-button";
editButton.textContent = "🖊️";
editButton.id = "parentId-" + parent.id;
// console.log(parent);
editButton.addEventListener("click", (event) => {
var inputNewText = document.createElement("input"); var inputNewText = document.createElement("input");
inputNewText.type = "text"; inputNewText.type = "text";
inputNewText.class = "config-element-edit"; inputNewText.className = "config-element-edit";
parent.parentNode.replaceChild(inputNewText, parent); inputNewText.value = original.textContent;
// console.log(event); fixInputOnFocusOut(inputNewText, data, key);
original.parentNode.replaceChild(inputNewText, original);
inputNewText.focus();
});
}
function fixInputOnFocusOut(original, data, key) {
original.addEventListener("blur", () => {
console.log(original);
var value = document.createElement("span");
value.id = original.id;
value.textContent = original.value;
data[key] = value.textContent;
console.log(data);
console.log(rawConfig);
makeElementEditable(value);
original.parentNode.replaceChild(value, original);
}) })
// console.log("edit button", editButton); }
parent.appendChild(editButton);
function handleSubmit() {
submitButton.addEventListener("click", (event) => {
var submitButton = document.createElement("button");
submitButton.type = "submit";
});
configForm.appendChild(submitButton);
} }