summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--public/css/style.css32
-rw-r--r--public/index.html7
-rw-r--r--public/js/mv/load.js129
3 files changed, 121 insertions, 47 deletions
diff --git a/public/css/style.css b/public/css/style.css
index 2272814..738449e 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -257,3 +257,35 @@ a:hover {
color: #005580;
text-decoration: underline;
}
+
+.button {
+ border-top: 1px solid #96d1f8;
+ background: #65a9d7;
+ background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
+ background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
+ background: -moz-linear-gradient(top, #3e779d, #65a9d7);
+ background: -ms-linear-gradient(top, #3e779d, #65a9d7);
+ background: -o-linear-gradient(top, #3e779d, #65a9d7);
+ padding: 6px 12px;
+ -webkit-border-radius: 15px;
+ -moz-border-radius: 15px;
+ border-radius: 15px;
+ -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
+ -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
+ box-shadow: rgba(0,0,0,1) 0 1px 0;
+ text-shadow: rgba(0,0,0,.4) 0 1px 0;
+ color: white;
+ font-size: 13px;
+ font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
+ text-decoration: none;
+ vertical-align: middle;
+}
+.button:hover {
+ border-top-color: #28597a;
+ background: #28597a;
+ color: #ccc;
+}
+.button:active {
+ border-top-color: #1b435e;
+ background: #1b435e;
+}
diff --git a/public/index.html b/public/index.html
index 67e83a4..e3ad3c3 100644
--- a/public/index.html
+++ b/public/index.html
@@ -75,8 +75,11 @@
<p>Both raw server logs (.log) and scrubbed datasets (.scrubbed) will work fine. If using the latter, make sure it has .scrubbed in the file name!</p>
<p>You can load any number of files at once.</p>
<p>Please note that this is very js intensive. The tab may briefly lock up as it loads everything.</p>
- <input type="file" id="input" name="records[]" multiple />
- <output id="list"></output>
+ <div>
+ <input type="file" id="input" name="records[]" multiple />
+ <output id="list"></output>
+ or <a href="javascript:mv.loader.use(['/logs/map.scrubbed.latest.zip']);" class="button">Use the most recent dataset</a>
+ </div>
<div id="filesbar" class="progressbar fader">
<div class="percent">0%</div>
</div>
diff --git a/public/js/mv/load.js b/public/js/mv/load.js
index 56edf76..765707f 100644
--- a/public/js/mv/load.js
+++ b/public/js/mv/load.js
@@ -2,9 +2,9 @@
var mv = function(mv) {
mv.loader = {
/* Callbacks */
- onbulkstart: onbulkstart,
- onloadstart: onloadstart,
- onprogress: onprogress,
+ onbulkstart: nullFunc,
+ onloadstart: nullFunc,
+ onprogress: nullFunc,
onabort: onabort,
onerror: onerror,
/* File state accessors */
@@ -13,6 +13,8 @@ var mv = function(mv) {
curfile: function() { return curfile; },
/* Callback */
setname: function(n) {},
+ /* Use an array of URLs for loading, via d3.xhr */
+ use: use,
/* Initialise the loader module */
init: init,
}
@@ -20,10 +22,16 @@ var mv = function(mv) {
var numfiles = 0;
var filenames = [];
var curfile = 0;
- var files;
- function onbulkstart(fevt) {}
- function onloadstart(evt) {}
- function onprogress(evt) {}
+ /* Function to handle the loading of the next file - should invoke loadBlobable */
+ var nextFile;
+ /* Function to be called after all loading */
+ var postLoadAll;
+ /* The reader used to handle files once the request is complete */
+ var reader;
+ /* Dummy function */
+ function nullFunc() {};
+ /* Basic error functions - you probably want to override these */
+ /* TODO: Make the defaults a little more sensible */
function onabort(evt) {
alert('File load aborted!');
}
@@ -41,50 +49,81 @@ var mv = function(mv) {
alert('An error occurred reading this file.');
};
}
+ function use(urllist) {
+ /* Load files using d3's xhr requests */
+ numfiles = urllist.length
+ filenames = urllist;
+ nextFile = function() {
+ mv.loader.setname(urllist[curfile] + "'; 'Downloading");
+ var req = d3.xhr(urllist[curfile])
+ .on('progress', function(d, i) { reader.onprogress(d3.event); })
+ .on('load', function(d) {
+ console.log(typeof(d), typeof(d) == "object" ? d : d.length);
+ loadBlobable(d.response, urllist[curfile]);
+ })
+ .responseType("blob")
+ .get()
+ ;
+ };
+ startLoading();
+ }
function init(input, each, after) {
+ reader = new FileReader();
+ postLoadAll = after;
input.on('change', function() {
- files = d3.event.target.files;
+ /* Load files using the file selector */
+ var files = d3.event.target.files;
numfiles = files.length;
filenames = Array.prototype.map.call(files, function(d) { return d.name; });
- curfile = 0;
- var reader = new FileReader();
- mv.loader.onbulkstart();
- reader.onerror = function() { mv.loader.onerror.apply(null, arguments) };
- reader.onprogress = function(evt) { if (evt.lengthComputable) { mv.loader.onprogress(evt.loaded, evt.total) } };
- reader.onabort = function() { mv.loader.onabort.apply(null, arguments) };
- reader.onloadstart = function() { mv.loader.onloadstart.apply(null, arguments) };
- reader.onload = function(evt) {
- each(reader.result, filenames[curfile], function() {
- ++curfile;
- if (curfile == numfiles) {
- after();
- } else {
- nextFile();
- }
- });
- };
- function nextFile() {
- var file = files[curfile];
- mv.loader.onloadstart();
- if (file.name.indexOf(".zip", name.length - 4) != -1) {
- zip.createReader(new zip.BlobReader(file), function(zipReader) {
- zipReader.getEntries(function(entries) {
- entries.forEach(function(d, i) {
- mv.loader.setname(file.name + "'; unzipping '" + d.filename + " (" + (i + 1) + "/" + entries.length + ")");
- d.getData(new zip.BlobWriter(), function(blob) {
- mv.loader.setname(d.filename);
- reader.readAsBinaryString(blob);
- }, mv.loader.onprogress);
- });
- }, mv.loader.onerror);
- }, mv.loader.onerror);
- } else {
- mv.loader.setname(file);
- reader.readAsBinaryString(file);
- }
+ nextFile = function() {
+ loadBlobable(files[curfile], files[curfile].name);
}
- nextFile();
+ startLoading();
}, false);
+ /* General callbacks */
+ reader.onerror = function() { mv.loader.onerror.apply(null, arguments) };
+ reader.onprogress = function(evt) { if (evt.lengthComputable) { mv.loader.onprogress(evt.loaded, evt.total) } };
+ reader.onabort = function() { mv.loader.onabort.apply(null, arguments) };
+ reader.onloadstart = function() { mv.loader.onloadstart.apply(null, arguments) };
+ /* Logic for finishing or moving on once a file has finished loading */
+ reader.onload = function(evt) {
+ each(reader.result, filenames[curfile], function() {
+ ++curfile;
+ if (curfile >= numfiles) {
+ /* We're done */
+ postLoadAll();
+ } else {
+ /* Go to the next file, as determined by the current nextFile function */
+ nextFile();
+ }
+ });
+ };
};
+ function startLoading() {
+ curfile = 0;
+ mv.loader.onbulkstart();
+ nextFile();
+ }
+ function loadBlobable(blobable, name) {
+ mv.loader.onloadstart();
+ console.log(name);
+ if (name.indexOf(".zip", name.length - 4) != -1) {
+ zip.createReader(new zip.BlobReader(blobable), function(zipReader) {
+ zipReader.getEntries(function(entries) {
+ console.log(entries);
+ entries.forEach(function(d, i) {
+ mv.loader.setname(name + "'; 'Unzipping " + d.filename + " (" + (i + 1) + "/" + entries.length + ")");
+ d.getData(new zip.BlobWriter(), function(blob) {
+ mv.loader.setname(d.filename);
+ reader.readAsBinaryString(blob);
+ }, mv.loader.onprogress);
+ });
+ }, mv.loader.onerror);
+ }, mv.loader.onerror);
+ } else {
+ mv.loader.setname(name);
+ reader.readAsBinaryString(blobable);
+ }
+ }
return mv;
}(mv || {});
generated by cgit v1.2.3-60-g2f50 (git 2.42.0) at 2024-05-19 20:53:49 +0000