// ==UserScript==
// @name TapTap游戏社区列表页贴子预览
// @namespace TapTap游戏社区列表页贴子预览
// @version 1.0.0
// @description TapTap游戏社区列表页贴子(除图片和视频贴)卡片新增预览按钮,可在列表页直接预览贴子内容。
// @author QIAN
// @match *://www.taptap.com/app*
// @grant none
// @require https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js
// @downloadURL none
// ==/UserScript==
$(function() {
//创建预览和取消预览按钮
var pvBtn = "
预览";
var pvBtnClose = "取消预览";
//创建预览贴子样式
var pvCss = '';
//在除图片和视频贴以外的贴子卡片上追加预览和取消预览按钮
$(".topic-item[data-filter-id*='topic'] .item-text-footer").prepend(pvBtn);
$(".topic-item[data-filter-id*='topic'] .item-text-footer").prepend(pvBtnClose);
//遍历每个贴子
$(".topic-item[data-filter-id*='topic']").each(function() {
//获取贴子链接
var postLink = $(this).find(".topic-share").attr("data-share-url");
//创建预览贴子容器
var pvBox = ``;
//获取预览按钮相对文档顶部的偏移量
var pvBtnOffset = $(this).find(".pvBtn").offset().top;
//为预览按钮添加点击事件
$(this).find(".pvBtn").click(function() {
//浏览器滚动条自动定位至预览按钮
$("html,body").animate({ scrollTop: pvBtnOffset - 12 + "px" }, 300);
//显示贴子内容
$(this).parents(".topic-item[data-filter-id*='topic']").append(pvBox);
$(this).parents(".topic-item[data-filter-id*='topic']").find(".pvBox").load(`${postLink} .topic-content`);
$(this).parents(".topic-item[data-filter-id*='topic']").append(pvCss);
//隐藏预览按钮,显示取消预览按钮
$(this).css("display", "none");
$(this).siblings(".pvBtnClose").css("display", "block");
//移除其他贴子的预览内容及样式文件,并切换预览按钮为取消预览按钮
$(this).parents(".topic-item[data-filter-id*='topic']").siblings().find(".pvBox").remove();
$(this).parents(".topic-item[data-filter-id*='topic']").siblings().find(".pvStyle").remove();
$(this).parents(".topic-item[data-filter-id*='topic']").siblings().find(".pvBtnClose").css("display", "none");
$(this).parents(".topic-item[data-filter-id*='topic']").siblings().find(".pvBtn").css("display", "block");
});
//为取消预览按钮添加点击事件
$(this).find(".pvBtnClose").click(function() {
//移除贴子的预览内容及样式文件,并切换预览按钮为取消预览按钮
$(this).parents(".topic-item[data-filter-id*='topic']").find(".pvBox").remove();
$(this).parents(".topic-item[data-filter-id*='topic']").find(".pvStyle").remove();
$(this).css("display", "none");
$(this).siblings(".pvBtn").css("display", "block");
});
});
});