friendica-addons/showmore_dyn/showmore_dyn.js

87 lines
2.2 KiB
JavaScript
Raw Normal View History

var nextBodyIdx = 0;
2020-03-15 13:34:51 +01:00
$(document).ready(function() {
$("head").append('<style type="text/css"></style>');
var newStyleElement = $("head").children(':last');
newStyleElement.html('.limit-height{max-height: ' + postLimitHeight + 'px; overflow: hidden; display:inline-block;}');
2020-03-13 22:09:21 +01:00
handleNewWallItemBodies();
2020-03-12 23:24:54 +01:00
2020-03-13 22:09:21 +01:00
document.addEventListener("postprocess_liveupdate", function() {
handleNewWallItemBodies();
});
2020-03-12 23:24:54 +01:00
});
function handleNewWallItemBodies() {
2020-03-13 22:09:21 +01:00
$('.wall-item-body:not(.showmore-done)').each(function() {
var $el = $(this);
$el.addClass('showmore-done');
if ($el.has('button.content-filter-button').length > 0) {
$el.removeClass('limitable');
return;
}
2020-03-12 23:24:54 +01:00
if (!$el.attr("id")) {
$el.attr("id", nextBodyIdx++);
}
2020-03-13 22:09:21 +01:00
addHeightToggleHandler($el);
var limited = processHeightLimit($el);
2020-03-12 23:24:54 +01:00
2020-03-13 22:09:21 +01:00
if (!limited) {
2020-03-15 13:34:51 +01:00
var mutationObserver = new MutationObserver(function() {
2020-03-13 22:09:21 +01:00
var limited = processHeightLimit($el);
if (limited) {
mutationObserver.disconnect()
}
});
2020-03-15 13:34:51 +01:00
mutationObserver.observe($el[0], {
attributes: true,
characterData: true,
childList: true,
subtree: true,
attributeOldValue: true,
characterDataOldValue: true
});
2020-03-12 23:24:54 +01:00
2020-03-15 13:34:51 +01:00
$el.imagesLoaded().then(function() {
2020-03-13 22:09:21 +01:00
processHeightLimit($el);
});
}
});
2020-03-12 23:24:54 +01:00
}
2020-03-13 22:09:21 +01:00
function addHeightToggleHandler($item) {
var itemId = parseInt($item.attr("id").replace("wall-item-body-", ""));
$item.data("item-id", itemId);
var toggleId = "wall-item-body-toggle-" + itemId;
2020-03-12 23:24:54 +01:00
$item.append('<div class="wall-item-body-toggle" data-item-id="' + itemId + '" id="' + toggleId + '" ><button type="button" class="wall-item-body-toggle-text">' + showmore_dyn_showmore_linktext + '</button></div>');
2020-03-13 22:09:21 +01:00
$item.addClass("limitable limit-height");
2020-03-12 23:24:54 +01:00
2020-03-13 22:09:21 +01:00
var $toggle = $("#" + toggleId);
$toggle.show();
$toggle.click(function(el) {
$item.toggleClass("limit-height");
$(this).hide();
$item.removeClass("limitable");
});
2020-03-12 23:24:54 +01:00
}
2020-03-13 22:09:21 +01:00
function processHeightLimit($item) {
if (!$item.hasClass("limitable")) {
return false;
}
2020-03-12 23:24:54 +01:00
2020-03-13 22:09:21 +01:00
var itemId = $item.data("item-id");
var $toggle = $("#wall-item-body-toggle-" + itemId);
if ($item.height() < postLimitHeight) {
2020-03-13 22:09:21 +01:00
$item.removeClass("limit-height");
$toggle.hide();
return false;
} else {
$item.addClass("limit-height");
$toggle.show();
return true;
}
2020-03-12 23:24:54 +01:00
}