before big animation implementation

This commit is contained in:
Peter Cottle 2012-09-15 15:33:21 -07:00
parent 5ac6b035f5
commit b7f6bfff5a
6 changed files with 86 additions and 169 deletions

View file

@ -2,26 +2,28 @@ var CommitCollection = Backbone.Collection.extend({
model: Commit model: Commit
}); });
var commitCollection = new CommitCollection();
var CommandCollection = Backbone.Collection.extend({ var CommandCollection = Backbone.Collection.extend({
model: Command model: Command
}); });
var CommandBuffer = Backbone.Model.extend({ var CommandBuffer = Backbone.Model.extend({
initialize: function() { defaults: {
collection: null,
},
initialize: function(options) {
events.on('gitCommandReady', _.bind( events.on('gitCommandReady', _.bind(
this.addCommand, this this.addCommand, this
)); ));
this.collection = new CommandCollection(); options.collection.bind('add', this.addCommand, this);
this.buffer = []; this.buffer = [];
this.timeout = null; this.timeout = null;
this.delay = 300; this.delay = 300;
}, },
addCommand: function(command) { addCommand: function(command) {
this.collection.add(command);
this.buffer.push(command); this.buffer.push(command);
this.touchBuffer(); this.touchBuffer();
}, },
@ -50,7 +52,15 @@ var CommandBuffer = Backbone.Model.extend({
popAndProcess: function() { popAndProcess: function() {
var popped = this.buffer.pop(); var popped = this.buffer.pop();
events.trigger('processCommand', popped);
// find a command with no error
while (popped.get('error') && this.buffer.length) {
popped = buffer.pop();
}
// process it if theres no error
if (!popped.get('error')) {
events.trigger('processCommand', popped);
}
}, },
clear: function() { clear: function() {
@ -71,7 +81,5 @@ var CommandBuffer = Backbone.Model.extend({
this.clear(); this.clear();
} }
}, },
}); });
var commandBuffer = new CommandBuffer();

View file

@ -1,10 +1,13 @@
var Command = Backbone.Model.extend({ var Command = Backbone.Model.extend({
defaults: { defaults: {
status: 'inqueue', status: 'inqueue',
result: null,
error: null,
generalArgs: [], generalArgs: [],
supportedMap: {}, supportedMap: {},
options: null, options: null,
method: null, method: null,
createTime: null,
rawStr: null rawStr: null
}, },
@ -12,11 +15,28 @@ var Command = Backbone.Model.extend({
if (!this.get('rawStr')) { if (!this.get('rawStr')) {
throw new Error('Give me a string!'); throw new Error('Give me a string!');
} }
if (!this.get('createTime')) {
this.set('createTime', new Date().toString());
}
}, },
initialize: function() { initialize: function() {
this.validateAtInit(); this.validateAtInit();
this.parse(); this.parseOrCatch();
},
parseOrCatch: function() {
try {
this.parse();
} catch (err) {
if (err instanceof CommandProcessError ||
err instanceof CommandResult ||
err instanceof GitError) {
this.set('error', err);
} else {
throw err;
}
}
}, },
getShortcutMap: function() { getShortcutMap: function() {

View file

@ -105,36 +105,3 @@ Renderer = function(canvas) {
return that; return that;
} }
function addRandom() {
// Add some random nodes and edges to the graph!
nodes = [];
for (var i = 0; i < 15; i++) {
var id = randomString(8);
var node = sys.addNode(id);
nodes.push(node);
}
var randNode = function() {
var length = nodes.length;
var index = Math.floor(Math.random() * length);
return nodes[index];
};
var closures = [];
for (var i = 0; i < 20; i++) {
var node1 = randNode();
var node2 = randNode();
// lol will it ever end?
while (node1 === node2) {
node2 = randNode();
}
sys.addEdge(node1, node2);
}
for (var i = 0; i < nodes.length; i++) {
var node2 = randNode();
while (nodes[i] === node2) {
node2 = randNode();
}
sys.addEdge(nodes[i], node2);
}
}

View file

@ -2,20 +2,36 @@
* Globals * Globals
*/ */
var events = _.clone(Backbone.Events); var events = _.clone(Backbone.Events);
var sys = null; var sys = null;
var graphicsEffects = {}; var graphicsEffects = {};
var gitEngine = null; var gitEngine = null;
var gitVisuals = null; var gitVisuals = null;
var commitCollection = null;
var commandCollection = null;
var commandBuffer = null;
$(document).ready(function(){ $(document).ready(function(){
sys = arbor.ParticleSystem(4000, 200, 0.5, false, 55, 0.005, 'verlet'); sys = arbor.ParticleSystem(4000, 200, 0.5, false, 55, 0.005, 'verlet');
sys.renderer = Renderer('#viewport'); sys.renderer = Renderer('#viewport');
// the two major collections that affect everything
commitCollection = new CommitCollection();
commandCollection = new CommandCollection();
commandBuffer = new CommandBuffer({
collection: commandCollection
});
new CommandPromptView({ new CommandPromptView({
el: $('#commandLineBar') el: $('#commandLineBar'),
collection: commandCollection
}); });
new CommandLineHistoryView({ new CommandLineHistoryView({
el: $('#commandLineHistory') el: $('#commandLineHistory'),
collection: commandCollection
}); });
gitEngine = new GitEngine(); gitEngine = new GitEngine();

View file

@ -1,15 +1,8 @@
var CommandPromptView = Backbone.View.extend({ var CommandPromptView = Backbone.View.extend({
initialize: function(options) { initialize: function(options) {
this.collection = options.collection;
this.commands = []; this.commands = [];
this.index = -1; this.index = -1;
events.on('commandSubmitted', _.bind(
this.parseOrCatch, this
));
events.on('processErrorGeneral', _.bind(
this.processError, this
));
}, },
events: { events: {
@ -55,24 +48,6 @@ var CommandPromptView = Backbone.View.extend({
this.setTextField(this.commands[this.index]); this.setTextField(this.commands[this.index]);
}, },
processError: function(err) {
// TODO move this somewhere else!!! it's awkward here
// in this demo, every command that's not a git command will
// throw an exception. Some of these errors might be just to
// short-circuit the normal programatic flow and print stuff,
// so we handle them here
if (err instanceof CommandProcessError) {
events.trigger('commandProcessError', err);
} else if (err instanceof CommandResult) {
events.trigger('commandResultPrint', err);
} else if (err instanceof GitError) {
events.trigger('commandGitError', err);
} else {
throw err;
}
},
setTextField: function(value) { setTextField: function(value) {
this.$('#commandTextField').val(value); this.$('#commandTextField').val(value);
}, },
@ -92,27 +67,20 @@ var CommandPromptView = Backbone.View.extend({
this.index = -1; this.index = -1;
// split commands on semicolon // split commands on semicolon
_.each(value.split(';'), function(command) { _.each(value.split(';'), _.bind(function(command) {
command = command.replace(/^(\s+)/, ''); command = command.replace(/^(\s+)/, '');
command = command.replace(/(\s+)$/, ''); command = command.replace(/(\s+)$/, '');
if (command.length) { if (command.length) {
events.trigger('commandSubmitted', command); this.addToCollection(command);
} }
}); }, this));
}, },
parseOrCatch: function(value) { addToCollection: function(value) {
// TODO: move this also var command = new Command({
try { rawStr: value
// parse validation });
var command = new Command({ this.collection.add(command);
rawStr: value
});
// gitCommandReady actually gives it to the gitEngine for dispatch
events.trigger('gitCommandReady', command);
} catch (err) {
events.trigger('processErrorGeneral', err);
}
} }
}); });
@ -127,10 +95,12 @@ var CommandView = Backbone.View.extend({
template: _.template($('#command-template').html()), template: _.template($('#command-template').html()),
events: { events: {
'click': 'alert' 'click': 'clicked'
}, },
alert: function() { alert('clicked!' + this.get('status')); }, clicked: function(e) {
console.log('was clicked');
},
initialize: function() { initialize: function() {
this.model.bind('change', this.render, this); this.model.bind('change', this.render, this);
@ -157,92 +127,21 @@ var CommandView = Backbone.View.extend({
var CommandLineHistoryView = Backbone.View.extend({ var CommandLineHistoryView = Backbone.View.extend({
initialize: function(options) { initialize: function(options) {
events.on('commandSubmitted', _.bind( this.collection = options.collection;
this.addCommand, this
));
events.on('commandProcessError', _.bind( this.collection.on('add', this.addOne, this);
this.commandError, this this.collection.on('reset', this.addAll, this);
)); this.collection.on('all', this.render, this);
// TODO special errors for git?
events.on('commandGitError', _.bind(
this.commandError, this
));
events.on('commandProcessWarn', _.bind(
this.commandWarn, this
));
events.on('commandResultPrint', _.bind(
this.commandResultPrint, this
));
// TODO: move these to a real template system
this.commandTemplate = ' \
<p class="commandLine <%= className %>"> \
<span class="arrows">&gt; &gt; &gt;</span> \
<%= command %> \
</p> \
';
this.resultTemplate = ' \
<p class="commandLine <%= className %>"> \
<%= result %> \
</p> \
';
}, },
addCommand: function(commandText) { addOne: function(command) {
this.$('#commandDisplay').append( var view = new CommandView({
_.template( model: command
this.commandTemplate, });
{ this.$('#commandDisplay').append(view.render().el);
className: 'pastCommand',
command: commandText
}
)
);
}, },
commandError: function(err) { addAll: function() {
this.$('#commandDisplay').append( this.collection.each(this.addOne);
_.template(
this.resultTemplate,
{
className: 'errorResult',
result: err.toResult()
}
)
);
},
commandWarn: function(msg) {
this.$('#commandDisplay').append(
_.template(
this.resultTemplate,
{
className: 'commandWarn',
result: msg
}
)
);
},
commandResultPrint: function(err) {
if (!err.get('msg') || !err.get('msg').length) {
console.log(err);
// blank lines
return;
}
this.$('#commandDisplay').append(
_.template(
this.resultTemplate,
{
className: 'commandResult',
result: err.toResult()
}
)
);
} }
}); });

View file

@ -1,4 +1,7 @@
function GitVisuals() { function GitVisuals() {
this.collection = commitCollection;
this.collection.on('change', _.bind(this.collectionChanged, this));
events.on('drawGitVisuals', _.bind(this.drawVisuals, this)); events.on('drawGitVisuals', _.bind(this.drawVisuals, this));
events.on('fixNodePositions', _.bind(this.fixNodes, this)); events.on('fixNodePositions', _.bind(this.fixNodes, this));
} }
@ -71,6 +74,10 @@ GitVisuals.prototype.drawArrow = function(ctx, start, end, headWidth, offset) {
ctx.stroke(); ctx.stroke();
}; };
GitVisuals.prototype.collectionChanged = function() {
// redo the algorithms
};
GitVisuals.prototype.fixRootCommit = function(sys) { GitVisuals.prototype.fixRootCommit = function(sys) {
// get the viewports bottom center // get the viewports bottom center
var bottomPosScreen = { var bottomPosScreen = {