gluehuffer
/
pager
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Mods

This commit is contained in:
Auric Vente 2023-04-26 23:57:59 -06:00
parent e5e24077cc
commit d70db6236e
3 changed files with 4482 additions and 4493 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

143
base.js
View File

@ -1,26 +1,26 @@
const M = {} const App = {}
M.init = function () { App.init = () => {
M.numb = M.$("#numb") App.numb = App.el(`#numb`)
M.filter = M.$("#filter") App.filter = App.el(`#filter`)
M.keydec() App.keydec()
M.start_widgets() App.start_widgets()
M.update() App.update()
if (M.numb.value) { if (App.numb.value) {
M.do_numb_action() App.do_numb_action()
} }
if (M.filter.value) { if (App.filter.value) {
M.do_filter_action() App.do_filter_action()
} }
M.filter.focus() App.filter.focus()
M.move_cursor_to_end(M.filter) App.move_cursor_to_end(App.filter)
} }
M.$ = function (s, parent = false) { App.el = (s, parent = false) => {
if (!parent) { if (!parent) {
parent = document parent = document
} }
@ -28,28 +28,14 @@ M.$ = function (s, parent = false) {
return parent.querySelector(s) return parent.querySelector(s)
} }
M.$$ = function (s, parent = false, direct = false) { App.debounce = (func, wait, immediate) => {
if (!parent) {
parent = document
}
let items = Array.from(parent.querySelectorAll(s))
if (direct) {
items = items.filter((node) => node.parentNode === parent)
}
return items
}
M.debounce = function (func, wait, immediate) {
let timeout let timeout
return function executedFunction() { return function executedFunction() {
let context = this let context = this
let args = arguments let args = arguments
let later = function () { let later = () => {
timeout = null timeout = null
if (!immediate) func.apply(context, args) if (!immediate) func.apply(context, args)
} }
@ -61,49 +47,50 @@ M.debounce = function (func, wait, immediate) {
} }
} }
M.move_cursor_to_end = function (element) { App.move_cursor_to_end = (element) => {
element.selectionStart = element.selectionEnd = element.value.length element.selectionStart = element.selectionEnd = element.value.length
} }
M.do_numb_action = function () { App.do_numb_action = () => {
M.numb.value = parseInt(M.numb.value.replace(/\D/g, "")) App.numb.value = parseInt(App.numb.value.replace(/\D/g, ``))
if (M.numb.value > 9999) { if (App.numb.value > 9999) {
M.numb.value = 9999 App.numb.value = 9999
} else if (M.numb.value != "" && M.numb.value < 0) { }
M.numb.value = 0 else if (App.numb.value != `` && App.numb.value < 0) {
App.numb.value = 0
} }
M.update(M.filter.value.trim()) App.update(App.filter.value.trim())
} }
M.do_filter_action = function () { App.do_filter_action = () => {
M.update(M.filter.value.trim()) App.update(App.filter.value.trim())
} }
M.keydec = function () { App.keydec = () => {
M.numb.addEventListener( App.numb.addEventListener(
"input", `input`,
M.debounce(function (e) { App.debounce((e) => {
M.do_numb_action() App.do_numb_action()
}, 350) }, 350)
) )
M.filter.addEventListener( App.filter.addEventListener(
"input", `input`,
M.debounce(function (e) { App.debounce((e) => {
M.do_filter_action() App.do_filter_action()
}, 350) }, 350)
) )
M.filter.addEventListener("keydown", function (e) { App.filter.addEventListener(`keydown`, (e) => {
if (e.key === "Escape") { if (e.key === `Escape`) {
M.clear_filter() App.clear_filter()
} }
}) })
document.addEventListener("keydown", function (e) { document.addEventListener(`keydown`, (e) => {
if (document.activeElement !== M.filter) { if (document.activeElement !== App.filter) {
if (e.key.length === 1 && e.key.match(/[a-zA-Z]/)) { if (e.key.length === 1 && e.key.match(/[a-zA-Z]/)) {
filter.focus() filter.focus()
} }
@ -111,31 +98,33 @@ M.keydec = function () {
}) })
} }
M.update = function (txt = "") { App.update = (txt = ``) => {
txt = txt.toLowerCase() txt = txt.toLowerCase()
let s = "" let s = ``
let all = txt ? false : true let all = txt ? false : true
let len = M.nouns.length let len = App.nouns.length
let index = parseInt(M.numb.value) % len let index = parseInt(App.numb.value) % len
let exact = M.$("#exact_filter").checked let exact = App.el(`#exact_filter`).checked
for (let i = 0; i < M.nouns.length; i++) { for (let i = 0; i < App.nouns.length; i++) {
let include = false let include = false
if (all) { if (all) {
include = true include = true
} else if (exact) { }
include = M.nouns[i] === txt || M.nouns[index] === txt else if (exact) {
} else { include = App.nouns[i] === txt || App.nouns[index] === txt
include = M.nouns[i].includes(txt) || M.nouns[index].includes(txt) }
else {
include = App.nouns[i].includes(txt) || App.nouns[index].includes(txt)
} }
if (include) { if (include) {
s += ` s += `
<div class='list_item'> <div class='list_item'>
<div class='list_item_word'>${M.nouns[i]}</div> <div class='list_item_word'>${App.nouns[i]}</div>
<div class='list_item_arrow'>-&gt;</div> <div class='list_item_arrow'>-&gt;</div>
<div class='list_item_word_2'>${M.nouns[index]}</div> <div class='list_item_word_2'>${App.nouns[index]}</div>
</div>` </div>`
} }
@ -146,24 +135,24 @@ M.update = function (txt = "") {
} }
} }
M.$("#list").innerHTML = s App.el(`#list`).innerHTML = s
} }
M.start_widgets = function () { App.start_widgets = () => {
M.$("#exact_filter").addEventListener("change", function (e) { App.el(`#exact_filter`).addEventListener(`change`, (e) => {
if (M.filter.value) { if (App.filter.value) {
M.do_filter_action() App.do_filter_action()
} }
}) })
M.$("#clear_filter").addEventListener("click", function (e) { App.el(`#clear_filter`).addEventListener(`click`, (e) => {
M.clear_filter() App.clear_filter()
}) })
} }
M.clear_filter = function () { App.clear_filter = () => {
if (M.filter.value) { if (App.filter.value) {
M.filter.value = "" App.filter.value = ``
M.do_filter_action() App.do_filter_action()
} }
} }

28
index.html
View File

@ -4,29 +4,29 @@
<head> <head>
<title>Coke Bottle Glasses</title> <title>Coke Bottle Glasses</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="shortcut icon" href="favicon.ico?v=1" type="image/x-icon"> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" type="text/css" href="style.css?v=1"> <link rel="stylesheet" type="text/css" href="style.css">
<script src='base.js?v=4'></script> <script src="base.js"></script>
<script src='nouns.js?v=1'></script> <script src="nouns.js"></script>
<script> <script>
window.onload = function() { window.onload = () => {
M.init() App.init()
} }
</script> </script>
</head> </head>
<body> <body>
<div id='inputs'> <div id="inputs">
<input type='number' max='9999' min='0' id='numb' value='89' title='Page'> <input type="number" max="9999" min="0" id="numb" value="89" title="Page">
<input type='text' id='filter' placeholder='Filter'> <input type="text" id="filter" placeholder="Filter">
<div class='flex_row_center'> <div class="flex_row_center">
<div>Exact:</div> <div>Exact:</div>
<input id='exact_filter' type='checkbox'> <input id="exact_filter" type="checkbox">
<div class='separator'>|</div> <div class="separator">|</div>
<div id='clear_filter' class='pointer'>Clear</div> <div id="clear_filter" class="pointer">Clear</div>
</div> </div>
</div> </div>
<div id='list'></div> <div id="list"></div>
</body> </body>
</html> </html>

8804
nouns.js
View File

File diff suppressed because it is too large Load Diff