post-hover.js

Created Diff never expires
22 removals
Lines
Total
Removed
Words
Total
Removed
To continue using this feature, upgrade to
Diffchecker logo
Diffchecker Pro
171 lines
12 additions
Lines
Total
Added
Words
Total
Added
To continue using this feature, upgrade to
Diffchecker logo
Diffchecker Pro
166 lines
/*
/*
* post-hover.js
* post-hover.js
* https://github.com/savetheinternet/Tinyboard/blob/master/js/post-hover.js
* https://github.com/savetheinternet/Tinyboard/blob/master/js/post-hover.js
*
*
* Released under the MIT license
* Released under the MIT license
* Copyright (c) 2012 Michael Save <savetheinternet@tinyboard.org>
* Copyright (c) 2012 Michael Save <savetheinternet@tinyboard.org>
* Copyright (c) 2013-2014 Marcin Łabanowski <marcin@6irc.net>
* Copyright (c) 2013-2014 Marcin Łabanowski <marcin@6irc.net>
* Copyright (c) 2013 Macil Tech <maciltech@gmail.com>
* Copyright (c) 2013 Macil Tech <maciltech@gmail.com>
*
*
* Usage:
* Usage:
* $config['additional_javascript'][] = 'js/jquery.min.js';
* $config['additional_javascript'][] = 'js/jquery.min.js';
* $config['additional_javascript'][] = 'js/post-hover.js';
* $config['additional_javascript'][] = 'js/post-hover.js';
*
*
*/
*/


onready(function(){
onready(function(){
var dont_fetch_again = [];
var dont_fetch_again = [];
init_hover = function() {
init_hover = function() {
var $link = $(this);
var $link = $(this);
var id;
var id;
var matches;
var matches;


if ($link.is('[data-thread]')) {
if ($link.is('[data-thread]')) {
id = $link.attr('data-thread');
id = $link.attr('data-thread');
}
}
else if(matches = $link.text().match(/^>>(?:>\/([^\/]+)\/)?(\d+)$/)) {
else if(matches = $link.text().match(/^>>(?:>\/([^\/]+)\/)?(\d+)$/)) {
id = matches[2];
id = matches[2];
}
}
else {
else {
return;
return;
}
}
var board = $(this);
var board = $(this);
while (board.data('board') === undefined) {
while (board.data('board') === undefined) {
board = board.parent();
board = board.parent();
}
}
var threadid;
var threadid;
if ($link.is('[data-thread]')) threadid = 0;
if ($link.is('[data-thread]')) threadid = 0;
else threadid = board.attr('id').replace("thread_", "");
else threadid = board.attr('id').replace("thread_", "");


board = board.data('board');
board = board.data('board');


var parentboard = board;
var parentboard = board;
if ($link.is('[data-thread]')) parentboard = $('form[name="post"] input[name="board"]').val();
if ($link.is('[data-thread]')) parentboard = $('form[name="post"] input[name="board"]').val();
else if (matches[1] !== undefined) board = matches[1];
else if (matches[1] !== undefined) board = matches[1];


var $post = false;
var $post = false;
var hovering = false;
var hovering = false;
var hovered_at;
var hovered_at;
$link.hover(function(e) {
$link.hover(function(e) {
hovering = true;
hovering = true;
hovered_at = {'x': e.pageX, 'y': e.pageY};
hovered_at = {'x': e.clientX, 'y': e.clientY};
var start_hover = function($link) {
var start_hover = function($link) {
if ($post.is(':visible') &&
if ($post.is(':visible') &&
$post.offset().top >= $(window).scrollTop() &&
$post.offset().top >= $(window).scrollTop() &&
$post.offset().top + $post.height() <= $(window).scrollTop() + $(window).height()) {
$post.offset().top + $post.height() <= $(window).scrollTop() + $(window).height()) {
// post is in view
// post is in view
$post.addClass('highlighted');
$post.addClass('highlighted');
} else {
} else {
var $newPost = $post.clone();
var $newPost = $post.clone();
$newPost.find('>.reply, >br').remove();
$newPost.find('>.reply, >br').remove();
$newPost.find('span.mentioned').remove();
$newPost.find('span.mentioned').remove();
$newPost.find('a.post_anchor').remove();
$newPost.find('a.post_anchor').remove();


$newPost
$newPost
.attr('id', 'post-hover-' + id)
.attr('id', 'post-hover-' + id)
.attr('data-board', board)
.attr('data-board', board)
.addClass('post-hover')
.addClass('post-hover')
.css('border-style', 'solid')
.css('border-style', 'solid')
.css('box-shadow', '1px 1px 1px #999')
.css('box-shadow', '1px 1px 1px #999')
.css('display', 'block')
.css('display', 'block')
.css('position', 'absolute')
.css('position', 'fixed')
.css('font-style', 'normal')
.css('font-style', 'normal')
.css('z-index', '100')
.css('z-index', '100')
.addClass('reply').addClass('post')
.addClass('reply').addClass('post')
.insertAfter($link.parent())
.insertAfter($link.parent())


$link.trigger('mousemove');
$link.trigger('mousemove');
}
}
};
};
$post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id);
$post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id);
if($post.length > 0) {
if($post.length > 0) {
start_hover($(this));
start_hover($(this));
} else {
} else {
var url = $link.attr('href').replace(/#.*$/, '');
var url = $link.attr('href').replace(/#.*$/, '');
if($.inArray(url, dont_fetch_again) != -1) {
if($.inArray(url, dont_fetch_again) != -1) {
return;
return;
}
}
dont_fetch_again.push(url);
dont_fetch_again.push(url);
$.ajax({
$.ajax({
url: url,
url: url,
context: document.body,
context: document.body,
success: function(data) {
success: function(data) {
var mythreadid = $(data).find('div[id^="thread_"]').attr('id').replace("thread_", "");
var mythreadid = $(data).find('div[id^="thread_"]').attr('id').replace("thread_", "");


if (mythreadid == threadid && parentboard == board) {
if (mythreadid == threadid && parentboard == board) {
$(data).find('div.post.reply').each(function() {
$(data).find('div.post.reply').each(function() {
if($('[data-board="' + board + '"] #' + $(this).attr('id')).length == 0) {
if($('[data-board="' + board + '"] #' + $(this).attr('id')).length == 0) {
$('[data-board="' + board + '"]#thread_' + threadid + " .post.reply:first").before($(this).hide().addClass('hidden'));
$('[data-board="' + board + '"]#thread_' + threadid + " .post.reply:first").before($(this).hide().addClass('hidden'));
}
}
});
});
}
}
else if ($('[data-board="' + board + '"]#thread_'+mythreadid).length > 0) {
else if ($('[data-board="' + board + '"]#thread_'+mythreadid).length > 0) {
$(data).find('div.post.reply').each(function() {
$(data).find('div.post.reply').each(function() {
if($('[data-board="' + board + '"] #' + $(this).attr('id')).length == 0) {
if($('[data-board="' + board + '"] #' + $(this).attr('id')).length == 0) {
$('[data-board="' + board + '"]#thread_' + mythreadid + " .post.reply:first").before($(this).hide().addClass('hidden'));
$('[data-board="' + board + '"]#thread_' + mythreadid + " .post.reply:first").before($(this).hide().addClass('hidden'));
}
}
});
});
}
}
else {
else {
$(data).find('div[id^="thread_"]').hide().attr('data-cached', 'yes').prependTo('form[name="postcontrols"]');
$(data).find('div[id^="thread_"]').hide().attr('data-cached', 'yes').prependTo('form[name="postcontrols"]');
}
}


$post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id);
$post = $('[data-board="' + board + '"] div.post#reply_' + id + ', [data-board="' + board + '"]div#thread_' + id);


if(hovering && $post.length > 0) {
if(hovering && $post.length > 0) {
start_hover($link);
start_hover($link);
}
}
}
}
});
});
}
}
}, function() {
}, function() {
hovering = false;
hovering = false;
if(!$post)
if(!$post)
return;
return;
$post.removeClass('highlighted');
$post.removeClass('highlighted');
if($post.hasClass('hidden') || $post.data('cached') == 'yes')
if($post.hasClass('hidden') || $post.data('cached') == 'yes')
$post.css('display', 'none');
$post.css('display', 'none');
$('.post-hover').remove();
$('.post-hover').remove();
}).mousemove(function(e) {
}).mousemove(function(e) {
if(!$post)
if(!$post)
return;
return;
var $hover = $('#post-hover-' + id + '[data-board="' + board + '"]');
var $hover = $('#post-hover-' + id + '[data-board="' + board + '"]');
if($hover.length == 0)
if($hover.length == 0)
return;
return;


var scrollTop = $(window).scrollTop();
var ecy = e.clientY;
if ($link.is("[data-thread]")) scrollTop = 0;
var top = (ecy ? ecy : hovered_at['y']) - 10;
var epy = e.pageY;
if ($link.is("[data-thread]")) epy -= $(window).scrollTop();

var top = (epy ? epy : hovered_at['y']) - 10;
if(epy < scrollTop + 15) {
if(ecy < 15) {
top = scrollTop;
top = 0;
} else if(epy > scrollTop + $(window).height() - $hover.height() - 15) {
} else if(ecy > $(window).height() - $hover.height() - 15) {
top = scrollTop + $(window).height() - $hover.height() - 15;
top = $(window).height() - $hover.height() - 15;
}
}
$hover.css('left', (e.clientX ? e.clientX : hovered_at['x'])).css('top', top);
$hover.css('left', (e.pageX ? e.pageX : hovered_at['x'])).css('top', top);
});
});
};
};
$('div.body a:not([rel="nofollow"])').each(init_hover);
$('div.body a:not([rel="nofollow"])').each(init_hover);
// allow to work with auto-reload.js, etc.
// allow to work with auto-reload.js, etc.
$(document).on('new_post', function(e, post) {
$(document).on('new_post', function(e, post) {
$(post).find('div.body a:not([rel="nofollow"])').each(init_hover);
$(post).find('div.body a:not([rel="nofollow"])').each(init_hover);
});
});
});
});