TEXT   35   0
   414 5.23 KB    142

Improved Flag Selector

By AnonPPP
Created: 2021-10-01 15:18:38
Expiry: Never

  1. 1.
    // This is a userscript to make the flagselector more bearable
  2. 2.
    // For Archival Purpose (I did not make this)
  3. 3.
    // Source code checks out
  4. 4.
    // ==UserScript==
  5. 5.
    // @name Improved Waifu Flag Selection
  6. 6.
  7. 7.
    // @version 1.0.3
  8. 8.
    // @description Improved flag selection for /mlp/ (icons, search, etc)
  9. 9.
    // @author Anonymous
  10. 10.
    // @license MIT
  11. 11.
  12. 12.
  13. 13.
  14. 14.
  15. 15.
  16. 16.
  17. 17.
    // @grant GM_getResourceText
  18. 18.
    // @grant GM_addStyle
  19. 19.
    // ==/UserScript==
  20. 20.
     
  21. 21.
    (function() {
  22. 22.
    'use strict';
  23. 23.
    /*global Choices, NodeCreationObserver*/
  24. 24.
    GM_addStyle(GM_getResourceText("cssMain"));
  25. 25.
    GM_addStyle(`
  26. 26.
    .choices__inner {
  27. 27.
    box-sizing: border-box;
  28. 28.
    padding: 0 !important;
  29. 29.
    min-height: 25px !important;
  30. 30.
    }
  31. 31.
    .choices[data-type*="select-one"] .choices__inner {
  32. 32.
    padding-bottom: 0px !important;
  33. 33.
    }
  34. 34.
    .choices[data-type*="select-one"] .choices__input {
  35. 35.
    padding: 3px !important;
  36. 36.
    }
  37. 37.
    .choices__list--dropdown .choices__item {
  38. 38.
    padding: 3px !important;
  39. 39.
    }
  40. 40.
    .bfl-0 {
  41. 41.
    visibility: hidden;
  42. 42.
    }
  43. 43.
    #qr > form {
  44. 44.
    overflow-y: visible !important;
  45. 45.
    overflow-x: visible !important;
  46. 46.
    }
  47. 47.
    `);
  48. 48.
    if (document.querySelector('link[rel="stylesheet"][href*="flags"]') === null) {
  49. 49.
    GM_addStyle(GM_getResourceText("cssFlags"));
  50. 50.
    }
  51. 51.
     
  52. 52.
    let clonedFlagSelector;
  53. 53.
    let myNodeList = document.querySelectorAll('.flagSelector');
  54. 54.
    for (let i = 0; i < myNodeList.length; i++) {
  55. 55.
    let flagSelectorElem = myNodeList[i];
  56. 56.
    if (i == 0) {
  57. 57.
    clonedFlagSelector = flagSelectorElem.cloneNode(true);
  58. 58.
    }
  59. 59.
    createChoices(flagSelectorElem, 'choices ponyFlagChoices');
  60. 60.
    console.log("i=" + i);
  61. 61.
    }
  62. 62.
     
  63. 63.
    function createChoices(flagSelectorElem, outerClass) {
  64. 64.
    const choices = new Choices(flagSelectorElem, {
  65. 65.
    searchResultLimit: 80,
  66. 66.
    searchPlaceholderValue: "Search pony",
  67. 67.
    noResultsText: 'No ponies found',
  68. 68.
    itemSelectText: '',
  69. 69.
    shouldSort: false,
  70. 70.
    classNames: {
  71. 71.
    containerOuter: outerClass,
  72. 72.
    },
  73. 73.
    fuseOptions: {
  74. 74.
    includeMatches: true,
  75. 75.
    includeScore: true,
  76. 76.
    threshold: 0.1,
  77. 77.
    distance: 600
  78. 78.
    },
  79. 79.
    callbackOnCreateTemplates: () => ({
  80. 80.
    choice: (...args) => {
  81. 81.
    const choiceDefault = Choices.defaults.templates.choice.call(this, ...args);
  82. 82.
    addIcon(choiceDefault, ...args);
  83. 83.
    return choiceDefault;
  84. 84.
    },
  85. 85.
    item: (...args) => {
  86. 86.
    const itemDefault = Choices.defaults.templates.item.call(this, ...args);
  87. 87.
    addIcon(itemDefault, ...args);
  88. 88.
    return itemDefault;
  89. 89.
    }
  90. 90.
    }),
  91. 91.
    });
  92. 92.
    flagSelectorElem.addEventListener(
  93. 93.
    'choice',
  94. 94.
    function(event) {
  95. 95.
    setBoardFlag(event.detail.choice.value);
  96. 96.
    },
  97. 97.
    false,
  98. 98.
    );
  99. 99.
    choices.setChoiceByValue(getBoardFlag());
  100. 100.
    return choices;
  101. 101.
    }
  102. 102.
     
  103. 103.
    function addIcon(templateElement, ...args) {
  104. 104.
    console.log(args[1]);
  105. 105.
    const icon = document.createElement("span");
  106. 106.
    icon.classList.add("bfl", "bfl-" + args[1].value.toLowerCase());
  107. 107.
    const space = document.createTextNode(" ");
  108. 108.
    templateElement.prepend(icon, space);
  109. 109.
    }
  110. 110.
     
  111. 111.
    //#qrForm > #qrCaptchaContainer + div > .flagSelector,
  112. 112.
    let isObserve = true;
  113. 113.
    NodeCreationObserver.onCreation("#qrForm > #qrCaptchaContainer + div > .ponyFlagChoices", (node) => {
  114. 114.
    if (isObserve) {
  115. 115.
    isObserve = false;
  116. 116.
    let curFlagSelector = clonedFlagSelector.cloneNode(true);
  117. 117.
    node.parentNode.appendChild(curFlagSelector);
  118. 118.
    node.remove();
  119. 119.
    createChoices(curFlagSelector, 'choices');
  120. 120.
    isObserve = true;
  121. 121.
    }
  122. 122.
    });
  123. 123.
    NodeCreationObserver.onCreation("#qr > form > .flagSelector", (node) => {
  124. 124.
    if (isObserve) {
  125. 125.
    isObserve = false;
  126. 126.
    createChoices(node, 'choices');
  127. 127.
    isObserve = true;
  128. 128.
    }
  129. 129.
    });
  130. 130.
     
  131. 131.
    function setBoardFlag(value) {
  132. 132.
    var curBoardFlagKey = "4chan_flag_" + location.pathname.split(/\//)[1];
  133. 133.
    "0" === value ? localStorage.removeItem(curBoardFlagKey) : localStorage.setItem(curBoardFlagKey, value);
  134. 134.
    }
  135. 135.
     
  136. 136.
    function getBoardFlag() {
  137. 137.
    var curBoardFlagKey = "4chan_flag_" + location.pathname.split(/\//)[1];
  138. 138.
    return localStorage.getItem(curBoardFlagKey) || "0";
  139. 139.
    }
  140. 140.
     
  141. 141.
    // .flagSelector
  142. 142.
    })();

/mlp/ Flags All ID'S

by AnonPPP

Flag Hider (4ChanX)

by AnonPPP

Flag Filter (4ChanX)

by AnonPPP

A Joint Collection of (almost) all MD5 Image Hashes (EQG)

by AnonPPP

MLP G5 Stream Compilation

by AnonPPP