89 lines
2.6 KiB
JavaScript
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]);
|
|
});
|
|
})(); |