diff --git a/data/http.go b/data/http.go new file mode 100644 index 0000000..7621e3c --- /dev/null +++ b/data/http.go @@ -0,0 +1,16 @@ +// +build !wasm + +package data + +import ( + "net/http" + "net/url" +) + +func httpGet(url string) (*http.Response, error) { + return http.Get(url) +} + +func httpPostForm(url string, vals url.Values) (*http.Response, error) { + return http.PostForm(url, vals) +} diff --git a/data/http_wasm.go b/data/http_wasm.go new file mode 100644 index 0000000..d7ae78f --- /dev/null +++ b/data/http_wasm.go @@ -0,0 +1,42 @@ +// +build wasm + +package data + +import ( + "io/ioutil" + "net/http" + "net/url" + "strings" +) + +// implements http.Get but makes wasm's fetch work with CORS +func httpGet(url string) (*http.Response, error) { + req, err := http.NewRequest("GET", url, nil) + if err != nil { + return nil, err + } + req.Header.Add("js.fetch:mode", "cors") + + resp, err := http.DefaultClient.Do(req) + bb, err := ioutil.ReadAll(resp.Body) + resp.Body.Close() + resp.Body = ioutil.NopCloser(strings.NewReader(string(bb))) + return resp, err +} + +// implements http.PostForm but makes wasm's fetch work with CORS +func httpPostForm(wurl string, vals url.Values) (*http.Response, error) { + body := strings.NewReader(vals.Encode()) + req, err := http.NewRequest("POST", wurl, body) + if err != nil { + return nil, err + } + req.Header.Set("Content-Type", "application/x-www-form-urlencoded") + req.Header.Add("js.fetch:mode", "cors") + + resp, err := http.DefaultClient.Do(req) + bb, err := ioutil.ReadAll(resp.Body) + resp.Body.Close() + resp.Body = ioutil.NopCloser(strings.NewReader(string(bb))) + return resp, err +} diff --git a/data/pfam.go b/data/pfam.go index 00562d9..db78352 100644 --- a/data/pfam.go +++ b/data/pfam.go @@ -22,15 +22,14 @@ import ( "fmt" "io/ioutil" "net" - "net/http" "os" ) -const PfamGraphicURL = "http://pfam.xfam.org/protein/%s/graphic" +const PfamGraphicURL = "https://pfam.xfam.org/protein/%s/graphic" func GetPfamGraphicData(accession string) (*GraphicResponse, error) { queryURL := fmt.Sprintf(PfamGraphicURL, accession) - resp, err := http.Get(queryURL) + resp, err := httpGet(queryURL) if err != nil { if err, ok := err.(net.Error); ok && err.Timeout() { fmt.Fprintf(os.Stderr, "Unable to connect to Pfam. Check your internet connection or try again later.") @@ -57,13 +56,13 @@ func GetPfamGraphicData(accession string) (*GraphicResponse, error) { r := data[0] for i, x := range r.Motifs { if x.Link != "" { - x.Link = "http://pfam.xfam.org" + x.Link + x.Link = "https://pfam.xfam.org" + x.Link r.Motifs[i] = x } } for i, x := range r.Regions { if x.Link != "" { - x.Link = "http://pfam.xfam.org" + x.Link + x.Link = "https://pfam.xfam.org" + x.Link r.Regions[i] = x } } diff --git a/data/uniprot.go b/data/uniprot.go index f2310c8..dd28d8c 100644 --- a/data/uniprot.go +++ b/data/uniprot.go @@ -24,7 +24,6 @@ import ( "io/ioutil" "log" "net" - "net/http" "net/url" "os" "regexp" @@ -61,7 +60,7 @@ func getValueForKey(line, key string) string { func GetUniprotGraphicData(accession string) (*GraphicResponse, error) { queryURL := fmt.Sprintf(UniprotDataURL, accession) - resp, err := http.Get(queryURL) + resp, err := httpGet(queryURL) if err != nil { if err, ok := err.(net.Error); ok && err.Timeout() { fmt.Fprintf(os.Stderr, "Unable to connect to Uniprot. Check your internet connection or try again later.") @@ -167,11 +166,11 @@ func GetUniprotGraphicData(accession string) (*GraphicResponse, error) { } func GetProtID(symbol string) (string, error) { - apiURL := `http://www.uniprot.org/uniprot/?query=` + url.QueryEscape(symbol) + apiURL := `https://www.uniprot.org/uniprot/?query=` + url.QueryEscape(symbol) apiURL += `+AND+reviewed:yes+AND+organism:9606+AND+database:pfam` apiURL += `&sort=score&columns=id,entry+name,reviewed,genes,organism&format=tab` - resp, err := http.Get(apiURL) + resp, err := httpGet(apiURL) if err != nil { if err, ok := err.(net.Error); ok && err.Timeout() { fmt.Fprintf(os.Stderr, "Unable to connect to Uniprot. Check your internet connection or try again later.") @@ -229,7 +228,7 @@ func GetProtMapping(dbname, geneid string) (string, error) { "format": {"tab"}, } - resp, err := http.PostForm(apiURL, params) + resp, err := httpPostForm(apiURL, params) if err != nil { if err, ok := err.(net.Error); ok && err.Timeout() { fmt.Fprintf(os.Stderr, "Unable to connect to Uniprot. Check your internet connection or try again later.") diff --git a/drawing/draw.go b/drawing/draw.go index 6b8a386..d26519c 100644 --- a/drawing/draw.go +++ b/drawing/draw.go @@ -38,6 +38,11 @@ type diagram struct { } func (s *Settings) prepare(changelist []string, g *data.GraphicResponse) *diagram { + // don't alter the source changelist + newchanges := make([]string, len(changelist)) + copy(newchanges, changelist) + changelist = newchanges + d := &diagram{ Settings: s, g: g, diff --git a/html/README.md b/html/README.md new file mode 100644 index 0000000..9f08247 --- /dev/null +++ b/html/README.md @@ -0,0 +1,22 @@ +# Lollipops web frontend + +This directory contains a simple web frontend for lollipops, using the +template provided by Go's wasm toolchain in `$GOROOT/misc/wasm/` + +Building lollipops for wasm using: + + cd $GOPATH/github.com/pbnjay/lollipops + GOOS=js GOARCH=wasm go build -o html/lollipops.wasm . + +You can then copy the 4 files to any webserver: + + index.html + lollipops.wasm + style.css + wasm_exec.js + + +A simple server is included here for testing purposes: + + cd $GOPATH/github.com/pbnjay/lollipops/html + go run www.go diff --git a/html/index.html b/html/index.html new file mode 100644 index 0000000..936fd98 --- /dev/null +++ b/html/index.html @@ -0,0 +1,154 @@ + + + + + Lollipops - Protein Variant Visualization tool + + + + + + + + +
+
+ : +

+ +
+
+
+
+
+
+ + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + +
+ + + + diff --git a/html/style.css b/html/style.css new file mode 100644 index 0000000..28fcb5c --- /dev/null +++ b/html/style.css @@ -0,0 +1,153 @@ +@media print +{ + .no-print, .no-print * + { + display: none !important; + } + body {margin-top:64px;} +} + +svg { font-family: sans-serif; } + +.sk-fading-circle { + width: 40px; + height: 40px; + position: fixed; + top: 5%; + left: 50%; +} + +.sk-fading-circle .sk-circle { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; +} + +.sk-fading-circle .sk-circle:before { + content: ''; + display: block; + margin: 0 auto; + width: 15%; + height: 15%; + background-color: #333; + border-radius: 100%; + -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both; + animation: sk-circleFadeDelay 1.2s infinite ease-in-out both; +} +.sk-fading-circle .sk-circle2 { + -webkit-transform: rotate(30deg); + -ms-transform: rotate(30deg); + transform: rotate(30deg); +} +.sk-fading-circle .sk-circle3 { + -webkit-transform: rotate(60deg); + -ms-transform: rotate(60deg); + transform: rotate(60deg); +} +.sk-fading-circle .sk-circle4 { + -webkit-transform: rotate(90deg); + -ms-transform: rotate(90deg); + transform: rotate(90deg); +} +.sk-fading-circle .sk-circle5 { + -webkit-transform: rotate(120deg); + -ms-transform: rotate(120deg); + transform: rotate(120deg); +} +.sk-fading-circle .sk-circle6 { + -webkit-transform: rotate(150deg); + -ms-transform: rotate(150deg); + transform: rotate(150deg); +} +.sk-fading-circle .sk-circle7 { + -webkit-transform: rotate(180deg); + -ms-transform: rotate(180deg); + transform: rotate(180deg); +} +.sk-fading-circle .sk-circle8 { + -webkit-transform: rotate(210deg); + -ms-transform: rotate(210deg); + transform: rotate(210deg); +} +.sk-fading-circle .sk-circle9 { + -webkit-transform: rotate(240deg); + -ms-transform: rotate(240deg); + transform: rotate(240deg); +} +.sk-fading-circle .sk-circle10 { + -webkit-transform: rotate(270deg); + -ms-transform: rotate(270deg); + transform: rotate(270deg); +} +.sk-fading-circle .sk-circle11 { + -webkit-transform: rotate(300deg); + -ms-transform: rotate(300deg); + transform: rotate(300deg); +} +.sk-fading-circle .sk-circle12 { + -webkit-transform: rotate(330deg); + -ms-transform: rotate(330deg); + transform: rotate(330deg); +} +.sk-fading-circle .sk-circle2:before { + -webkit-animation-delay: -1.1s; + animation-delay: -1.1s; +} +.sk-fading-circle .sk-circle3:before { + -webkit-animation-delay: -1s; + animation-delay: -1s; +} +.sk-fading-circle .sk-circle4:before { + -webkit-animation-delay: -0.9s; + animation-delay: -0.9s; +} +.sk-fading-circle .sk-circle5:before { + -webkit-animation-delay: -0.8s; + animation-delay: -0.8s; +} +.sk-fading-circle .sk-circle6:before { + -webkit-animation-delay: -0.7s; + animation-delay: -0.7s; +} +.sk-fading-circle .sk-circle7:before { + -webkit-animation-delay: -0.6s; + animation-delay: -0.6s; +} +.sk-fading-circle .sk-circle8:before { + -webkit-animation-delay: -0.5s; + animation-delay: -0.5s; +} +.sk-fading-circle .sk-circle9:before { + -webkit-animation-delay: -0.4s; + animation-delay: -0.4s; +} +.sk-fading-circle .sk-circle10:before { + -webkit-animation-delay: -0.3s; + animation-delay: -0.3s; +} +.sk-fading-circle .sk-circle11:before { + -webkit-animation-delay: -0.2s; + animation-delay: -0.2s; +} +.sk-fading-circle .sk-circle12:before { + -webkit-animation-delay: -0.1s; + animation-delay: -0.1s; +} + +@-webkit-keyframes sk-circleFadeDelay { + 0%, 39%, 100% { opacity: 0; } + 40% { opacity: 1; } +} + +@keyframes sk-circleFadeDelay { + 0%, 39%, 100% { opacity: 0; } + 40% { opacity: 1; } +} + +.footer { + font-family: sans-serif; + margin-top: 64px; + font-size: 10px; +} diff --git a/html/wasm_exec.js b/html/wasm_exec.js new file mode 100644 index 0000000..165d567 --- /dev/null +++ b/html/wasm_exec.js @@ -0,0 +1,465 @@ +// Copyright 2018 The Go Authors. All rights reserved. +// Use of this source code is governed by a BSD-style +// license that can be found in the LICENSE file. + +(() => { + if (typeof global !== "undefined") { + // global already exists + } else if (typeof window !== "undefined") { + window.global = window; + } else if (typeof self !== "undefined") { + self.global = self; + } else { + throw new Error("cannot export Go (neither global, window nor self is defined)"); + } + + // Map web browser API and Node.js API to a single common API (preferring web standards over Node.js API). + const isNodeJS = global.process && global.process.title === "node"; + if (isNodeJS) { + global.require = require; + global.fs = require("fs"); + + const nodeCrypto = require("crypto"); + global.crypto = { + getRandomValues(b) { + nodeCrypto.randomFillSync(b); + }, + }; + + global.performance = { + now() { + const [sec, nsec] = process.hrtime(); + return sec * 1000 + nsec / 1000000; + }, + }; + + const util = require("util"); + global.TextEncoder = util.TextEncoder; + global.TextDecoder = util.TextDecoder; + } else { + let outputBuf = ""; + global.fs = { + constants: { O_WRONLY: -1, O_RDWR: -1, O_CREAT: -1, O_TRUNC: -1, O_APPEND: -1, O_EXCL: -1 }, // unused + writeSync(fd, buf) { + outputBuf += decoder.decode(buf); + const nl = outputBuf.lastIndexOf("\n"); + if (nl != -1) { + console.log(outputBuf.substr(0, nl)); + outputBuf = outputBuf.substr(nl + 1); + } + return buf.length; + }, + write(fd, buf, offset, length, position, callback) { + if (offset !== 0 || length !== buf.length || position !== null) { + throw new Error("not implemented"); + } + const n = this.writeSync(fd, buf); + callback(null, n); + }, + open(path, flags, mode, callback) { + const err = new Error("not implemented"); + err.code = "ENOSYS"; + callback(err); + }, + read(fd, buffer, offset, length, position, callback) { + const err = new Error("not implemented"); + err.code = "ENOSYS"; + callback(err); + }, + fsync(fd, callback) { + callback(null); + }, + }; + } + + const encoder = new TextEncoder("utf-8"); + const decoder = new TextDecoder("utf-8"); + + global.Go = class { + constructor() { + this.argv = ["js"]; + this.env = {}; + this.exit = (code) => { + if (code !== 0) { + console.warn("exit code:", code); + } + }; + this._exitPromise = new Promise((resolve) => { + this._resolveExitPromise = resolve; + }); + this._pendingEvent = null; + this._scheduledTimeouts = new Map(); + this._nextCallbackTimeoutID = 1; + + const mem = () => { + // The buffer may change when requesting more memory. + return new DataView(this._inst.exports.mem.buffer); + } + + const setInt64 = (addr, v) => { + mem().setUint32(addr + 0, v, true); + mem().setUint32(addr + 4, Math.floor(v / 4294967296), true); + } + + const getInt64 = (addr) => { + const low = mem().getUint32(addr + 0, true); + const high = mem().getInt32(addr + 4, true); + return low + high * 4294967296; + } + + const loadValue = (addr) => { + const f = mem().getFloat64(addr, true); + if (f === 0) { + return undefined; + } + if (!isNaN(f)) { + return f; + } + + const id = mem().getUint32(addr, true); + return this._values[id]; + } + + const storeValue = (addr, v) => { + const nanHead = 0x7FF80000; + + if (typeof v === "number") { + if (isNaN(v)) { + mem().setUint32(addr + 4, nanHead, true); + mem().setUint32(addr, 0, true); + return; + } + if (v === 0) { + mem().setUint32(addr + 4, nanHead, true); + mem().setUint32(addr, 1, true); + return; + } + mem().setFloat64(addr, v, true); + return; + } + + switch (v) { + case undefined: + mem().setFloat64(addr, 0, true); + return; + case null: + mem().setUint32(addr + 4, nanHead, true); + mem().setUint32(addr, 2, true); + return; + case true: + mem().setUint32(addr + 4, nanHead, true); + mem().setUint32(addr, 3, true); + return; + case false: + mem().setUint32(addr + 4, nanHead, true); + mem().setUint32(addr, 4, true); + return; + } + + let ref = this._refs.get(v); + if (ref === undefined) { + ref = this._values.length; + this._values.push(v); + this._refs.set(v, ref); + } + let typeFlag = 0; + switch (typeof v) { + case "string": + typeFlag = 1; + break; + case "symbol": + typeFlag = 2; + break; + case "function": + typeFlag = 3; + break; + } + mem().setUint32(addr + 4, nanHead | typeFlag, true); + mem().setUint32(addr, ref, true); + } + + const loadSlice = (addr) => { + const array = getInt64(addr + 0); + const len = getInt64(addr + 8); + return new Uint8Array(this._inst.exports.mem.buffer, array, len); + } + + const loadSliceOfValues = (addr) => { + const array = getInt64(addr + 0); + const len = getInt64(addr + 8); + const a = new Array(len); + for (let i = 0; i < len; i++) { + a[i] = loadValue(array + i * 8); + } + return a; + } + + const loadString = (addr) => { + const saddr = getInt64(addr + 0); + const len = getInt64(addr + 8); + return decoder.decode(new DataView(this._inst.exports.mem.buffer, saddr, len)); + } + + const timeOrigin = Date.now() - performance.now(); + this.importObject = { + go: { + // Go's SP does not change as long as no Go code is running. Some operations (e.g. calls, getters and setters) + // may synchronously trigger a Go event handler. This makes Go code get executed in the middle of the imported + // function. A goroutine can switch to a new stack if the current stack is too small (see morestack function). + // This changes the SP, thus we have to update the SP used by the imported function. + + // func wasmExit(code int32) + "runtime.wasmExit": (sp) => { + const code = mem().getInt32(sp + 8, true); + this.exited = true; + delete this._inst; + delete this._values; + delete this._refs; + this.exit(code); + }, + + // func wasmWrite(fd uintptr, p unsafe.Pointer, n int32) + "runtime.wasmWrite": (sp) => { + const fd = getInt64(sp + 8); + const p = getInt64(sp + 16); + const n = mem().getInt32(sp + 24, true); + fs.writeSync(fd, new Uint8Array(this._inst.exports.mem.buffer, p, n)); + }, + + // func nanotime() int64 + "runtime.nanotime": (sp) => { + setInt64(sp + 8, (timeOrigin + performance.now()) * 1000000); + }, + + // func walltime() (sec int64, nsec int32) + "runtime.walltime": (sp) => { + const msec = (new Date).getTime(); + setInt64(sp + 8, msec / 1000); + mem().setInt32(sp + 16, (msec % 1000) * 1000000, true); + }, + + // func scheduleTimeoutEvent(delay int64) int32 + "runtime.scheduleTimeoutEvent": (sp) => { + const id = this._nextCallbackTimeoutID; + this._nextCallbackTimeoutID++; + this._scheduledTimeouts.set(id, setTimeout( + () => { this._resume(); }, + getInt64(sp + 8) + 1, // setTimeout has been seen to fire up to 1 millisecond early + )); + mem().setInt32(sp + 16, id, true); + }, + + // func clearTimeoutEvent(id int32) + "runtime.clearTimeoutEvent": (sp) => { + const id = mem().getInt32(sp + 8, true); + clearTimeout(this._scheduledTimeouts.get(id)); + this._scheduledTimeouts.delete(id); + }, + + // func getRandomData(r []byte) + "runtime.getRandomData": (sp) => { + crypto.getRandomValues(loadSlice(sp + 8)); + }, + + // func stringVal(value string) ref + "syscall/js.stringVal": (sp) => { + storeValue(sp + 24, loadString(sp + 8)); + }, + + // func valueGet(v ref, p string) ref + "syscall/js.valueGet": (sp) => { + const result = Reflect.get(loadValue(sp + 8), loadString(sp + 16)); + sp = this._inst.exports.getsp(); // see comment above + storeValue(sp + 32, result); + }, + + // func valueSet(v ref, p string, x ref) + "syscall/js.valueSet": (sp) => { + Reflect.set(loadValue(sp + 8), loadString(sp + 16), loadValue(sp + 32)); + }, + + // func valueIndex(v ref, i int) ref + "syscall/js.valueIndex": (sp) => { + storeValue(sp + 24, Reflect.get(loadValue(sp + 8), getInt64(sp + 16))); + }, + + // valueSetIndex(v ref, i int, x ref) + "syscall/js.valueSetIndex": (sp) => { + Reflect.set(loadValue(sp + 8), getInt64(sp + 16), loadValue(sp + 24)); + }, + + // func valueCall(v ref, m string, args []ref) (ref, bool) + "syscall/js.valueCall": (sp) => { + try { + const v = loadValue(sp + 8); + const m = Reflect.get(v, loadString(sp + 16)); + const args = loadSliceOfValues(sp + 32); + const result = Reflect.apply(m, v, args); + sp = this._inst.exports.getsp(); // see comment above + storeValue(sp + 56, result); + mem().setUint8(sp + 64, 1); + } catch (err) { + storeValue(sp + 56, err); + mem().setUint8(sp + 64, 0); + } + }, + + // func valueInvoke(v ref, args []ref) (ref, bool) + "syscall/js.valueInvoke": (sp) => { + try { + const v = loadValue(sp + 8); + const args = loadSliceOfValues(sp + 16); + const result = Reflect.apply(v, undefined, args); + sp = this._inst.exports.getsp(); // see comment above + storeValue(sp + 40, result); + mem().setUint8(sp + 48, 1); + } catch (err) { + storeValue(sp + 40, err); + mem().setUint8(sp + 48, 0); + } + }, + + // func valueNew(v ref, args []ref) (ref, bool) + "syscall/js.valueNew": (sp) => { + try { + const v = loadValue(sp + 8); + const args = loadSliceOfValues(sp + 16); + const result = Reflect.construct(v, args); + sp = this._inst.exports.getsp(); // see comment above + storeValue(sp + 40, result); + mem().setUint8(sp + 48, 1); + } catch (err) { + storeValue(sp + 40, err); + mem().setUint8(sp + 48, 0); + } + }, + + // func valueLength(v ref) int + "syscall/js.valueLength": (sp) => { + setInt64(sp + 16, parseInt(loadValue(sp + 8).length)); + }, + + // valuePrepareString(v ref) (ref, int) + "syscall/js.valuePrepareString": (sp) => { + const str = encoder.encode(String(loadValue(sp + 8))); + storeValue(sp + 16, str); + setInt64(sp + 24, str.length); + }, + + // valueLoadString(v ref, b []byte) + "syscall/js.valueLoadString": (sp) => { + const str = loadValue(sp + 8); + loadSlice(sp + 16).set(str); + }, + + // func valueInstanceOf(v ref, t ref) bool + "syscall/js.valueInstanceOf": (sp) => { + mem().setUint8(sp + 24, loadValue(sp + 8) instanceof loadValue(sp + 16)); + }, + + "debug": (value) => { + console.log(value); + }, + } + }; + } + + async run(instance) { + this._inst = instance; + this._values = [ // TODO: garbage collection + NaN, + 0, + null, + true, + false, + global, + this._inst.exports.mem, + this, + ]; + this._refs = new Map(); + this.exited = false; + + const mem = new DataView(this._inst.exports.mem.buffer) + + // Pass command line arguments and environment variables to WebAssembly by writing them to the linear memory. + let offset = 4096; + + const strPtr = (str) => { + let ptr = offset; + new Uint8Array(mem.buffer, offset, str.length + 1).set(encoder.encode(str + "\0")); + offset += str.length + (8 - (str.length % 8)); + return ptr; + }; + + const argc = this.argv.length; + + const argvPtrs = []; + this.argv.forEach((arg) => { + argvPtrs.push(strPtr(arg)); + }); + + const keys = Object.keys(this.env).sort(); + argvPtrs.push(keys.length); + keys.forEach((key) => { + argvPtrs.push(strPtr(`${key}=${this.env[key]}`)); + }); + + const argv = offset; + argvPtrs.forEach((ptr) => { + mem.setUint32(offset, ptr, true); + mem.setUint32(offset + 4, 0, true); + offset += 8; + }); + + this._inst.exports.run(argc, argv); + if (this.exited) { + this._resolveExitPromise(); + } + await this._exitPromise; + } + + _resume() { + if (this.exited) { + throw new Error("Go program has already exited"); + } + this._inst.exports.resume(); + if (this.exited) { + this._resolveExitPromise(); + } + } + + _makeFuncWrapper(id) { + const go = this; + return function () { + const event = { id: id, this: this, args: arguments }; + go._pendingEvent = event; + go._resume(); + return event.result; + }; + } + } + + if (isNodeJS) { + if (process.argv.length < 3) { + process.stderr.write("usage: go_js_wasm_exec [wasm binary] [arguments]\n"); + process.exit(1); + } + + const go = new Go(); + go.argv = process.argv.slice(2); + go.env = Object.assign({ TMPDIR: require("os").tmpdir() }, process.env); + go.exit = process.exit; + WebAssembly.instantiate(fs.readFileSync(process.argv[2]), go.importObject).then((result) => { + process.on("exit", (code) => { // Node.js exits if no event handler is pending + if (code === 0 && !go.exited) { + // deadlock, make Go print error and stack traces + go._pendingEvent = { id: 0 }; + go._resume(); + } + }); + return go.run(result.instance); + }).catch((err) => { + throw err; + }); + } +})(); diff --git a/html/www.go b/html/www.go new file mode 100644 index 0000000..031cd8a --- /dev/null +++ b/html/www.go @@ -0,0 +1,23 @@ +package main + +import ( + "flag" + "log" + "net/http" + "strings" +) + +func main() { + dir := flag.String("d", "./", "`directory` to serve") + flag.Parse() + fs := http.FileServer(http.Dir(*dir)) + + log.Print("Open http://localhost:8080 in your web browser") + http.ListenAndServe(":8080", http.HandlerFunc(func(resp http.ResponseWriter, req *http.Request) { + resp.Header().Add("Cache-Control", "no-cache") + if strings.HasSuffix(req.URL.Path, ".wasm") { + resp.Header().Set("content-type", "application/wasm") + } + fs.ServeHTTP(resp, req) + })) +} diff --git a/main.go b/main.go index 92215c0..25149fe 100644 --- a/main.go +++ b/main.go @@ -214,17 +214,9 @@ Press Enter/Ctrl-C to quit.`) *output = geneSymbol + ".svg" } - f, err := os.OpenFile(*output, os.O_CREATE|os.O_RDWR|os.O_TRUNC, 0644) + err = createOutput(*output, d, flag.Args()[varStart:]) if err != nil { fmt.Fprintln(os.Stderr, err) os.Exit(1) } - defer f.Close() - - fmt.Fprintln(os.Stderr, "Drawing diagram to", *output) - if strings.HasSuffix(strings.ToLower(*output), ".png") { - drawing.DrawPNG(f, *dpi, flag.Args()[varStart:], d) - } else { - drawing.DrawSVG(f, flag.Args()[varStart:], d) - } } diff --git a/output.go b/output.go new file mode 100644 index 0000000..3a6f3f8 --- /dev/null +++ b/output.go @@ -0,0 +1,27 @@ +// +build !wasm + +package main + +import ( + "fmt" + "os" + "strings" + + "github.com/pbnjay/lollipops/data" + "github.com/pbnjay/lollipops/drawing" +) + +func createOutput(filename string, d *data.GraphicResponse, variants []string) error { + f, err := os.Create(filename) + if err != nil { + return err + } + + fmt.Fprintln(os.Stderr, "Drawing diagram to", filename) + if strings.HasSuffix(strings.ToLower(filename), ".png") { + drawing.DrawPNG(f, *dpi, variants, d) + } else { + drawing.DrawSVG(f, variants, d) + } + return f.Close() +} diff --git a/output_wasm.go b/output_wasm.go new file mode 100644 index 0000000..5353509 --- /dev/null +++ b/output_wasm.go @@ -0,0 +1,22 @@ +// +build wasm + +package main + +import ( + "bytes" + "fmt" + "os" + "syscall/js" + + "github.com/pbnjay/lollipops/data" + "github.com/pbnjay/lollipops/drawing" +) + +func createOutput(elementID string, d *data.GraphicResponse, variants []string) error { + fmt.Fprintln(os.Stderr, "Creating SVG image") + buf := &bytes.Buffer{} + drawing.DrawSVG(buf, variants, d) + js.Global().Get("document").Call("getElementById", "lollipops-svg-container").Set("innerHTML", buf.String()) + + return nil +}