keyboard events legit

This commit is contained in:
Peter Cottle 2012-12-24 13:14:21 -08:00
parent d6a7a11337
commit 93f6f3c6ca
3 changed files with 193 additions and 21 deletions

View file

@ -13712,12 +13712,13 @@ var ContainedBase = require('../views').ContainedBase;
var ConfirmCancelView = require('../views').ConfirmCancelView; var ConfirmCancelView = require('../views').ConfirmCancelView;
var LeftRightView = require('../views').LeftRightView; var LeftRightView = require('../views').LeftRightView;
var ModalAlert = require('../views').ModalAlert; var ModalAlert = require('../views').ModalAlert;
var KeyboardListener = require('../util/keyboard').KeyboardListener;
var MultiView = Backbone.View.extend({ var MultiView = Backbone.View.extend({
tagName: 'div', tagName: 'div',
className: 'multiView', className: 'multiView',
// ms to debounce the nav functions // ms to throttle the nav functions
navEventDebounce: 150, navEventThrottle: 150,
// a simple mapping of what childViews we support // a simple mapping of what childViews we support
typeToConstructor: { typeToConstructor: {
@ -13743,22 +13744,30 @@ var MultiView = Backbone.View.extend({
this.currentIndex = 0; this.currentIndex = 0;
this.navEvents = _.clone(Backbone.Events); this.navEvents = _.clone(Backbone.Events);
this.navEvents.on('positive', this.getPosFunc(), this);
this.navEvents.on('negative', this.getNegFunc(), this); this.navEvents.on('negative', this.getNegFunc(), this);
this.navEvents.on('positive', this.getPosFunc(), this);
this.keyboardListener = new KeyboardListener({
events: this.navEvents,
aliasMap: {
left: 'negative',
right: 'positive'
}
});
this.render(); this.render();
}, },
getPosFunc: function() { getPosFunc: function() {
return _.debounce(_.bind(function() { return _.throttle(_.bind(function() {
this.navForward(); this.navForward();
}, this), this.navEventDebounce, true); }, this), this.navEventThrottle);
}, },
getNegFunc: function() { getNegFunc: function() {
return _.debounce(_.bind(function() { return _.throttle(_.bind(function() {
this.navBackward(); this.navBackward();
}, this), this.navEventDebounce, true); }, this), this.navEventThrottle);
}, },
navForward: function() { navForward: function() {
@ -13794,6 +13803,7 @@ var MultiView = Backbone.View.extend({
}, },
finish: function() { finish: function() {
this.keyboardListener.mute();
if (this.deferred) { if (this.deferred) {
this.deferred.resolve(); this.deferred.resolve();
} else { } else {
@ -13836,6 +13846,54 @@ var MultiView = Backbone.View.extend({
exports.MultiView = MultiView; exports.MultiView = MultiView;
});
require.define("/src/js/util/keyboard.js",function(require,module,exports,__dirname,__filename,process,global){var _ = require('underscore');
var Backbone = require('backbone');
function KeyboardListener(options) {
this.events = options.events || _.clone(Backbone.Events);
this.aliasMap = options.aliasMap || {};
this.keyMap = {
37: 'left',
38: 'up',
39: 'right',
40: 'down',
27: 'esc',
13: 'enter'
};
this.keydownListener = _.bind(this.keydown, this);
this.listen();
}
KeyboardListener.prototype.listen = function() {
$(document).bind('keydown', this.keydownListener);
};
KeyboardListener.prototype.mute = function() {
$(document).unbind('keydown', this.keydownListener);
};
KeyboardListener.prototype.keydown = function(e) {
var which = e.which;
console.log('key which', which);
if (this.keyMap[which] === undefined) {
return;
}
this.fireEvent(this.keyMap[which]);
};
KeyboardListener.prototype.fireEvent = function(eventName) {
eventName = this.aliasMap[eventName] || eventName;
this.events.trigger(eventName);
};
exports.KeyboardListener = KeyboardListener;
}); });
require.define("/src/js/app/index.js",function(require,module,exports,__dirname,__filename,process,global){var _ = require('underscore'); require.define("/src/js/app/index.js",function(require,module,exports,__dirname,__filename,process,global){var _ = require('underscore');
@ -16420,6 +16478,55 @@ exports.splitTextCommand = function(value, func, context) {
}); });
require("/src/js/util/index.js"); require("/src/js/util/index.js");
require.define("/src/js/util/keyboard.js",function(require,module,exports,__dirname,__filename,process,global){var _ = require('underscore');
var Backbone = require('backbone');
function KeyboardListener(options) {
this.events = options.events || _.clone(Backbone.Events);
this.aliasMap = options.aliasMap || {};
this.keyMap = {
37: 'left',
38: 'up',
39: 'right',
40: 'down',
27: 'esc',
13: 'enter'
};
this.keydownListener = _.bind(this.keydown, this);
this.listen();
}
KeyboardListener.prototype.listen = function() {
$(document).bind('keydown', this.keydownListener);
};
KeyboardListener.prototype.mute = function() {
$(document).unbind('keydown', this.keydownListener);
};
KeyboardListener.prototype.keydown = function(e) {
var which = e.which;
console.log('key which', which);
if (this.keyMap[which] === undefined) {
return;
}
this.fireEvent(this.keyMap[which]);
};
KeyboardListener.prototype.fireEvent = function(eventName) {
eventName = this.aliasMap[eventName] || eventName;
this.events.trigger(eventName);
};
exports.KeyboardListener = KeyboardListener;
});
require("/src/js/util/keyboard.js");
require.define("/src/js/util/mock.js",function(require,module,exports,__dirname,__filename,process,global){exports.mock = function(Constructor) { require.define("/src/js/util/mock.js",function(require,module,exports,__dirname,__filename,process,global){exports.mock = function(Constructor) {
var dummy = {}; var dummy = {};
var stub = function() {}; var stub = function() {};
@ -17041,12 +17148,13 @@ var ContainedBase = require('../views').ContainedBase;
var ConfirmCancelView = require('../views').ConfirmCancelView; var ConfirmCancelView = require('../views').ConfirmCancelView;
var LeftRightView = require('../views').LeftRightView; var LeftRightView = require('../views').LeftRightView;
var ModalAlert = require('../views').ModalAlert; var ModalAlert = require('../views').ModalAlert;
var KeyboardListener = require('../util/keyboard').KeyboardListener;
var MultiView = Backbone.View.extend({ var MultiView = Backbone.View.extend({
tagName: 'div', tagName: 'div',
className: 'multiView', className: 'multiView',
// ms to debounce the nav functions // ms to throttle the nav functions
navEventDebounce: 150, navEventThrottle: 150,
// a simple mapping of what childViews we support // a simple mapping of what childViews we support
typeToConstructor: { typeToConstructor: {
@ -17072,22 +17180,30 @@ var MultiView = Backbone.View.extend({
this.currentIndex = 0; this.currentIndex = 0;
this.navEvents = _.clone(Backbone.Events); this.navEvents = _.clone(Backbone.Events);
this.navEvents.on('positive', this.getPosFunc(), this);
this.navEvents.on('negative', this.getNegFunc(), this); this.navEvents.on('negative', this.getNegFunc(), this);
this.navEvents.on('positive', this.getPosFunc(), this);
this.keyboardListener = new KeyboardListener({
events: this.navEvents,
aliasMap: {
left: 'negative',
right: 'positive'
}
});
this.render(); this.render();
}, },
getPosFunc: function() { getPosFunc: function() {
return _.debounce(_.bind(function() { return _.throttle(_.bind(function() {
this.navForward(); this.navForward();
}, this), this.navEventDebounce, true); }, this), this.navEventThrottle);
}, },
getNegFunc: function() { getNegFunc: function() {
return _.debounce(_.bind(function() { return _.throttle(_.bind(function() {
this.navBackward(); this.navBackward();
}, this), this.navEventDebounce, true); }, this), this.navEventThrottle);
}, },
navForward: function() { navForward: function() {
@ -17123,6 +17239,7 @@ var MultiView = Backbone.View.extend({
}, },
finish: function() { finish: function() {
this.keyboardListener.mute();
if (this.deferred) { if (this.deferred) {
this.deferred.resolve(); this.deferred.resolve();
} else { } else {

45
src/js/util/keyboard.js Normal file
View file

@ -0,0 +1,45 @@
var _ = require('underscore');
var Backbone = require('backbone');
function KeyboardListener(options) {
this.events = options.events || _.clone(Backbone.Events);
this.aliasMap = options.aliasMap || {};
this.keyMap = {
37: 'left',
38: 'up',
39: 'right',
40: 'down',
27: 'esc',
13: 'enter'
};
this.keydownListener = _.bind(this.keydown, this);
this.listen();
}
KeyboardListener.prototype.listen = function() {
$(document).bind('keydown', this.keydownListener);
};
KeyboardListener.prototype.mute = function() {
$(document).unbind('keydown', this.keydownListener);
};
KeyboardListener.prototype.keydown = function(e) {
var which = e.which;
console.log('key which', which);
if (this.keyMap[which] === undefined) {
return;
}
this.fireEvent(this.keyMap[which]);
};
KeyboardListener.prototype.fireEvent = function(eventName) {
eventName = this.aliasMap[eventName] || eventName;
this.events.trigger(eventName);
};
exports.KeyboardListener = KeyboardListener;

View file

@ -9,12 +9,13 @@ var ContainedBase = require('../views').ContainedBase;
var ConfirmCancelView = require('../views').ConfirmCancelView; var ConfirmCancelView = require('../views').ConfirmCancelView;
var LeftRightView = require('../views').LeftRightView; var LeftRightView = require('../views').LeftRightView;
var ModalAlert = require('../views').ModalAlert; var ModalAlert = require('../views').ModalAlert;
var KeyboardListener = require('../util/keyboard').KeyboardListener;
var MultiView = Backbone.View.extend({ var MultiView = Backbone.View.extend({
tagName: 'div', tagName: 'div',
className: 'multiView', className: 'multiView',
// ms to debounce the nav functions // ms to throttle the nav functions
navEventDebounce: 150, navEventThrottle: 150,
// a simple mapping of what childViews we support // a simple mapping of what childViews we support
typeToConstructor: { typeToConstructor: {
@ -40,22 +41,30 @@ var MultiView = Backbone.View.extend({
this.currentIndex = 0; this.currentIndex = 0;
this.navEvents = _.clone(Backbone.Events); this.navEvents = _.clone(Backbone.Events);
this.navEvents.on('positive', this.getPosFunc(), this);
this.navEvents.on('negative', this.getNegFunc(), this); this.navEvents.on('negative', this.getNegFunc(), this);
this.navEvents.on('positive', this.getPosFunc(), this);
this.keyboardListener = new KeyboardListener({
events: this.navEvents,
aliasMap: {
left: 'negative',
right: 'positive'
}
});
this.render(); this.render();
}, },
getPosFunc: function() { getPosFunc: function() {
return _.debounce(_.bind(function() { return _.throttle(_.bind(function() {
this.navForward(); this.navForward();
}, this), this.navEventDebounce, true); }, this), this.navEventThrottle);
}, },
getNegFunc: function() { getNegFunc: function() {
return _.debounce(_.bind(function() { return _.throttle(_.bind(function() {
this.navBackward(); this.navBackward();
}, this), this.navEventDebounce, true); }, this), this.navEventThrottle);
}, },
navForward: function() { navForward: function() {
@ -91,6 +100,7 @@ var MultiView = Backbone.View.extend({
}, },
finish: function() { finish: function() {
this.keyboardListener.mute();
if (this.deferred) { if (this.deferred) {
this.deferred.resolve(); this.deferred.resolve();
} else { } else {