mirror of
https://bitbucket.org/skobkin/chrome_point_plus.git
synced 2024-11-23 18:56:04 +00:00
- Comments tree view mode support
- WebSocket code refactoring - More useful logs - Some fixes
This commit is contained in:
Alexey Skobkin
parent
9f55bff748
commit
0d5e0449a3
|
|
@ -4,12 +4,15 @@ $(document).ready(function() {
|
||||||
|
|
||||||
// Loading options
|
// Loading options
|
||||||
chrome.storage.sync.get(ppOptions, function(options) {
|
chrome.storage.sync.get(ppOptions, function(options) {
|
||||||
|
// Options debug
|
||||||
|
console.debug('Options loaded: %O', options);
|
||||||
|
|
||||||
// Fancybox
|
// Fancybox
|
||||||
if (options.option_fancybox == true) {
|
if (options.option_fancybox == true) {
|
||||||
// Images
|
// Images
|
||||||
if (options.option_fancybox_images == true) {
|
if (options.option_fancybox_images == true) {
|
||||||
// Linking images in posts to the galleries
|
// Linking images in posts to the galleries
|
||||||
$('.post-content .text').each(function(idxPost){
|
$('.post-content .text').each(function(idxPost) {
|
||||||
$(this).find('a.postimg:not(.youtube)').attr('rel', 'post' + idxPost);
|
$(this).find('a.postimg:not(.youtube)').attr('rel', 'post' + idxPost);
|
||||||
});
|
});
|
||||||
// Init fancybox
|
// Init fancybox
|
||||||
|
|
@ -67,7 +70,7 @@ $(document).ready(function() {
|
||||||
// Image resizing
|
// Image resizing
|
||||||
if (options.option_images_load_original == true) {
|
if (options.option_images_load_original == true) {
|
||||||
// Setting new image source
|
// Setting new image source
|
||||||
$('.postimg:not(.youtube) img').each(function(){
|
$('.postimg:not(.youtube) img').each(function() {
|
||||||
console.log($(this).parent('.postimg').attr('href'));
|
console.log($(this).parent('.postimg').attr('href'));
|
||||||
$(this).attr('src', $(this).parent('.postimg').attr('href'));
|
$(this).attr('src', $(this).parent('.postimg').attr('href'));
|
||||||
});
|
});
|
||||||
|
|
@ -108,46 +111,73 @@ $(document).ready(function() {
|
||||||
}
|
}
|
||||||
// WebSocket
|
// WebSocket
|
||||||
if (options.option_ws == true) {
|
if (options.option_ws == true) {
|
||||||
// Comments
|
// SSL or plain
|
||||||
if (options.option_ws_comments == true) {
|
ws = new WebSocket(((location.protocol == 'https:') ? 'wss' : 'ws') + '://point.im/ws');
|
||||||
// If we are in the post page
|
console.log('WebSocket created: %O', ws);
|
||||||
if ($('#top-post').length > 0) {
|
|
||||||
|
|
||||||
// Comments view mode
|
// Detecting post id if presented
|
||||||
treeSwitch = $('#tree-switch a.active').attr('href');
|
var postId = $('#top-post').attr('data-id');
|
||||||
|
console.debug('Current post id detected as #%s', postId);
|
||||||
|
// Detecting view mode
|
||||||
|
treeSwitch = $('#tree-switch a.active').attr('href');
|
||||||
|
console.debug('Comments view mode: %s', treeSwitch);
|
||||||
|
|
||||||
// WS connection
|
// Error handler
|
||||||
console.log('Starting WebSocket connection');
|
ws.onerror = function(err) {
|
||||||
ws = new WebSocket('wss://point.im/ws');
|
console.error('WebSocket error: %O', err);
|
||||||
// Message handler
|
};
|
||||||
ws.onmessage = function(evt) {
|
|
||||||
try {
|
|
||||||
// ping :)
|
|
||||||
if (evt.data == 'ping') {
|
|
||||||
console.log('WS ping received');
|
|
||||||
} else {
|
|
||||||
var wsMessage = JSON.parse(evt.data);
|
|
||||||
console.log(wsMessage);
|
|
||||||
|
|
||||||
// Post id
|
// Message handler
|
||||||
var postId = $('#top-post').attr('data-id');
|
ws.onmessage = function(evt) {
|
||||||
|
try {
|
||||||
|
// ping :)
|
||||||
|
if (evt.data == 'ping') {
|
||||||
|
console.debug('ws-ping');
|
||||||
|
} else {
|
||||||
|
var wsMessage = JSON.parse(evt.data);
|
||||||
|
|
||||||
|
if (wsMessage.hasOwnProperty('a') && wsMessage.a != '') {
|
||||||
|
switch (wsMessage.a) {
|
||||||
|
// Comments
|
||||||
|
case 'comment':
|
||||||
|
console.groupCollapsed('ws-comment #%s/%s', wsMessage.post_id, wsMessage.comment_id);
|
||||||
|
console.debug(wsMessage);
|
||||||
|
|
||||||
|
// Check option
|
||||||
|
if (options.option_ws_comments != true) {
|
||||||
|
console.log('Comments processing disabled');
|
||||||
|
console.groupEnd();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check we are in the post
|
||||||
|
if ($('#top-post').length < 1) {
|
||||||
|
console.log('Not in the post, skipping');
|
||||||
|
console.groupEnd();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check we are in specified post
|
||||||
|
if (wsMessage.post_id != postId) {
|
||||||
|
console.log('The comment is for #%s but current page is for #%s', wsMessage.post_id, postId);
|
||||||
|
console.groupEnd();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
// If this is a comment for this post
|
|
||||||
if ((wsMessage.a == 'comment') && (wsMessage.post_id == postId)) {
|
|
||||||
var $anchor = $('<a>').attr('name', wsMessage.comment_id);
|
var $anchor = $('<a>').attr('name', wsMessage.comment_id);
|
||||||
|
|
||||||
// Initializing comment element
|
// Initializing comment element
|
||||||
var $commentTemplate = $('<div>').attr({
|
var $commentTemplate = $('<div>').attr({
|
||||||
'class': 'post',
|
'class': 'post',
|
||||||
'data-id': postId,
|
'data-id': postId,
|
||||||
'data-comment-id': wsMessage.comment_id
|
'data-comment-id': wsMessage.comment_id,
|
||||||
|
'data-to-comment-id': (wsMessage.to_comment_id != null) ? wsMessage.to_comment_id : ''
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log(chrome.extension.getURL('includes/comment.html'));
|
|
||||||
// Loading HTML template
|
// Loading HTML template
|
||||||
$commentTemplate.load(chrome.extension.getURL('includes/comment.html'), function() {
|
$commentTemplate.load(chrome.extension.getURL('includes/comment.html'), function() {
|
||||||
// Load complete
|
// Load complete
|
||||||
console.log('comment.html loaded');
|
console.info('comment.html loaded');
|
||||||
|
|
||||||
// Date and time of comment
|
// Date and time of comment
|
||||||
var date = new Date();
|
var date = new Date();
|
||||||
|
|
@ -161,7 +191,7 @@ $(document).ready(function() {
|
||||||
var csRfToken = $('.reply-form input[name="csrf_token"').val();
|
var csRfToken = $('.reply-form input[name="csrf_token"').val();
|
||||||
|
|
||||||
// Filling template
|
// Filling template
|
||||||
console.log('Changing data in the comment element');
|
console.info('Changing data in the comment element');
|
||||||
// Date and time
|
// Date and time
|
||||||
$commentTemplate.find('.info .created')
|
$commentTemplate.find('.info .created')
|
||||||
.append($('<span>').html(((date.getDate().toString.length < 2) ? ('0' + date.getDate().toString()) : (date.getDate().toString())) + ' ' + months[date.getMonth()]))
|
.append($('<span>').html(((date.getDate().toString.length < 2) ? ('0' + date.getDate().toString()) : (date.getDate().toString())) + ' ' + months[date.getMonth()]))
|
||||||
|
|
@ -193,24 +223,81 @@ $(document).ready(function() {
|
||||||
$commentTemplate.find('.post-content form.reply-form input[name="csrf_token"]').val(csRfToken);
|
$commentTemplate.find('.post-content form.reply-form input[name="csrf_token"]').val(csRfToken);
|
||||||
///Filling template
|
///Filling template
|
||||||
|
|
||||||
console.log('Inserting new comment into the DOM');
|
// It's time to DOM
|
||||||
// Insert new comment in the list
|
console.info('Inserting comment');
|
||||||
$('.content-wrap #comments #post-reply').before($commentTemplate.hide().fadeIn(2000).css('background-color', '#FFFFBB'));
|
// If list mode or not addressed to other comment
|
||||||
|
if ((treeSwitch == '?tree=0') || (wsMessage.to_comment_id == null)) {
|
||||||
|
// List mode
|
||||||
|
$('.content-wrap #comments #post-reply').before($commentTemplate.hide().fadeIn(2000).css('background-color', '#FFFFBB'));
|
||||||
|
} else {
|
||||||
|
// Tree mode
|
||||||
|
// Search parent comment
|
||||||
|
$parentComment = $('.post[data-comment-id="' + wsMessage.to_comment_id + '"]');
|
||||||
|
if ($parentComment.length > 0) {
|
||||||
|
console.log('Parent comment: %O', $parentComment);
|
||||||
|
// Check for children
|
||||||
|
$parentCommentChildren = $parentComment.next('.comments');
|
||||||
|
// If child comment already exist
|
||||||
|
if ($parentCommentChildren.length > 0) {
|
||||||
|
console.log('Child comments found. Appending...');
|
||||||
|
$parentCommentChildren.append($commentTemplate.hide().fadeIn(2000).css('background-color', '#FFFFBB'));
|
||||||
|
} else {
|
||||||
|
console.log('No child comments found. Creating...');
|
||||||
|
$parentComment.after($('<div>').addClass('comments').append($commentTemplate.hide().fadeIn(2000).css('background-color', '#FFFFBB')));
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.log('Parent comment not found');
|
||||||
|
// FIXME: Double code
|
||||||
|
$('.content-wrap #comments #post-reply').before($commentTemplate.hide().fadeIn(2000).css('background-color', '#FFFFBB'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Adding anchor
|
// Adding anchor
|
||||||
$commentTemplate.before($anchor);
|
$commentTemplate.before($anchor);
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} catch(e) {
|
|
||||||
console.log('WebSocket exception:')
|
|
||||||
console.log(e);
|
|
||||||
console.log(evt.data);
|
|
||||||
};
|
|
||||||
};
|
|
||||||
} else {
|
|
||||||
|
|
||||||
|
console.groupEnd();
|
||||||
|
});
|
||||||
|
|
||||||
|
break;
|
||||||
|
|
||||||
|
// Posts
|
||||||
|
case 'post':
|
||||||
|
console.group('ws-post #%s', wsMessage.post_id);
|
||||||
|
|
||||||
|
console.debug(wsMessage);
|
||||||
|
|
||||||
|
console.groupEnd();
|
||||||
|
break;
|
||||||
|
|
||||||
|
// Recommendation
|
||||||
|
case 'ok':
|
||||||
|
console.group('ws-recommendation #%s/%s', wsMessage.post_id, wsMessage.comment_id);
|
||||||
|
|
||||||
|
console.debug(wsMessage);
|
||||||
|
|
||||||
|
console.groupEnd();
|
||||||
|
break;
|
||||||
|
|
||||||
|
default:
|
||||||
|
console.group('ws-other');
|
||||||
|
|
||||||
|
console.log(wsMessage);
|
||||||
|
|
||||||
|
console.groupEnd();
|
||||||
|
break;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.log('WebSocket exception:')
|
||||||
|
console.log(e);
|
||||||
|
console.log(evt.data);
|
||||||
}
|
}
|
||||||
}
|
;
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
@ -220,13 +307,13 @@ $(document).ready(function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
function escapeHtml(text) {
|
function escapeHtml(text) {
|
||||||
return text
|
return text
|
||||||
.replace(/&/g, "&")
|
.replace(/&/g, "&")
|
||||||
.replace(/</g, "<")
|
.replace(/</g, "<")
|
||||||
//.replace(/>/g, ">")
|
//.replace(/>/g, ">")
|
||||||
.replace(/"/g, """)
|
.replace(/"/g, """)
|
||||||
.replace(/'/g, "'")
|
.replace(/'/g, "'")
|
||||||
.replace(/\n/g, "<br>");
|
.replace(/\n/g, "<br>");
|
||||||
}
|
}
|
||||||
|
|
||||||
// Monts for Date.getMonth()
|
// Monts for Date.getMonth()
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue