Commit 3b07fd36 by Tom Giannattasio

added keyboard nav to dropdown; doesn't work yet when filtered

parent 9da7a337
......@@ -59,9 +59,11 @@ class @DiscussionThreadListView extends Backbone.View
if @$(".browse").hasClass('is-dropped')
@$(".browse-topic-drop-menu-wrapper").show()
$('body').bind 'click', @toggleTopicDrop
$('body').bind 'keyup', @setActiveItem
else
@$(".browse-topic-drop-menu-wrapper").hide()
$('body').unbind 'click', @toggleTopicDrop
$('body').unbind 'keyup', @setActiveItem
setTopic: (event) ->
item = $(event.target).closest('a')
......@@ -115,3 +117,35 @@ class @DiscussionThreadListView extends Backbone.View
if textStatus == 'success'
@collection.reset(response.discussion_data)
@displayedCollection.reset(@collection.models)
setActiveItem: (event) ->
if event.which == 13
console.log($(".browse-topic-drop-menu-wrapper .focused"))
$(".browse-topic-drop-menu-wrapper .focused").click()
return
if event.which != 40 && event.which != 38
return
event.preventDefault()
items = $(".browse-topic-drop-menu-wrapper a").not(".hidden")
totalItems = items.length
index = $(".browse-topic-drop-menu-wrapper .focused").parent().index()
# index = parseInt($(".browse-topic-drop-menu-wrapper").attr("data-focused")) || 0
if event.which == 40
index = index + 1
else if event.which == 38
index = index - 1
if index == totalItems
index = 0
console.log(index)
$(".browse-topic-drop-menu-wrapper .focused").removeClass("focused")
$(".browse-topic-drop-menu-wrapper li").eq(index).find('a').addClass("focused")
# $(items[index]).addClass("focused")
$(".browse-topic-drop-menu-wrapper").attr("data-focused", index)
......@@ -132,7 +132,7 @@ function filterDrop(e) {
return;
}
$items.hide();
$items.addClass('hidden');
$items.each(function(i) {
var thisText = $(this).children().not('.unread').text();
$(this).parents('ul').siblings('a').not('.unread').each(function(i) {
......@@ -147,7 +147,7 @@ function filterDrop(e) {
}
if(test) {
$(this).show();
$(this).removeClass('hidden');
// show children
$(this).parent().find('a').show();
......@@ -225,6 +225,7 @@ function showTopicDrop(e) {
$topicDrop.show();
$browse.unbind('click', showTopicDrop);
$body.bind('keyup', setActiveDropItem);
$browse.bind('click', hideTopicDrop);
setTimeout(function() {
$body.bind('click', hideTopicDrop);
......
......@@ -732,8 +732,14 @@ body.discussion {
line-height: 22px;
color: #fff;
@include clearfix;
@include transition(none);
&:hover {
&.hidden {
display: none;
}
&:hover,
&.focused {
background-color: #636363;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment