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