☰

LynxChan Extended Minus Minus

LynxChan Extended with even more features

安装此脚本？
作者推荐脚本

您可能也喜欢8chan-buffs。

安装此脚本 
  1. // ==UserScript==
  2. // @name         LynxChan Extended Minus Minus
  3. // @namespace    https://rentry.org/8chanMinusMinus
  4. // @version      2.3.18
  5. // @description  LynxChan Extended with even more features
  6. // @author       SaddestPanda & Dandelion & /gfg/
  7. // @license      UNLICENSE
  8. // @match        *://8chan.moe/*
  9. // @match        *://8chan.se/*
  10. // @match        *://8chan.cc/*
  11. // @match        *://alephchvkipd2houttjirmgivro5pxullvcgm4c47ptm7mhubbja6kad.onion/*
  12. // @grant        GM.getValue
  13. // @grant        GM.setValue
  14. // @grant        GM.deleteValue
  15. // @grant        GM.registerMenuCommand
  16. // @run-at       document-start
  17. // ==/UserScript==
  18.  
  19. //TODO LATER MAYBE: combine all CSS into one <style> and use classes on html or body instead.
  20. (async function () {
  21.     "use strict";
  22.  
  23.     const REGEX_THREAD = /\/res|last\//;
  24.     const SETTINGS_DEFINITIONS = {
  25.         firstRun:{
  26.             default:true,
  27.             hidden:true,
  28.             desc:"You shouldn't be able to see this setting! (firstRun)"
  29.         },
  30.         addKeyboardHandlers:{
  31.             default:true,
  32.             desc:"Add keyboard Ctrl+ hotkeys to the quick reply box (Disable this for 8chanSS compatibility)"
  33.         },
  34.         showScrollbarMarkers:{
  35.             default:true,
  36.             type:"checkbox_with_colors",
  37.             desc:"Show your posts and replies on the scrollbar",
  38.             color1Default:"#0092ff",
  39.             color1Desc:"<b>Your marker:</b>",
  40.             color2Default:"#a8d8f8",
  41.             color2Desc:"<b>Reply marker:</b>"
  42.         },
  43.         spoilerImageType:{
  44.             default:"off",
  45.             desc:"Override how the spoiler thumbnail looks:",
  46.             type:"radio",
  47.             options:{
  48.                 off:"Don't change the thumbnail.",
  49.                 reveal:"Reveal spoilers <span class='altText lineBefore'>(Previously spoilered images will have a red border around them indicating that they're spoilers.)</span>",
  50.                 reveal_blur:"Change to a blurred thumbnail <span class='altText lineBefore'>(Unblurred when you hover your mouse over.)</span>",
  51.                 kachina:"Makes the spoiler image Kachina from Genshin Impact.",
  52.                 thread:`<b>Use <b style="color: var(--link-color);">"ThreadSpoiler.jpg"</b> from the current thread <span class="altText lineBefore">(first posted jpg, png or webp image with that filename)</span></b>`,
  53.                 threadAlt:`same as above with the filename <b style="color: var(--link-color);">"ThreadSpoilerAlt.jpg"</b> <span class="altText lineBefore">(jpg, png or webp; uses ThreadSpoiler.jpg until this is found)</span>`,
  54.                 //test:`[TEST OPTION] Set custom spoiler thumb per-thread (For /gacha/ only!)`
  55.             },
  56.             nonewline:true
  57.         },
  58.         overrideBoardSpoilerImage: {
  59.             default:true,
  60.             parent:"spoilerImageType",
  61.             //Not implemented yet
  62.             //depends: function() {return settings.spoilerImageType != "off"},
  63.             desc:"Also override board's custom thumbnail image <span class='altText lineBefore'>(for example, /v/'s spoiler thumbnail is an image of a monitor with a ? inside it)</span>"
  64.         },
  65.         revealSpoilerText:{
  66.             default:"off",
  67.             desc:"Reveal the spoiler text. Or make it into madoka runes.",
  68.             type:"radio",
  69.             options:{
  70.                 off:"Don't reveal spoilers.",
  71.                 on:"Spoilers will be always be shown by turning the text white.",
  72.                 madoka:`Spoilers will turn into madoka runes. Please install <a href="https://www.dropbox.com/s/n6ys414nviitr9y/MadokaRunes-2.0.ttf"><u>MadokaRunes.ttf</u></a> for it to show up properly.`
  73.             }
  74.         },
  75.         markPostEdge:{
  76.             default:true,
  77.             type:"checkbox_with_colors",
  78.             desc:"<span class='boldText'>Style:</span> Mark your posts and replies <span class='altText'>(with a left border)</span>",
  79.             color1Default:"#4BB2FF",
  80.             color1Desc:"<b>Your border:</b>",
  81.             color2Default:"#0066ff",
  82.             color2Desc:"<b>Reply border:</b>",
  83.             nonewline:true
  84.         },
  85.         markYouText:{
  86.             default:true,
  87.             type:"checkbox_with_colors",
  88.             desc:"<span class='boldText'>Style:</span> Color your name and (You) links",
  89.             color1Default:"#ff2222",
  90.             color1Desc:"<b>Color:</b>",
  91.             nonewline:true
  92.         },
  93.         compactPosts:{
  94.             default:true,
  95.             desc:"<span class='boldText'>Style:</span> Make thumbnails and posts more compact",
  96.             nonewline:true
  97.         },
  98.         showStubs:{
  99.             default:true,
  100.             desc:"<span class='boldText'>Style:</span> Show post stubs when filtering",
  101.             nonewline:true
  102.         },
  103.         //I swear this used to be a built in option on 8chan
  104.         halfchanGreentexts:{
  105.             default:false,
  106.             desc:"<span class='boldText'>Style:</span> Make the greentext brighter like 4chan"
  107.         },
  108.         glowFirstPostByID:{
  109.             default:true,
  110.             type:"checkbox_with_colors",
  111.             desc:"Mark new/unique posters by adding a glow effect to their ID",
  112.             color1Default:"#26bf47",
  113.             color1Desc:"<b>Glow color:</b>",
  114.             nonewline:true
  115.         },
  116.         showPostIndex:{
  117.             default:true,
  118.             type:"checkbox_with_colors",
  119.             desc:"Show the current index of a post on the thread. <span class='altText'>(OP: 1, first post: 2 etc.)</span>",
  120.             color1Default:"#7b3bcc",
  121.             color1Desc:"<b>Index color:</b>",
  122.             nonewline:true
  123.         },
  124.         showWatcherOnLoad: {
  125.             default:false,
  126.             desc:'Show the "Watched Threads" popup on page load',
  127.             nonewline:true
  128.         },
  129.         showVideoIcons: {
  130.             default:true,
  131.             desc:"Distinguish videos, gifs and audio with an icon before the filename"
  132.         },
  133.         preserveQuickReply:{
  134.             default:false,
  135.             desc:"Preserve the quick reply text when closing the box or refreshing the page",
  136.             nonewline:true
  137.         },
  138.         preserveName:{
  139.             default:false,
  140.             desc:"Preserve the last used name between page refreshes"
  141.         },
  142.         reverseSearchOptions:{
  143.             default:{
  144.                 pixiv:true,
  145.                 booru:true,
  146.                 saucenao:true
  147.             },
  148.             desc:"Reverse image search buttons to show:",
  149.             type:"checkbox_multiple_dict", //Maybe "multiple_array" or "bitfield" types allowed in the future
  150.             options:{
  151.                 pixiv:"Pixiv <span class='altText lineBefore'>Shown if the filename matches an image downloaded from Pixiv</span>",
  152.                 booru:"Gelbooru / Danbooru / Safebooru <span class='altText lineBefore'>Shown if the filename contains an md5 hash</span>",
  153.                 saucenao:"Saucenao <span class='altText lineBefore'>Always shown, uses JS to download and reupload the image to saucenao</span>"
  154.             },
  155.             nonewline:true
  156.         },
  157.         reverseSearchBooruSite:{
  158.             desc:"Booru to link if the above option is enabled",
  159.             type:"dropdown",
  160.             default:"gelbooru",
  161.             choices:{
  162.                 "gelbooru":"https://gelbooru.com/index.php?page=post&s=list&tags=md5%3a",
  163.                 "danbooru":"https://danbooru.donmai.us/posts?tags=md5%3a",
  164.                 "safebooru":"https://safebooru.org/index.php?page=post&s=list&tags=md5%3a"
  165.             }
  166.         }
  167.         /*redirectToCatalog:{
  168.             default:false,
  169.             desc:"Redirect to catalog when clicking on the index."
  170.         }*/
  171.     }
  172.  
  173.     const settingsNames = Object.keys(SETTINGS_DEFINITIONS);
  174.  
  175.     //Collect all color fields for checkbox_with_colors settings
  176.     //In the userscript storage they look like settingName_color1 etc.
  177.     const colorSettingKeys = [];
  178.     settingsNames.forEach(key => {
  179.         const def = SETTINGS_DEFINITIONS[key];
  180.         if (def.type === "checkbox_with_colors") {
  181.             Object.keys(def).forEach(k => {
  182.                 const match = k.match(/^color(\d+)Default$/);
  183.                 if (match) {
  184.                     colorSettingKeys.push(`${key}_color${match[1]}`);
  185.                 }
  186.             });
  187.         }
  188.     });
  189.  
  190.     //Compose all keys to load: main settings + color fields
  191.     const allSettingKeys = [...settingsNames, ...colorSettingKeys];
  192.  
  193.     //For each color field, get its default from the definition
  194.     function getDefaultForKey(key) {
  195.         const colorMatch = key.match(/^(.+)_color(\d+)$/);
  196.         if (colorMatch) {
  197.             const [_, base, idx] = colorMatch;
  198.             const def = SETTINGS_DEFINITIONS[base];
  199.             //Return color setting default like color1Default
  200.             return def && def[`color${idx}Default`] ? def[`color${idx}Default`] : undefined;
  201.         }
  202.         //Return regular setting
  203.         return SETTINGS_DEFINITIONS[key]?.default;
  204.     }
  205.  
  206.     const allSettingDefaults = allSettingKeys.map(getDefaultForKey);
  207.     const allSettingValues = await Promise.all(allSettingKeys.map((key, i) => GM.getValue(key, allSettingDefaults[i])));
  208.     const settings = Object.fromEntries(allSettingKeys.map((key, i) => [key, allSettingValues[i]]));
  209.  
  210.     function addMyStyle(newID, newStyle) {
  211.         let myStyle = document.createElement("style");
  212.         //myStyle.type = 'text/css';
  213.         myStyle.id = newID;
  214.         myStyle.textContent = newStyle;
  215.         document.head.appendChild(myStyle);
  216.     }
  217.  
  218.     function waitForDom(callback) {
  219.         if (document.readyState === "loading") {
  220.             //Loading hasn't finished yet. Wait for the inital document to load and start.
  221.             document.addEventListener("DOMContentLoaded", callback);
  222.         } else {
  223.             //Document has already loaded. Start.
  224.             callback();
  225.         }
  226.     }
  227.  
  228.     if (document?.head) {
  229.         runASAP();
  230.     } else {
  231.         //On some environments document.head doesn't exist yet?
  232.         waitForDom(runASAP);
  233.     }
  234.  
  235.     async function runASAP() {
  236.         // Migrations can be removed in a few weeks 
  237.         // Migrations are disabled now. Keeping the code for potential future migrations
  238.  
  239.         // // Migrate old useExtraStylingFixes setting if present
  240.         // const oldStyling = await GM.getValue("useExtraStylingFixes", undefined);
  241.         // if (typeof oldStyling !== "undefined") {
  242.         //     // If oldStyling is false, set both new options to false
  243.         //     if (oldStyling === false) {
  244.         //         settings.markPostEdge = false;
  245.         //         settings.compactPosts = false;
  246.         //         await GM.setValue("markPostEdge", false);
  247.         //         await GM.setValue("compactPosts", false);
  248.         //     }
  249.         //     // Remove the old setting
  250.         //     await GM.deleteValue("useExtraStylingFixes");
  251.         // }
  252.  
  253.         if (settings.preserveName === false) {
  254.             localStorage.removeItem("name");
  255.         }
  256.  
  257.         //Secret tip for anyone manually editing colors:
  258.         //if you edit the saved value in your userscript manager's settings database manually, you can use semi-transparent colors for the color pickers (until you click save on the settings menu).
  259.         //or easier: just copy the relevant part of the css and paste it to the css box in the website settings. Add !important if you want to force it like: color: red !important;
  260.  
  261.         //Apply all the styles as soon as possible
  262.         if (settings.compactPosts) {
  263.             addMyStyle("lynx-compact-posts", `
  264.                 /* smaller thumbnails & image paddings */
  265.                 body .uploadCell img:not(.imgExpanded) {
  266.                     max-width: 160px;
  267.                     max-height: 125px;
  268.                     object-fit: contain;
  269.                     height: auto;
  270.                     width: auto;
  271.                     margin-right: 0em;
  272.                     margin-bottom: 0em;
  273.                 }
  274.  
  275.                 .uploadCell {
  276.                     margin-bottom: 0.45em;
  277.                 }
  278.  
  279.                 .uploadCell .imgLink {
  280.                     margin-right: 1em;
  281.                 }
  282.  
  283.                 /* smaller post spacing (not too much) */
  284.                 .divMessage {
  285.                     margin: .8em .8em .5em 3em;
  286.                 }
  287.  
  288.                 /* file details: reduce paddings and icon sizes */
  289.                 .uploadDetails {
  290.                     & > * {
  291.                         vertical-align: top;
  292.                         font-size: 95%;
  293.                     }
  294.                     & > .dimensionLabel {
  295.                         margin-right: 0.3ch;
  296.                     }
  297.                     .coloredIcon {
  298.                         font-size: 90%;
  299.                     }
  300.                     & > a.nameLink {
  301.                         margin-right: -2.5px;
  302.                     }
  303.                     & > span.hideFileButton {
  304.                         margin-right: -4px;
  305.                     }
  306.                 }
  307.  
  308.                 /* This thing adds an unnecessary line break (only on chrome) */
  309.                 .uploadCell > details > summary + br {
  310.                     display: none;
  311.                 }
  312.  
  313.                 /* Contain expanded images to the page */
  314.                 .imgExpanded {
  315.                     max-height: 100vh; 
  316.                     object-fit: contain;
  317.                 }
  318.  
  319.             `);
  320.         }
  321.  
  322.         const markerColor1 = settings.showScrollbarMarkers_color1 || SETTINGS_DEFINITIONS.showScrollbarMarkers.color1Default;
  323.         const markerColor2 = settings.showScrollbarMarkers_color2 || SETTINGS_DEFINITIONS.showScrollbarMarkers.color2Default;
  324.         const indexColor = settings.showPostIndex_color1 || SETTINGS_DEFINITIONS.showPostIndex.color1Default;
  325.         const glowColor = settings.glowFirstPostByID_color1 || SETTINGS_DEFINITIONS.glowFirstPostByID.color1Default;
  326.         addMyStyle("lynx-extended-css", `
  327.         :root {
  328.             --showScrollbarMarkers_color1: ${markerColor1};
  329.             --showScrollbarMarkers_color2: ${markerColor2};
  330.             --showPostIndex_color1: ${indexColor};
  331.             --glowFirstPostByID_color1: ${glowColor};
  332.         }
  333.  
  334.         /* Booru links */
  335.         /* For multiple uploads the button is below the image, for single upload it's next to the filename */
  336.         /* single upload buttons can also be moved below the image by setting the innerPost as relative. */
  337.         .lynxReverseImageSearch a:hover {
  338.             text-decoration: underline;
  339.         }
  340.         .lynxReverseImageSearch > a {
  341.             margin: 0 4px 0 1px;
  342.  
  343.             &.fetch-awaiting:after {
  344.                 content: attr(data-booruname)" (please wait...)" !important;
  345.             }
  346.  
  347.             &.fetch-failed:after {
  348.                 content: attr(data-booruname)" (failed!)" !important;
  349.             }
  350.  
  351.             & > svg {
  352.                 margin-block: -2.5px;
  353.                 height: 1em;
  354.                 width: 1em;
  355.             }
  356.         }
  357.  
  358.         .panelUploads:not(.multipleUploads) .lynxReverseImageSearch > a:after, lynxReverseImageSearch.showSearchNames > a:after {
  359.             content: attr(data-booruname);
  360.         }
  361.  
  362.         .multipleUploads .uploadCell:has(.lynxReverseImageSearch) {
  363.             position: relative;
  364.         }
  365.  
  366.         .multipleUploads .lynxReverseImageSearch {
  367.             position: absolute;
  368.             bottom: 0;
  369.             left: 0;
  370.             z-index: 2; /* Fixes the button not being clickable if you have spoiler thumbs disabled */
  371.  
  372.             & a {
  373.                 font-size: 0.9em;
  374.                 filter: drop-shadow(0px 0px 1px black) drop-shadow(0px 0px 1px var(--contrast-color)) drop-shadow(0px 0px 1px var(--contrast-color));
  375.                 &:hover,
  376.                 &:active {
  377.                     background: var(--contrast-color);
  378.                     opacity: 0.9;
  379.                     max-width: 999px;
  380.                     &:after {
  381.                         content: attr(data-booruname);
  382.                     }
  383.                 }
  384.             }
  385.         }
  386.  
  387.         /* video icons for filenames */
  388.         a.originalNameLink.lynx-video::before {
  389.             content: "\\e0a9";
  390.             font-family: "Icons"; /* open-iconic font from the page */
  391.             font-size: 90%;
  392.             margin-right: 2px;
  393.         }
  394.  
  395.         /* Scrollbar you and reply markers */
  396.         .marker-container {
  397.             position: fixed;
  398.             top: 8px;
  399.             right: 0px;
  400.             width: 10px;
  401.             height: calc(100vh - 16px);
  402.             z-index: 11000;
  403.             pointer-events: none;
  404.         }
  405.  
  406.         .marker {
  407.             position: absolute;
  408.             width: 100%;
  409.             height: 7px;
  410.             background: var(--showScrollbarMarkers_color1);
  411.             cursor: pointer;
  412.             pointer-events: auto;
  413.             border-radius: 40% 0 0 40%;
  414.             z-index: 5;
  415.             filter: drop-shadow(0px 0px 1px #000000BA);
  416.         }
  417.  
  418.         .marker.alt {
  419.             background: var(--showScrollbarMarkers_color2);
  420.             z-index: 2;
  421.         }
  422.  
  423.         .postNum.index {
  424.             color: var(--showPostIndex_color1);
  425.             font-weight: bold;
  426.         }
  427.  
  428.         .labelId.glows {
  429.             box-shadow: 0 0 15px var(--glowFirstPostByID_color1);
  430.         }
  431.  
  432.         #lynxExtendedMenu {
  433.             position: fixed;
  434.             top: 15px;
  435.             left: 50%;
  436.             transform: TranslateX(-50%);
  437.             padding: 10px;
  438.             z-index: 10000;
  439.             font-family: Arial, sans-serif;
  440.             font-size: 14px;
  441.             box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
  442.             background: var(--contrast-color);
  443.             color: var(--text-color);
  444.             border: 1px solid #737373;
  445.             border-radius: 4px;
  446.             max-height:90%;
  447.             overflow-y: auto;
  448.             line-height: 0.8em;
  449.  
  450.             & .altText {
  451.                 opacity: 0.8;
  452.                 font-size: 0.9em;
  453.  
  454.                 &.lineBefore:before {
  455.                     content: "—— ";
  456.                 }
  457.             }
  458.  
  459.             & .boldText {
  460.                 color: var(--link-color);
  461.                 font-weight: bold;
  462.             }
  463.  
  464.             & .colorLabel {
  465.                 padding: 3px 2px 3px 4px;
  466.                 border-radius: 8px;
  467.                 box-shadow: 0px 0px 1px currentColor;
  468.                 margin-left: 0.5em;
  469.             }
  470.  
  471.             & input[type="color"] {
  472.                 width: 40px;
  473.                 height: 20px;
  474.                 padding: 1px;
  475.                 transform: translate(0, 2px);
  476.             }
  477.  
  478.             & button {
  479.                 padding: 10px 20px;
  480.                 margin-right: 4px;
  481.                 margin-bottom: 0;
  482.                 filter: contrast(115%) brightness(110%);
  483.                 &:hover {
  484.                     filter: brightness(130%);
  485.                 }
  486.             }
  487.         }
  488.         #lynxExtendedMenu > .settings-footer {
  489.             height: auto;
  490.         }
  491.         @media screen and (max-width: 1000px) {
  492.             #lynxExtendedMenu{
  493.                 right:0;
  494.                 width:90%;
  495.                 line-height: 1em;
  496.                 /*bottom:15px;*/
  497.             }
  498.         }
  499.  
  500.         .lynxExtendedButton::before {
  501.             content: "\\e0da";
  502.         }
  503.  
  504.         `);
  505.  
  506.         if (settings.markPostEdge) {
  507.             const color1 = settings.markPostEdge_color1 || SETTINGS_DEFINITIONS.markPostEdge.color1Default;
  508.             const color2 = settings.markPostEdge_color2 || SETTINGS_DEFINITIONS.markPostEdge.color2Default;
  509.             addMyStyle("lynx-mark-posts", `
  510.                 /* 
  511.                 README:
  512.                 Mark your posts and replies with a left border. Specificity order: (you) > (reply). 
  513.                 Important: The :not(#SP1) selectors and the !important are used for extra specificity.
  514.                 These are made extra specific so we can override ones from other userscripts.
  515.                 (because Lynx-- has an option to disable only this and also has the ability to customize the color)
  516.                 */
  517.                 /* Match your posts. This is easy. */
  518.                 body:not(#SP1#SP1) .yourPost {
  519.                     border-left: 3px dashed var(--markPostEdge_color1, ${color1}) !important;
  520.                 }
  521.  
  522.                 /* 
  523.                 * Match replies:
  524.                 * This can be a simple .divMessage > .quoteLink 
  525.                 * or it can be a .divMessage > details > .spoiler > s > u > .quoteLink (or something like that)
  526.                 */
  527.                 body:not(#SP1) .quotesYou {
  528.                     border-left: 2px solid var(--markPostEdge_color2, ${color2}) !important;
  529.                 }
  530.             `);
  531.         }
  532.  
  533.         if (settings.markYouText) {
  534.             const color1 = settings.markYouText_color1 || SETTINGS_DEFINITIONS.markYouText.color1Default;
  535.             addMyStyle("lynx-mark-you-text", `
  536.                     .youName { color: var(--markYouText_color1, ${color1}); }
  537.                     .you { --link-color: var(--markYouText_color1, ${color1}); }
  538.             `);
  539.         }
  540.  
  541.         if (settings.halfchanGreentexts) {
  542.             addMyStyle("lynx-halfchanGreentexts",
  543.                 `.greenText {
  544.                     filter: brightness(110%);
  545.                 }
  546.             `);
  547.         }
  548.  
  549.         if (settings.showStubs === false) {
  550.             addMyStyle("lynx-hide-stubs",`
  551.             .postCell:has(> span.unhideButton.glowOnHover) {
  552.                 display: none;
  553.             }
  554.             `);
  555.         }
  556.  
  557.         if (settings.revealSpoilerText=="on") {
  558.             addMyStyle("lynx-reveal-spoilertext1",`
  559.                 span.spoiler { color: white }
  560.             `);
  561.         } else if (settings.revealSpoilerText=="madoka") {
  562.             addMyStyle("lynx-reveal-spoilertext2",`
  563.                 span.spoiler:not(:hover) {
  564.                     color: white;
  565.                     font-family: MadokaRunes !important;
  566.                 }
  567.             `);
  568.         }
  569.  
  570.     } //End of runASAP()
  571.  
  572.     //Everything in runAfterDom runs after document has loaded (like @run-at document-end)
  573.     //Everything in runAfterDom runs after document has loaded (like @run-at document-end)
  574.     //Everything in runAfterDom runs after document has loaded (like @run-at document-end)
  575.     async function runAfterDom() {
  576.         console.log("%cLynx Minus Minus Started with settings:", "color:rgb(0, 140, 255)", settings);
  577.  
  578.         //Detect if the current page is a thread
  579.         const url = window.location.href;
  580.         const isThread = REGEX_THREAD.test(url);
  581.  
  582.         //Keep these for now I guess.
  583.         //Get the following window objects
  584.         //unsafeWindow works on chrome and Tampermonkey FF, wrappedJSObject works on Firefox VM.
  585.         //Chrome and firefox behavior is different here. In Chrome you can simply do 'api' to check if the variable is defined, in Firefox you need to do typeof api !== 'undefined'.
  586.         //And a && will return the second element if the first is true.
  587.  
  588.         // const window_api = (typeof api !== 'undefined' && api) || window?.api || unsafeWindow?.api || wrappedJSObject?.api || undefined;
  589.         // const window_posting = (typeof posting !== 'undefined' && posting) || window?.posting || unsafeWindow?.posting || wrappedJSObject?.posting || undefined;
  590.         // const window_qr = (typeof qr !== 'undefined' && qr) || window?.qr || unsafeWindow?.qr || wrappedJSObject?.qr || undefined;
  591.         // if (window_api && window_posting && window_qr) {
  592.         //     windowAccessible = true;
  593.         // } else {
  594.         //     //I think greasemonkey sandboxes the script. I use violentmonkey though
  595.         //     console.error("Lynx Minus Minus: This JS script is sandboxed and can't access page JS... (If you can read this, let me know what browser/extension does this. Or maybe the site just failed to load?)")
  596.         // }
  597.  
  598.         if (settings.preserveQuickReply === false) {
  599.             const qrBody = document.getElementById("qrbody");
  600.             if (qrBody) {
  601.                 qrBody.value = "";
  602.             }
  603.         }
  604.  
  605.         function pageHotkeys(ev) {
  606.             const key = ev.key.toLowerCase();
  607.             //Ctrl+Q or Alt+R to open quick reply
  608.             if ((ev.ctrlKey && key == "q") || (ev.altKey && key == "r")) {
  609.                 ev.preventDefault();
  610.                 //8chan's HTML will keep the text after a reload so attempt to clear it again
  611.                 const qrBody = document.getElementById("qrbody");
  612.                 if (settings.preserveQuickReply === false) {
  613.                     if (qrBody) {
  614.                         qrBody.value = "";
  615.                     }
  616.                 }
  617.                 const replyBtn = document.getElementById("replyButton");
  618.                 replyBtn?.click();
  619.                 qrBody?.focus();
  620.             };
  621.             //Alt+T to toggle thread watcher
  622.             if (ev.altKey && (key == "t")) {
  623.                 ev.preventDefault();
  624.                 const watcherBtn = document.querySelector("body > nav a.watcherButton");
  625.                 if (watcherBtn) watcherBtn.click();
  626.             }
  627.         }
  628.         document.addEventListener("keydown", pageHotkeys);
  629.  
  630.         function createSettingsButton() {
  631.             //Desktop
  632.             document.querySelector("#navLinkSpan > .settingsButton").insertAdjacentHTML("afterend", `
  633.             <span>/</span>
  634.             <a id="navigation-lynxextended" class="coloredIcon lynxExtendedButton" title="LynxChan Extended-- Settings"></a>
  635.             `);
  636.             //Mobile
  637.             document.querySelector("#sidebar-menu > ul > li > .settingsButton").parentElement.insertAdjacentHTML("afterend", `
  638.                 <li>
  639.                     <a id="navigation-lynxextended-mobile" class="coloredIcon lynxExtendedButton" title="LynxChan Extended-- Settings">Lynx Ex-- Settings</a>
  640.                 </li>
  641.             `);
  642.             document.querySelector("#navigation-lynxextended").addEventListener("click", openMenu);
  643.             document.querySelector("#navigation-lynxextended-mobile").addEventListener("click", openMenu);
  644.         }
  645.  
  646.         //Register menu command for the settings button
  647.         GM.registerMenuCommand("Show Options Menu", openMenu);
  648.         try {
  649.             createSettingsButton();
  650.         } catch (error) {
  651.             //Don't log errors on the disclaimer page (constantly seen by private browsing users)
  652.             if (document.location.href.includes("disclaimer.html") === false) {
  653.                 console.log("Error while creating settings button:", error);
  654.             }
  655.             // return; //If the button creation fails, don't continue (not sure if this is needed)
  656.         }
  657.  
  658.         //Open the settings menu on the first run
  659.         if (settings.firstRun) {
  660.             settings.firstRun = false;
  661.             await GM.setValue("firstRun", settings.firstRun);
  662.             openMenu();
  663.         }
  664.  
  665.         //Show watched threads on page load
  666.         if (settings.showWatcherOnLoad) {
  667.             const watchedMenu = document.querySelector("body > #watchedMenu");
  668.             const watcherButton = document.querySelector("body > nav > #navLinkSpan > .watcherButton");
  669.             if (watchedMenu && watcherButton) {
  670.                 if (watchedMenu?.style?.display === "none") {
  671.                     watcherButton.click();
  672.                 }
  673.             }
  674.         }
  675.  
  676.         function replyKeyboardShortcuts(ev) {
  677.             if (ev.ctrlKey) {
  678.                 let combinations = {
  679.                     "s":["[spoiler]","[/spoiler]"],
  680.                     "b":["'''","'''"],
  681.                     "u":["__","__"],
  682.                     "i":["''","''"],
  683.                     "d":["[doom]","[/doom]"],
  684.                     "m":["[moe]","[/moe]"]
  685.                 }
  686.                 for (var key in combinations)
  687.                 {
  688.                     if (ev.key == key)
  689.                     {
  690.                         ev.preventDefault();
  691.                         console.log("ctrl+"+key+" pressed in textbox")
  692.                         const textBox = ev.target;
  693.                         let newText = textBox.value;
  694.                         const tags = combinations[key]
  695.                         const selectionStart = textBox.selectionStart
  696.                         const selectionEnd = textBox.selectionEnd
  697.                         
  698.                         if (selectionStart == selectionEnd) { //If there is nothing selected, make empty tags and center the cursor between it
  699.                             document.execCommand("insertText",false, tags[0] + tags[1]);
  700.                             //Center the cursor between tags
  701.                             textBox.selectionStart = textBox.selectionEnd = (textBox.selectionEnd - tags[1].length);
  702.                         } else {
  703.                             //Insert text and keep undo/redo support (Only replaces highlighted text)
  704.                             document.execCommand("insertText",false, tags[0] + newText.slice(selectionStart, selectionEnd) + tags[1])
  705.                         }
  706.                         return;
  707.                     }
  708.                 }
  709.                 //Ctrl+Enter to send reply
  710.                 if (ev.key=="Enter") {
  711.                     document.getElementById("qrbutton")?.click()
  712.                 }
  713.             }
  714.         }
  715.  
  716.  
  717.         function openMenu() {
  718.             const oldMenu = document.getElementById("lynxExtendedMenu");
  719.             if (oldMenu) {
  720.                 oldMenu.remove();
  721.                 return;
  722.             }
  723.             // Create options menu
  724.             const menu = document.createElement("div");
  725.             menu.id = "lynxExtendedMenu";
  726.             menu.innerHTML = `
  727.             <h3 style="text-align: center; color: var(--subject-color);" class='settings-header'>LynxChan Extended-- Options</h3>
  728.             <p style="text-align: center;"><a href="https://greasyfork.org/en/scripts/533169-lynxchan-extended-minus-minus/versions">Version ${GM.info.script.version}</a></p><br>
  729.             `;
  730.  
  731.             //we use createElement() here instead of setting innerHTML so we can attach onclick to elements
  732.             //...In the future, at least. There aren't any onclicks added yet.
  733.             let settings_content = document.createElement("div");
  734.             settings_content.classList.add("settings-content");
  735.             Object.keys(SETTINGS_DEFINITIONS).forEach((name) => {
  736.                 const setting = SETTINGS_DEFINITIONS[name];
  737.                 if (setting.hidden) {
  738.                     //pass
  739.                 }
  740.                 else if (setting.type == "radio") {
  741.                     let html = `<span>${setting.desc}</span><br><form id="${name}" action='#'>`;
  742.                     for (const [value, description] of Object.entries(setting.options)) {
  743.                         html += `
  744.                         <label>
  745.                             <input name="${name}" type="radio" value="${value}" ${settings[name]==value ? "checked" : ""}
  746.                             <span>${description}</span>
  747.                         </label><br>
  748.                         `;
  749.                     }
  750.                     html += `</form>${setting.nonewline ? '' : '<br>'}`;
  751.                     settings_content.innerHTML += html;
  752.                 } else if (setting.type == "checkbox_multiple_dict") {
  753.                     const dict = settings[name]
  754.                     let html = `<span>${setting.desc}</span><br><form id="${name}" action='#'>`;
  755.                     for (const [key, description] of Object.entries(setting.options)) {
  756.                         html += `
  757.                         <label>
  758.                             <input name="${name}" type="checkbox" value="${key}" ${dict[key] ? "checked" : ""}
  759.                             <span>${description}</span>
  760.                         </label><br>
  761.                         `;
  762.                     }
  763.                     html += `</form>${setting.nonewline ? '' : '<br>'}`;
  764.                     settings_content.innerHTML += html;
  765.                 } else if (setting.type == "dropdown") {
  766.                     let html = `<label for="${name}">${setting.desc}:</label><select id="${name}">`
  767.                     Object.keys(setting['choices']).forEach(value => {
  768.                         html+=`<option value="${value}" ${settings[name]==value ? "selected" : ""}>${value}</option>`
  769.                     })
  770.                     html+=`</select><br>${setting.nonewline ? '' : '<br>'}`;
  771.                     settings_content.innerHTML += html;
  772.  
  773.                 } else if (setting.type == "checkbox_with_colors") {
  774.                     let colorHtml = "";
  775.                     let colorFields = Object.keys(setting).filter(k => /^color\d+Default$/.test(k));
  776.                     colorFields.forEach((colorKey) => {
  777.                         const idx = colorKey.match(/^color(\d+)Default$/)[1];
  778.                         const colorValue = settings[`${name}_color${idx}`] || setting[`color${idx}Default`];
  779.                         const colorDesc = setting[`color${idx}Desc`] || "";
  780.                         colorHtml += `
  781.                         <label class="colorLabel">
  782.                             ${colorDesc}
  783.                             <input type="color" id="${name}_color${idx}" value="${colorValue}" ${settings[name] ? '' : 'disabled'}>
  784.                         </label>
  785.                         `;
  786.                     });
  787.                     settings_content.innerHTML += `
  788.                     <label>
  789.                         <input type="checkbox" id="${name}" ${settings[name] ? "checked" : ""}>
  790.                         ${setting.desc}
  791.                     </label>
  792.                     ${colorHtml}
  793.                     <br>${setting.nonewline ? '' : '<br>'}`;
  794.                 } else {
  795.                     settings_content.innerHTML += `
  796.                     <label>
  797.                         <input type="checkbox" id="${name}" ${settings[name] ? "checked" : ""}>
  798.                         ${setting.desc}
  799.                     </label><br>${setting.nonewline ? '' : '<br>'}`;
  800.                 }
  801.             })
  802.             menu.appendChild(settings_content);
  803.             menu.innerHTML += `
  804.                 <div class='settings-footer'>
  805.                     <button id="saveSettings">Save</button>
  806.                     <button id="closeMenu">Close</button>
  807.                     <button id="resetSettings" style="float: right;">Reset</button>
  808.                 </div>
  809.             `;
  810.             document.body.appendChild(menu);
  811.  
  812.             // Save button functionality
  813.             document.getElementById("saveSettings").addEventListener("click", async () => {
  814.                 Object.keys(SETTINGS_DEFINITIONS).forEach((name) => {
  815.                     const setting = SETTINGS_DEFINITIONS[name];
  816.                     if (!('hidden' in setting)) {
  817.                         if (setting.type=="radio") {
  818.                             settings[name] = menu.querySelector(`input[name="${name}"]:checked`).value;
  819.                         } else if (setting.type == "checkbox_multiple_dict") {
  820.                             
  821.                             const d = {}
  822.                             menu.querySelectorAll(`input[name="${name}"]`).forEach(checkbox => {
  823.                                 d[checkbox.value] = checkbox.checked;
  824.                             })
  825.                             settings[name] = d;
  826.                             
  827.                         } else if (setting.type=="dropdown") {
  828.                             settings[name] = document.getElementById(name).value;
  829.                         } else if (setting.type=="checkbox_with_colors") {
  830.                             settings[name] = document.getElementById(name).checked;
  831.                             let colorFields = Object.keys(setting).filter(k => /^color\d+Default$/.test(k));
  832.                             colorFields.forEach((colorKey) => {
  833.                                 const idx = colorKey.match(/^color(\d+)Default$/)[1];
  834.                                 const colorName = `${name}_color${idx}`;
  835.                                 const colorValue = document.getElementById(colorName).value;
  836.                                 settings[colorName] = colorValue;
  837.                                 // Set CSS variable on body (so it can be used without a refresh)
  838.                                 document.body.style.setProperty(`--${colorName}`, colorValue);
  839.                             });
  840.                         } else {
  841.                             settings[name] = document.getElementById(name).checked;
  842.                         }
  843.                     }
  844.                 })
  845.                 console.log("Saving settings ",settings)
  846.                 await Promise.all(Object.entries(settings).map(([key, value]) => GM.setValue(key, value)));
  847.                 setTimeout(()=>{
  848.                     alert("Settings saved!\nFor most settings you must refresh the page for the changes to take effect.\n\n(only color pickers don't need a refresh)");
  849.                 }, 1);
  850.                 // menu.remove();
  851.             });
  852.  
  853.             // Reset button functionality
  854.             document.getElementById("resetSettings").addEventListener("click", async () => {
  855.                 if (!confirm("Are you sure you want to reset all settings? This will delete all saved data.")) return;
  856.                 const keys = await GM.listValues();
  857.                 await Promise.all(keys.map(key => GM.deleteValue(key)));
  858.                 alert("All settings have been reset.\nRefreshing automatically for the changes to take effect.");
  859.                 menu.remove();
  860.                 location.reload();
  861.             });
  862.  
  863.             // Close button functionality
  864.             document.getElementById("closeMenu").addEventListener("click", () => {
  865.                 menu.remove();
  866.             });
  867.  
  868.         }
  869.  
  870.         function createMarker(element, container, isReply) {
  871.             const pageHeight = document.body.scrollHeight;
  872.             const offsetTop = element.offsetTop;
  873.             const percent = offsetTop / pageHeight;
  874.             const top = (percent * 100).toFixed(2);
  875.  
  876.             const marker = document.createElement("div");
  877.             marker.classList.add("marker");
  878.             if (isReply) {
  879.                 marker.classList.add("alt");
  880.             }
  881.             marker.style.top = `${top}%`;
  882.             marker.dataset.postid = element.id;
  883.  
  884.             marker.addEventListener("click", () => {
  885.                 let elem = element?.previousElementSibling || element;
  886.                 if (elem) elem.scrollIntoView({ behavior: "instant", block: "start" });
  887.             });
  888.  
  889.             container.appendChild(marker);
  890.         }
  891.  
  892.         function recreateScrollMarkers() {
  893.             let oldContainer = document.querySelector(".marker-container");
  894.             if (oldContainer) {
  895.                 oldContainer.remove();
  896.             }
  897.             // Create marker container
  898.             const markerContainer = document.createElement("div");
  899.             markerContainer.classList.add("marker-container");
  900.             document.body.appendChild(markerContainer);
  901.     
  902.             // Match and create markers for "my posts" (matches native)
  903.             document.querySelectorAll(".postCell:has(> .yourPost)")
  904.                 .forEach((elem) => {
  905.                     createMarker(elem, markerContainer, false);
  906.                 });
  907.  
  908.             // Match and create markers for "replies" (matches native)
  909.             document.querySelectorAll(".postCell:has(> .quotesYou)")
  910.                 .forEach((elem) => {
  911.                     createMarker(elem, markerContainer, true);
  912.                 });
  913.         }
  914.  
  915.         let postCount = 1;
  916.         const postIndexLookup = {};
  917.         function addPostCount(post, newpost = true) {
  918.             // const posts = Array.from(document.querySelectorAll(".innerOP, .divPosts > .postCell"));
  919.             if (post.querySelector(".postNum")) {
  920.                 return;
  921.             }
  922.  
  923.             const postInfoDiv = post.querySelector(".title");
  924.             const posterNameDiv = postInfoDiv.querySelector(".linkName");
  925.             const postNumber = postInfoDiv.querySelector(".linkQuote")?.textContent;
  926.             if (!postNumber) return;
  927.  
  928.             let localCount = postCount;
  929.             if (newpost) {
  930.                 postIndexLookup[postNumber] = localCount;
  931.                 postCount++;
  932.             } else {
  933.                 //Show cached post count for inlines & hovers
  934.                 localCount = postIndexLookup[postNumber];
  935.                 if (!localCount) return;
  936.             }
  937.  
  938.             let newNode = document.createElement("span");
  939.             newNode.innerText = localCount;
  940.             newNode.className = "postNum index";
  941.             // if (localCount >= Infinity) { //knownBumpLimit
  942.             //     newNode.style = "color: rgb(255, 4, 4); font-weight: bold;"
  943.             // }
  944.             postInfoDiv.insertBefore(newNode, posterNameDiv);
  945.             let foo = document.createTextNode("\u00A0"); // Non-breaking space
  946.             postInfoDiv.insertBefore(foo, posterNameDiv);
  947.         }
  948.  
  949.         //Open source svg from iconify.design
  950.         const SVG_SEARCH = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-width="3"><path stroke-linecap="round" d="m20 20l-6-6"></path><path d="M15 9.5a5.5 5.5 0 1 1-11 0a5.5 5.5 0 0 1 11 0Z"></path></g></svg>`;
  951.         function filenameFeatures(post) {
  952.             const fileNames = post.querySelectorAll(".originalNameLink[href]");
  953.  
  954.             //Feature: Distinguish videos, gifs and audio with an icon
  955.             //Theres also a mime type on .imgLink
  956.             if (settings.showVideoIcons) {
  957.                 const videoExts = /\.(webm|mp4|mkv|mov|avi|flv|wmv|m4v|gif|apng|mp3|flac|opus|ogg|wav|aac|m4a|wma)$/i;
  958.                 fileNames.forEach((nameElem) => {
  959.                     if (videoExts.test(nameElem.download)) {
  960.                         nameElem.classList.add("lynx-video");
  961.                     }
  962.                 });
  963.             }
  964.  
  965.             //Last feature: Reverse image search buttons
  966.             //TODO MAYBE: Make this button open a small menu (like the post menu) instead of multiple buttons. AI can do it in 20 seconds.
  967.             // .some() will return true if any value in the dict is true
  968.             // So inverting this means no values are true, so return without doing anything
  969.             if (!Object.values(settings.reverseSearchOptions).some(Boolean)) {
  970.                 return;
  971.             }
  972.  
  973.             const fileNameElements = Array.from(fileNames);
  974.             const regex_md5sum = /[0-9a-f]{32}/g;
  975.             const regex_pixiv = /(\d+)_p\d+/;
  976.             const alt_regex_pixiv = /illust\_(\d+)\_\d+\_\d+/; //Match pixiv images saved using the mobile app (ex. illust_123456_20250530_123456)
  977.  
  978.             for (let i = fileNameElements.length-1; i>=0; i--)
  979.             {
  980.                 const nameElem = fileNameElements[i];
  981.                 const parent = nameElem.parentElement
  982.                 if (parent.querySelector(".lynxReverseImageSearch")) {
  983.                     return;
  984.                 }
  985.                 const attachmentFileName = nameElem.download;
  986.  
  987.                 const span = document.createElement("span");
  988.                 span.classList.add("lynxReverseImageSearch");
  989.  
  990.                 let searchButtonsAdded = 0
  991.  
  992.                 let m;
  993.                 if (settings.reverseSearchOptions.pixiv) {
  994.                     if ((m = regex_pixiv.exec(attachmentFileName)) !== null || (m = alt_regex_pixiv.exec(attachmentFileName)) !== null) {
  995.                         span.innerHTML += `<a rel="noopener noreferrer" target="_blank" data-booruname="pixiv" href="https://pixiv.net/i/${m[1]}">${SVG_SEARCH}</a>`
  996.                         searchButtonsAdded++;
  997.                     }
  998.                 }
  999.                 //This is 'else if' because these options are mutually exclusive - a filename will never match pixiv AND an md5 hash
  1000.                 //Careful with this insane abuse of conditionals, the order of operations matters (&& is before = without parenthesis)
  1001.                 //And we don't want to match >1 because that could be an 8chan hash (There should only be 1 md5 hash in a file name anyways)
  1002.                 else if (settings.reverseSearchOptions.booru && (m = [...attachmentFileName.matchAll(regex_md5sum)]) && m?.length == 1) {
  1003.                     span.innerHTML += `<a rel="noopener noreferrer" target="_blank" data-booruname="${settings.reverseSearchBooruSite}" href="${SETTINGS_DEFINITIONS['reverseSearchBooruSite']['choices'][settings.reverseSearchBooruSite]}${m[0]}">${SVG_SEARCH}</a>`
  1004.                     searchButtonsAdded++;
  1005.                 }
  1006.  
  1007.                 if (settings.reverseSearchOptions.saucenao) {
  1008.                     //Logic: for everything thats not supported i.e. not an image use the thumbnail if its available
  1009.                     //Supported image extensions for Saucenao direct search
  1010.                     const imageExts = /\.(png|jpe?g|webp|bmp|gif)$/i;
  1011.                     let validImage = true;
  1012.                     let useThumbInstead = false;
  1013.                     let thumbUrl = null;
  1014.                     if (!imageExts.test(attachmentFileName)) {
  1015.                         // Not a supported image, try to find a thumbnail
  1016.                         const uploadCell = parent.closest('.uploadCell');
  1017.                         if (uploadCell) {
  1018.                             const thumbImg = uploadCell.querySelector('.imgLink > img');
  1019.                             const thumbSrc = thumbImg?.getAttribute("src");
  1020.                             if (thumbImg && thumbSrc?.startsWith('/.media/t_')) {
  1021.                                 useThumbInstead = true;
  1022.                                 thumbUrl = thumbSrc;
  1023.                             }
  1024.                         }
  1025.                         // If no valid thumbnail, don't add saucenao
  1026.                         if (!useThumbInstead) {
  1027.                             // Don't add saucenao button for this file
  1028.                             validImage = false;
  1029.                         }
  1030.                     }
  1031.  
  1032.                     const sauceNaoWrapper = function(ev) {
  1033.                         ev.preventDefault(); //Prevent <details> node from contracting
  1034.                         const a = ev.currentTarget;
  1035.                         if (a.classList?.contains("fetch-awaiting")) {
  1036.                             //Abort if theres an ongoing fetch to prevent accidental doubleclicks
  1037.                             return;
  1038.                         }
  1039.  
  1040.                         a.classList.add("fetch-awaiting");
  1041.                         const fetchUrl = useThumbInstead ? thumbUrl : nameElem.href;
  1042.                         const fetchName = useThumbInstead ? ("thumbnail_" + attachmentFileName) : attachmentFileName;
  1043.                         fetch(fetchUrl)
  1044.                             .then(resp => {
  1045.                                 if (!resp.ok) throw new Error("Fetch failed");
  1046.                                 return resp.blob();
  1047.                             })
  1048.                             .then(blob => {
  1049.                                 let file = new File([blob], fetchName, {type: blob.type} );
  1050.                                 let dataTransfer = new DataTransfer();
  1051.                                 dataTransfer.items.add(file);
  1052.                                 document.getElementById("saucenao_file_input").files = dataTransfer.files;
  1053.                                 document.getElementById("saucenao_submit").click();
  1054.                                 a.classList.remove("fetch-awaiting");
  1055.                             })
  1056.                             .catch(() => {
  1057.                                 a.classList.remove("fetch-awaiting");
  1058.                                 a.classList.add("fetch-failed");
  1059.                             });
  1060.                     }
  1061.  
  1062.                     if (validImage) {
  1063.                         const a = document.createElement("a");
  1064.                         a.setAttribute("data-booruname","saucenao")
  1065.                         // a.innerText = '🔍︎'
  1066.                         a.innerHTML = SVG_SEARCH;
  1067.                         a.addEventListener("click", sauceNaoWrapper)
  1068.                         span.appendChild(a);
  1069.                         //span.innerHTML += `<a data-booruname='saucenao' onclick=''>🔍︎</a>`
  1070.                         searchButtonsAdded++;
  1071.                     }
  1072.                 }
  1073.  
  1074.                 if (searchButtonsAdded > 1) {
  1075.                     span.classList.add("showSearchNames")
  1076.                 }
  1077.  
  1078.                 if (searchButtonsAdded > 0) {
  1079.                     parent.insertAdjacentElement("beforeend", span);
  1080.                 }
  1081.             }
  1082.         }
  1083.     
  1084.         /*function glowpost() {
  1085.             // Create a frequency map to track occurrences of each item
  1086.             const list = document.querySelectorAll(".labelId");
  1087.             const countMap = Array.from(list).reduce((acc, item) => {
  1088.             acc[item.style.backgroundColor] = (acc[item.style.backgroundColor] || 0) + 1;
  1089.             return acc;
  1090.             }, {});
  1091.             
  1092.             // Filter the list to keep only items with a count of 1
  1093.             Array.from(list).filter(item => countMap[item.style.backgroundColor] === 1).forEach((item) => {
  1094.                 item.style.boxShadow = "0 0 15px #26bf47";
  1095.                 item.title = "This is the first post from this ID.";
  1096.             });
  1097.         }*/
  1098.         var idMap = {};
  1099.         const glowpost = function(post, newpost = true) {
  1100.             const list = post.querySelectorAll(".labelId");
  1101.             const postNumber = post.querySelector(".linkQuote")?.textContent;
  1102.             list.forEach((poster) => {
  1103.                 const bgColor = poster.style.backgroundColor;
  1104.                 if (newpost && idMap[bgColor] === undefined) {
  1105.                     idMap[bgColor] = postNumber;
  1106.                     poster.classList.add("glows");
  1107.                     poster.title = "This is the first post from this ID.";
  1108.                 } else if (!newpost && idMap[bgColor] == postNumber) {
  1109.                     poster.classList.add("glows");
  1110.                     poster.title = "This is the first post from this ID.";
  1111.                 }
  1112.             });
  1113.         }
  1114.  
  1115.         const revealSpoilerImages = function(post) {
  1116.             const spoilers = post.querySelectorAll(".imgLink > img:is([src='/spoiler.png'],[src*='/custom.spoiler'])");
  1117.             // spoilers.forEach(spoiler => {
  1118.             //     spoiler.classList.add('spoiler-thumb');
  1119.             //     const parent = spoiler.parentElement;
  1120.             //     const hrefTokens = parent.href.split("/");
  1121.             //     const fileNameTokens = hrefTokens[4].split(".");
  1122.         
  1123.             //     const thumbUrl = `/.media/t_${fileNameTokens[0]}`;
  1124.             //     spoiler.src = thumbUrl;
  1125.             // });
  1126.             spoilers.forEach(image => {
  1127.                 image.classList.add('spoiler-thumb');
  1128.  
  1129.                 const uploadCell = image.closest('.uploadCell');
  1130.                 const parent = image.closest('a.imgLink');
  1131.                 const fileName = parent.href.split("/")[4];
  1132.                 const dimensionLabel = uploadCell.querySelector('.dimensionLabel');
  1133.                 const dataFilemime = parent.getAttribute('data-filemime');
  1134.     
  1135.                 // Set the full image as the thumbnail for images that are 220x220 pixels or smaller.
  1136.                 // This is a fix for small images because thumbnails are not generated for them.
  1137.                 // This crap does not apply to GIFs, GIFs always have generated thumbnails.
  1138.                 if (dimensionLabel && /^image\/.+$/.test(dataFilemime) && !/^image\/gif$/.test(dataFilemime) ) {
  1139.                     //Split at x or X, split only 2 times, then for each value in the split array convert to integer and assign to const 'dimensions'
  1140.                     const dimensions = dimensionLabel.textContent.trim().split(/x|×/, 2).map(v => parseInt(v));
  1141.                     if (dimensions.length === 2 && dimensions[0] <= 220 && dimensions[1] <= 220) {
  1142.                         image.src = `/.media/${fileName}?`;
  1143.                     } else {
  1144.                         image.src = `/.media/t_${fileName.split(".")[0]}`;
  1145.                     }
  1146.                 } else {
  1147.                     image.src = `/.media/t_${fileName.split(".")[0]}`;
  1148.                 }
  1149.             })
  1150.         }
  1151.  
  1152.         if (settings.spoilerImageType.startsWith("reveal")) {
  1153.             addMyStyle("lynx-reveal-spoilerimage",`
  1154.                 img.spoiler-thumb {
  1155.                     transition: 0.2s;
  1156.                     outline: 2px dotted #ff0000ee;
  1157.                     ${settings.spoilerImageType=="reveal_blur" ? "filter: blur(10px);" : ""}
  1158.                 }
  1159.                 img.spoiler-thumb:hover {
  1160.                     filter: blur(0);
  1161.                 }
  1162.             `)
  1163.         }
  1164.     
  1165.         // Add functionality to apply the custom spoiler image CSS
  1166.         let threadSpoilerFound = false;
  1167.         let tsFallbackUsed = false;
  1168.         function setThreadSpoiler(post) {
  1169.             if (threadSpoilerFound) return;
  1170.  
  1171.             let spoilerImageUrl = null;
  1172.  
  1173.             //When the option is "threadAlt", fallback to "thread" if "threadAlt" doesn't exist yet.
  1174.             if (settings.spoilerImageType == "threadAlt") {
  1175.                 const altSpoilerLink = Array.from(post.querySelectorAll('a.originalNameLink[download^="ThreadSpoilerAlt"]')).find(link => /\.(jpg|jpeg|png|webp)$/i.test(link.download));
  1176.                 spoilerImageUrl = altSpoilerLink ? altSpoilerLink.href : null;
  1177.                 tsFallbackUsed = false; //stop looking for threadAlt
  1178.             }
  1179.  
  1180.             if (settings.spoilerImageType == "thread" || (!spoilerImageUrl && !tsFallbackUsed && settings.spoilerImageType == "threadAlt")) {	
  1181.                 const spoilerLink = Array.from(post.querySelectorAll('a.originalNameLink[download^="ThreadSpoiler"]')).find(link => /\.(jpg|jpeg|png|webp)$/i.test(link.download));
  1182.                 spoilerImageUrl = spoilerLink ? spoilerLink.href : null;
  1183.                 if (settings.spoilerImageType == "threadAlt") {
  1184.                     tsFallbackUsed = true; //Keep looking for threadAlt
  1185.                 }
  1186.             } else if (settings.spoilerImageType == "test") {
  1187.                 const myArray = [
  1188.                     'https://8chan.moe/.media/f76e9657d6b506115ccd0ade73d3d562777a441e4b6bb396610669396ff3032a.png',
  1189.                     'https://8chan.moe/.media/1074fdb6eea4ba609910581e7824106736a1bcad446ace1ae0792b231b52cf9a.png',
  1190.                     'https://8chan.moe/.media/c32b4de8490d7e77987f0e2a381d5935ffa6fec9b98c78ea7c05bd4381d6f64b.png',
  1191.                     'https://8chan.moe/.media/bb225302110d52494ec2bea68693d566acee09767212ce4ee8c0d83d49cfa05b.png'
  1192.                 ];
  1193.                 spoilerImageUrl = myArray[Math.floor(Math.random() * myArray.length)];
  1194.                 addMyStyle("lynx-thread-spoiler-css1", `
  1195.                     body {
  1196.                         --spoiler-img: url("${spoilerImageUrl}")
  1197.                     }
  1198.                     .uploadCell:not(.expandedCell) a.imgLink:has(>img[src="/spoiler.png"]),
  1199.                     .uploadCell:not(.expandedCell) a.imgLink:has(>img[src*="/custom.spoiler"]) {
  1200.                         background-image: var(--spoiler-img);
  1201.                         background-size: cover;
  1202.                         background-position: center;
  1203.                         & > img {
  1204.                             opacity: 0;
  1205.                         }
  1206.                     }
  1207.                 `);
  1208.                 threadSpoilerFound = true;
  1209.                 return;
  1210.             }
  1211.  
  1212.             if (spoilerImageUrl) {
  1213.                 document.head?.querySelector("#lynx-thread-spoiler-css2")?.remove(); //Remove if the style already exists (from fallback)
  1214.                 addMyStyle("lynx-thread-spoiler-css2", `
  1215.                     ${settings.overrideBoardSpoilerImage ? '.uploadCell:not(.expandedCell) a.imgLink:has(>img[src*="/custom.spoiler"]),' : "" }
  1216.                     .uploadCell:not(.expandedCell) a.imgLink:has(>img[src="/spoiler.png"]) {
  1217.                         background-image: url("${spoilerImageUrl}");
  1218.                         background-size: cover;
  1219.                         background-position: center;
  1220.                         outline: dashed 2px #ff000090;
  1221.                         & > img {
  1222.                             opacity: 0;
  1223.                         }
  1224.                     }
  1225.                 `);
  1226.                 if (!tsFallbackUsed) {
  1227.                     threadSpoilerFound = true;
  1228.                 }
  1229.             }
  1230.         }
  1231.  
  1232.         if (settings.spoilerImageType=="kachina") {
  1233.             addMyStyle("lynx-kachinaSpoilers",`
  1234.                 ${settings.overrideBoardSpoilerImage ? '.uploadCell:not(.expandedCell) a.imgLink:has(>img[src*="/custom.spoiler"]),' : "" }
  1235.                 .uploadCell:not(.expandedCell) a.imgLink:has(>img[src="/spoiler.png"]) {
  1236.                     background-size: cover;
  1237.                     background-position: center;
  1238.                     margin-right:5px;
  1239.                     background-image: url("data:image/jpeg;base64,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");
  1240.                     & > img {
  1241.                         opacity: 0;
  1242.                     }
  1243.                 }
  1244.             `)
  1245.         }
  1246.  
  1247.         function iterateAllPosts() {
  1248.             //Get ALL posts (this does NOT include inlined posts and hovered posts)
  1249.             const allPosts = document.querySelectorAll("#divThreads > .opCell > .innerOP, .divPosts > .postCell");
  1250.             allPosts.forEach((post) => {
  1251.                 iterateSinglePost(post, true);
  1252.             });
  1253.         }
  1254.  
  1255.         /**
  1256.          * Processes a single post element.
  1257.          *
  1258.          * @param {HTMLElement} post - The post here can be an .innerPost or one of its containers
  1259.          * @param {boolean} newpost - True if this is a new post in the thread (i.e. not a tooltip or inline)
  1260.          */
  1261.         function iterateSinglePost(post, newpost = false) {
  1262.             // console.log("Lynx-- processing post", {post}, {newpost}, {batching});
  1263.             filenameFeatures(post);
  1264.             if (settings.glowFirstPostByID)
  1265.                 glowpost(post, newpost);
  1266.             if (settings.spoilerImageType.startsWith("reveal"))
  1267.                 revealSpoilerImages(post);
  1268.             if (settings.showPostIndex)
  1269.                 addPostCount(post, newpost);
  1270.  
  1271.             //Run only if its a new post in the thread
  1272.             if (newpost) {
  1273.                 if (settings.spoilerImageType=="thread" || settings.spoilerImageType=="threadAlt")
  1274.                     setThreadSpoiler(post);
  1275.  
  1276.                 //Below functions still have to iterate all posts, do these last and only when necessary.
  1277.                 //These are now manually ran outside this function for performance reasons.
  1278.                 // if (settings.showScrollbarMarkers)
  1279.                 //     recreateScrollMarkers();
  1280.             }
  1281.         }
  1282.  
  1283.         //ANYTHING BELOW ONLY RUNS ON THREAD PAGES (if (isThread))
  1284.         //ANYTHING BELOW ONLY RUNS ON THREAD PAGES (if (isThread))
  1285.         //99% of above are functions. They can be ignored.
  1286.         if (isThread) {
  1287.             if (settings.addKeyboardHandlers) {
  1288.                 document.getElementById("qrbody")?.addEventListener("keydown", replyKeyboardShortcuts);
  1289.                 document.getElementById("quick-reply")?.addEventListener('keydown',function(ev) {
  1290.                     if (ev.key == "Escape") {
  1291.                         document.getElementById("quick-reply")?.querySelector(".close-btn").click();
  1292.                     }
  1293.                 })
  1294.             }
  1295.             //I'm not sure who would ever want this on but I'm making it an option anyways
  1296.             if (settings.preserveQuickReply===false) {
  1297.                 document.getElementById("quick-reply")?.querySelector(".close-btn")?.addEventListener("click", function(ev){
  1298.                     document.getElementById("qrbody").value = "";
  1299.                 });
  1300.                 //This doesn't replace the built in onclick but adds to it so the original onclick will still bring up the qr
  1301.                 document.getElementById("replyButton")?.addEventListener("click", function(ev){
  1302.                     ev.preventDefault();
  1303.                     const qrBody = document.getElementById("qrbody");
  1304.                     if (qrBody) {
  1305.                         qrBody.value = "";
  1306.                         qrBody?.focus();
  1307.                     }
  1308.                 });
  1309.             }
  1310.             if (settings.reverseSearchOptions.saucenao) {
  1311.                 //have to shove this at the bottom of the document since the entire thread is inside a form div and I can't nest it
  1312.                 const formm =`
  1313.                 <form target="_blank" action="https://saucenao.com/search.php" method="POST" enctype="multipart/form-data" style="display:none">
  1314.                 <input type="file" name="file" size="50" id='saucenao_file_input'>
  1315.                 <input type="submit" accesskey="s" value="get sauce" id='saucenao_submit'>
  1316.                 </form>`
  1317.                 document.body.insertAdjacentHTML('beforeend', formm);
  1318.             }
  1319.             //Start running and observing
  1320.             iterateAllPosts();
  1321.             //Delay slow actions to let the page finish loading first.
  1322.             if (settings.showScrollbarMarkers) {
  1323.                 setTimeout(() => recreateScrollMarkers(), 1);
  1324.             }
  1325.             //Observe posts and all their children
  1326.             const observer = new MutationObserver((mt_callback) => {
  1327.                 let foundNewPost = false;
  1328.                 mt_callback.forEach(mut => {
  1329.                     if (mut.type == "childList" && mut.addedNodes?.length > 0) {
  1330.                         //console.log("MutationObserver!!!");
  1331.                         mut.addedNodes.forEach(node => {
  1332.                             //New posts, new inlined posts, new hovered posts all contain .innerPost and are always in a div container.
  1333.                             //New posts are div.postCell and new inlines are div.inlineQuote
  1334.                             if (node.tagName === "DIV") {
  1335.                                 // console.log("lynx ~ observer:", {node}, {mut});
  1336.                                 if (node.classList.contains("postCell")) {
  1337.                                     foundNewPost = true;
  1338.                                     iterateSinglePost(node, true); 
  1339.                                 } else if (node.classList.contains("inlineQuote")) {
  1340.                                     iterateSinglePost(node, false);
  1341.                                 }
  1342.                             }
  1343.                         });
  1344.                     }
  1345.                 });
  1346.                 //Manually run all remaining slow actions here
  1347.                 if (foundNewPost && settings.showScrollbarMarkers) {
  1348.                     recreateScrollMarkers();
  1349.                 }
  1350.             });
  1351.             observer.observe(document.querySelector(".divPosts"), {childList: true, subtree: true});
  1352.  
  1353.             //Observe the hover tooltip (ignore everything else)
  1354.             const toolObserver = new MutationObserver((mutationsList) => {
  1355.                 for (const mutation of mutationsList) {
  1356.                     if (mutation.type === 'childList') {
  1357.                         mutation.addedNodes.forEach(node => {
  1358.                             if (node.tagName === "DIV" && node.matches(".innerPost, .innerOP")) {
  1359.                                 //New hover tooltip found
  1360.                                 iterateSinglePost(node, false);
  1361.                             }
  1362.                         });
  1363.                     }
  1364.                 }
  1365.             });
  1366.             const quoteTooltip = document.body?.querySelector(":scope > div.quoteTooltip");
  1367.             if (quoteTooltip) {
  1368.                 toolObserver.observe(quoteTooltip, {childList: true});
  1369.             }
  1370.         }
  1371.     } //End of runAfterDom()
  1372.  
  1373.     //Starting runAfterDom when the document is ready
  1374.     waitForDom(runAfterDom);
  1375. })();