better zoom support

This commit is contained in:
Peter Cottle 2013-01-01 21:52:15 -08:00
parent 7750bae1b4
commit 423a353e28
14 changed files with 143 additions and 137 deletions

View file

@ -4398,8 +4398,8 @@ var GLOBAL = {
};
var VIEWPORT = {
minZoom: 1,
maxZoom: 1.15
minZoom: 0.66,
maxZoom: 1.25
};
var GRAPHICS = {
@ -4578,7 +4578,6 @@ var ModalView = Backbone.View.extend({
},
stealKeyboard: function() {
console.warn('stealing keyboard');
Main.getEventBaton().stealBaton('keydown', this.onKeyDown, this);
Main.getEventBaton().stealBaton('keyup', this.onKeyUp, this);
Main.getEventBaton().stealBaton('windowFocus', this.onWindowFocus, this);
@ -4912,7 +4911,7 @@ var init = function(){
/* hacky demo functionality */
if (/\?demo/.test(window.location.href)) {
setTimeout(function() {
events.trigger('submitCommandValueFromEvent', "gc; git checkout HEAD~1; git commit; git checkout -b bugFix; gc; gc; git rebase -i HEAD~2; git rebase master; git checkout master; gc; gc; git merge bugFix");
events.trigger('commandSubmitted', "gc; git checkout HEAD~1; git commit; git checkout -b bugFix; gc; gc; git rebase -i HEAD~2; git rebase master; git checkout master; gc; gc; git merge bugFix");
}, 500);
}
};
@ -4928,10 +4927,12 @@ function UI() {
collection: this.commandCollection
});
// command prompt event fires an event when commands are ready,
// hence it doesn't need access to the collection anymore
this.commandPromptView = new CommandViews.CommandPromptView({
el: $('#commandLineBar'),
collection: this.commandCollection
el: $('#commandLineBar')
});
this.commandLineHistoryView = new CommandViews.CommandLineHistoryView({
el: $('#commandLineHistory'),
collection: this.commandCollection
@ -5089,7 +5090,6 @@ var CommandBuffer = Backbone.Model.extend({
},
initialize: function(options) {
require('../app').getEvents().on('gitCommandReady', this.addCommand, this);
options.collection.bind('add', this.addCommand, this);
this.buffer = [];
@ -9192,6 +9192,8 @@ var Command = Backbone.Model.extend({
}
_.each(results.toSet, function(obj, key) {
// data comes back from the parsing functions like
// options (etc) that need to be set
this.set(key, obj);
}, this);
return true;
@ -10140,7 +10142,7 @@ GitVisuals.prototype.calcDepthRecursive = function(commit, depth) {
GitVisuals.prototype.canvasResize = _.debounce(function(width, height) {
// refresh when we are ready
if (GLOBAL.isAnimating) {
this.events.trigger('processCommandFromEvent', 'refresh');
this.events.trigger('commandSubmitted', 'refresh');
} else {
this.refreshTree();
}
@ -10596,7 +10598,7 @@ var VisNode = VisBase.extend({
var Main = require('../app');
_.each([this.get('circle'), this.get('text')], function(rObj) {
rObj.click(function() {
Main.getEvents().trigger('processCommandFromEvent', commandStr);
Main.getEvents().trigger('commandSubmitted', commandStr);
});
$(rObj.node).css('cursor', 'pointer');
});
@ -11080,7 +11082,7 @@ var VisBranch = VisBase.extend({
_.each(objs, function(rObj) {
rObj.click(function() {
Main.getEvents().trigger('processCommandFromEvent', commandStr);
Main.getEvents().trigger('commandSubmitted', commandStr);
});
$(rObj.node).css('cursor', 'pointer');
});
@ -11483,7 +11485,7 @@ EventBaton.prototype.trigger = function(name) {
}
var listeners = this.eventMap[name];
if (!listeners) {
if (!listeners || !listeners.length) {
console.warn('no listeners for', name);
return;
}
@ -11557,6 +11559,7 @@ var setupZoomPoll = function(callback, context) {
};
exports.setupZoomPoll = setupZoomPoll;
exports.detectZoom = detectZoom;
});
@ -11578,8 +11581,6 @@ var keyboard = require('../util/keyboard');
var CommandPromptView = Backbone.View.extend({
initialize: function(options) {
this.collection = options.collection;
// uses local storage
this.commands = new CommandEntryCollection();
this.commands.fetch({
@ -11604,8 +11605,6 @@ var CommandPromptView = Backbone.View.extend({
this.commandCursor = this.$('#prompt span.cursor')[0];
this.focus();
Main.getEvents().on('processCommandFromEvent', this.addToCollection, this);
Main.getEvents().on('submitCommandValueFromEvent', this.submitValue, this);
Main.getEvents().on('rollupCommands', this.rollupCommands, this);
Main.getEventBaton().stealBaton('keydown', this.onKeyDown, this);
@ -11683,7 +11682,6 @@ var CommandPromptView = Backbone.View.extend({
// there's a very annoying and sightly noticeable command delay.
// try.github.com also has this, so I'm assuming those engineers gave up as
// well...
var val = this.badHtmlEncode(el.value);
this.commandSpan.innerHTML = val;
@ -11694,8 +11692,9 @@ var CommandPromptView = Backbone.View.extend({
},
cursorUpdate: function(commandLength, selectionStart, selectionEnd) {
// 10px for monospaced font...
var widthPerChar = 10;
// 10px for monospaced font at "1" zoom
var zoom = require('../util/zoomLevel').detectZoom();
var widthPerChar = 10 * zoom;
var numCharsSelected = Math.max(1, selectionEnd - selectionStart);
var width = String(numCharsSelected * widthPerChar) + 'px';
@ -11744,7 +11743,9 @@ var CommandPromptView = Backbone.View.extend({
submit: function() {
var value = this.$('#commandTextField').val().replace('\n', '');
this.clear();
this.submitValue(value);
this.submitCommand(value);
this.index = -1;
},
rollupCommands: function(numBack) {
@ -11756,22 +11757,28 @@ var CommandPromptView = Backbone.View.extend({
str += commandEntry.get('text') + ';';
}, this);
console.log('the str', str);
var rolled = new CommandEntry({text: str});
this.commands.unshift(rolled);
Backbone.sync('create', rolled, function() { });
},
submitValue: function(value) {
addToCommandHistory: function(value, index) {
// this method will fire from events too (like clicking on a visNode),
// so the index might not be present or relevant. a value of -1
// means we should add it regardless
index = (index === undefined) ? -1 : index;
// we should add the command to our local storage history
// if it's not a blank line and this is a new command...
// or if we edited the command in place
var shouldAdd = (value.length && this.index == -1) ||
((value.length && this.index !== -1 &&
this.commands.toArray()[this.index].get('text') !== value));
// or if we edited the command in place in history
var shouldAdd = (value.length && index == -1) ||
((value.length && index !== -1 &&
this.commands.toArray()[index].get('text') !== value));
if (!shouldAdd) {
return;
}
if (shouldAdd) {
var commandEntry = new CommandEntry({text: value});
this.commands.unshift(commandEntry);
@ -11782,19 +11789,15 @@ var CommandPromptView = Backbone.View.extend({
if (this.commands.length > 100) {
this.clearLocalStorage();
}
}
this.index = -1;
util.splitTextCommand(value, function(command) {
this.addToCollection(command);
}, this);
},
addToCollection: function(value) {
submitCommand: function(value) {
Main.getEventBaton().trigger('commandSubmitted', value);
/*
var command = new Command({
rawStr: value
});
this.collection.add(command);
*/
}
});
@ -11876,8 +11879,6 @@ var CommandLineHistoryView = Backbone.View.extend({
this.collection.on('all', this.render, this);
this.collection.on('change', this.scrollDown, this);
Main.getEvents().on('issueWarning', this.addWarning, this);
Main.getEvents().on('commandScrollDown', this.scrollDown, this);
},
@ -14465,7 +14466,7 @@ var init = function(){
/* hacky demo functionality */
if (/\?demo/.test(window.location.href)) {
setTimeout(function() {
events.trigger('submitCommandValueFromEvent', "gc; git checkout HEAD~1; git commit; git checkout -b bugFix; gc; gc; git rebase -i HEAD~2; git rebase master; git checkout master; gc; gc; git merge bugFix");
events.trigger('commandSubmitted', "gc; git checkout HEAD~1; git commit; git checkout -b bugFix; gc; gc; git rebase -i HEAD~2; git rebase master; git checkout master; gc; gc; git merge bugFix");
}, 500);
}
};
@ -14481,10 +14482,12 @@ function UI() {
collection: this.commandCollection
});
// command prompt event fires an event when commands are ready,
// hence it doesn't need access to the collection anymore
this.commandPromptView = new CommandViews.CommandPromptView({
el: $('#commandLineBar'),
collection: this.commandCollection
el: $('#commandLineBar')
});
this.commandLineHistoryView = new CommandViews.CommandLineHistoryView({
el: $('#commandLineHistory'),
collection: this.commandCollection
@ -16805,7 +16808,6 @@ var CommandBuffer = Backbone.Model.extend({
},
initialize: function(options) {
require('../app').getEvents().on('gitCommandReady', this.addCommand, this);
options.collection.bind('add', this.addCommand, this);
this.buffer = [];
@ -17028,6 +17030,8 @@ var Command = Backbone.Model.extend({
}
_.each(results.toSet, function(obj, key) {
// data comes back from the parsing functions like
// options (etc) that need to be set
this.set(key, obj);
}, this);
return true;
@ -17062,8 +17066,8 @@ var GLOBAL = {
};
var VIEWPORT = {
minZoom: 1,
maxZoom: 1.15
minZoom: 0.66,
maxZoom: 1.25
};
var GRAPHICS = {
@ -17122,7 +17126,8 @@ var toGlobalize = {
Q: { Q: require('q') },
RebaseView: require('../views/rebaseView'),
Views: require('../views'),
MultiView: require('../views/multiView')
MultiView: require('../views/multiView'),
ZoomLevel: require('../util/zoomLevel')
};
_.each(toGlobalize, function(module) {
@ -17232,7 +17237,7 @@ EventBaton.prototype.trigger = function(name) {
}
var listeners = this.eventMap[name];
if (!listeners) {
if (!listeners || !listeners.length) {
console.warn('no listeners for', name);
return;
}
@ -17403,6 +17408,7 @@ var setupZoomPoll = function(callback, context) {
};
exports.setupZoomPoll = setupZoomPoll;
exports.detectZoom = detectZoom;
});
@ -17425,8 +17431,6 @@ var keyboard = require('../util/keyboard');
var CommandPromptView = Backbone.View.extend({
initialize: function(options) {
this.collection = options.collection;
// uses local storage
this.commands = new CommandEntryCollection();
this.commands.fetch({
@ -17451,8 +17455,6 @@ var CommandPromptView = Backbone.View.extend({
this.commandCursor = this.$('#prompt span.cursor')[0];
this.focus();
Main.getEvents().on('processCommandFromEvent', this.addToCollection, this);
Main.getEvents().on('submitCommandValueFromEvent', this.submitValue, this);
Main.getEvents().on('rollupCommands', this.rollupCommands, this);
Main.getEventBaton().stealBaton('keydown', this.onKeyDown, this);
@ -17530,7 +17532,6 @@ var CommandPromptView = Backbone.View.extend({
// there's a very annoying and sightly noticeable command delay.
// try.github.com also has this, so I'm assuming those engineers gave up as
// well...
var val = this.badHtmlEncode(el.value);
this.commandSpan.innerHTML = val;
@ -17541,8 +17542,9 @@ var CommandPromptView = Backbone.View.extend({
},
cursorUpdate: function(commandLength, selectionStart, selectionEnd) {
// 10px for monospaced font...
var widthPerChar = 10;
// 10px for monospaced font at "1" zoom
var zoom = require('../util/zoomLevel').detectZoom();
var widthPerChar = 10 * zoom;
var numCharsSelected = Math.max(1, selectionEnd - selectionStart);
var width = String(numCharsSelected * widthPerChar) + 'px';
@ -17591,7 +17593,9 @@ var CommandPromptView = Backbone.View.extend({
submit: function() {
var value = this.$('#commandTextField').val().replace('\n', '');
this.clear();
this.submitValue(value);
this.submitCommand(value);
this.index = -1;
},
rollupCommands: function(numBack) {
@ -17603,22 +17607,28 @@ var CommandPromptView = Backbone.View.extend({
str += commandEntry.get('text') + ';';
}, this);
console.log('the str', str);
var rolled = new CommandEntry({text: str});
this.commands.unshift(rolled);
Backbone.sync('create', rolled, function() { });
},
submitValue: function(value) {
addToCommandHistory: function(value, index) {
// this method will fire from events too (like clicking on a visNode),
// so the index might not be present or relevant. a value of -1
// means we should add it regardless
index = (index === undefined) ? -1 : index;
// we should add the command to our local storage history
// if it's not a blank line and this is a new command...
// or if we edited the command in place
var shouldAdd = (value.length && this.index == -1) ||
((value.length && this.index !== -1 &&
this.commands.toArray()[this.index].get('text') !== value));
// or if we edited the command in place in history
var shouldAdd = (value.length && index == -1) ||
((value.length && index !== -1 &&
this.commands.toArray()[index].get('text') !== value));
if (!shouldAdd) {
return;
}
if (shouldAdd) {
var commandEntry = new CommandEntry({text: value});
this.commands.unshift(commandEntry);
@ -17629,19 +17639,15 @@ var CommandPromptView = Backbone.View.extend({
if (this.commands.length > 100) {
this.clearLocalStorage();
}
}
this.index = -1;
util.splitTextCommand(value, function(command) {
this.addToCollection(command);
}, this);
},
addToCollection: function(value) {
submitCommand: function(value) {
Main.getEventBaton().trigger('commandSubmitted', value);
/*
var command = new Command({
rawStr: value
});
this.collection.add(command);
*/
}
});
@ -17723,8 +17729,6 @@ var CommandLineHistoryView = Backbone.View.extend({
this.collection.on('all', this.render, this);
this.collection.on('change', this.scrollDown, this);
Main.getEvents().on('issueWarning', this.addWarning, this);
Main.getEvents().on('commandScrollDown', this.scrollDown, this);
},
@ -17916,7 +17920,6 @@ var ModalView = Backbone.View.extend({
},
stealKeyboard: function() {
console.warn('stealing keyboard');
Main.getEventBaton().stealBaton('keydown', this.onKeyDown, this);
Main.getEventBaton().stealBaton('keyup', this.onKeyUp, this);
Main.getEventBaton().stealBaton('windowFocus', this.onWindowFocus, this);
@ -19400,7 +19403,7 @@ GitVisuals.prototype.calcDepthRecursive = function(commit, depth) {
GitVisuals.prototype.canvasResize = _.debounce(function(width, height) {
// refresh when we are ready
if (GLOBAL.isAnimating) {
this.events.trigger('processCommandFromEvent', 'refresh');
this.events.trigger('commandSubmitted', 'refresh');
} else {
this.refreshTree();
}
@ -19907,7 +19910,7 @@ var VisBranch = VisBase.extend({
_.each(objs, function(rObj) {
rObj.click(function() {
Main.getEvents().trigger('processCommandFromEvent', commandStr);
Main.getEvents().trigger('commandSubmitted', commandStr);
});
$(rObj.node).css('cursor', 'pointer');
});
@ -20515,7 +20518,7 @@ var VisNode = VisBase.extend({
var Main = require('../app');
_.each([this.get('circle'), this.get('text')], function(rObj) {
rObj.click(function() {
Main.getEvents().trigger('processCommandFromEvent', commandStr);
Main.getEvents().trigger('commandSubmitted', commandStr);
});
$(rObj.node).css('cursor', 'pointer');
});

View file

@ -71,7 +71,7 @@ var init = function(){
/* hacky demo functionality */
if (/\?demo/.test(window.location.href)) {
setTimeout(function() {
events.trigger('submitCommandValueFromEvent', "gc; git checkout HEAD~1; git commit; git checkout -b bugFix; gc; gc; git rebase -i HEAD~2; git rebase master; git checkout master; gc; gc; git merge bugFix");
events.trigger('commandSubmitted', "gc; git checkout HEAD~1; git commit; git checkout -b bugFix; gc; gc; git rebase -i HEAD~2; git rebase master; git checkout master; gc; gc; git merge bugFix");
}, 500);
}
};
@ -87,10 +87,12 @@ function UI() {
collection: this.commandCollection
});
// command prompt event fires an event when commands are ready,
// hence it doesn't need access to the collection anymore
this.commandPromptView = new CommandViews.CommandPromptView({
el: $('#commandLineBar'),
collection: this.commandCollection
el: $('#commandLineBar')
});
this.commandLineHistoryView = new CommandViews.CommandLineHistoryView({
el: $('#commandLineHistory'),
collection: this.commandCollection

View file

@ -32,7 +32,6 @@ var CommandBuffer = Backbone.Model.extend({
},
initialize: function(options) {
require('../app').getEvents().on('gitCommandReady', this.addCommand, this);
options.collection.bind('add', this.addCommand, this);
this.buffer = [];

View file

@ -146,6 +146,8 @@ var Command = Backbone.Model.extend({
}
_.each(results.toSet, function(obj, key) {
// data comes back from the parsing functions like
// options (etc) that need to be set
this.set(key, obj);
}, this);
return true;

View file

@ -11,8 +11,8 @@ var GLOBAL = {
};
var VIEWPORT = {
minZoom: 1,
maxZoom: 1.15
minZoom: 0.66,
maxZoom: 1.25
};
var GRAPHICS = {

View file

@ -15,7 +15,8 @@ var toGlobalize = {
Q: { Q: require('q') },
RebaseView: require('../views/rebaseView'),
Views: require('../views'),
MultiView: require('../views/multiView')
MultiView: require('../views/multiView'),
ZoomLevel: require('../util/zoomLevel')
};
_.each(toGlobalize, function(module) {

View file

@ -26,7 +26,7 @@ EventBaton.prototype.trigger = function(name) {
}
var listeners = this.eventMap[name];
if (!listeners) {
if (!listeners || !listeners.length) {
console.warn('no listeners for', name);
return;
}

View file

@ -34,4 +34,5 @@ var setupZoomPoll = function(callback, context) {
};
exports.setupZoomPoll = setupZoomPoll;
exports.detectZoom = detectZoom;

View file

@ -15,8 +15,6 @@ var keyboard = require('../util/keyboard');
var CommandPromptView = Backbone.View.extend({
initialize: function(options) {
this.collection = options.collection;
// uses local storage
this.commands = new CommandEntryCollection();
this.commands.fetch({
@ -41,8 +39,6 @@ var CommandPromptView = Backbone.View.extend({
this.commandCursor = this.$('#prompt span.cursor')[0];
this.focus();
Main.getEvents().on('processCommandFromEvent', this.addToCollection, this);
Main.getEvents().on('submitCommandValueFromEvent', this.submitValue, this);
Main.getEvents().on('rollupCommands', this.rollupCommands, this);
Main.getEventBaton().stealBaton('keydown', this.onKeyDown, this);
@ -120,7 +116,6 @@ var CommandPromptView = Backbone.View.extend({
// there's a very annoying and sightly noticeable command delay.
// try.github.com also has this, so I'm assuming those engineers gave up as
// well...
var val = this.badHtmlEncode(el.value);
this.commandSpan.innerHTML = val;
@ -131,8 +126,9 @@ var CommandPromptView = Backbone.View.extend({
},
cursorUpdate: function(commandLength, selectionStart, selectionEnd) {
// 10px for monospaced font...
var widthPerChar = 10;
// 10px for monospaced font at "1" zoom
var zoom = require('../util/zoomLevel').detectZoom();
var widthPerChar = 10 * zoom;
var numCharsSelected = Math.max(1, selectionEnd - selectionStart);
var width = String(numCharsSelected * widthPerChar) + 'px';
@ -181,7 +177,9 @@ var CommandPromptView = Backbone.View.extend({
submit: function() {
var value = this.$('#commandTextField').val().replace('\n', '');
this.clear();
this.submitValue(value);
this.submitCommand(value);
this.index = -1;
},
rollupCommands: function(numBack) {
@ -193,22 +191,28 @@ var CommandPromptView = Backbone.View.extend({
str += commandEntry.get('text') + ';';
}, this);
console.log('the str', str);
var rolled = new CommandEntry({text: str});
this.commands.unshift(rolled);
Backbone.sync('create', rolled, function() { });
},
submitValue: function(value) {
addToCommandHistory: function(value, index) {
// this method will fire from events too (like clicking on a visNode),
// so the index might not be present or relevant. a value of -1
// means we should add it regardless
index = (index === undefined) ? -1 : index;
// we should add the command to our local storage history
// if it's not a blank line and this is a new command...
// or if we edited the command in place
var shouldAdd = (value.length && this.index == -1) ||
((value.length && this.index !== -1 &&
this.commands.toArray()[this.index].get('text') !== value));
// or if we edited the command in place in history
var shouldAdd = (value.length && index == -1) ||
((value.length && index !== -1 &&
this.commands.toArray()[index].get('text') !== value));
if (!shouldAdd) {
return;
}
if (shouldAdd) {
var commandEntry = new CommandEntry({text: value});
this.commands.unshift(commandEntry);
@ -219,19 +223,15 @@ var CommandPromptView = Backbone.View.extend({
if (this.commands.length > 100) {
this.clearLocalStorage();
}
}
this.index = -1;
util.splitTextCommand(value, function(command) {
this.addToCollection(command);
}, this);
},
addToCollection: function(value) {
submitCommand: function(value) {
Main.getEventBaton().trigger('commandSubmitted', value);
/*
var command = new Command({
rawStr: value
});
this.collection.add(command);
*/
}
});
@ -313,8 +313,6 @@ var CommandLineHistoryView = Backbone.View.extend({
this.collection.on('all', this.render, this);
this.collection.on('change', this.scrollDown, this);
Main.getEvents().on('issueWarning', this.addWarning, this);
Main.getEvents().on('commandScrollDown', this.scrollDown, this);
},

View file

@ -136,7 +136,6 @@ var ModalView = Backbone.View.extend({
},
stealKeyboard: function() {
console.warn('stealing keyboard');
Main.getEventBaton().stealBaton('keydown', this.onKeyDown, this);
Main.getEventBaton().stealBaton('keyup', this.onKeyUp, this);
Main.getEventBaton().stealBaton('windowFocus', this.onWindowFocus, this);

View file

@ -618,7 +618,7 @@ GitVisuals.prototype.calcDepthRecursive = function(commit, depth) {
GitVisuals.prototype.canvasResize = _.debounce(function(width, height) {
// refresh when we are ready
if (GLOBAL.isAnimating) {
this.events.trigger('processCommandFromEvent', 'refresh');
this.events.trigger('commandSubmitted', 'refresh');
} else {
this.refreshTree();
}

View file

@ -319,7 +319,7 @@ var VisBranch = VisBase.extend({
_.each(objs, function(rObj) {
rObj.click(function() {
Main.getEvents().trigger('processCommandFromEvent', commandStr);
Main.getEvents().trigger('commandSubmitted', commandStr);
});
$(rObj.node).css('cursor', 'pointer');
});

View file

@ -318,7 +318,7 @@ var VisNode = VisBase.extend({
var Main = require('../app');
_.each([this.get('circle'), this.get('text')], function(rObj) {
rObj.click(function() {
Main.getEvents().trigger('processCommandFromEvent', commandStr);
Main.getEvents().trigger('commandSubmitted', commandStr);
});
$(rObj.node).css('cursor', 'pointer');
});

View file

@ -21,6 +21,7 @@ Small things to implement:
Minor Bugs to fix:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
[ ] figure out why multiview baton passing doesn't work...
Big Bugs to fix:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~