diff --git a/clients/js/README b/clients/js/README new file mode 100644 index 000000000..b4792a81b --- /dev/null +++ b/clients/js/README @@ -0,0 +1,6 @@ +This is a sketch of a client written in JavaScript. + +The idea is twofold: +1) any working server can drop in this directory to get a blobstore + browser UI, while simultaneously testing their API implementation +2) provide an easy library to plug into node.js if needed diff --git a/clients/js/camel.jpg b/clients/js/camel.jpg new file mode 100644 index 000000000..34a46f403 Binary files /dev/null and b/clients/js/camel.jpg differ diff --git a/clients/js/client.js b/clients/js/client.js new file mode 100644 index 000000000..aff5b065d --- /dev/null +++ b/clients/js/client.js @@ -0,0 +1,38 @@ +var Camli = { + +BlobStore: function() { +} + +}; + +Camli.BlobStore.prototype.blobURL = function(ref) { + return '/camli/' + ref; +}; + +Camli.BlobStore.prototype.xhr = function(url, cb) { + var xhr = new XMLHttpRequest(); + xhr.onreadystatechange = function() { + if (xhr.readyState == 4) { + if (xhr.status == 200) { + cb(xhr.responseText); + } + } + // XXX handle error + }; + xhr.open('GET', url, true); + xhr.send(null); +}; + +Camli.BlobStore.prototype.xhrJSON = function(url, cb) { + this.xhr('/camli/enumerate-blobs', function(data) { + cb(JSON.parse(data)); + }); +}; + +Camli.BlobStore.prototype.enumerate = function(cb) { + this.xhrJSON('/camli/enumerate-blobs', cb); +}; + +Camli.BlobStore.prototype.getBlob = function(ref, cb) { + this.xhr(this.blobURL(ref), cb); +}; diff --git a/clients/js/index.html b/clients/js/index.html new file mode 100644 index 000000000..7315a986d --- /dev/null +++ b/clients/js/index.html @@ -0,0 +1,61 @@ + + + + + + + + + + + + + +
refsize
+ + + + + diff --git a/clients/js/style.css b/clients/js/style.css new file mode 100644 index 000000000..1031c002d --- /dev/null +++ b/clients/js/style.css @@ -0,0 +1,27 @@ +body { + font-family: sans-serif; + font-size: 0.8em; +} +#logo { + background: url(camel.jpg); + width: 320px; + height: 302px; + color: white; + font-size: 400%; + text-align: center; + vertical-align: bottom; + text-shadow: 0 0 10px black; +} +#bloblist { + border: solid 1px gray; +} +#bloblist th { + background: #eee; + padding: 2px 4px; +} +#bloblist td { + padding-right: 1ex; +} +.blobref { + font-family: WebKitWorkaround, monospace; +}