From db4d3b09771f46cce240cf9a9966931dd106bc2c Mon Sep 17 00:00:00 2001 From: Eggbertx Date: Mon, 22 Aug 2022 21:23:32 -0700 Subject: [PATCH] Apply thumbnail expansion and inline post preview events to AJAX-loaded posts --- frontend/js/postutil.js | 26 +++++++++++++++++++------- html/js/gochan.js | 2 +- html/js/gochan.js.map | 2 +- 3 files changed, 21 insertions(+), 9 deletions(-) diff --git a/frontend/js/postutil.js b/frontend/js/postutil.js index b6b1085b..17d2c28c 100755 --- a/frontend/js/postutil.js +++ b/frontend/js/postutil.js @@ -66,6 +66,8 @@ function updateThreadHTML() { }).append($post); $replyContainer.appendTo(`div#${post.resto}.thread`); addPostDropdown($post); + prepareThumbnails($post); + initPostPreviews($post); numAdded++; } if(numAdded === 0) return; @@ -156,17 +158,22 @@ export function initPostPreviews($post = null) { } } -export function prepareThumbnails() { - // set thumbnails to expand when clicked - $("a.upload-container").on("click", function(e) { +/** + * Sets thumbnails to expand when clicked. If a parent is provided, prepareThumbnails will only + * be applied to that parent + * @param {JQuery} $post the post (if set) to prepare the thumbnails for + */ +export function prepareThumbnails($parent = null) { + let $container = $parent === null ? $("a.upload-container") : $parent.find("a") + $container.on("click", function(e) { e.preventDefault(); - let a = $(this); - let thumb = a.find("img.upload"); + let $a = $(this); + let thumb = $a.find("img.upload"); let thumbURL = thumb.attr("src"); let uploadURL = thumb.attr("alt"); thumb.removeAttr("width").removeAttr("height"); - var fileInfoElement = a.prevAll(".file-info:first"); + var fileInfoElement = $a.prevAll(".file-info:first"); if(videoTestRE.test(thumbURL + uploadURL)) { // Upload is a video @@ -243,9 +250,14 @@ export function stopThreadWatcher() { clearInterval(threadWatcherInterval); } +export function resetThreadWatcherInterval() { + stopThreadWatcher(); + threadWatcherInterval = setInterval(updateThread, getNumberStorageVal("watcherseconds", 10) * 1000); +} + $(() => { let pageThread = getPageThread(); if(pageThread.op >= 1) { - threadWatcherInterval = setInterval(updateThread, getNumberStorageVal("watcherseconds", 10) * 1000); + resetThreadWatcherInterval(); } }); diff --git a/html/js/gochan.js b/html/js/gochan.js index dd0cee46..53e5e284 100644 --- a/html/js/gochan.js +++ b/html/js/gochan.js @@ -58,5 +58,5 @@ function(e){"function"==typeof define&&define.amd?define(["jquery","../ie","../v * Released under the MIT license. * http://jquery.org/license */ -function(e){"function"==typeof define&&define.amd?define(["jquery","./mouse","../data","../plugin","../safe-active-element","../safe-blur","../scroll-parent","../version","../widget"],e):e(jQuery)}((function(e){"use strict";return e.widget("ui.draggable",e.ui.mouse,{version:"1.13.1",widgetEventPrefix:"drag",options:{addClasses:!0,appendTo:"parent",axis:!1,connectToSortable:!1,containment:!1,cursor:"auto",cursorAt:!1,grid:!1,handle:!1,helper:"original",iframeFix:!1,opacity:!1,refreshPositions:!1,revert:!1,revertDuration:500,scope:"default",scroll:!0,scrollSensitivity:20,scrollSpeed:20,snap:!1,snapMode:"both",snapTolerance:20,stack:!1,zIndex:!1,drag:null,start:null,stop:null},_create:function(){"original"===this.options.helper&&this._setPositionRelative(),this.options.addClasses&&this._addClass("ui-draggable"),this._setHandleClassName(),this._mouseInit()},_setOption:function(e,t){this._super(e,t),"handle"===e&&(this._removeHandleClassName(),this._setHandleClassName())},_destroy:function(){(this.helper||this.element).is(".ui-draggable-dragging")?this.destroyOnClear=!0:(this._removeHandleClassName(),this._mouseDestroy())},_mouseCapture:function(t){var n=this.options;return!(this.helper||n.disabled||e(t.target).closest(".ui-resizable-handle").length>0)&&(this.handle=this._getHandle(t),!!this.handle&&(this._blurActiveElement(t),this._blockFrames(!0===n.iframeFix?"iframe":n.iframeFix),!0))},_blockFrames:function(t){this.iframeBlocks=this.document.find(t).map((function(){var t=e(this);return e("
").css("position","absolute").appendTo(t.parent()).outerWidth(t.outerWidth()).outerHeight(t.outerHeight()).offset(t.offset())[0]}))},_unblockFrames:function(){this.iframeBlocks&&(this.iframeBlocks.remove(),delete this.iframeBlocks)},_blurActiveElement:function(t){var n=e.ui.safeActiveElement(this.document[0]);e(t.target).closest(n).length||e.ui.safeBlur(n)},_mouseStart:function(t){var n=this.options;return this.helper=this._createHelper(t),this._addClass(this.helper,"ui-draggable-dragging"),this._cacheHelperProportions(),e.ui.ddmanager&&(e.ui.ddmanager.current=this),this._cacheMargins(),this.cssPosition=this.helper.css("position"),this.scrollParent=this.helper.scrollParent(!0),this.offsetParent=this.helper.offsetParent(),this.hasFixedAncestor=this.helper.parents().filter((function(){return"fixed"===e(this).css("position")})).length>0,this.positionAbs=this.element.offset(),this._refreshOffsets(t),this.originalPosition=this.position=this._generatePosition(t,!1),this.originalPageX=t.pageX,this.originalPageY=t.pageY,n.cursorAt&&this._adjustOffsetFromHelper(n.cursorAt),this._setContainment(),!1===this._trigger("start",t)?(this._clear(),!1):(this._cacheHelperProportions(),e.ui.ddmanager&&!n.dropBehaviour&&e.ui.ddmanager.prepareOffsets(this,t),this._mouseDrag(t,!0),e.ui.ddmanager&&e.ui.ddmanager.dragStart(this,t),!0)},_refreshOffsets:function(e){this.offset={top:this.positionAbs.top-this.margins.top,left:this.positionAbs.left-this.margins.left,scroll:!1,parent:this._getParentOffset(),relative:this._getRelativeOffset()},this.offset.click={left:e.pageX-this.offset.left,top:e.pageY-this.offset.top}},_mouseDrag:function(t,n){if(this.hasFixedAncestor&&(this.offset.parent=this._getParentOffset()),this.position=this._generatePosition(t,!0),this.positionAbs=this._convertPositionTo("absolute"),!n){var r=this._uiHash();if(!1===this._trigger("drag",t,r))return this._mouseUp(new e.Event("mouseup",t)),!1;this.position=r.position}return this.helper[0].style.left=this.position.left+"px",this.helper[0].style.top=this.position.top+"px",e.ui.ddmanager&&e.ui.ddmanager.drag(this,t),!1},_mouseStop:function(t){var n=this,r=!1;return e.ui.ddmanager&&!this.options.dropBehaviour&&(r=e.ui.ddmanager.drop(this,t)),this.dropped&&(r=this.dropped,this.dropped=!1),"invalid"===this.options.revert&&!r||"valid"===this.options.revert&&r||!0===this.options.revert||"function"==typeof this.options.revert&&this.options.revert.call(this.element,r)?e(this.helper).animate(this.originalPosition,parseInt(this.options.revertDuration,10),(function(){!1!==n._trigger("stop",t)&&n._clear()})):!1!==this._trigger("stop",t)&&this._clear(),!1},_mouseUp:function(t){return this._unblockFrames(),e.ui.ddmanager&&e.ui.ddmanager.dragStop(this,t),this.handleElement.is(t.target)&&this.element.trigger("focus"),e.ui.mouse.prototype._mouseUp.call(this,t)},cancel:function(){return this.helper.is(".ui-draggable-dragging")?this._mouseUp(new e.Event("mouseup",{target:this.element[0]})):this._clear(),this},_getHandle:function(t){return!this.options.handle||!!e(t.target).closest(this.element.find(this.options.handle)).length},_setHandleClassName:function(){this.handleElement=this.options.handle?this.element.find(this.options.handle):this.element,this._addClass(this.handleElement,"ui-draggable-handle")},_removeHandleClassName:function(){this._removeClass(this.handleElement,"ui-draggable-handle")},_createHelper:function(t){var n=this.options,r="function"==typeof n.helper,o=r?e(n.helper.apply(this.element[0],[t])):"clone"===n.helper?this.element.clone().removeAttr("id"):this.element;return o.parents("body").length||o.appendTo("parent"===n.appendTo?this.element[0].parentNode:n.appendTo),r&&o[0]===this.element[0]&&this._setPositionRelative(),o[0]===this.element[0]||/(fixed|absolute)/.test(o.css("position"))||o.css("position","absolute"),o},_setPositionRelative:function(){/^(?:r|a|f)/.test(this.element.css("position"))||(this.element[0].style.position="relative")},_adjustOffsetFromHelper:function(e){"string"==typeof e&&(e=e.split(" ")),Array.isArray(e)&&(e={left:+e[0],top:+e[1]||0}),"left"in e&&(this.offset.click.left=e.left+this.margins.left),"right"in e&&(this.offset.click.left=this.helperProportions.width-e.right+this.margins.left),"top"in e&&(this.offset.click.top=e.top+this.margins.top),"bottom"in e&&(this.offset.click.top=this.helperProportions.height-e.bottom+this.margins.top)},_isRootNode:function(e){return/(html|body)/i.test(e.tagName)||e===this.document[0]},_getParentOffset:function(){var t=this.offsetParent.offset(),n=this.document[0];return"absolute"===this.cssPosition&&this.scrollParent[0]!==n&&e.contains(this.scrollParent[0],this.offsetParent[0])&&(t.left+=this.scrollParent.scrollLeft(),t.top+=this.scrollParent.scrollTop()),this._isRootNode(this.offsetParent[0])&&(t={top:0,left:0}),{top:t.top+(parseInt(this.offsetParent.css("borderTopWidth"),10)||0),left:t.left+(parseInt(this.offsetParent.css("borderLeftWidth"),10)||0)}},_getRelativeOffset:function(){if("relative"!==this.cssPosition)return{top:0,left:0};var e=this.element.position(),t=this._isRootNode(this.scrollParent[0]);return{top:e.top-(parseInt(this.helper.css("top"),10)||0)+(t?0:this.scrollParent.scrollTop()),left:e.left-(parseInt(this.helper.css("left"),10)||0)+(t?0:this.scrollParent.scrollLeft())}},_cacheMargins:function(){this.margins={left:parseInt(this.element.css("marginLeft"),10)||0,top:parseInt(this.element.css("marginTop"),10)||0,right:parseInt(this.element.css("marginRight"),10)||0,bottom:parseInt(this.element.css("marginBottom"),10)||0}},_cacheHelperProportions:function(){this.helperProportions={width:this.helper.outerWidth(),height:this.helper.outerHeight()}},_setContainment:function(){var t,n,r,o=this.options,i=this.document[0];this.relativeContainer=null,o.containment?"window"!==o.containment?"document"!==o.containment?o.containment.constructor!==Array?("parent"===o.containment&&(o.containment=this.helper[0].parentNode),(r=(n=e(o.containment))[0])&&(t=/(scroll|auto)/.test(n.css("overflow")),this.containment=[(parseInt(n.css("borderLeftWidth"),10)||0)+(parseInt(n.css("paddingLeft"),10)||0),(parseInt(n.css("borderTopWidth"),10)||0)+(parseInt(n.css("paddingTop"),10)||0),(t?Math.max(r.scrollWidth,r.offsetWidth):r.offsetWidth)-(parseInt(n.css("borderRightWidth"),10)||0)-(parseInt(n.css("paddingRight"),10)||0)-this.helperProportions.width-this.margins.left-this.margins.right,(t?Math.max(r.scrollHeight,r.offsetHeight):r.offsetHeight)-(parseInt(n.css("borderBottomWidth"),10)||0)-(parseInt(n.css("paddingBottom"),10)||0)-this.helperProportions.height-this.margins.top-this.margins.bottom],this.relativeContainer=n)):this.containment=o.containment:this.containment=[0,0,e(i).width()-this.helperProportions.width-this.margins.left,(e(i).height()||i.body.parentNode.scrollHeight)-this.helperProportions.height-this.margins.top]:this.containment=[e(window).scrollLeft()-this.offset.relative.left-this.offset.parent.left,e(window).scrollTop()-this.offset.relative.top-this.offset.parent.top,e(window).scrollLeft()+e(window).width()-this.helperProportions.width-this.margins.left,e(window).scrollTop()+(e(window).height()||i.body.parentNode.scrollHeight)-this.helperProportions.height-this.margins.top]:this.containment=null},_convertPositionTo:function(e,t){t||(t=this.position);var n="absolute"===e?1:-1,r=this._isRootNode(this.scrollParent[0]);return{top:t.top+this.offset.relative.top*n+this.offset.parent.top*n-("fixed"===this.cssPosition?-this.offset.scroll.top:r?0:this.offset.scroll.top)*n,left:t.left+this.offset.relative.left*n+this.offset.parent.left*n-("fixed"===this.cssPosition?-this.offset.scroll.left:r?0:this.offset.scroll.left)*n}},_generatePosition:function(e,t){var n,r,o,i,s=this.options,a=this._isRootNode(this.scrollParent[0]),l=e.pageX,c=e.pageY;return a&&this.offset.scroll||(this.offset.scroll={top:this.scrollParent.scrollTop(),left:this.scrollParent.scrollLeft()}),t&&(this.containment&&(this.relativeContainer?(r=this.relativeContainer.offset(),n=[this.containment[0]+r.left,this.containment[1]+r.top,this.containment[2]+r.left,this.containment[3]+r.top]):n=this.containment,e.pageX-this.offset.click.leftn[2]&&(l=n[2]+this.offset.click.left),e.pageY-this.offset.click.top>n[3]&&(c=n[3]+this.offset.click.top)),s.grid&&(o=s.grid[1]?this.originalPageY+Math.round((c-this.originalPageY)/s.grid[1])*s.grid[1]:this.originalPageY,c=n?o-this.offset.click.top>=n[1]||o-this.offset.click.top>n[3]?o:o-this.offset.click.top>=n[1]?o-s.grid[1]:o+s.grid[1]:o,i=s.grid[0]?this.originalPageX+Math.round((l-this.originalPageX)/s.grid[0])*s.grid[0]:this.originalPageX,l=n?i-this.offset.click.left>=n[0]||i-this.offset.click.left>n[2]?i:i-this.offset.click.left>=n[0]?i-s.grid[0]:i+s.grid[0]:i),"y"===s.axis&&(l=this.originalPageX),"x"===s.axis&&(c=this.originalPageY)),{top:c-this.offset.click.top-this.offset.relative.top-this.offset.parent.top+("fixed"===this.cssPosition?-this.offset.scroll.top:a?0:this.offset.scroll.top),left:l-this.offset.click.left-this.offset.relative.left-this.offset.parent.left+("fixed"===this.cssPosition?-this.offset.scroll.left:a?0:this.offset.scroll.left)}},_clear:function(){this._removeClass(this.helper,"ui-draggable-dragging"),this.helper[0]===this.element[0]||this.cancelHelperRemoval||this.helper.remove(),this.helper=null,this.cancelHelperRemoval=!1,this.destroyOnClear&&this.destroy()},_trigger:function(t,n,r){return r=r||this._uiHash(),e.ui.plugin.call(this,t,[n,r,this],!0),/^(drag|start|stop)/.test(t)&&(this.positionAbs=this._convertPositionTo("absolute"),r.offset=this.positionAbs),e.Widget.prototype._trigger.call(this,t,n,r)},plugins:{},_uiHash:function(){return{helper:this.helper,position:this.position,originalPosition:this.originalPosition,offset:this.positionAbs}}}),e.ui.plugin.add("draggable","connectToSortable",{start:function(t,n,r){var o=e.extend({},n,{item:r.element});r.sortables=[],e(r.options.connectToSortable).each((function(){var n=e(this).sortable("instance");n&&!n.options.disabled&&(r.sortables.push(n),n.refreshPositions(),n._trigger("activate",t,o))}))},stop:function(t,n,r){var o=e.extend({},n,{item:r.element});r.cancelHelperRemoval=!1,e.each(r.sortables,(function(){var e=this;e.isOver?(e.isOver=0,r.cancelHelperRemoval=!0,e.cancelHelperRemoval=!1,e._storedCSS={position:e.placeholder.css("position"),top:e.placeholder.css("top"),left:e.placeholder.css("left")},e._mouseStop(t),e.options.helper=e.options._helper):(e.cancelHelperRemoval=!0,e._trigger("deactivate",t,o))}))},drag:function(t,n,r){e.each(r.sortables,(function(){var o=!1,i=this;i.positionAbs=r.positionAbs,i.helperProportions=r.helperProportions,i.offset.click=r.offset.click,i._intersectsWith(i.containerCache)&&(o=!0,e.each(r.sortables,(function(){return this.positionAbs=r.positionAbs,this.helperProportions=r.helperProportions,this.offset.click=r.offset.click,this!==i&&this._intersectsWith(this.containerCache)&&e.contains(i.element[0],this.element[0])&&(o=!1),o}))),o?(i.isOver||(i.isOver=1,r._parent=n.helper.parent(),i.currentItem=n.helper.appendTo(i.element).data("ui-sortable-item",!0),i.options._helper=i.options.helper,i.options.helper=function(){return n.helper[0]},t.target=i.currentItem[0],i._mouseCapture(t,!0),i._mouseStart(t,!0,!0),i.offset.click.top=r.offset.click.top,i.offset.click.left=r.offset.click.left,i.offset.parent.left-=r.offset.parent.left-i.offset.parent.left,i.offset.parent.top-=r.offset.parent.top-i.offset.parent.top,r._trigger("toSortable",t),r.dropped=i.element,e.each(r.sortables,(function(){this.refreshPositions()})),r.currentItem=r.element,i.fromOutside=r),i.currentItem&&(i._mouseDrag(t),n.position=i.position)):i.isOver&&(i.isOver=0,i.cancelHelperRemoval=!0,i.options._revert=i.options.revert,i.options.revert=!1,i._trigger("out",t,i._uiHash(i)),i._mouseStop(t,!0),i.options.revert=i.options._revert,i.options.helper=i.options._helper,i.placeholder&&i.placeholder.remove(),n.helper.appendTo(r._parent),r._refreshOffsets(t),n.position=r._generatePosition(t,!0),r._trigger("fromSortable",t),r.dropped=!1,e.each(r.sortables,(function(){this.refreshPositions()})))}))}}),e.ui.plugin.add("draggable","cursor",{start:function(t,n,r){var o=e("body"),i=r.options;o.css("cursor")&&(i._cursor=o.css("cursor")),o.css("cursor",i.cursor)},stop:function(t,n,r){var o=r.options;o._cursor&&e("body").css("cursor",o._cursor)}}),e.ui.plugin.add("draggable","opacity",{start:function(t,n,r){var o=e(n.helper),i=r.options;o.css("opacity")&&(i._opacity=o.css("opacity")),o.css("opacity",i.opacity)},stop:function(t,n,r){var o=r.options;o._opacity&&e(n.helper).css("opacity",o._opacity)}}),e.ui.plugin.add("draggable","scroll",{start:function(e,t,n){n.scrollParentNotHidden||(n.scrollParentNotHidden=n.helper.scrollParent(!1)),n.scrollParentNotHidden[0]!==n.document[0]&&"HTML"!==n.scrollParentNotHidden[0].tagName&&(n.overflowOffset=n.scrollParentNotHidden.offset())},drag:function(t,n,r){var o=r.options,i=!1,s=r.scrollParentNotHidden[0],a=r.document[0];s!==a&&"HTML"!==s.tagName?(o.axis&&"x"===o.axis||(r.overflowOffset.top+s.offsetHeight-t.pageY=0;p--)c=(l=r.snapElements[p].left-r.margins.left)+r.snapElements[p].width,f=(u=r.snapElements[p].top-r.margins.top)+r.snapElements[p].height,mc+g||bf+g||!e.contains(r.snapElements[p].item.ownerDocument,r.snapElements[p].item)?(r.snapElements[p].snapping&&r.options.snap.release&&r.options.snap.release.call(r.element,t,e.extend(r._uiHash(),{snapItem:r.snapElements[p].item})),r.snapElements[p].snapping=!1):("inner"!==h.snapMode&&(o=Math.abs(u-b)<=g,i=Math.abs(f-y)<=g,s=Math.abs(l-m)<=g,a=Math.abs(c-v)<=g,o&&(n.position.top=r._convertPositionTo("relative",{top:u-r.helperProportions.height,left:0}).top),i&&(n.position.top=r._convertPositionTo("relative",{top:f,left:0}).top),s&&(n.position.left=r._convertPositionTo("relative",{top:0,left:l-r.helperProportions.width}).left),a&&(n.position.left=r._convertPositionTo("relative",{top:0,left:c}).left)),d=o||i||s||a,"outer"!==h.snapMode&&(o=Math.abs(u-y)<=g,i=Math.abs(f-b)<=g,s=Math.abs(l-v)<=g,a=Math.abs(c-m)<=g,o&&(n.position.top=r._convertPositionTo("relative",{top:u,left:0}).top),i&&(n.position.top=r._convertPositionTo("relative",{top:f-r.helperProportions.height,left:0}).top),s&&(n.position.left=r._convertPositionTo("relative",{top:0,left:l}).left),a&&(n.position.left=r._convertPositionTo("relative",{top:0,left:c-r.helperProportions.width}).left)),!r.snapElements[p].snapping&&(o||i||s||a||d)&&r.options.snap.snap&&r.options.snap.snap.call(r.element,t,e.extend(r._uiHash(),{snapItem:r.snapElements[p].item})),r.snapElements[p].snapping=o||i||s||a||d)}}),e.ui.plugin.add("draggable","stack",{start:function(t,n,r){var o,i=r.options,s=e.makeArray(e(i.stack)).sort((function(t,n){return(parseInt(e(t).css("zIndex"),10)||0)-(parseInt(e(n).css("zIndex"),10)||0)}));s.length&&(o=parseInt(e(s[0]).css("zIndex"),10)||0,e(s).each((function(t){e(this).css("zIndex",o+t)})),this.css("zIndex",o+s.length))}}),e.ui.plugin.add("draggable","zIndex",{start:function(t,n,r){var o=e(n.helper),i=r.options;o.css("zIndex")&&(i._zIndex=o.css("zIndex")),o.css("zIndex",i.zIndex)},stop:function(t,n,r){var o=r.options;o._zIndex&&e(n.helper).css("zIndex",o._zIndex)}}),e.ui.draggable}));var S=null,C=32,N=function t(n){"use strict";var o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:function(){},i=this;s(this,t),this.title=n,this.buttonAction=o,this.button=e(r)("").prop({href:"javascript:;",class:"dropdown-button",id:n.toLowerCase()}).text(n+"▼"),S.append(this.button),this.button.on("click",(function(e){return e.preventDefault(),i.buttonAction(),!1}))};function j(){S=e(r)("div#topbar"),T("pintopbar",!0)?S.css({"z-index":"9001",position:"fixed"}):S.css({position:"absolute",top:"0px"}),C=S.outerHeight()+4}var D=function(){};function A(){for(var t=arguments.length,n=new Array(t),o=0;o0&&void 0!==arguments[0]?arguments[0]:{},n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[];void 0===t.class&&(t.class="lightbox");var i={display:"inline-block",top:"50%",left:"50%",transform:"translate(-50%, -50%)","max-width":"80%","max-height":"80%",right:"auto",bottom:"auto"};for(var s in i)void 0===n[s]&&(n[s]=i[s]);var a=e(r)("
").prop(t).css(n).prependTo(document.body).append(o);return e(r)("
").prop({class:"lightbox-bg"}).on("click",(function(){A(this)})).prependTo(document.body),a}function L(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",n=arguments.length>1&&void 0!==arguments[1]&&arguments[1],o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:D,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"",s=e(r)("