kconfig/main.js

89 lines
2.6 KiB
JavaScript

import {JSONEditor} from '@json-editor/json-editor'
import 'spectre.css/dist/spectre.min.css'
import 'spectre.css/dist/spectre-exp.min.css'
import 'spectre.css/dist/spectre-icons.min.css'
(function() {
var editor = new JSONEditor(document.getElementById('editor_holder'),{
theme: 'spectre',
iconlib: 'spectre',
ajax: true,
// The schema for the editor
schema: {
$ref: "api/schema",
format: "grid"
},
});
// Hook up the submit button to log to the console
document.getElementById('submit').addEventListener('click',async function() {
const res = await fetch('api/apply', {
method: 'POST',
body: JSON.stringify(editor.getValue()),
headers: new Headers({
'Content-Type': 'application/json'
})
}).catch(err=>{console.log(err);return;});
if (!res.ok) {
console.log(res)
const errMsg = await res.text()
alert(errMsg)
return
}
parent.KSubmit();
});
// Hook up the load from server button
async function load() {
const res = await fetch('api/load').catch(err=>{console.log(err);return;});
if (!res.ok) {
console.log(res);
const errMsg = await res.text();
alert(errMsg);
return
}
const body = await res.json();
editor.setValue(body);
}
document.getElementById('load').addEventListener('click', load);
load();
// Hook up the validation indicator to update its
// status whenever the editor changes
editor.on('change',function() {
// Get an array of errors from the validator
var errors = editor.validate();
var indicator = document.getElementById('valid_indicator');
// Not valid
if(errors.length) {
indicator.className = 'label alert';
indicator.textContent = 'not valid';
}
// Valid
else {
indicator.className = 'label success';
indicator.textContent = 'valid';
}
});
document.getElementById('download').addEventListener('click',async function() {
var dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(editor.getValue(),null,2));
var dlAnchorElem = document.getElementById('downloadAnchorElem');
dlAnchorElem.setAttribute('href', dataStr );
dlAnchorElem.setAttribute('download', AppName+'.json');
dlAnchorElem.click();
});
document.getElementById('upload').addEventListener('change',function(e) {
var reader = new FileReader();
reader.onload = function(event) {
var jsonObj = JSON.parse(event.target.result);
editor.setValue(jsonObj);
};
reader.readAsText(e.target.files[0]);
});
})();