From 92fc782ad2f541702b43f787916025745be6bbca Mon Sep 17 00:00:00 2001 From: beccasafan Date: Sat, 22 Aug 2020 17:43:47 -0500 Subject: [PATCH 1/2] shorten posts extension: update for react and remove options that aren't relevant anymore with NPF --- Extensions/shorten_posts.css | 2 + Extensions/shorten_posts.js | 242 +++++++++++++++++------------------ Extensions/xkit_patches.js | 14 +- 3 files changed, 130 insertions(+), 128 deletions(-) diff --git a/Extensions/shorten_posts.css b/Extensions/shorten_posts.css index f82aa1d27..88a70c919 100644 --- a/Extensions/shorten_posts.css +++ b/Extensions/shorten_posts.css @@ -36,4 +36,6 @@ background: rgba(255,255,255,0.95); border-top: 1px solid rgba(0,0,0,0.22); margin-left: 0; + z-index: 1; + margin-bottom: 0; } diff --git a/Extensions/shorten_posts.js b/Extensions/shorten_posts.js index eafc7888d..01ed3885a 100644 --- a/Extensions/shorten_posts.js +++ b/Extensions/shorten_posts.js @@ -1,7 +1,7 @@ //* TITLE Shorten Posts **// -//* VERSION 0.2.4 **// +//* VERSION 0.2.5 **// //* DESCRIPTION Makes scrolling easier **// -//* DETAILS This extension shortens long posts, so if you are interested, you can just click on Show Full Post button to see it all, or scroll down if you are not interested. Useful for screens where long posts take a lot of space, and making it hard to scroll down.

By default, this extension shortens text posts. You can toggle settings to choose which types of posts to shorten. (This will 'cut off' long, vertical posts.) **// +//* DETAILS This extension shortens long posts, so if you are interested, you can just click on Show Full Post button to see it all, or scroll down if you are not interested. Useful for screens where long posts take a lot of space, and making it hard to scroll down. **// //* DEVELOPER STUDIOXENIX **// //* FRAME false **// //* BETA false **// @@ -17,163 +17,105 @@ XKit.extensions.shorten_posts = new Object({ height_default: 350, preferences: { - sep0: { - text: "When to shorten posts", - type: "separator" - }, - text_too: { - text: "Check and shorten text posts", - default: true, - value: true - }, - photos_too: { - text: "Check and shorten photo posts and photosets", - default: false, - value: false - }, - audio_too: { - text: "Check and shorten audio posts", - default: false, - value: false - }, - asks_too: { - text: "Check and shorten replies to asks", - default: false, - value: false - }, - videos_too: { - text: "Check and shorten video posts", - default: false, - value: false - }, - chat_too: { - text: "Check and shorten chat posts", - default: false, - value: false - }, - links_too: { - text: "Check and shorten link posts", - default: false, - value: false - }, - quotes_too: { - text: "Check and shorten quote posts", - default: false, - value: false - }, height: { text: "Maximum post height (what is this?)", type: "text", default: "350", value: "350" }, - sep1: { - text: "Appearance and behaviour options", - type: "separator" - }, display_tags: { text: "Display the tags on shortened posts", default: true, value: true - }, - embiggen_on_click: { - text: "Embiggen photo posts when I click on the thumbnail", - default: true, - value: true } }, + tagsCss: null, + wrapperCss: null, + avatarCss: null, + processing: false, + run: function() { this.running = true; XKit.extensions.shorten_posts.cpanel_check_height(); - if ($(".posts .post").length > 0) { + if ($("[data-id], .posts .post").length > 0) { XKit.tools.init_css("shorten_posts"); - $(document).on("click", ".xkit-shorten-posts-embiggen", XKit.extensions.shorten_posts.embiggen); - XKit.post_listener.add("shorten_posts", XKit.extensions.shorten_posts.check); - XKit.extensions.shorten_posts.check(); + + if (XKit.page.react) { + XKit.css_map.getCssMap().then(map => { + this.tagsCss = XKit.css_map.keyToCss("tags"); + this.wrapperCss = XKit.css_map.keyToCss("impressionLoggingWrapper"); + this.avatarCss = XKit.css_map.keyToCss("stickyContainer"); + + XKit.tools.add_css(`${XKit.css_map.keyToCss("baseContainer")} { z-index: 99; }`, "shorten_posts"); + XKit.post_listener.add("shorten_posts", XKit.extensions.shorten_posts.react_check); + XKit.extensions.shorten_posts.react_check(); + }); + } else { + $(document).on("click", ".xkit-shorten-posts-embiggen", XKit.extensions.shorten_posts.embiggen); + XKit.post_listener.add("shorten_posts", XKit.extensions.shorten_posts.check); + XKit.extensions.shorten_posts.check(); + } } }, - check: function() { + react_check: async function() { + if (XKit.extensions.shorten_posts.processing === true) { + return; + } + XKit.extensions.shorten_posts.processing = true; + + const $posts = await XKit.interface.react.get_posts(["xkit-shorten-posts-done", "xkit-shorten-posts-embiggened"]); + $posts + .addClass("xkit-shorten-posts-done") + .each(function() { + var $this = $(this); + if ($(this).hasClass("xblacklist_blacklisted_post")) { return; } + + var height = $this.height(); + + if (height >= XKit.extensions.shorten_posts.preferences.height.value) { + XKit.extensions.shorten_posts.react_short($(this), height); + } + }); + + XKit.extensions.shorten_posts.processing = false; + }, + + check: function() { var shortened_count = 0; $(".posts .post").not(".xkit-shorten-posts-done").not(".xkit-shorten-posts-embiggened").each(function() { - var m_height = $(this).height(); $(this).addClass("xkit-shorten-posts-done"); if ($(this).hasClass("xblacklist_blacklisted_post")) { return; } - var dont_return = false; - if (XKit.extensions.shorten_posts.preferences.text_too.value - && $(this).hasClass("is_regular")) { - dont_return = true; - } - if (XKit.extensions.shorten_posts.preferences.photos_too.value - && ($(this).hasClass("is_photo") || $(this).hasClass("is_photoset"))) { - dont_return = true; - } - if (XKit.extensions.shorten_posts.preferences.audio_too.value - && $(this).hasClass("is_audio")) { - dont_return = true; - } - if (XKit.extensions.shorten_posts.preferences.links_too.value - && $(this).hasClass("is_link")) { - dont_return = true; - } - if (XKit.extensions.shorten_posts.preferences.chat_too.value - && $(this).hasClass("is_conversation")) { - dont_return = true; - } - if (XKit.extensions.shorten_posts.preferences.quotes_too.value - && $(this).hasClass("is_quote")) { - dont_return = true; - } - if (XKit.extensions.shorten_posts.preferences.asks_too.value - && $(this).hasClass("is_note")) { - dont_return = true; - } - if (XKit.extensions.shorten_posts.preferences.videos_too.value - && $(this).hasClass("is_video")) { - dont_return = true; - } - - if (!dont_return) { - return; - } if (m_height >= XKit.extensions.shorten_posts.preferences.height.value) { XKit.extensions.shorten_posts.short($(this), m_height); shortened_count++; } - }); if (shortened_count > 0) { - // Call Tumblr scroll helper update thingy. XKit.tools.add_function(function() { Tumblr.Events.trigger("DOMEventor:updateRect"); }, true, ""); } - }, embiggen: function(e) { - var obj = e.target; - if ($(obj).hasClass("image_thumbnail") === true) { - obj = $(obj).parentsUntil(".post").parent().find(".xkit-shorten-posts-embiggen"); - } - var m_height = $(obj).attr('data-old-height'); - var post_div = $(obj).parent(); + var post_div = $(obj).parents(".xkit-shorten-posts-shortened"); var m_speed = 200 + (m_height / 2); @@ -188,13 +130,54 @@ XKit.extensions.shorten_posts = new Object({ $(this).removeClass("xkit-shorten-posts-shortened"); $(this).removeClass("xkit-shorten-posts-shortened-show-tags"); $(this).addClass("xkit-shorten-posts-embiggened"); - $(this).css('height', 'auto'); + + if (XKit.page.react) { + const $article = $(this).find("article"); + const $avatar = $(this).find(".xkit-shorten-posts-shortened-avatar"); + + $avatar.contents().prependTo($article); + $avatar.remove(); + $article.removeClass("post_wrapper"); + $(this).find(".post_tags").removeClass("post_tags"); + + $(this).find(XKit.extensions.shorten_posts.wrapperCss).css("height", "auto"); + $(this).css("height", "auto"); + } else { + $(this).css('height', 'auto'); + } }); }, - short: function(obj, m_height) { + react_short: function(obj, height) { + var $obj = $(obj); + if ($obj.hasClass("xblacklist_blacklisted_post")) { $obj.removeClass("xkit-shorten-posts-shortened-show-tags"); return; } + + const $article = $obj.find("article"); + + const container_css = $article.attr("class"); + const post_id = $obj.attr("data-id"); + + $obj.attr("data-old-height", height); + $obj.find(XKit.extensions.shorten_posts.wrapperCss).css("height", XKit.extensions.shorten_posts.preferences.height.value + "px"); + $article.addClass("post_wrapper"); + + const $avatar_wrapper = $(`
`); + $article.find(XKit.extensions.shorten_posts.avatarCss).appendTo($avatar_wrapper); + $article.before($avatar_wrapper); + + $obj.addClass("xkit-shorten-posts-shortened"); + + $article.append("
This post has been shortened. Click here to show the full post
"); + $article.on("click", ".xkit-shorten-posts-embiggen", XKit.extensions.shorten_posts.embiggen); + + if (XKit.extensions.shorten_posts.preferences.display_tags.value === true) { + $obj.find(XKit.extensions.shorten_posts.tagsCss).addClass("post_tags"); + $obj.addClass("xkit-shorten-posts-shortened-show-tags"); + } + }, + short: function(obj, m_height) { if ($(obj).hasClass("xblacklist_blacklisted_post")) { $(obj).removeClass("xkit-shorten-posts-shortened-show-tags"); return; } var post_id = $(obj).attr('data-post-id'); @@ -211,34 +194,43 @@ XKit.extensions.shorten_posts = new Object({ if (XKit.extensions.shorten_posts.preferences.embiggen_on_click.value === true) { $(obj).find(".image_thumbnail").on("click", XKit.extensions.shorten_posts.embiggen); } - }, destroy: function() { - this.running = false; + const $posts = $(XKit.page.react ? "[data-id]" : ".post"); - // Remove all the stuff we've added. - $(".xkit-shorten-posts-embiggen").remove(); - - $(".post.xkit-shorten-posts-shortened").each(function() { + (XKit.page.react ? $posts.find(XKit.extensions.shorten_posts.wrapperCss) : $posts).each(function() { $(this).css('height', 'auto'); }); - $(".xkit-shorten-posts-embiggen").off("click", XKit.extensions.shorten_posts.embiggen); + $posts.removeClass("xkit-shorten-posts-shortened-show-tags xkit-shorten-posts-done xkit-shorten-posts-embiggened xkit-shorten-posts-shortened"); + + // Remove all the stuff we've added. + $(".xkit-shorten-posts-embiggen").remove(); + + if (XKit.page.react) { + $posts.find(".post_wrapper").removeClass("post_wrapper"); + $posts.find(".post_tags").removeClass("post_tags"); - $(".post").removeClass("xkit-shorten-posts-shortened"); - $(".post").removeClass("xkit-shorten-posts-embiggened"); - $(".post").removeClass("xkit-shorten-posts-shortened-show-tags"); - $(".post").removeClass("xkit-shorten-posts-done"); + $posts.each(function() { + const $avatar = $(this).find(".xkit-shorten-posts-shortened-avatar"); + $avatar.contents().prependTo($(this).find("article")); + $avatar.remove(); + }); - XKit.tools.remove_css("shorten_posts"); + $posts.find("article").off("click", ".xkit-shorten-posts-embiggen", XKit.extensions.shorten_posts.embiggen); - // Call Tumblr scroll helper update thingy. - XKit.tools.add_function(function() { - Tumblr.Events.trigger("DOMEventor:updateRect"); - }, true, ""); + } else { + $(document).off("click", ".xkit-shorten-posts-embiggen", XKit.extensions.shorten_posts.embiggen); + // Call Tumblr scroll helper update thingy. + XKit.tools.add_function(function() { + Tumblr.Events.trigger("DOMEventor:updateRect"); + }, true, ""); + } + XKit.post_listener.remove("shorten_posts"); + XKit.tools.remove_css("shorten_posts"); }, cpanel_check_height: function() { diff --git a/Extensions/xkit_patches.js b/Extensions/xkit_patches.js index 962b01358..c81fe7203 100644 --- a/Extensions/xkit_patches.js +++ b/Extensions/xkit_patches.js @@ -1,5 +1,5 @@ //* TITLE XKit Patches **// -//* VERSION 7.4.9 **// +//* VERSION 7.4.10 **// //* DESCRIPTION Patches framework **// //* DEVELOPER new-xkit **// @@ -830,7 +830,11 @@ XKit.extensions.xkit_patches = new Object({ var exclusions = [".radar", ".new_post_buttons", ".post_micro"]; if (typeof without_tag !== "undefined") { - exclusions.push("." + without_tag); + if (!Array.isArray(without_tag)) { + without_tag = [without_tag]; + } + + without_tag.forEach(tag => exclusions.push("." + without_tag)); } for (var i = 0; i < exclusions.length; i++) { @@ -924,7 +928,11 @@ XKit.extensions.xkit_patches = new Object({ get_posts: async function(without_tag, can_edit) { let selector = "[data-id]"; if (without_tag !== undefined) { - selector += `:not(.${without_tag})`; + if (!Array.isArray(without_tag)) { + without_tag = [without_tag]; + } + + selector += `:not(${without_tag.map(tag => "." + tag).join(",")})`; } var $posts = $(selector); From 3521623aeab9dfbc555b2dce62cee190d0bf5b4b Mon Sep 17 00:00:00 2001 From: beccasafan Date: Mon, 24 Aug 2020 21:59:33 -0500 Subject: [PATCH 2/2] add a threshold pref, discussed in discord --- Extensions/shorten_posts.js | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/Extensions/shorten_posts.js b/Extensions/shorten_posts.js index 01ed3885a..8e79b10f1 100644 --- a/Extensions/shorten_posts.js +++ b/Extensions/shorten_posts.js @@ -23,6 +23,12 @@ XKit.extensions.shorten_posts = new Object({ default: "350", value: "350" }, + threshold: { + text: 'Minimum hidden height (what is this?)', + type: "text", + default: "50", + value: "50" + }, display_tags: { text: "Display the tags on shortened posts", default: true, @@ -78,7 +84,7 @@ XKit.extensions.shorten_posts = new Object({ var height = $this.height(); - if (height >= XKit.extensions.shorten_posts.preferences.height.value) { + if (height >= parseInt(XKit.extensions.shorten_posts.preferences.height.value, 10) + parseInt(XKit.extensions.shorten_posts.preferences.threshold.value, 10)) { XKit.extensions.shorten_posts.react_short($(this), height); } }); @@ -95,8 +101,7 @@ XKit.extensions.shorten_posts = new Object({ if ($(this).hasClass("xblacklist_blacklisted_post")) { return; } - - if (m_height >= XKit.extensions.shorten_posts.preferences.height.value) { + if (m_height >= parseInt(XKit.extensions.shorten_posts.preferences.height.value, 10) + parseInt(XKit.extensions.shorten_posts.preferences.threshold.value, 10)) { XKit.extensions.shorten_posts.short($(this), m_height); shortened_count++; } @@ -251,9 +256,10 @@ XKit.extensions.shorten_posts = new Object({ cpanel: function(div) { $("#xkit-shorten-posts-height-help").click(function() { - XKit.window.show("Maximum post height", "XKit will shorten posts longer than the height entered here.

The minimum value you can enter is 200, and the maximum is " + XKit.extensions.shorten_posts.height_max + ". If you enter a value bigger or smaller than these, XKit will return to it's default value, which is 350 pixels.", "info", "
OK
"); - + }); + $("#xkit-shorten-posts-threshold-help").click(function() { + XKit.window.show("Minimum hidden height", "XKit will only shorten posts if there is at least the height entered here to be hidden.

This will avoid shortening posts that have little to expand.", "info", "
OK
"); }); }