Skip to content

brainfood / frontend-uploads

Go to a project
Toggle navigation
Toggle navigation pinning
b90c55dc by Adam Heath
Options

Port code into backbone/rivets land.

1 parent 759719e3
Inline Side-by-side
Showing 7 changed files with 312 additions and 0 deletions
.*.swp
.tmp/
dist/
node_modules/
src/lib/
.grunt/
_SpecRunner.html
/* global module */
module.exports = function (grunt) {
/* global require */
'use strict';
var config = {};
config.base = 'src';
config.jshint = {
options: {
},
browserOptions: {
},
};
config.jscs = {
options: {
validateIndentation: 4,
reporter: 'console',
maxErrors: -1,
},
};
config.bower = {
directory: 'lib/bower',
};
config.jasmine = {
withCoverage: true,
};
var montyPython = require('grunt-monty-python')(grunt);
montyPython.createConfig(config);
};
{
"name": "frontend-uploads",
"version": "2016.07.06-0",
"authors": [
"Adam Heath <doogie@brainfood.com>"
],
"main": [
"src/scripts/Upload.js"
],
"private": true,
"ignore": [
"**/.*",
"node_modules",
"src/lib",
"src/scripts/*.spec.js",
"src/scripts/config.js",
"src/scripts/main.js"
],
"dependencies": {
"requirejs": "",
"jquery": "",
"underscore": "",
"backbone": "",
"rivets": "",
"flow": ""
}
}
{
"name": "frontend-uploads",
"version": "2016.07.06-0",
"main": [
"src/scripts/Upload.js"
],
"dependencies": {
},
"devDependencies": {
"bower-requirejs": "~0.9.2",
"grunt": "~0",
"grunt-monty-python": "git+ssh://git@gitlab.brainfood.com:brainfood/grunt-monty-python.git"
},
"engines": {
"node": ">=0.8.0"
}
}
define(function(require) {
'use strict';
var $ = require('jquery');
var Backbone = require('backbone');
var Flow = require('flow');
var Status = Backbone.Model.extend({
defaults: function() {
return {
result: null,
resultData: null,
sent: null,
completion: null,
total: null,
};
},
});
var Upload = Backbone.Model.extend({
defaults: function() {
return {
name: null,
status: new Status(),
date: null,
size: null,
};
},
initialize: function() {
Upload.__super__.initialize.apply(this, arguments);
_.each(['retry', 'pause', 'resume', 'cancel'], function(methodName) {
this[methodName] = _.bind(function(e) {
if (e) {
e.preventDefault();
}
var flowFile = this.flowFile;
if (flowFile) {
flowFile[methodName].call(flowFile);
}
if (flowFile.paused) {
this.get('status').set({
result: 'paused',
resultData: null,
});
}
return false;
}, this);
}, this);
},
parse: function(data, options) {
data = _.extend({}, data);
var status = data.status;
if (!(status instanceof Backbone.Model)) {
data.status = new Status(status);
}
return data;
},
});
var Uploads = Backbone.Collection.extend({
model: Upload,
initialize: function initialize(data, options) {
Uploads.__super__.initialize.apply(this, arguments);
},
});
function makeFallbackFlowEventHandler(eventName) {
return function() {
console.log('flow.' + eventName, arguments);
};
}
_.extend(Upload, {
Uploads: Uploads,
Status: Status,
flowEventHandlers: {
fileAdded: function(flowFile) {
var model = flowFile._model;
if (!model) {
model = flowFile._model = new Upload({
name: flowFile.name,
size: flowFile.size,
startDate: new Date(),
});
model.flowFile = flowFile;
this.model.get('collection').add(model);
}
return true;
},
filesAdded: function() {
return true;
},
filesSubmitted: function() {
this.flow.upload();
},
fileProgress: function(flowFile) {
var model = flowFile._model;
if (model) {
model.get('status').set({
result: 'uploading',
resultData: null,
completion: Math.floor(flowFile.progress() * 100),
size: flowFile.sizeUploaded(),
});
}
},
fileSuccess: function(flowFile, message, chunk) {
var model = flowFile._model;
if (model) {
model.get('status').set({
result: 'success',
resultData: message,
});
}
},
fileError: function(flowFile, message, chunk) {
var model = flowFile._model;
if (model) {
model.get('status').set({
result: 'error',
resultData: message,
});
}
},
fileRemoved: function(flowFile) {
var model = flowFile._model;
if (model) {
this.model.get('collection').remove(model);
}
},
},
rivetsComponent: {
static: [
'accept',
'allowDuplicateUploads',
'maxChunkRetries',
'maxFilesize',
'prioritizeFirstAndLastChunk',
'simultaneousUploads',
],
template: function() {
return this.el.innerHTML;
},
initialize: function initialize(el, locals) {
var instance = {el: el};
var model = instance.model = new Backbone.Model(locals);
_.each(this.observers, function(observer, key) {
sightglass(observer.obj, observer.keypath, function() {
model.set(key, observer.value());
}, observer.options);
});
var flow = instance.flow = new Flow({
target: _.bind(function(flowFile, flowChunk, isTest) {
var model = this.model;
var target = model.get('target');
var sessionId = model.get('sessionId');
if (target) {
if (target.indexOf('?') !== -1) {
target += '&';
} else {
target += '?';
}
} else {
target = '?';
}
return target + 'sessionId=' + sessionId;
}, instance),
allowDuplicateUploads: locals.allowDuplicateUploads,
maxChunkRetries: locals.maxChunkRetries,
maxFilesize: locals.maxFilesize,
prioritizeFirstAndLastChunk: locals.prioritizeFirstAndLastChunk,
simultaneousUploads: locals.simultaneousUploads,
});
_.each([
'fileSuccess',
'fileProgress',
'fileAdded',
'filesAdded',
'filesSubmitted',
'fileRemoved',
'fileRetry',
'fileError',
//'uploadStart',
//'complete',
//'progress',
//'error',
], function(eventName) {
var eventHandler = Upload.flowEventHandlers[eventName] || makeFallbackFlowEventHandler(eventName);
flow.on(eventName, _.bind(eventHandler, instance));
});
flow.assignBrowse(el, true, false, {
accept: model.get('accept'),
});
flow.assignDrop(el);
instance.view = rivets.bind($(el).contents(), this.view.models);
return {};
},
},
});
return Upload;
});
/* global require:true */
var require;
require = (function() {
'use strict';
var require = {
baseUrl: 'scripts',
shim: {
backbone: {
deps: ['underscore'],
exports: 'Backbone',
},
underscore: {
exports: '_',
},
},
paths: {
flow: '../lib/bower/underscore/underscore',
jquery: '../lib/bower/jquery/dist/jquery',
underscore: '../lib/bower/underscore/underscore',
backbone: '../lib/bower/backbone/backbone',
},
};
return require;
})();
/* global require */
define(function(require) {
'use strict';
});