From e5ffb15020b1c175e9ecda68d43c1589268326d8 Mon Sep 17 00:00:00 2001 From: Dane Everitt Date: Thu, 13 Oct 2016 21:03:49 -0400 Subject: [PATCH] Add support for new file upload mechanics --- CHANGELOG.md | 3 +- public/js/binaryjs.js | 2 - public/js/vendor/upload/client.min.js | 15 ++ resources/views/server/files/add.blade.php | 169 ++++++++++----------- 4 files changed, 97 insertions(+), 92 deletions(-) delete mode 100755 public/js/binaryjs.js create mode 100644 public/js/vendor/upload/client.min.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 9af2c1da0..b3be6bf7b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,7 +3,7 @@ This file is a running track of new features and fixes to each version of the pa This project follows [Semantic Versioning](http://semver.org) guidelines. -## v0.5.0-pre.2 (Bodacious Boreopterus) +## v0.5.0-pre.3 (Bodacious Boreopterus) ### Added * Return node configuration from remote API by using `/api/nodes/{id}/config` endpoint. Only accepts SSL connections. @@ -13,6 +13,7 @@ This project follows [Semantic Versioning](http://semver.org) guidelines. ### Changed * Creating a user, server, or node now returns `HTTP/1.1 200` and a JSON element with the user/server/node's ID. * Environment setting script is much more user friendly and does not require an excessive amount of clicking and typing. +* File upload method switched from BinaryJS to Socket.io implementation to fix bugs as well as be a little speedier and allow upload throttling. ## v0.5.0-pre.2 (Bodacious Boreopterus) diff --git a/public/js/binaryjs.js b/public/js/binaryjs.js deleted file mode 100755 index 0d1be91ff..000000000 --- a/public/js/binaryjs.js +++ /dev/null @@ -1,2 +0,0 @@ -/*! binary.js build:0.2.1, development. Copyright(c) 2012 Eric Zhang MIT Licensed */ -!function(e){function t(){this._pieces=[],this._parts=[]}function r(e){this.index=0,this.dataBuffer=e,this.dataView=new Uint8Array(this.dataBuffer),this.length=this.dataBuffer.byteLength}function i(){this.bufferBuilder=new t}function n(e){var t=e.charCodeAt(0);return 2047>=t?"00":65535>=t?"000":2097151>=t?"0000":67108863>=t?"00000":"000000"}function s(e){return e.length>600?new Blob([e]).size:e.replace(/[^\u0000-\u007F]/g,n).length}function a(){this._events={}}function o(){a.call(this)}function u(e,t){o.call(this),t=d.extend({readDelay:0,paused:!1},t),this._source=e,this._start=0,this._readChunkSize=t.chunkSize||e.size,this._readDelay=t.readDelay,this.readable=!0,this.paused=t.paused,this._read()}function p(e,t,r,i){if(!(this instanceof p))return new p(options);o.call(this),this.id=t,this._socket=e,this.writable=!0,this.readable=!0,this.paused=!1,this._closed=!1,this._ended=!1,r&&this._write(1,i,this.id)}function h(e,t){if(!(this instanceof h))return new h(e,t);a.call(this);var r=this;this._options=d.extend({chunkSize:40960},t),this.streams={},"string"==typeof e?(this._nextId=0,this._socket=new WebSocket(e)):(this._nextId=1,this._socket=e),this._socket.binaryType="arraybuffer",this._socket.addEventListener("open",function(){r.emit("open")}),this._socket.addEventListener("error",function(e){for(var t=Object.keys(r.streams),i=0,n=t.length;n>i;i++)r.streams[t[i]]._onError(e);r.emit("error",e)}),this._socket.addEventListener("close",function(e,t){for(var i=Object.keys(r.streams),n=0,s=i.length;s>n;n++)r.streams[i[n]]._onClose();r.emit("close",e,t)}),this._socket.addEventListener("message",function(e){d.setZeroTimeout(function(){e=e.data;try{e=d.unpack(e)}catch(t){return r.emit("error",new Error("Received unparsable message: "+t))}if(!(e instanceof Array))return r.emit("error",new Error("Received non-array message"));if(3!=e.length)return r.emit("error",new Error("Received message with wrong part count: "+e.length));if("number"!=typeof e[0])return r.emit("error",new Error("Received message with non-number type: "+e[0]));switch(e[0]){case 0:break;case 1:var i=e[1],n=e[2],s=r._receiveStream(n);r.emit("stream",s,i);break;case 2:var a=e[1],n=e[2],s=r.streams[n];s?s._onData(a):r.emit("error",new Error("Received `data` message for unknown stream: "+n));break;case 3:var n=e[2],s=r.streams[n];s?s._onPause():r.emit("error",new Error("Received `pause` message for unknown stream: "+n));break;case 4:var n=e[2],s=r.streams[n];s?s._onResume():r.emit("error",new Error("Received `resume` message for unknown stream: "+n));break;case 5:var n=e[2],s=r.streams[n];s?s._onEnd():r.emit("error",new Error("Received `end` message for unknown stream: "+n));break;case 6:var n=e[2],s=r.streams[n];s?s._onClose():r.emit("error",new Error("Received `close` message for unknown stream: "+n));break;default:r.emit("error",new Error("Unrecognized message type received: "+e[0]))}})})}var c={};c.useBlobBuilder=function(){try{return new Blob([]),!1}catch(e){return!0}}(),c.useArrayBufferView=!c.useBlobBuilder&&function(){try{return 0===new Blob([new Uint8Array([])]).size}catch(e){return!0}}(),c.supportsBinaryWebsockets=function(){try{var e=new WebSocket("ws://null");return e.onerror=function(){},"undefined"!=typeof e.binaryType?!0:!1}catch(t){return!1}}(),e.binaryFeatures=c,e.BlobBuilder=window.WebKitBlobBuilder||window.MozBlobBuilder||window.MSBlobBuilder||window.BlobBuilder,t.prototype.append=function(e){"number"==typeof e?this._pieces.push(e):(this.flush(),this._parts.push(e))},t.prototype.flush=function(){if(this._pieces.length>0){var e=new Uint8Array(this._pieces);c.useArrayBufferView||(e=e.buffer),this._parts.push(e),this._pieces=[]}},t.prototype.getBuffer=function(){if(this.flush(),c.useBlobBuilder){for(var e=new BlobBuilder,t=0,r=this._parts.length;r>t;t++)e.append(this._parts[t]);return e.getBlob()}return new Blob(this._parts)},e.BinaryPack={unpack:function(e){var t=new r(e);return t.unpack()},pack:function(e){var t=new i;t.pack(e);var r=t.getBuffer();return r}},r.prototype.unpack=function(){var e=this.unpack_uint8();if(128>e){var t=e;return t}if(32>(224^e)){var r=(224^e)-32;return r}var i;if((i=160^e)<=15)return this.unpack_raw(i);if((i=176^e)<=15)return this.unpack_string(i);if((i=144^e)<=15)return this.unpack_array(i);if((i=128^e)<=15)return this.unpack_map(i);switch(e){case 192:return null;case 193:return void 0;case 194:return!1;case 195:return!0;case 202:return this.unpack_float();case 203:return this.unpack_double();case 204:return this.unpack_uint8();case 205:return this.unpack_uint16();case 206:return this.unpack_uint32();case 207:return this.unpack_uint64();case 208:return this.unpack_int8();case 209:return this.unpack_int16();case 210:return this.unpack_int32();case 211:return this.unpack_int64();case 212:return void 0;case 213:return void 0;case 214:return void 0;case 215:return void 0;case 216:return i=this.unpack_uint16(),this.unpack_string(i);case 217:return i=this.unpack_uint32(),this.unpack_string(i);case 218:return i=this.unpack_uint16(),this.unpack_raw(i);case 219:return i=this.unpack_uint32(),this.unpack_raw(i);case 220:return i=this.unpack_uint16(),this.unpack_array(i);case 221:return i=this.unpack_uint32(),this.unpack_array(i);case 222:return i=this.unpack_uint16(),this.unpack_map(i);case 223:return i=this.unpack_uint32(),this.unpack_map(i)}},r.prototype.unpack_uint8=function(){var e=255&this.dataView[this.index];return this.index++,e},r.prototype.unpack_uint16=function(){var e=this.read(2),t=256*(255&e[0])+(255&e[1]);return this.index+=2,t},r.prototype.unpack_uint32=function(){var e=this.read(4),t=256*(256*(256*e[0]+e[1])+e[2])+e[3];return this.index+=4,t},r.prototype.unpack_uint64=function(){var e=this.read(8),t=256*(256*(256*(256*(256*(256*(256*e[0]+e[1])+e[2])+e[3])+e[4])+e[5])+e[6])+e[7];return this.index+=8,t},r.prototype.unpack_int8=function(){var e=this.unpack_uint8();return 128>e?e:e-256},r.prototype.unpack_int16=function(){var e=this.unpack_uint16();return 32768>e?e:e-65536},r.prototype.unpack_int32=function(){var e=this.unpack_uint32();return en;)t=i[n],128>t?(s+=String.fromCharCode(t),n++):32>(192^t)?(r=(192^t)<<6|63&i[n+1],s+=String.fromCharCode(r),n+=2):(r=(15&t)<<12|(63&i[n+1])<<6|63&i[n+2],s+=String.fromCharCode(r),n+=3);return this.index+=e,s},r.prototype.unpack_array=function(e){for(var t=new Array(e),r=0;e>r;r++)t[r]=this.unpack();return t},r.prototype.unpack_map=function(e){for(var t={},r=0;e>r;r++){var i=this.unpack(),n=this.unpack();t[i]=n}return t},r.prototype.unpack_float=function(){var e=this.unpack_uint32(),t=e>>31,r=(e>>23&255)-127,i=8388607&e|8388608;return(0==t?1:-1)*i*Math.pow(2,r-23)},r.prototype.unpack_double=function(){var e=this.unpack_uint32(),t=this.unpack_uint32(),r=e>>31,i=(e>>20&2047)-1023,n=1048575&e|1048576,s=n*Math.pow(2,i-20)+t*Math.pow(2,i-52);return(0==r?1:-1)*s},r.prototype.read=function(e){var t=this.index;if(t+e<=this.length)return this.dataView.subarray(t,t+e);throw new Error("BinaryPackFailure: read index out of range")},i.prototype.getBuffer=function(){return this.bufferBuilder.getBuffer()},i.prototype.pack=function(e){var t=typeof e;if("string"==t)this.pack_string(e);else if("number"==t)Math.floor(e)===e?this.pack_integer(e):this.pack_double(e);else if("boolean"==t)e===!0?this.bufferBuilder.append(195):e===!1&&this.bufferBuilder.append(194);else if("undefined"==t)this.bufferBuilder.append(192);else{if("object"!=t)throw new Error('Type "'+t+'" not yet supported');if(null===e)this.bufferBuilder.append(192);else{var r=e.constructor;if(r==Array)this.pack_array(e);else if(r==Blob||r==File)this.pack_bin(e);else if(r==ArrayBuffer)this.pack_bin(c.useArrayBufferView?new Uint8Array(e):e);else if("BYTES_PER_ELEMENT"in e)this.pack_bin(c.useArrayBufferView?new Uint8Array(e.buffer):e.buffer);else if(r==Object)this.pack_object(e);else if(r==Date)this.pack_string(e.toString());else{if("function"!=typeof e.toBinaryPack)throw new Error('Type "'+r.toString()+'" not yet supported');this.bufferBuilder.append(e.toBinaryPack())}}}this.bufferBuilder.flush()},i.prototype.pack_bin=function(e){var t=e.length||e.byteLength||e.size;if(15>=t)this.pack_uint8(160+t);else if(65535>=t)this.bufferBuilder.append(218),this.pack_uint16(t);else{if(!(4294967295>=t))throw new Error("Invalid length");this.bufferBuilder.append(219),this.pack_uint32(t)}this.bufferBuilder.append(e)},i.prototype.pack_string=function(e){var t=s(e);if(15>=t)this.pack_uint8(176+t);else if(65535>=t)this.bufferBuilder.append(216),this.pack_uint16(t);else{if(!(4294967295>=t))throw new Error("Invalid length");this.bufferBuilder.append(217),this.pack_uint32(t)}this.bufferBuilder.append(e)},i.prototype.pack_array=function(e){var t=e.length;if(15>=t)this.pack_uint8(144+t);else if(65535>=t)this.bufferBuilder.append(220),this.pack_uint16(t);else{if(!(4294967295>=t))throw new Error("Invalid length");this.bufferBuilder.append(221),this.pack_uint32(t)}for(var r=0;t>r;r++)this.pack(e[r])},i.prototype.pack_integer=function(e){if(e>=-32&&127>=e)this.bufferBuilder.append(255&e);else if(e>=0&&255>=e)this.bufferBuilder.append(204),this.pack_uint8(e);else if(e>=-128&&127>=e)this.bufferBuilder.append(208),this.pack_int8(e);else if(e>=0&&65535>=e)this.bufferBuilder.append(205),this.pack_uint16(e);else if(e>=-32768&&32767>=e)this.bufferBuilder.append(209),this.pack_int16(e);else if(e>=0&&4294967295>=e)this.bufferBuilder.append(206),this.pack_uint32(e);else if(e>=-2147483648&&2147483647>=e)this.bufferBuilder.append(210),this.pack_int32(e);else if(e>=-0x8000000000000000&&0x8000000000000000>=e)this.bufferBuilder.append(211),this.pack_int64(e);else{if(!(e>=0&&0x10000000000000000>=e))throw new Error("Invalid integer");this.bufferBuilder.append(207),this.pack_uint64(e)}},i.prototype.pack_double=function(e){var t=0;0>e&&(t=1,e=-e);var r=Math.floor(Math.log(e)/Math.LN2),i=e/Math.pow(2,r)-1,n=Math.floor(i*Math.pow(2,52)),s=Math.pow(2,32),a=t<<31|r+1023<<20|n/s&1048575,o=n%s;this.bufferBuilder.append(203),this.pack_int32(a),this.pack_int32(o)},i.prototype.pack_object=function(e){var t=Object.keys(e),r=t.length;if(15>=r)this.pack_uint8(128+r);else if(65535>=r)this.bufferBuilder.append(222),this.pack_uint16(r);else{if(!(4294967295>=r))throw new Error("Invalid length");this.bufferBuilder.append(223),this.pack_uint32(r)}for(var i in e)e.hasOwnProperty(i)&&(this.pack(i),this.pack(e[i]))},i.prototype.pack_uint8=function(e){this.bufferBuilder.append(e)},i.prototype.pack_uint16=function(e){this.bufferBuilder.append(e>>8),this.bufferBuilder.append(255&e)},i.prototype.pack_uint32=function(e){var t=4294967295&e;this.bufferBuilder.append((4278190080&t)>>>24),this.bufferBuilder.append((16711680&t)>>>16),this.bufferBuilder.append((65280&t)>>>8),this.bufferBuilder.append(255&t)},i.prototype.pack_uint64=function(e){var t=e/Math.pow(2,32),r=e%Math.pow(2,32);this.bufferBuilder.append((4278190080&t)>>>24),this.bufferBuilder.append((16711680&t)>>>16),this.bufferBuilder.append((65280&t)>>>8),this.bufferBuilder.append(255&t),this.bufferBuilder.append((4278190080&r)>>>24),this.bufferBuilder.append((16711680&r)>>>16),this.bufferBuilder.append((65280&r)>>>8),this.bufferBuilder.append(255&r)},i.prototype.pack_int8=function(e){this.bufferBuilder.append(255&e)},i.prototype.pack_int16=function(e){this.bufferBuilder.append((65280&e)>>8),this.bufferBuilder.append(255&e)},i.prototype.pack_int32=function(e){this.bufferBuilder.append(e>>>24&255),this.bufferBuilder.append((16711680&e)>>>16),this.bufferBuilder.append((65280&e)>>>8),this.bufferBuilder.append(255&e)},i.prototype.pack_int64=function(e){var t=Math.floor(e/Math.pow(2,32)),r=e%Math.pow(2,32);this.bufferBuilder.append((4278190080&t)>>>24),this.bufferBuilder.append((16711680&t)>>>16),this.bufferBuilder.append((65280&t)>>>8),this.bufferBuilder.append(255&t),this.bufferBuilder.append((4278190080&r)>>>24),this.bufferBuilder.append((16711680&r)>>>16),this.bufferBuilder.append((65280&r)>>>8),this.bufferBuilder.append(255&r)};var f=Array.isArray;a.prototype.addListener=function(e,t){if("function"!=typeof t)throw new Error("addListener only takes instances of Function");this.emit("newListener",e,"function"==typeof t.listener?t.listener:t),this._events[e]?f(this._events[e])?this._events[e].push(t):this._events[e]=[this._events[e],t]:this._events[e]=t},a.prototype.on=a.prototype.addListener,a.prototype.once=function(e,t){function r(){i.removeListener(e,r),t.apply(this,arguments)}if("function"!=typeof t)throw new Error(".once only takes instances of Function");var i=this;return r.listener=t,i.on(e,r),this},a.prototype.removeListener=function(e,t){if("function"!=typeof t)throw new Error("removeListener only takes instances of Function");if(!this._events[e])return this;var r=this._events[e];if(f(r)){for(var i=-1,n=0,s=r.length;s>n;n++)if(r[n]===t||r[n].listener&&r[n].listener===t){i=n;break}if(0>i)return this;r.splice(i,1),0==r.length&&delete this._events[e]}else(r===t||r.listener&&r.listener===t)&&delete this._events[e];return this},a.prototype.off=a.prototype.removeListener,a.prototype.removeAllListeners=function(e){return 0===arguments.length?(this._events={},this):(e&&this._events&&this._events[e]&&(this._events[e]=null),this)},a.prototype.listeners=function(e){return this._events[e]||(this._events[e]=[]),f(this._events[e])||(this._events[e]=[this._events[e]]),this._events[e]},a.prototype.emit=function(e){var e=arguments[0],t=this._events[e];if(!t)return!1;if("function"==typeof t){switch(arguments.length){case 1:t.call(this);break;case 2:t.call(this,arguments[1]);break;case 3:t.call(this,arguments[1],arguments[2]);break;default:for(var r=arguments.length,i=new Array(r-1),n=1;r>n;n++)i[n-1]=arguments[n];t.apply(this,i)}return!0}if(f(t)){for(var r=arguments.length,i=new Array(r-1),n=1;r>n;n++)i[n-1]=arguments[n];for(var s=t.slice(),n=0,r=s.length;r>n;n++)s[n].apply(this,i);return!0}return!1};var d={inherits:function(e,t){e.super_=t,e.prototype=Object.create(t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}})},extend:function(e,t){for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r]);return e},pack:BinaryPack.pack,unpack:BinaryPack.unpack,setZeroTimeout:function(e){function t(t){i.push(t),e.postMessage(n,"*")}function r(t){t.source==e&&t.data==n&&(t.stopPropagation&&t.stopPropagation(),i.length&&i.shift()())}var i=[],n="zero-timeout-message";return e.addEventListener?e.addEventListener("message",r,!0):e.attachEvent&&e.attachEvent("onmessage",r),t}(this)};d.inherits(o,a),o.prototype.pipe=function(e,t){function r(t){e.writable&&!1===e.write(t)&&u.pause&&u.pause()}function i(){u.readable&&u.resume&&u.resume()}function n(){p||(p=!0,e.end())}function s(){p||(p=!0,e.destroy())}function a(e){if(o(),0===this.listeners("error").length)throw e}function o(){u.removeListener("data",r),e.removeListener("drain",i),u.removeListener("end",n),u.removeListener("close",s),u.removeListener("error",a),e.removeListener("error",a),u.removeListener("end",o),u.removeListener("close",o),e.removeListener("end",o),e.removeListener("close",o)}var u=this;u.on("data",r),e.on("drain",i),e._isStdio||t&&t.end===!1||(u.on("end",n),u.on("close",s));var p=!1;return u.on("error",a),e.on("error",a),u.on("end",o),u.on("close",o),e.on("end",o),e.on("close",o),e.emit("pipe",u),e},d.inherits(u,o),u.prototype.pause=function(){this.paused=!0},u.prototype.resume=function(){this.paused=!1,this._read()},u.prototype.destroy=function(){this.readable=!1,clearTimeout(this._timeoutId)},u.prototype._read=function(){function e(){t._emitReadChunk()}var t=this,r=this._readDelay;0!==r?this._timeoutId=setTimeout(e,r):d.setZeroTimeout(e)},u.prototype._emitReadChunk=function(){if(!this.paused&&this.readable){var e=Math.min(this._source.size-this._start,this._readChunkSize);if(0===e)return this.readable=!1,void this.emit("end");var t=this._start+e,r=(this._source.slice||this._source.webkitSlice||this._source.mozSlice).call(this._source,this._start,t);this._start=t,this._read(),this.emit("data",r)}},e.BlobReadStream=u,d.inherits(p,o),p.prototype._onDrain=function(){this.paused||this.emit("drain")},p.prototype._onClose=function(){this._closed||(this.readable=!1,this.writable=!1,this._closed=!0,this.emit("close"))},p.prototype._onError=function(e){this.readable=!1,this.writable=!1,this.emit("error",e)},p.prototype._onPause=function(){this.paused=!0,this.emit("pause")},p.prototype._onResume=function(){this.paused=!1,this.emit("resume"),this.emit("drain")},p.prototype._write=function(e,t,r){if(this._socket.readyState!==this._socket.constructor.OPEN)return!1;var i=d.pack([e,t,r]);return this._socket.send(i)!==!1},p.prototype.write=function(e){if(this.writable){var t=this._write(2,e,this.id);return!this.paused&&t}throw new Error("Stream is not writable")},p.prototype.end=function(){this._ended=!0,this.readable=!1,this._write(5,null,this.id)},p.prototype.destroy=p.prototype.destroySoon=function(){this._onClose(),this._write(6,null,this.id)},p.prototype._onEnd=function(){this._ended||(this._ended=!0,this.readable=!1,this.emit("end"))},p.prototype._onData=function(e){this.emit("data",e)},p.prototype.pause=function(){this._onPause(),this._write(3,null,this.id)},p.prototype.resume=function(){this._onResume(),this._write(4,null,this.id)},d.inherits(h,a),h.prototype.send=function(e,t){var r=this.createStream(t);if(e instanceof o)e.pipe(r);else if(d.isNode===!0)Buffer.isBuffer(e)?new BufferReadStream(e,{chunkSize:this._options.chunkSize}).pipe(r):r.write(e);else if(d.isNode!==!0)if(e.constructor==Blob||e.constructor==File)new u(e,{chunkSize:this._options.chunkSize}).pipe(r);else if(e.constructor==ArrayBuffer){var i;if(c.useArrayBufferView&&(e=new Uint8Array(e)),c.useBlobBuilder){var n=new BlobBuilder;n.append(e),i=n.getBlob()}else i=new Blob([e]);new u(i,{chunkSize:this._options.chunkSize}).pipe(r)}else if("object"==typeof e&&"BYTES_PER_ELEMENT"in e){var i;if(c.useArrayBufferView||(e=e.buffer),c.useBlobBuilder){var n=new BlobBuilder;n.append(e),i=n.getBlob()}else i=new Blob([e]);new u(i,{chunkSize:this._options.chunkSize}).pipe(r)}else r.write(e);return r},h.prototype._receiveStream=function(e){var t=this,r=new p(this._socket,e,!1);return r.on("close",function(){delete t.streams[e]}),this.streams[e]=r,r},h.prototype.createStream=function(e){if(this._socket.readyState!==WebSocket.OPEN)throw new Error("Client is not yet connected or has closed");var t=this,r=this._nextId;this._nextId+=2;var i=new p(this._socket,r,!0,e);return i.on("close",function(){delete t.streams[r]}),this.streams[r]=i,i},h.prototype.close=h.prototype.destroy=function(){this._socket.close()},e.BinaryClient=h}(this); \ No newline at end of file diff --git a/public/js/vendor/upload/client.min.js b/public/js/vendor/upload/client.min.js new file mode 100644 index 000000000..1030af4ac --- /dev/null +++ b/public/js/vendor/upload/client.min.js @@ -0,0 +1,15 @@ +/* Socket IO File Upload Client-Side Library + * Copyright (C) 2015 Shane Carr and others + * Released under the X11 License + * For more information, visit: https://github.com/vote539/socketio-file-upload + */ + +(function(g,d,f){"function"===typeof define&&define.amd?define(d,f):"object"===typeof module&&module.exports?module.exports=f():g[d]=f()})(this,"SocketIOFileUpload",function(){return function(g){var d=this;if(!window.File||!window.FileReader)throw Error("Socket.IO File Upload: Browser Not Supported");var f={},q=[],u=[],k={};d.fileInputElementId="siofu_input";d.resetFileInputs=!0;d.useText=!1;d.serializedOctets=!1;d.useBuffer=!0;d.chunkSize=102400;d.chunkDelay=0;var r=function(a,b){var c=document.createEvent("Event"); +c.initEvent(a,!1,!1);for(var y in b)b.hasOwnProperty(y)&&(c[y]=b[y]);return d.dispatchEvent(c)},p=[],e=function(a,b,c,d){a.addEventListener(b,c,d);p.push(arguments)},t=function(a,b,c,d){a.removeEventListener&&a.removeEventListener(b,c,d)},z=function(){for(var a=p.length-1;0<=a;a--)t.apply(this,p[a]);p=[]},A=function(a){if(null!==d.maxFileSize&&a.size>d.maxFileSize)r("error",{file:a,message:"Attempt by client to upload file exceeding the maximum file size",code:1});else if(r("start",{file:a})){var b= +new FileReader,c=q.length,f=d.useText,v=0,k;b._realReader&&(b=b._realReader);q.push(a);var p={id:c},w=d.chunkSize;if(w>=a.size||0>=w)w=a.size;var x=function(){if(!p.abort){var c=a.slice(v,Math.min(v+w,a.size));f?b.readAsText(c):b.readAsArrayBuffer(c)}},l=function(e){if(!p.abort){var l=Math.min(v+w,a.size);a:{var q=v;e=e.target.result;var u=!1;if(!f)try{var m=new Uint8Array(e);if(d.serializedOctets)e=m;else if(d.useBuffer)e=m.buffer;else{var u=!0,n,t=m.buffer.byteLength,h="";for(n=0;n> +2],h+="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"[(m[n]&3)<<4|m[n+1]>>4],h+="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"[(m[n+1]&15)<<2|m[n+2]>>6],h+="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"[m[n+2]&63];2===t%3?h=h.substring(0,h.length-1)+"=":1===t%3&&(h=h.substring(0,h.length-2)+"==");e=h}}catch(z){g.emit("siofu_done",{id:c,interrupt:!0});break a}g.emit("siofu_progress",{id:c,size:a.size,start:q,end:l,content:e,base64:u})}r("progress", +{file:a,bytesLoaded:l,name:k});v+=w;v -
Edit the path location above before you upload files. They will automatically be placed in the directory you specify above. You can change this each time you upload a new file without having to press anything else.
+
Edit the path location above before you upload files. They will automatically be placed in the directory you specify above. You can change this each time you upload a new file without having to press anything else. The directory must exist before performing an upload.
-

Connecting...

+

Drag and Drop File Here

@@ -124,99 +124,90 @@ $(window).load(function () { var newFileContents; @can('upload-files', $server) - var client = new BinaryClient('{{ $node->scheme === 'https' ? 'wss' : 'ws' }}://{{ $node->fqdn }}:{{ $node->daemonListen }}/upload/', { - chunkSize: 40960 + var notifyUploadSocketError = false; + var uploadSocket = io('{{ $node->scheme }}://{{ $node->fqdn }}:{{ $node->daemonListen }}/upload/{{ $server->uuid }}', { + 'query': 'token={{ $server->daemonSecret }}' }); - // Wait for connection to BinaryJS server - client.on('open', function() { - - var box = $('#uploader_box'); - box.on('dragenter', doNothing); - box.on('dragover', doNothing); - box.html('

Drag or Click to Upload

'); - box.on('click', function () { - $('#fileinput').click(); - }); - box.on('drop', function (e, files) { - - if (typeof files !== 'undefined') { - e.originalEvent = { - dataTransfer: { - files: files.currentTarget.files - } - }; - } - - // e.preventDefault(); - $.each(e.originalEvent.dataTransfer.files, function(index, value) { - - var file = e.originalEvent.dataTransfer.files[index]; - var identifier = Math.random().toString(36).slice(2); - - $('#file_progress').append('
\ -
\ -
\ -
Uploading ' + file.name + '
\ - Waiting... \ -
\ -
\ -
\ -
\ -
\ -
'); - - // Add to list of uploaded files - var stream = client.send(file, { - token: "{{ $server->daemonSecret }}", - server: "{{ $server->uuid }}", - path: $("#u_file_name").val(), - name: file.name, - size: file.size - }); - - var tx = 0; - stream.on('data', function(data) { - if(data.error) { - $("#upload_error").html(data.error).show(); - $("#file-upload-" + identifier).hide(); - } else { - tx += data.rx; - - if(tx >= 0.999) { - $('.prog-bar-text-' + identifier).text('Upload Complete'); - $('.prog-bar-' + identifier).css('width', '100%').parent().removeClass('active').removeClass('progress-striped'); - } else { - $('.prog-bar-text-' + identifier).text(Math.round(tx * 100) + '%'); - $('.prog-bar-' + identifier).css('width', tx * 100 + '%'); - } - } - }); - - stream.on('close', function(data) { - $("#upload_error").html("The BinaryJS data stream was closed by the server. Please refresh the page and try again.").show(); - $("#file-upload-" + identifier).hide(); - }); - - stream.on('error', function(data) { - console.error("An error was encountered with the BinaryJS upload stream."); - }); + socket.io.on('connect_error', function (err) { + siofu.destroy(); + $('#applyUpdate').removeClass('fa-circle-o-notch fa-spinner fa-spin').addClass('fa-question-circle').css({ color: '#FF9900' }); + if(typeof notifyUploadSocketError !== 'object') { + notifyUploadSocketError = $.notify({ + message: 'There was an error connecting to the Upload Socket for this server.' + }, { + type: 'danger', + delay: 0 }); - }); - + } }); - // listen for a file being chosen - $('#fileinput').change(function (event) { - $('#uploader_box').trigger('drop', [event, event.currentTarget]); - $('#fileinput').val(''); + uploadSocket.on('error', err => { + siofu.destroy(); + console.error(err); + }); + + uploadSocket.on('connect', function () { + if (notifyUploadSocketError !== false) { + notifyUploadSocketError.close(); + notifyUploadSocketError = false; + } + }); + + socket.on('error', function (err) { + console.error('There was an error while attemping to connect to the websocket: ' + err + '\n\nPlease try loading this page again.'); + }); + + + var siofu = new SocketIOFileUpload(uploadSocket); + siofu.chunkDelay = 50; + + document.getElementById("uploader_box").addEventListener("click", siofu.prompt, false); + siofu.listenOnDrop(document.getElementById("uploader_box")); + + siofu.addEventListener('start', function (event) { + event.file.meta.path = $("#u_file_name").val(); + event.file.meta.identifier = Math.random().toString(36).slice(2); + + $('#file_progress').append('
\ +
\ +
\ +
Uploading ' + event.file.name + '
\ + Waiting... \ +
\ +
\ +
\ +
\ +
\ +
'); + }); + + siofu.addEventListener('progress', function(event) { + console.log(event.file); + var percent = event.bytesLoaded / event.file.size * 100; + if (percent >= 100) { + $('.prog-bar-text-' + event.file.meta.identifier).text('Upload Complete'); + $('.prog-bar-' + event.file.meta.identifier).css('width', '100%').removeClass('progress-bar-info').addClass('progress-bar-success').parent().removeClass('active progress-striped'); + $('.prog-bar-text-' + event.file.meta.identifier).parents().eq(2).delay(5000).slideUp(); + } else { + $('.prog-bar-text-' + event.file.meta.identifier).text(Math.round(percent) + '%'); + $('.prog-bar-' + event.file.meta.identifier).css('width', percent + '%'); + } + }); + + // Do something when a file is uploaded: + siofu.addEventListener('complete', function(event){ + if (!event.success) { + $("#upload_error").html('An error was encountered while attempting to upload this file. Does the target directory exist?').show(); + $("#file-upload-" + event.file.meta.identifier).hide(); + } + }); + + siofu.addEventListener('error', function(event){ + $("#upload_error").html('An error was encountered while attempting to upload this file. Does the target directory exist?').show(); + $("#file-upload-" + event.file.meta.identifier).hide(); }); - // Deal with DOM quirks - function doNothing (e){ - e.preventDefault(); - e.stopPropagation(); - } @endcan const Editor = ace.edit('fileContents');