mirror of
https://github.com/mperham/sidekiq.git
synced 2022-11-09 13:52:34 -05:00
Revert "Implement Web UI keyboard shortcuts, #2540"
This reverts commit 4c274f4cfb.
This commit is contained in:
Mike Perham
parent
4c274f4cfb
commit
6e652817e3
7 changed files with 5 additions and 515 deletions
|
|
@ -1,7 +1,6 @@
|
|||
HEAD
|
||||
Next
|
||||
-----------
|
||||
|
||||
- Web UI now has keyboard shortcuts, hit '?' to see them. [#2540]
|
||||
- Add middleware stack to testing harness; see [wiki documentation](https://github.com/mperham/sidekiq/wiki/Testing#testing-server-middleware) [#2534, ryansch]
|
||||
|
||||
3.5.0
|
||||
|
|
|
|||
|
|
@ -30,18 +30,6 @@ module Sidekiq
|
|||
"Dead" => 'morgue',
|
||||
}
|
||||
|
||||
SHORTCUTS = {
|
||||
'Dashboard' => 'h',
|
||||
'Busy' => 'b',
|
||||
'Queues' => 'q',
|
||||
'Retries' => 'r',
|
||||
'Scheduled' => 's',
|
||||
'Dead' => 'd',
|
||||
'Limits' => 'l',
|
||||
'Batches' => 'a',
|
||||
'Cron' => 'c',
|
||||
}
|
||||
|
||||
class << self
|
||||
def default_tabs
|
||||
DEFAULT_TABS
|
||||
|
|
|
|||
|
|
@ -1,133 +0,0 @@
|
|||
// Generated by CoffeeScript 1.3.3
|
||||
(function() {
|
||||
|
||||
$.fn.extend({
|
||||
chaves: function(options) {
|
||||
var self;
|
||||
self = $.fn.chaves;
|
||||
options = $.extend({}, self.default_options, options);
|
||||
return $(this).each(function(i, el) {
|
||||
return self.init(el, options);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$.extend($.fn.chaves, {
|
||||
version: '0.1.1',
|
||||
default_options: {
|
||||
activeClass: 'active',
|
||||
bindings: [],
|
||||
childSelector: '> *',
|
||||
className: 'jquery-chaves',
|
||||
enableUpDown: false,
|
||||
helpModalClass: 'jquery-chaves-help',
|
||||
linkSelector: 'a:first',
|
||||
scope: 'all',
|
||||
searchSelector: '.search,\
|
||||
#search,\
|
||||
input[type="search"],\
|
||||
input[type="text"][value*="earch"],\
|
||||
input[type="text"][placeholder*="earch"]'
|
||||
},
|
||||
init: function(el, options) {
|
||||
var addToHelp, clickActive, downkeys, goDown, goUp, hideHelp, register_all_bindings, searchFocus, showHelp, upkeys,
|
||||
_this = this;
|
||||
this.options = options;
|
||||
this.bindings = $.extend([], options.bindings);
|
||||
this.el = $(el).addClass(options.className);
|
||||
this.children = this.el.find(options.childSelector);
|
||||
this.active = this.children.first().addClass(options.activeClass);
|
||||
this.index = 0;
|
||||
this.help = this.findOrCreateHelp();
|
||||
downkeys = 'j';
|
||||
upkeys = 'k';
|
||||
if (options.enableUpDown) {
|
||||
downkeys += ", down";
|
||||
upkeys += ", up";
|
||||
}
|
||||
register_all_bindings = function() {
|
||||
var binding, _i, _len, _ref, _results;
|
||||
_ref = _this.bindings;
|
||||
_results = [];
|
||||
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
|
||||
binding = _ref[_i];
|
||||
key(binding[0], _this.options.scope, binding[2]);
|
||||
_results.push(addToHelp(binding[0], binding[1]));
|
||||
}
|
||||
return _results;
|
||||
};
|
||||
addToHelp = function(keys, description) {
|
||||
return _this.help.find('dl').append("<dt>" + keys + "</dt><dd>" + description + "</dd>");
|
||||
};
|
||||
goUp = function() {
|
||||
var prev;
|
||||
if (_this.index > 0) {
|
||||
_this.index = _this.index - 1;
|
||||
prev = $(_this.children[_this.index]).addClass(_this.options.activeClass);
|
||||
_this.active.removeClass(_this.options.activeClass);
|
||||
_this.active = prev;
|
||||
return _this.readjust(150);
|
||||
}
|
||||
};
|
||||
goDown = function() {
|
||||
var next;
|
||||
if (_this.index < _this.children.length - 1) {
|
||||
_this.index = _this.index + 1;
|
||||
next = $(_this.children[_this.index]).addClass(_this.options.activeClass);
|
||||
_this.active.removeClass(_this.options.activeClass);
|
||||
_this.active = next;
|
||||
return _this.readjust(0);
|
||||
}
|
||||
};
|
||||
showHelp = function() {
|
||||
return _this.help.toggleClass('visible');
|
||||
};
|
||||
hideHelp = function() {
|
||||
return _this.help.removeClass('visible');
|
||||
};
|
||||
searchFocus = function() {
|
||||
_this.search = $(_this.options.searchSelector);
|
||||
return window.setTimeout((function() {
|
||||
return _this.search.focus();
|
||||
}), 10);
|
||||
};
|
||||
clickActive = function() {
|
||||
var link;
|
||||
link = _this.active.find(_this.options.linkSelector);
|
||||
if (link.trigger('click').attr('target') === '_blank') {
|
||||
return window.open(link.attr('href'), 'popped');
|
||||
} else {
|
||||
return window.location.href = link.attr('href');
|
||||
}
|
||||
};
|
||||
this.bindings.push(['/', 'Focus on filter.', searchFocus]);
|
||||
this.bindings.push(['shift+/', 'Toggle help dialog.', showHelp]);
|
||||
this.bindings.push(['esc', 'Close help dialog.', hideHelp]);
|
||||
return register_all_bindings();
|
||||
},
|
||||
readjust: function(buffer) {
|
||||
var top;
|
||||
if (this.elementOutOfViewport(this.active[0])) {
|
||||
top = this.active.offset().top - buffer;
|
||||
return $(window).scrollTop(top).trigger('scroll');
|
||||
}
|
||||
},
|
||||
elementOutOfViewport: function(el) {
|
||||
var rect;
|
||||
if (el) {
|
||||
rect = el.getBoundingClientRect();
|
||||
return !(rect.top >= 0 && rect.left >= 0 && rect.bottom <= window.innerHeight && rect.right <= window.innerWidth);
|
||||
}
|
||||
},
|
||||
findOrCreateHelp: function() {
|
||||
var help, helpSelector;
|
||||
helpSelector = "." + this.options.helpModalClass;
|
||||
if (!$(helpSelector).length) {
|
||||
$('body').append("<div class=" + this.options.helpModalClass + "></div>");
|
||||
help = $(helpSelector).append('<h3>Keyboard Shortcuts</h3><dl></dl>');
|
||||
}
|
||||
return $(helpSelector);
|
||||
}
|
||||
});
|
||||
|
||||
}).call(this);
|
||||
|
|
@ -1,296 +0,0 @@
|
|||
// keymaster.js
|
||||
// (c) 2011-2013 Thomas Fuchs
|
||||
// keymaster.js may be freely distributed under the MIT license.
|
||||
|
||||
;(function(global){
|
||||
var k,
|
||||
_handlers = {},
|
||||
_mods = { 16: false, 18: false, 17: false, 91: false },
|
||||
_scope = 'all',
|
||||
// modifier keys
|
||||
_MODIFIERS = {
|
||||
'⇧': 16, shift: 16,
|
||||
'⌥': 18, alt: 18, option: 18,
|
||||
'⌃': 17, ctrl: 17, control: 17,
|
||||
'⌘': 91, command: 91
|
||||
},
|
||||
// special keys
|
||||
_MAP = {
|
||||
backspace: 8, tab: 9, clear: 12,
|
||||
enter: 13, 'return': 13,
|
||||
esc: 27, escape: 27, space: 32,
|
||||
left: 37, up: 38,
|
||||
right: 39, down: 40,
|
||||
del: 46, 'delete': 46,
|
||||
home: 36, end: 35,
|
||||
pageup: 33, pagedown: 34,
|
||||
',': 188, '.': 190, '/': 191,
|
||||
'`': 192, '-': 189, '=': 187,
|
||||
';': 186, '\'': 222,
|
||||
'[': 219, ']': 221, '\\': 220
|
||||
},
|
||||
code = function(x){
|
||||
return _MAP[x] || x.toUpperCase().charCodeAt(0);
|
||||
},
|
||||
_downKeys = [];
|
||||
|
||||
for(k=1;k<20;k++) _MAP['f'+k] = 111+k;
|
||||
|
||||
// IE doesn't support Array#indexOf, so have a simple replacement
|
||||
function index(array, item){
|
||||
var i = array.length;
|
||||
while(i--) if(array[i]===item) return i;
|
||||
return -1;
|
||||
}
|
||||
|
||||
// for comparing mods before unassignment
|
||||
function compareArray(a1, a2) {
|
||||
if (a1.length != a2.length) return false;
|
||||
for (var i = 0; i < a1.length; i++) {
|
||||
if (a1[i] !== a2[i]) return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
var modifierMap = {
|
||||
16:'shiftKey',
|
||||
18:'altKey',
|
||||
17:'ctrlKey',
|
||||
91:'metaKey'
|
||||
};
|
||||
function updateModifierKey(event) {
|
||||
for(k in _mods) _mods[k] = event[modifierMap[k]];
|
||||
};
|
||||
|
||||
// handle keydown event
|
||||
function dispatch(event) {
|
||||
var key, handler, k, i, modifiersMatch, scope;
|
||||
key = event.keyCode;
|
||||
|
||||
if (index(_downKeys, key) == -1) {
|
||||
_downKeys.push(key);
|
||||
}
|
||||
|
||||
// if a modifier key, set the key.<modifierkeyname> property to true and return
|
||||
if(key == 93 || key == 224) key = 91; // right command on webkit, command on Gecko
|
||||
if(key in _mods) {
|
||||
_mods[key] = true;
|
||||
// 'assignKey' from inside this closure is exported to window.key
|
||||
for(k in _MODIFIERS) if(_MODIFIERS[k] == key) assignKey[k] = true;
|
||||
return;
|
||||
}
|
||||
updateModifierKey(event);
|
||||
|
||||
// see if we need to ignore the keypress (filter() can can be overridden)
|
||||
// by default ignore key presses if a select, textarea, or input is focused
|
||||
if(!assignKey.filter.call(this, event)) return;
|
||||
|
||||
// abort if no potentially matching shortcuts found
|
||||
if (!(key in _handlers)) return;
|
||||
|
||||
scope = getScope();
|
||||
|
||||
// for each potential shortcut
|
||||
for (i = 0; i < _handlers[key].length; i++) {
|
||||
handler = _handlers[key][i];
|
||||
|
||||
// see if it's in the current scope
|
||||
if(handler.scope == scope || handler.scope == 'all'){
|
||||
// check if modifiers match if any
|
||||
modifiersMatch = handler.mods.length > 0;
|
||||
for(k in _mods)
|
||||
if((!_mods[k] && index(handler.mods, +k) > -1) ||
|
||||
(_mods[k] && index(handler.mods, +k) == -1)) modifiersMatch = false;
|
||||
// call the handler and stop the event if neccessary
|
||||
if((handler.mods.length == 0 && !_mods[16] && !_mods[18] && !_mods[17] && !_mods[91]) || modifiersMatch){
|
||||
if(handler.method(event, handler)===false){
|
||||
if(event.preventDefault) event.preventDefault();
|
||||
else event.returnValue = false;
|
||||
if(event.stopPropagation) event.stopPropagation();
|
||||
if(event.cancelBubble) event.cancelBubble = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// unset modifier keys on keyup
|
||||
function clearModifier(event){
|
||||
var key = event.keyCode, k,
|
||||
i = index(_downKeys, key);
|
||||
|
||||
// remove key from _downKeys
|
||||
if (i >= 0) {
|
||||
_downKeys.splice(i, 1);
|
||||
}
|
||||
|
||||
if(key == 93 || key == 224) key = 91;
|
||||
if(key in _mods) {
|
||||
_mods[key] = false;
|
||||
for(k in _MODIFIERS) if(_MODIFIERS[k] == key) assignKey[k] = false;
|
||||
}
|
||||
};
|
||||
|
||||
function resetModifiers() {
|
||||
for(k in _mods) _mods[k] = false;
|
||||
for(k in _MODIFIERS) assignKey[k] = false;
|
||||
};
|
||||
|
||||
// parse and assign shortcut
|
||||
function assignKey(key, scope, method){
|
||||
var keys, mods;
|
||||
keys = getKeys(key);
|
||||
if (method === undefined) {
|
||||
method = scope;
|
||||
scope = 'all';
|
||||
}
|
||||
|
||||
// for each shortcut
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
// set modifier keys if any
|
||||
mods = [];
|
||||
key = keys[i].split('+');
|
||||
if (key.length > 1){
|
||||
mods = getMods(key);
|
||||
key = [key[key.length-1]];
|
||||
}
|
||||
// convert to keycode and...
|
||||
key = key[0]
|
||||
key = code(key);
|
||||
// ...store handler
|
||||
if (!(key in _handlers)) _handlers[key] = [];
|
||||
_handlers[key].push({ shortcut: keys[i], scope: scope, method: method, key: keys[i], mods: mods });
|
||||
}
|
||||
};
|
||||
|
||||
// unbind all handlers for given key in current scope
|
||||
function unbindKey(key, scope) {
|
||||
var multipleKeys, keys,
|
||||
mods = [],
|
||||
i, j, obj;
|
||||
|
||||
multipleKeys = getKeys(key);
|
||||
|
||||
for (j = 0; j < multipleKeys.length; j++) {
|
||||
keys = multipleKeys[j].split('+');
|
||||
|
||||
if (keys.length > 1) {
|
||||
mods = getMods(keys);
|
||||
}
|
||||
|
||||
key = keys[keys.length - 1];
|
||||
key = code(key);
|
||||
|
||||
if (scope === undefined) {
|
||||
scope = getScope();
|
||||
}
|
||||
if (!_handlers[key]) {
|
||||
return;
|
||||
}
|
||||
for (i = 0; i < _handlers[key].length; i++) {
|
||||
obj = _handlers[key][i];
|
||||
// only clear handlers if correct scope and mods match
|
||||
if (obj.scope === scope && compareArray(obj.mods, mods)) {
|
||||
_handlers[key][i] = {};
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Returns true if the key with code 'keyCode' is currently down
|
||||
// Converts strings into key codes.
|
||||
function isPressed(keyCode) {
|
||||
if (typeof(keyCode)=='string') {
|
||||
keyCode = code(keyCode);
|
||||
}
|
||||
return index(_downKeys, keyCode) != -1;
|
||||
}
|
||||
|
||||
function getPressedKeyCodes() {
|
||||
return _downKeys.slice(0);
|
||||
}
|
||||
|
||||
function filter(event){
|
||||
var tagName = (event.target || event.srcElement).tagName;
|
||||
// ignore keypressed in any elements that support keyboard data input
|
||||
return !(tagName == 'INPUT' || tagName == 'SELECT' || tagName == 'TEXTAREA');
|
||||
}
|
||||
|
||||
// initialize key.<modifier> to false
|
||||
for(k in _MODIFIERS) assignKey[k] = false;
|
||||
|
||||
// set current scope (default 'all')
|
||||
function setScope(scope){ _scope = scope || 'all' };
|
||||
function getScope(){ return _scope || 'all' };
|
||||
|
||||
// delete all handlers for a given scope
|
||||
function deleteScope(scope){
|
||||
var key, handlers, i;
|
||||
|
||||
for (key in _handlers) {
|
||||
handlers = _handlers[key];
|
||||
for (i = 0; i < handlers.length; ) {
|
||||
if (handlers[i].scope === scope) handlers.splice(i, 1);
|
||||
else i++;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// abstract key logic for assign and unassign
|
||||
function getKeys(key) {
|
||||
var keys;
|
||||
key = key.replace(/\s/g, '');
|
||||
keys = key.split(',');
|
||||
if ((keys[keys.length - 1]) == '') {
|
||||
keys[keys.length - 2] += ',';
|
||||
}
|
||||
return keys;
|
||||
}
|
||||
|
||||
// abstract mods logic for assign and unassign
|
||||
function getMods(key) {
|
||||
var mods = key.slice(0, key.length - 1);
|
||||
for (var mi = 0; mi < mods.length; mi++)
|
||||
mods[mi] = _MODIFIERS[mods[mi]];
|
||||
return mods;
|
||||
}
|
||||
|
||||
// cross-browser events
|
||||
function addEvent(object, event, method) {
|
||||
if (object.addEventListener)
|
||||
object.addEventListener(event, method, false);
|
||||
else if(object.attachEvent)
|
||||
object.attachEvent('on'+event, function(){ method(window.event) });
|
||||
};
|
||||
|
||||
// set the handlers globally on document
|
||||
addEvent(document, 'keydown', function(event) { dispatch(event) }); // Passing _scope to a callback to ensure it remains the same by execution. Fixes #48
|
||||
addEvent(document, 'keyup', clearModifier);
|
||||
|
||||
// reset modifiers to false whenever the window is (re)focused.
|
||||
addEvent(window, 'focus', resetModifiers);
|
||||
|
||||
// store previously defined key
|
||||
var previousKey = global.key;
|
||||
|
||||
// restore previously defined key and return reference to our key object
|
||||
function noConflict() {
|
||||
var k = global.key;
|
||||
global.key = previousKey;
|
||||
return k;
|
||||
}
|
||||
|
||||
// set window.key and window.key.set/get/deleteScope, and the default filter
|
||||
global.key = assignKey;
|
||||
global.key.setScope = setScope;
|
||||
global.key.getScope = getScope;
|
||||
global.key.deleteScope = deleteScope;
|
||||
global.key.filter = filter;
|
||||
global.key.isPressed = isPressed;
|
||||
global.key.getPressedKeyCodes = getPressedKeyCodes;
|
||||
global.key.noConflict = noConflict;
|
||||
global.key.unbind = unbindKey;
|
||||
|
||||
if(typeof module !== 'undefined') module.exports = assignKey;
|
||||
|
||||
})(this);
|
||||
|
|
@ -744,57 +744,3 @@ div.interval-slider input {
|
|||
max-width: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
.jquery-chaves-help {
|
||||
width: 250px;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 20%;
|
||||
padding: 15px 0px;
|
||||
margin-left: -110px;
|
||||
margin-top: -200px;
|
||||
background: white;
|
||||
display: none;
|
||||
border: 3px solid #efefef;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 18px rgba(0,0,0,0.4);
|
||||
z-index: 9000;
|
||||
font-family: Helvetica,arial,freesans,clean,sans-serif;
|
||||
}
|
||||
|
||||
.jquery-chaves-help h3 {
|
||||
border-bottom: 1px solid #DDD;
|
||||
margin: 0 0 20px;
|
||||
padding: 5px 20px 10px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.jquery-chaves-help dl {
|
||||
padding: 0 20px;
|
||||
margin: 0;
|
||||
}
|
||||
.jquery-chaves-help dt {
|
||||
display: inline-block;
|
||||
font-size: 11px;
|
||||
margin: 0 0 15px 0;
|
||||
padding: 3px 6px;
|
||||
min-width: 10px;
|
||||
text-align: center;
|
||||
font-family: Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;
|
||||
background: #333;
|
||||
color: #EEE;
|
||||
border-radius: 2px;
|
||||
text-shadow: 1px 1px 0 black;
|
||||
}
|
||||
.jquery-chaves-help dd {
|
||||
display: inline;
|
||||
margin: 0 0 0 10px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.jquery-chaves-help dd:after {
|
||||
content: '\A';
|
||||
white-space: pre;
|
||||
}
|
||||
.jquery-chaves-help.visible {
|
||||
display: block;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -23,11 +23,11 @@
|
|||
<% Sidekiq::Web.default_tabs.each do |title, url| %>
|
||||
<% if url == '' %>
|
||||
<li class="<%= current_path == url ? 'active' : '' %>">
|
||||
<a href="<%= root_path %><%= url %>" accesskey="<%= Sidekiq::Web::SHORTCUTS[title] %>"><%= t(title) %></a>
|
||||
<a href="<%= root_path %><%= url %>"><%= t(title) %></a>
|
||||
</li>
|
||||
<% else %>
|
||||
<li class="<%= current_path.start_with?(url) ? 'active' : '' %>">
|
||||
<a href="<%= root_path %><%= url %>" accesskey="<%= Sidekiq::Web::SHORTCUTS[title] %>"><%= t(title) %></a>
|
||||
<a href="<%= root_path %><%= url %>"><%= t(title) %></a>
|
||||
</li>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
|
@ -39,7 +39,7 @@
|
|||
<ul class="dropdown-menu" role="menu">
|
||||
<% Sidekiq::Web.custom_tabs.each do |title, url| %>
|
||||
<li>
|
||||
<a href="<%= root_path %><%= url %>" accesskey="<%= Sidekiq::Web::SHORTCUTS[title] %>"><%= t(title) %></a>
|
||||
<a href="<%= root_path %><%= url %>"><%= t(title) %></a>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
|
@ -47,7 +47,7 @@
|
|||
|
||||
<% Sidekiq::Web.custom_tabs.each do |title, url| %>
|
||||
<li class="<%= current_path.start_with?(url) ? 'active' : '' %>" data-navbar="custom-tab">
|
||||
<a href="<%= root_path %><%= url %>" accesskey="<%= Sidekiq::Web::SHORTCUTS[title] %>"><%= t(title) %></a>
|
||||
<a href="<%= root_path %><%= url %>"><%= t(title) %></a>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -7,8 +7,6 @@
|
|||
<link href="<%= root_path %>stylesheets/application.css" media="screen" rel="stylesheet" type="text/css" />
|
||||
<script type="text/javascript" src="<%= root_path %>javascripts/application.js"></script>
|
||||
<script type="text/javascript" src="<%= root_path %>javascripts/locales/jquery.timeago.<%= locale %>.js"></script>
|
||||
<script type="text/javascript" src="<%= root_path %>javascripts/keymaster.js"></script>
|
||||
<script type="text/javascript" src="<%= root_path %>javascripts/jquery.chaves.js"></script>
|
||||
<meta name="google" content="notranslate" />
|
||||
<%= display_custom_head %>
|
||||
</head>
|
||||
|
|
@ -29,17 +27,5 @@
|
|||
</div>
|
||||
<%= erb :_footer %>
|
||||
<%= erb :_poll_js %>
|
||||
<script>
|
||||
$('body').chaves({
|
||||
bindings: [
|
||||
<% (Sidekiq::Web::DEFAULT_TABS.merge Sidekiq::Web.tabs).each_pair do |title, url|
|
||||
chr = Sidekiq::Web::SHORTCUTS[title]
|
||||
if chr %>
|
||||
['<%= chr %>', '<%= t(title) %>', function() { window.location.href = '<%= root_path %><%= url %>' }],
|
||||
<% end %>
|
||||
<% end %>
|
||||
]
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue