update
continuous-integration/drone/tag Build is passing Details

master v0.1.0
Evan Chen 2021-11-24 18:49:30 +08:00
parent 28a1d2abb9
commit a084c9e004
6 changed files with 43 additions and 17 deletions

View File

@ -24,6 +24,26 @@ Usage: kconfig [options]
`kconfig -addr 127.0.0.1:8000 -pretty -level 0 -f dist/test.jcs` `kconfig -addr 127.0.0.1:8000 -pretty -level 0 -f dist/test.jcs`
## Intergrate
### as lib
```go
k := kconfig.New()
k.Apply = func(config []byte)error{
// custom logic to receive config
}
k.Load = func()[]byte{
// custom logic to show current config
}
mux.Handle("/", k)
// or in subroute
mux.Handle("/k/", http.StripPrefix("/k", k))
```
### in popup window or iframe
if no err submit => `parent.KSubmit()`
## Schema ## Schema
JSON Schema Support JSON Schema Support

View File

@ -86,13 +86,13 @@ func main() {
if err != nil { if err != nil {
log.Panic().Err(err).Msg("") log.Panic().Err(err).Msg("")
} }
k.KFJstr = schema k.Schema = schema
} }
<-time.After(time.Millisecond * 120) <-time.After(time.Millisecond * 120)
} }
}() }()
} }
k.Apply = func(b []byte) error { return fmt.Errorf("error %s", "test") } // k.Apply = func(b []byte) error { return fmt.Errorf("error %s", "test") }
// mux.Handle("/k/", http.StripPrefix("/k", k)) // mux.Handle("/k/", http.StripPrefix("/k", k))
mux.Handle("/", k) mux.Handle("/", k)

View File

@ -26,18 +26,23 @@ func init() {
} }
type Kconfig struct { type Kconfig struct {
// AppName displays appname in title and the download file will be {{.AppName}}.json
AppName string AppName string
KFJstr []byte // Schema json for schema, more information see [json-editor](https://github.com/json-editor/json-editor)
Schema []byte
// Mux the underlying Mux
Mux *http.ServeMux Mux *http.ServeMux
// Apply function callback for intergrating submit
Apply func([]byte) error Apply func([]byte) error
// Load function callback for intergrating load
Load func() []byte Load func() []byte
} }
func New() *Kconfig { func New() *Kconfig {
k := &Kconfig{ k := &Kconfig{
AppName: "kconfig", AppName: "kconfig",
KFJstr: defaultSchema, Schema: defaultSchema,
Apply: func(b []byte) error { Apply: func(b []byte) error {
log.Debug().Msgf("%s", b) log.Debug().Msgf("%s", b)
return nil return nil
@ -64,7 +69,7 @@ func New() *Kconfig {
http.NotFound(w, r) http.NotFound(w, r)
return return
} }
w.Write([]byte(k.KFJstr)) w.Write([]byte(k.Schema))
}) })
mux.HandleFunc("/api/load", func(w http.ResponseWriter, r *http.Request) { mux.HandleFunc("/api/load", func(w http.ResponseWriter, r *http.Request) {
if r.Method != http.MethodGet { if r.Method != http.MethodGet {

17
main.js
View File

@ -5,7 +5,6 @@ import 'spectre.css/dist/spectre-exp.min.css'
import 'spectre.css/dist/spectre-icons.min.css' import 'spectre.css/dist/spectre-icons.min.css'
(function() { (function() {
console.log("start")
var editor = new JSONEditor(document.getElementById('editor_holder'),{ var editor = new JSONEditor(document.getElementById('editor_holder'),{
theme: 'spectre', theme: 'spectre',
iconlib: 'spectre', iconlib: 'spectre',
@ -20,8 +19,6 @@ import 'spectre.css/dist/spectre-icons.min.css'
// Hook up the submit button to log to the console // Hook up the submit button to log to the console
document.getElementById('submit').addEventListener('click',async function() { document.getElementById('submit').addEventListener('click',async function() {
// Get the value from the editor
console.log(editor.getValue());
const res = await fetch('api/apply', { const res = await fetch('api/apply', {
method: 'POST', method: 'POST',
body: JSON.stringify(editor.getValue()), body: JSON.stringify(editor.getValue()),
@ -33,21 +30,25 @@ import 'spectre.css/dist/spectre-icons.min.css'
console.log(res) console.log(res)
const errMsg = await res.text() const errMsg = await res.text()
alert(errMsg) alert(errMsg)
return
} }
parent.KSubmit();
}); });
// Hook up the load from server button // Hook up the load from server button
document.getElementById('load').addEventListener('click',async function() { async function load() {
const res = await fetch('api/load').catch(err=>{console.log(err);return;}); const res = await fetch('api/load').catch(err=>{console.log(err);return;});
if (!res.ok) { if (!res.ok) {
console.log(res) console.log(res);
const errMsg = await res.text() const errMsg = await res.text();
alert(errMsg) alert(errMsg);
return return
} }
const body = await res.json(); const body = await res.json();
editor.setValue(body); editor.setValue(body);
}); }
document.getElementById('load').addEventListener('click', load);
load();
// Hook up the validation indicator to update its // Hook up the validation indicator to update its
// status whenever the editor changes // status whenever the editor changes

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
<!DOCTYPE html><html><head><link rel="stylesheet" href="index.e0891ed3.css"><title>{{.AppName}}</title><style>.ace_selection{background:#7f7f00!important}</style></head><body> <div class="container" style="max-width:960px;"> <div class="columns"> <h1 class="col-md-12">{{.AppName}} Config</h1> </div> <div class="columns"> <div class="col-md-12 column"> <button id="submit" class="tiny">Submit</button> <button id="load" class="secondary tiny">Load</button> <button id="download" class="secondary tiny">Download</button> <a id="downloadAnchorElem" style="display:none"></a> <span id="valid_indicator" class="label"></span> </div> </div> <br> <div class="columns"> <div class="col-md-12 column" id="editor_holder"></div> </div> </div> <script type="module" src="index.5a7c0711.js"></script> {{.ACE_JS}} <script>let AppName="{{.AppName}}";</script> </body></html> <!DOCTYPE html><html><head><link rel="stylesheet" href="index.e0891ed3.css"><title>{{.AppName}}</title><style>.ace_selection{background:#7f7f00!important}</style></head><body> <div class="container" style="max-width:960px;"> <div class="columns"> <h1 class="col-md-12">{{.AppName}} Config</h1> </div> <div class="columns"> <div class="col-md-12 column"> <button id="submit" class="tiny">Submit</button> <button id="load" class="secondary tiny">Load</button> <button id="download" class="secondary tiny">Download</button> <a id="downloadAnchorElem" style="display:none"></a> <span id="valid_indicator" class="label"></span> </div> </div> <br> <div class="columns"> <div class="col-md-12 column" id="editor_holder"></div> </div> </div> <script type="module" src="index.6ef506fc.js"></script> {{.ACE_JS}} <script>let AppName="{{.AppName}}";</script> </body></html>