Removed a lot of dead code and moved tooltips into their own file.
This commit is contained in:
@@ -120,9 +120,6 @@ if Backbone?
|
||||
anonymous_to_peers = false || @$("input.discussion-anonymous-to-peers").is(":checked")
|
||||
follow = false || @$("input.discussion-follow").is(":checked")
|
||||
|
||||
$formTopicDropBtn.bind('click', showFormTopicDrop)
|
||||
$formTopicDropMenu.bind('click', setFormTopic)
|
||||
|
||||
url = DiscussionUtil.urlFor('create_thread', @topicId)
|
||||
|
||||
DiscussionUtil.safeAjax
|
||||
|
||||
@@ -2,30 +2,16 @@ var $body;
|
||||
var $browse;
|
||||
var $search;
|
||||
var $searchField;
|
||||
var $topicDrop;
|
||||
var $currentBoard;
|
||||
var $tooltip;
|
||||
|
||||
var $newPost;
|
||||
var $thread;
|
||||
var $sidebar;
|
||||
var $sidebarWidthStyles;
|
||||
var $formTopicDropBtn;
|
||||
var $formTopicDropMenu;
|
||||
var $postListWrapper;
|
||||
var $dropFilter;
|
||||
var $topicFilter;
|
||||
var $discussionBody;
|
||||
var sidebarWidth;
|
||||
var sidebarHeight;
|
||||
var sidebarHeaderHeight;
|
||||
var sidebarXOffset;
|
||||
var scrollTop;
|
||||
var discussionsBodyTop;
|
||||
var discussionsBodyBottom;
|
||||
var tooltipTimer;
|
||||
var tooltipCoords;
|
||||
var SIDEBAR_PADDING = 10;
|
||||
var SIDEBAR_HEADER_HEIGHT = 87;
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -35,13 +21,11 @@ $(document).ready(function() {
|
||||
$searchField = $('.post-search-field');
|
||||
//$topicDrop = $('.browse-topic-drop-menu-wrapper');
|
||||
$currentBoard = $('.current-board');
|
||||
$tooltip = $('<div class="tooltip"></div>');
|
||||
|
||||
$newPost = $('.new-post-article');
|
||||
$sidebar = $('.sidebar');
|
||||
$discussionBody = $('.discussion-body');
|
||||
$postListWrapper = $('.post-list-wrapper');
|
||||
$formTopicDropBtn = $('.new-post-article .form-topic-drop-btn');
|
||||
$formTopicDropMenu = $('.new-post-article .form-topic-drop-menu-wrapper');
|
||||
// $dropFilter = $('.browse-topic-drop-search-input');
|
||||
// $topicFilter = $('.topic-drop-search-input');
|
||||
$sidebarWidthStyles = $('<style></style>');
|
||||
@@ -53,15 +37,8 @@ $(document).ready(function() {
|
||||
//$browse.bind('click', showTopicDrop);
|
||||
//$search.bind('click', showSearch);
|
||||
// $topicDrop.bind('click', setTopic);
|
||||
$formTopicDropBtn.bind('click', showFormTopicDrop);
|
||||
$formTopicDropMenu.bind('click', setFormTopic);
|
||||
|
||||
$body.delegate('[data-tooltip]', {
|
||||
'mouseover': showTooltip,
|
||||
'mousemove': moveTooltip,
|
||||
'mouseout': hideTooltip,
|
||||
'click': hideTooltip
|
||||
});
|
||||
// $formTopicDropBtn.bind('click', showFormTopicDrop);
|
||||
// $formTopicDropMenu.bind('click', setFormTopic);
|
||||
|
||||
$body.delegate('.browse-topic-drop-search-input, .form-topic-drop-search-input', 'keyup', filterDrop);
|
||||
});
|
||||
@@ -112,7 +89,6 @@ function filterDrop(e) {
|
||||
/*
|
||||
* single query
|
||||
*/
|
||||
|
||||
var $drop = $(e.target).parents('.topic_menu_wrapper, .browse-topic-drop-menu-wrapper');
|
||||
var query = $(this).val();
|
||||
var $items = $drop.find('a');
|
||||
@@ -147,193 +123,3 @@ function filterDrop(e) {
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function showTooltip(e) {
|
||||
var tooltipText = $(this).attr('data-tooltip');
|
||||
$tooltip.html(tooltipText);
|
||||
$body.append($tooltip);
|
||||
$(this).children().css('pointer-events', 'none');
|
||||
|
||||
tooltipCoords = {
|
||||
x: e.pageX - ($tooltip.outerWidth() / 2),
|
||||
y: e.pageY - ($tooltip.outerHeight() + 15)
|
||||
};
|
||||
|
||||
$tooltip.css({
|
||||
'left': tooltipCoords.x,
|
||||
'top': tooltipCoords.y
|
||||
});
|
||||
|
||||
tooltipTimer = setTimeout(function() {
|
||||
$tooltip.show().css('opacity', 1);
|
||||
|
||||
tooltipTimer = setTimeout(function() {
|
||||
hideTooltip();
|
||||
}, 3000);
|
||||
}, 500);
|
||||
}
|
||||
|
||||
function moveTooltip(e) {
|
||||
tooltipCoords = {
|
||||
x: e.pageX - ($tooltip.outerWidth() / 2),
|
||||
y: e.pageY - ($tooltip.outerHeight() + 15)
|
||||
};
|
||||
|
||||
$tooltip.css({
|
||||
'left': tooltipCoords.x,
|
||||
'top': tooltipCoords.y
|
||||
});
|
||||
}
|
||||
|
||||
function hideTooltip(e) {
|
||||
$tooltip.hide().css('opacity', 0);
|
||||
clearTimeout(tooltipTimer);
|
||||
}
|
||||
|
||||
function showBrowse(e) {
|
||||
$browse.addClass('is-open');
|
||||
$search.removeClass('is-open');
|
||||
$searchField.val('');
|
||||
}
|
||||
|
||||
function showSearch(e) {
|
||||
$search.addClass('is-open');
|
||||
$browse.removeClass('is-open');
|
||||
setTimeout(function() {
|
||||
$searchField.focus();
|
||||
}, 200);
|
||||
}
|
||||
|
||||
function showTopicDrop(e) {
|
||||
e.preventDefault();
|
||||
|
||||
$browse.addClass('is-dropped');
|
||||
|
||||
if(!$topicDrop[0]) {
|
||||
$topicDrop = $('.browse-topic-drop-menu-wrapper');
|
||||
}
|
||||
|
||||
$topicDrop.show();
|
||||
$browse.unbind('click', showTopicDrop);
|
||||
$body.bind('keyup', setActiveDropItem);
|
||||
$browse.bind('click', hideTopicDrop);
|
||||
setTimeout(function() {
|
||||
$body.bind('click', hideTopicDrop);
|
||||
}, 0);
|
||||
}
|
||||
|
||||
function hideTopicDrop(e) {
|
||||
if(e.target == $('.browse-topic-drop-search-input')[0]) {
|
||||
return;
|
||||
}
|
||||
|
||||
$browse.removeClass('is-dropped');
|
||||
$topicDrop.hide();
|
||||
$body.unbind('click', hideTopicDrop);
|
||||
$browse.bind('click', showTopicDrop);
|
||||
}
|
||||
|
||||
function setTopic(e) {
|
||||
if(e.target == $('.browse-topic-drop-search-input')[0]) {
|
||||
return;
|
||||
}
|
||||
|
||||
var $item = $(e.target).closest('a');
|
||||
var boardName = $item.find('.board-name').html();
|
||||
|
||||
$item.parents('ul').not('.browse-topic-drop-menu').each(function(i) {
|
||||
boardName = $(this).siblings('a').find('.board-name').html() + ' / ' + boardName;
|
||||
});
|
||||
|
||||
if(!$currentBoard[0]) {
|
||||
$currentBoard = $('.current-board');
|
||||
}
|
||||
$currentBoard.html(boardName);
|
||||
|
||||
var fontSize = 16;
|
||||
$currentBoard.css('font-size', '16px');
|
||||
|
||||
while($currentBoard.width() > (sidebarWidth * .8) - 40) {
|
||||
fontSize--;
|
||||
if(fontSize < 11) {
|
||||
break;
|
||||
}
|
||||
$currentBoard.css('font-size', fontSize + 'px');
|
||||
}
|
||||
|
||||
showBrowse();
|
||||
}
|
||||
|
||||
function showFormTopicDrop(e) {
|
||||
$formTopicDropBtn.addClass('is-dropped');
|
||||
$formTopicDropMenu.show();
|
||||
$formTopicDropBtn.unbind('click', showFormTopicDrop);
|
||||
$formTopicDropBtn.bind('click', hideFormTopicDrop);
|
||||
|
||||
setTimeout(function() {
|
||||
$body.bind('click', hideFormTopicDrop);
|
||||
}, 0);
|
||||
|
||||
}
|
||||
|
||||
function hideFormTopicDrop(e) {
|
||||
if(e.target == $('.topic-drop-search-input')[0]) {
|
||||
return;
|
||||
}
|
||||
|
||||
$formTopicDropBtn.removeClass('is-dropped');
|
||||
$formTopicDropMenu.hide();
|
||||
$body.unbind('click', hideFormTopicDrop);
|
||||
$formTopicDropBtn.unbind('click', hideFormTopicDrop);
|
||||
$formTopicDropBtn.bind('click', showFormTopicDrop);
|
||||
}
|
||||
|
||||
function setFormTopic(e) {
|
||||
if(e.target == $('.topic-drop-search-input')[0]) {
|
||||
return;
|
||||
}
|
||||
$formTopicDropBtn.removeClass('is-dropped');
|
||||
hideFormTopicDrop(e);
|
||||
|
||||
var $item = $(e.target);
|
||||
var boardName = $item.html();
|
||||
$item.parents('ul').not('.form-topic-drop-menu').each(function(i) {
|
||||
boardName = $(this).siblings('a').html() + ' / ' + boardName;
|
||||
});
|
||||
$formTopicDropBtn.html(boardName + ' <span class="drop-arrow">▾</span>');
|
||||
}
|
||||
|
||||
function updateSidebar(e) {
|
||||
// determine page scroll attributes
|
||||
scrollTop = $(window).scrollTop();
|
||||
discussionsBodyTop = $discussionBody.offset().top;
|
||||
discussionsBodyBottom = discussionsBodyTop + $discussionBody.height();
|
||||
var windowHeight = $(window).height();
|
||||
|
||||
// toggle fixed positioning
|
||||
if(scrollTop > discussionsBodyTop - SIDEBAR_PADDING) {
|
||||
$sidebar.addClass('fixed');
|
||||
$sidebar.css('top', SIDEBAR_PADDING + 'px');
|
||||
} else {
|
||||
$sidebar.removeClass('fixed');
|
||||
$sidebar.css('top', '0');
|
||||
}
|
||||
|
||||
// set sidebar width
|
||||
var sidebarWidth = .32 * $discussionBody.width() - 10;
|
||||
$sidebar.css('width', sidebarWidth + 'px');
|
||||
|
||||
// show the entire sidebar at all times
|
||||
var sidebarHeight = windowHeight - (scrollTop < discussionsBodyTop - SIDEBAR_PADDING ? discussionsBodyTop - scrollTop : SIDEBAR_PADDING) - SIDEBAR_PADDING - (scrollTop + windowHeight > discussionsBodyBottom + SIDEBAR_PADDING ? scrollTop + windowHeight - discussionsBodyBottom - SIDEBAR_PADDING : 0);
|
||||
$sidebar.css('height', sidebarHeight > 400 ? sidebarHeight : 400 + 'px');
|
||||
|
||||
// update the list height
|
||||
if(!$postListWrapper[0]) {
|
||||
$postListWrapper = $('.post-list-wrapper');
|
||||
}
|
||||
$postListWrapper.css('height', (sidebarHeight - SIDEBAR_HEADER_HEIGHT - 4) + 'px');
|
||||
|
||||
// update title wrappers
|
||||
var titleWidth = sidebarWidth - 115;
|
||||
$sidebarWidthStyles.html('.discussion-body .post-list a .title { width: ' + titleWidth + 'px !important; }');
|
||||
}
|
||||
|
||||
56
lms/static/js/tooltips.js
Normal file
56
lms/static/js/tooltips.js
Normal file
@@ -0,0 +1,56 @@
|
||||
var $body;
|
||||
var $tooltip;
|
||||
var tooltipTimer;
|
||||
var tooltipCoords;
|
||||
$(document).ready(function() {
|
||||
$body = $('body');
|
||||
$tooltip = $('<div class="tooltip"></div>');
|
||||
$body.delegate('[data-tooltip]', {
|
||||
'mouseover': showTooltip,
|
||||
'mousemove': moveTooltip,
|
||||
'mouseout': hideTooltip,
|
||||
'click': hideTooltip
|
||||
});
|
||||
});
|
||||
|
||||
function showTooltip(e) {
|
||||
var tooltipText = $(this).attr('data-tooltip');
|
||||
$tooltip.html(tooltipText);
|
||||
$body.append($tooltip);
|
||||
$(this).children().css('pointer-events', 'none');
|
||||
|
||||
tooltipCoords = {
|
||||
x: e.pageX - ($tooltip.outerWidth() / 2),
|
||||
y: e.pageY - ($tooltip.outerHeight() + 15)
|
||||
};
|
||||
|
||||
$tooltip.css({
|
||||
'left': tooltipCoords.x,
|
||||
'top': tooltipCoords.y
|
||||
});
|
||||
|
||||
tooltipTimer = setTimeout(function() {
|
||||
$tooltip.show().css('opacity', 1);
|
||||
|
||||
tooltipTimer = setTimeout(function() {
|
||||
hideTooltip();
|
||||
}, 3000);
|
||||
}, 500);
|
||||
}
|
||||
|
||||
function moveTooltip(e) {
|
||||
tooltipCoords = {
|
||||
x: e.pageX - ($tooltip.outerWidth() / 2),
|
||||
y: e.pageY - ($tooltip.outerHeight() + 15)
|
||||
};
|
||||
|
||||
$tooltip.css({
|
||||
'left': tooltipCoords.x,
|
||||
'top': tooltipCoords.y
|
||||
});
|
||||
}
|
||||
|
||||
function hideTooltip(e) {
|
||||
$tooltip.hide().css('opacity', 0);
|
||||
clearTimeout(tooltipTimer);
|
||||
}
|
||||
@@ -12,6 +12,7 @@
|
||||
<script type="text/javascript" src="${static.url('js/URI.min.js')}"></script>
|
||||
<script type="text/javascript" src="${static.url('js/vendor/underscore-min.js')}"></script>
|
||||
<script type="text/javascript" src="${static.url('js/vendor/backbone-min.js')}"></script>
|
||||
<script type="text/javascript" src="${static.url('js/tooltips.js')}"></script>
|
||||
|
||||
<link href="${static.url('css/vendor/jquery.tagsinput.css')}" rel="stylesheet" type="text/css">
|
||||
<link href="${static.url('css/vendor/jquery.autocomplete.css')}" rel="stylesheet" type="text/css">
|
||||
|
||||
Reference in New Issue
Block a user