diff options
Diffstat (limited to 'view/js/main.js')
-rw-r--r-- | view/js/main.js | 365 |
1 files changed, 175 insertions, 190 deletions
diff --git a/view/js/main.js b/view/js/main.js index 8ceb0b143..3e3fd057c 100644 --- a/view/js/main.js +++ b/view/js/main.js @@ -20,17 +20,18 @@ var pageHasMoreContent = true; var divmore_height = 400; var last_filestorage_id = null; var mediaPlaying = false; -var contentHeightDiff = 0; var liveRecurse = 0; var savedTitle = ''; var followUpPageLoad = false; var window_needs_alert = true; +var expanded_items = []; var sse_bs_active = false; var sse_offset = 0; var sse_type; var sse_partial_result = false; var sse_rmids = []; +var sse_fallback_interval; var page_cache = {}; @@ -43,7 +44,7 @@ if(localStorage.getItem('uid') !== localUser.toString()) { window.onstorage = function(e) { if(e.key === 'uid' && parseInt(e.newValue) !== localUser) { if(window_needs_alert) { - window_needs_alert = false; + window_needs_alert = false; alert("Your identity has changed. Page reload required!"); window.location.reload(); return; @@ -68,6 +69,13 @@ $(document).ready(function() { this.autocomplete_handled = true; } + + }); + + $(document).on('keydown', '.comment-edit-form textarea.expanded', function (e) { + if (e.ctrlKey && e.keyCode === 13) { + post_comment(this.id.replace('comment-edit-text-','')); + } }); var tf = new Function('n', 's', 'var k = s.split("/")['+aStr['plural_func']+']; return (k ? k : s);'); @@ -91,40 +99,58 @@ $(document).ready(function() { wordSeparator : aStr['t16'], numbers : aStr['t17'], }; - + jQuery.timeago.settings.allowFuture = true; - if(typeof(window.SharedWorker) === 'undefined') { - // notifications with multiple tabs open will not work very well in this scenario - var evtSource = new EventSource('/sse'); + if(sse_enabled) { + if(typeof(window.SharedWorker) === 'undefined') { + // notifications with multiple tabs open will not work very well in this scenario + var evtSource = new EventSource('/sse'); - evtSource.addEventListener('notifications', function(e) { - var obj = JSON.parse(e.data); - sse_handleNotifications(obj, false, false); - }, false); + evtSource.addEventListener('notifications', function(e) { + var obj = JSON.parse(e.data); + sse_handleNotifications(obj, false, false); + }, false); - document.addEventListener('visibilitychange', function() { - if (!document.hidden) { - sse_offset = 0; - sse_bs_init(); + document.addEventListener('visibilitychange', function() { + if (!document.hidden) { + sse_offset = 0; + sse_bs_init(); + } + }, false); + + } + else { + var myWorker = new SharedWorker('/view/js/sse_worker.js', localUser); + + myWorker.port.onmessage = function(e) { + obj = e.data; + console.log(obj); + sse_handleNotifications(obj, false, false); } - }, false); - } - else { - var myWorker = new SharedWorker('/view/js/sse_worker.js', localUser); + myWorker.onerror = function(e) { + myWorker.port.close(); + } - myWorker.port.onmessage = function(e) { - obj = e.data; - console.log(obj); - sse_handleNotifications(obj, false, false); + myWorker.port.start(); } + } + else { + if (!document.hidden) + sse_fallback_interval = setInterval(sse_fallback, updateInterval); - myWorker.onerror = function(e) { - myWorker.port.close(); - } + document.addEventListener('visibilitychange', function() { + if (document.hidden) { + clearInterval(sse_fallback_interval); + } + else { + sse_offset = 0; + sse_bs_init(); + sse_fallback_interval = setInterval(sse_fallback, updateInterval); + } - myWorker.port.start(); + }, false); } $('.notification-link').on('click', { replace: true, followup: false }, sse_bs_notifications); @@ -188,33 +214,6 @@ $(document).ready(function() { updateInit(); - // Allow folks to stop the ajax page updates with the pause/break key - $(document).keydown(function(event) { - if(event.keyCode == '8') { - var target = event.target || event.srcElement; - if (!/input|textarea/i.test(target.nodeName)) { - return false; - } - } - - if(event.keyCode == '19' || (event.ctrlKey && event.which == '32')) { - event.preventDefault(); - if(stopped === false) { - stopped = true; - if (event.ctrlKey) { - totStopped = true; - } - $('#pause').html('<img src="images/pause.gif" alt="pause" style="border: 1px solid black;" />'); - } else { - unpause(); - } - } else { - if (!totStopped) { - unpause(); - } - } - }); - var e = document.getElementById('content-complete'); if(e) pageHasMoreContent = false; @@ -288,6 +287,7 @@ function handle_comment_form(e) { // handle clicked form var form = $(this); + var fields = form.find(':input[type=text], textarea'); var fields_empty = true; @@ -298,12 +298,13 @@ function handle_comment_form(e) { $('#' + commentElm).addClass('expanded').removeAttr('placeholder'); $('#' + commentElm).attr('tabindex','9'); $('#' + submitElm).attr('tabindex','10'); - + form.find(':not(:visible)').show(); } + // handle click outside of form (close empty forms) - $(document).on('click', function(e) { + $(document).one('click', function(e) { fields.each(function() { if($(this).val() != '') fields_empty = false; @@ -322,18 +323,19 @@ function handle_comment_form(e) { form.find(':button[type=submit]').prop('title', ''); } }); - + var commentSaveTimer = null; var emptyCommentElm = form.find('.comment-edit-text').attr('id'); var convId = emptyCommentElm.replace('comment-edit-text-',''); - $(document).on('focusout','#' + emptyCommentElm,function(e){ + $('#' + emptyCommentElm).on('focusout',function(e){ if(commentSaveTimer) clearTimeout(commentSaveTimer); commentSaveChanges(convId,true); commentSaveTimer = null; + $('#' + emptyCommentElm).off(); }); - $(document).on('focusin','#' + emptyCommentElm,function(e){ + $('#' + emptyCommentElm).on('focusin', function (e){ commentSaveTimer = setTimeout(function () { commentSaveChanges(convId,false); },10000); @@ -357,11 +359,13 @@ function handle_comment_form(e) { } } } + } + + function commentClose(obj, id) { if(obj.value === '') { - obj.value = aStr.comment; $("#comment-edit-text-" + id).removeClass("expanded"); $("#mod-cmnt-wrap-" + id).hide(); $("#comment-tools-" + id).hide(); @@ -448,7 +452,7 @@ function insertCommentAttach(comment,id) { $('body').css('cursor', 'wait'); $('#invisible-comment-upload').trigger('click'); - + return false; } @@ -616,7 +620,10 @@ function updatePageItems(mode, data) { function updateConvItems(mode,data) { - $(document).trigger('hz:updateConvItems'); + var scroll_position = $(window).scrollTop(); + + if(mode !== 'update') + $(document).trigger('hz:updateConvItems'); if(mode === 'update' || mode === 'replace') { prev = 'threads-begin'; @@ -624,14 +631,13 @@ function updateConvItems(mode,data) { if(mode === 'append') { next = 'threads-end'; } - + if(mode === 'replace') { - $('.thread-wrapper').remove(); // clear existing content + $('.thread-parent').remove(); // clear existing content } $('.thread-wrapper', data).each(function() { if(this.classList.contains('toplevel_item')) { - var ident = this.id; var convId = ident.replace('thread-wrapper-',''); var commentWrap = $('#'+ident+' .collapsed-comments').attr('id'); @@ -646,7 +652,7 @@ function updateConvItems(mode,data) { if($('#collapsed-comments-'+itmId).is(':visible')) isVisible = true; - // insert the content according to the mode and first_page + // insert the content according to the mode and first_page // and whether or not the content exists already (overwrite it) if($('#' + ident).length == 0) { @@ -746,6 +752,8 @@ function updateConvItems(mode,data) { }); + $(window).scrollTop(scroll_position); + if(followUpPageLoad) sse_bs_counts(); else @@ -757,7 +765,7 @@ function updateConvItems(mode,data) { } // Setup to determine if the media player is playing. This affects - // some content loading decisions. + // some content loading decisions. $('video').off('playing'); $('video').off('pause'); @@ -841,25 +849,16 @@ function scrollToItem() { } function collapseHeight() { - var origContentHeight = Math.ceil($("#region_2").height()); - var cDiff = 0; - var i = 0; - var position = $(window).scrollTop(); $(".wall-item-content, .directory-collapse").each(function() { var orgHeight = $(this).outerHeight(true); + var id = $(this).attr('id') + var open = ((expanded_items.indexOf($(this).attr('id')) === -1) ? false : true); if(orgHeight > divmore_height) { if(! $(this).hasClass('divmore') && $(this).has('div.no-collapse').length == 0) { - - // check if we will collapse some content above the visible content and compensate the diff later - if($(this).offset().top + divmore_height - $(window).scrollTop() + cDiff - ($(".divgrow-showmore").outerHeight() * i) < 65) { - diff = orgHeight - divmore_height; - cDiff = cDiff + diff; - i++; - } - $(this).readmore({ speed: 0, + startOpen: open, heightMargin: 50, collapsedHeight: divmore_height, moreLink: '<a href="#" class="divgrow-showmore fakelink">' + aStr.divgrowmore + '</a>', @@ -869,6 +868,10 @@ function collapseHeight() { if((($(element).offset().top + divmore_height) - $(window).scrollTop()) < 65 ) { $(window).scrollTop($(window).scrollTop() - ($(element).outerHeight(true) - divmore_height)); } + expanded_items = expanded_items.filter(expanded_items => expanded_items !== id); + } + else { + expanded_items.push(id); } } }); @@ -877,15 +880,6 @@ function collapseHeight() { } }); - var collapsedContentHeight = Math.ceil($("#region_2").height()); - contentHeightDiff = liking ? 0 : origContentHeight - collapsedContentHeight; - console.log('collapseHeight() - contentHeightDiff: ' + contentHeightDiff + 'px'); - - if(i && !liking){ - var sval = position - cDiff + ($(".divgrow-showmore").outerHeight() * i); - console.log('collapsed above viewport count: ' + i); - $(window).scrollTop(sval); - } } function updateInit() { @@ -920,12 +914,7 @@ function liveUpdate(notify_id) { if((src === null) || (stopped) || (! profile_uid)) { $('.like-rotator').hide(); return; } - // if auto updates are enabled and a comment box is open, - // prevent live updates until the comment is submitted - - var lockUpdates = (($('.comment-edit-text.expanded').length && (! bParam_static)) ? true : false); - - if(lockUpdates || in_progress || mediaPlaying) { + if(in_progress || mediaPlaying) { if(livetime) { clearTimeout(livetime); } @@ -1027,11 +1016,6 @@ function liveUpdate(notify_id) { scroll_next = false; updateConvItems(update_mode,data); - // adjust scroll position if new content was added above viewport - if(update_mode === 'update' && !justifiedGalleryActive) { - $(window).scrollTop($(window).scrollTop() + $("#region_2").height() - orgHeight + contentHeightDiff); - } - in_progress = false; $('#image_counter').html(''); @@ -1162,19 +1146,30 @@ function justifyPhotosAjax(id) { $('#' + id).justifiedGallery('norewind').on('jg.complete', function(e){ justifiedGalleryActive = false; }); } -// Since our ajax calls are asynchronous, we will give a few -// seconds for the first ajax call (setting like/dislike), then -// run the updater to pick up any changes and display on the page. -// The updater will turn any rotators off when it's done. -// This function will have returned long before any of these -// events have completed and therefore there won't be any -// visible feedback that anything changed without all this -// trickery. This still could cause confusion if the "like" ajax call -// is delayed and updateInit runs before it completes. function dolike(ident, verb) { - unpause(); $('#like-rotator-' + ident.toString()).show(); - $.get('like/' + ident.toString() + '?verb=' + verb, updateInit ); + + if(typeof conv_mode == typeof undefined) + conv_mode = ''; + + $.get('like/' + ident.toString() + '?verb=' + verb + '&conv_mode=' + conv_mode, function (data) { + if(data.success) { + // this is a bit tricky since the top level thread wrapper wraps the whole thread + if($('#thread-wrapper-' + data.orig_id).hasClass('toplevel_item')) { + var wrapper = $('<div></div>').html( data.html ).find('#wall-item-outside-wrapper-' + data.id); + $('#wall-item-outside-wrapper-' + data.orig_id).html(wrapper[0].innerHTML); + // those were not replaced - swap the id + $('#thread-wrapper-' + data.orig_id).attr('id', 'thread-wrapper-' + data.id); + $('#wall-item-outside-wrapper-' + data.orig_id).attr('id', 'wall-item-outside-wrapper-' + data.id); + } + else { + $('#thread-wrapper-' + data.orig_id).replaceWith(data.html); + } + $('#wall-item-ago-' + data.id + ' .autotime').timeago(); + collapseHeight(); + liking = 0; + } + }); liking = 1; } @@ -1258,35 +1253,34 @@ function dopin(id) { } function dropItem(url, object) { + var confirm = confirmDelete(); + if(confirm) { + var id = url.split('/')[2]; + $('body').css('cursor', 'wait'); + $(object + ', #pinned-wrapper-' + id).css('opacity', 0.33); - var confirm = confirmDelete(); - if(confirm) { - var id = url.split('/')[2]; - $('body').css('cursor', 'wait'); - $(object + ', #pinned-wrapper-' + id).fadeTo('fast', 0.33, function () { - $.get(url).done(function() { - $(object + ', #pinned-wrapper-' + id).remove(); - $('body').css('cursor', 'auto'); - }); - }); - if($('#wall-item-pinned-' + id).length) - $.post('pin/pin', { 'id' : id }); - return true; - } - else { - return false; + $.get(url, function() { + $(object + ', #pinned-wrapper-' + id).remove(); + $('body').css('cursor', 'auto'); + }); + + if($('#wall-item-pinned-' + id).length) + $.post('pin/pin', { 'id' : id }); + + return true; } + else { + return false; + } } function dosubthread(ident) { - unpause(); $('#like-rotator-' + ident.toString()).show(); $.get('subthread/sub/' + ident.toString(), updateInit ); liking = 1; } function dounsubthread(ident) { - unpause(); $('#like-rotator-' + ident.toString()).show(); $.get('subthread/unsub/' + ident.toString(), updateInit ); liking = 1; @@ -1346,18 +1340,6 @@ function lockview(type, id) { }); } -function filestorage(event, nick, id) { - $('#cloud-index-' + last_filestorage_id).removeClass('cloud-index-active'); - $('#perms-panel-' + last_filestorage_id).hide().html(''); - $('#file-edit-' + id).show(); - $.get('filestorage/' + nick + '/' + id + '/edit', function(data) { - $('#cloud-index-' + id).addClass('cloud-index-active'); - $('#perms-panel-' + id).html(data).show(); - $('#file-edit-' + id).hide(); - last_filestorage_id = id; - }); -} - function submitPoll(id) { $.post('vote/' + id, @@ -1365,44 +1347,53 @@ function submitPoll(id) { function(data) { $.jGrowl(data.message, { sticky: false, theme: ((data.success) ? 'info' : 'notice'), life: 10000 }); if(timer) clearTimeout(timer); - timer = setTimeout(updateInit,1500); + timer = setTimeout(updateInit, 500); } ); } - function post_comment(id) { - unpause(); + commentBusy = true; $('body').css('cursor', 'wait'); $("#comment-preview-inp-" + id).val("0"); + + if(typeof conv_mode == typeof undefined) + conv_mode = ''; + + var form_data = $("#comment-edit-form-" + id).serialize(); + $.post( "item", - $("#comment-edit-form-" + id).serialize(), + form_data + '&conv_mode=' + conv_mode, function(data) { if(data.success) { localStorage.removeItem("comment_body-" + id); $("#comment-edit-preview-" + id).hide(); - $("#comment-edit-wrapper-" + id).hide(); - $("#comment-edit-text-" + id).val(''); + $("#comment-edit-text-" + id).val('').blur().attr('placeholder', aStr.comment); + $('#wall-item-comment-wrapper-' + id).before(data.html); + $('#wall-item-ago-' + data.id + ' .autotime').timeago(); + $('body').css('cursor', 'unset'); + collapseHeight(); + commentBusy = false; + var tarea = document.getElementById("comment-edit-text-" + id); if(tarea) { commentClose(tarea, id); - $(document).unbind( "click.commentOpen"); + $(document).off( "click.commentOpen"); } - if(timer) clearTimeout(timer); - timer = setTimeout(updateInit,1500); - } - if(data.reload) { - window.location.href=data.reload; } }, "json" ); + return false; + } + + function preview_comment(id) { $("#comment-preview-inp-" + id).val("1"); $("#comment-edit-preview-" + id).show(); @@ -1470,25 +1461,18 @@ function preview_mail() { return true; } -function unpause() { - // unpause auto reloads if they are currently stopped - totStopped = false; - stopped = false; - $('#pause').html(''); -} - function bin2hex(s) { - // Converts the binary representation of data to hex - // - // version: 812.316 - // discuss at: http://phpjs.org/functions/bin2hex - // + original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net) - // + bugfixed by: Onno Marsman - // + bugfixed by: Linuxworld - // * example 1: bin2hex('Kev'); - // * returns 1: '4b6576' - // * example 2: bin2hex(String.fromCharCode(0x00)); - // * returns 2: '00' + // Converts the binary representation of data to hex + // + // version: 812.316 + // discuss at: http://phpjs.org/functions/bin2hex + // + original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net) + // + bugfixed by: Onno Marsman + // + bugfixed by: Linuxworld + // * example 1: bin2hex('Kev'); + // * returns 1: '4b6576' + // * example 2: bin2hex(String.fromCharCode(0x00)); + // * returns 2: '00' var v,i, f = 0, a = []; s += ''; f = s.length; @@ -1573,7 +1557,6 @@ function zFormError(elm,x) { } } - $(window).scroll(function () { if(typeof buildCmd == 'function') { // This is a content page with items and/or conversations @@ -1599,22 +1582,6 @@ $(window).scroll(function () { } }); -var chanviewFullSize = false; - -function chanviewFull() { - if(chanviewFullSize) { - chanviewFullSize = false; - $('#chanview-iframe-border').css({ 'position' : 'relative', 'z-index' : '10' }); - $('#remote-channel').css({ 'position' : 'relative' , 'z-index' : '10' }); - } - else { - chanviewFullSize = true; - $('#chanview-iframe-border').css({ 'position' : 'fixed', 'top' : '0', 'left' : '0', 'z-index' : '150001' }); - $('#remote-channel').css({ 'position' : 'fixed', 'top' : '0', 'left' : '0', 'z-index' : '150000' }); - resize_iframe(); - } -} - function addhtmltext(data) { data = h2b(data); addeditortext(data); @@ -1763,8 +1730,6 @@ function sse_bs_init() { } function sse_bs_counts() { - - if(sse_bs_active) return; @@ -1847,8 +1812,6 @@ function sse_bs_notifications(e, replace, followup) { } } - - function sse_handleNotifications(obj, replace, followup) { var primary_notifications = ['dm', 'home', 'intros', 'register', 'mail', 'notify', 'files']; @@ -2022,3 +1985,25 @@ function sse_setNotificationsStatus() { } } + +function sse_fallback() { + $.get('/sse', function(obj) { + if(! obj) + return; + + console.log('sse fallback'); + console.log(obj); + + sse_handleNotifications(obj, false, false); + }); +} + +function makeid(length) { + var result = ''; + var characters = 'abcdef0123456789'; + var charactersLength = characters.length; + for ( var i = 0; i < length; i++ ) { + result += characters.charAt(Math.floor(Math.random() * charactersLength)); + } + return result; +} |