@turnipxenon/pineapple 2.4.52 → 2.4.54
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.idea/workspace.xml +54 -51
- package/.svelte-kit/__package__/components/combo_box/ComboBox.svelte +7 -7
- package/.svelte-kit/__package__/components/combo_box/ComboBoxWithButton.svelte +7 -7
- package/.svelte-kit/__package__/components/combo_box/combo-box.postcss +22 -22
- package/.svelte-kit/__package__/template/seaweed/ParseQueryTerms.d.ts +1 -0
- package/.svelte-kit/__package__/template/seaweed/ParseQueryTerms.js +23 -0
- package/.svelte-kit/__package__/template/seaweed/SeaweedTemplate.svelte +10 -22
- package/.svelte-kit/__package__/template/seaweed/entry_order_config/EntryOrderConfig.svelte +117 -117
- package/.svelte-kit/generated/server/internal.js +1 -1
- package/dist/components/combo_box/ComboBox.svelte +7 -7
- package/dist/components/combo_box/ComboBoxWithButton.svelte +7 -7
- package/dist/components/combo_box/combo-box.postcss +22 -22
- package/dist/template/seaweed/ParseQueryTerms.d.ts +1 -0
- package/dist/template/seaweed/ParseQueryTerms.js +23 -0
- package/dist/template/seaweed/SeaweedTemplate.svelte +10 -22
- package/dist/template/seaweed/entry_order_config/EntryOrderConfig.svelte +117 -117
- package/package.json +1 -1
- package/src/lib/components/combo_box/ComboBox.svelte +13 -13
- package/src/lib/components/combo_box/ComboBoxWithButton.svelte +18 -18
- package/src/lib/components/combo_box/combo-box.postcss +22 -22
- package/src/lib/template/seaweed/ParseQueryTerms.ts +26 -0
- package/src/lib/template/seaweed/RunChaos.ts +44 -44
- package/src/lib/template/seaweed/SeaweedTemplate.svelte +11 -34
- package/src/lib/template/seaweed/entry_order_config/EntryOrderConfig.svelte +166 -166
- package/src/lib/template/seaweed/entry_order_config/EntryOrderConfig.ts +6 -6
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
.combo-box-wrapper {
|
|
2
|
-
display: flex;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
.select {
|
|
6
|
-
flex-grow: 1;
|
|
7
|
-
@apply variant-filled-primary;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
.dark .select option {
|
|
11
|
-
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
.combo-box-side-button {
|
|
15
|
-
@apply btn variant-filled-primary;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.dark .option,
|
|
19
|
-
.dark .select,
|
|
20
|
-
.dark .combo-box-side-button {
|
|
21
|
-
color: var(--color-text-50);
|
|
22
|
-
}
|
|
1
|
+
.combo-box-wrapper {
|
|
2
|
+
display: flex;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.select {
|
|
6
|
+
flex-grow: 1;
|
|
7
|
+
@apply variant-filled-primary;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.dark .select option {
|
|
11
|
+
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.combo-box-side-button {
|
|
15
|
+
@apply btn variant-filled-primary;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.dark .option,
|
|
19
|
+
.dark .select,
|
|
20
|
+
.dark .combo-box-side-button {
|
|
21
|
+
color: var(--color-text-50);
|
|
22
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const parseQueryTerms: (node: Element, querySet: Set<string>) => void;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
export const parseQueryTerms = (node, querySet) => {
|
|
2
|
+
// change all text content to gibberish
|
|
3
|
+
for (const child of Array.from(node.children)) {
|
|
4
|
+
if (child.nodeType === Node.ELEMENT_NODE) {
|
|
5
|
+
parseQueryTerms(child, querySet);
|
|
6
|
+
// todo: if it's a span and it wraps a word, and qt class then we count that as query
|
|
7
|
+
// for (const childOfChild of child.childNodes) {
|
|
8
|
+
// if (childOfChild.nodeType === Node.TEXT_NODE && childOfChild.textContent?.trim()) {
|
|
9
|
+
// // todo analyze textcontent
|
|
10
|
+
// }
|
|
11
|
+
// }
|
|
12
|
+
// Warning: below is not redundant and is a catch-all
|
|
13
|
+
// Long-term solution: figure out the correct typing
|
|
14
|
+
if ((typeof child.className === "string") && child.className?.includes("qt-")) {
|
|
15
|
+
child.className.split(" ").forEach(c => {
|
|
16
|
+
if (c.startsWith("qt-")) {
|
|
17
|
+
querySet.add(c);
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
};
|
|
@@ -8,13 +8,13 @@ import { Accordion, AccordionItem, CodeBlock, SlideToggle } from "@skeletonlabs/
|
|
|
8
8
|
import { page } from "$app/stores";
|
|
9
9
|
import Card from "../../components/Card.svelte";
|
|
10
10
|
import ElementVisbilityDetector from "../../components/ElementVisbilityDetector.svelte";
|
|
11
|
-
import selfContent from "./SeaweedTemplate.svelte?raw";
|
|
12
11
|
import {
|
|
13
12
|
AllGroupedEntriesProjectFirst,
|
|
14
13
|
GetEntryFromGlobal,
|
|
15
14
|
seaweedTemplateData,
|
|
16
15
|
TurnGroupEntriesMutable
|
|
17
16
|
} from "./SeaweedTemplateData";
|
|
17
|
+
import { parseQueryTerms } from "./ParseQueryTerms";
|
|
18
18
|
export let letChaos = true;
|
|
19
19
|
export let name = "Turnip";
|
|
20
20
|
export let email = "turnipxenon@gmail.com";
|
|
@@ -25,7 +25,6 @@ export let extraComponent = void 0;
|
|
|
25
25
|
const entryProps = {
|
|
26
26
|
email
|
|
27
27
|
};
|
|
28
|
-
const entryList = import.meta.glob("./entries/*.svelte", { query: "?raw", eager: true });
|
|
29
28
|
const paramQTSet = /* @__PURE__ */ new Set();
|
|
30
29
|
let isVisible = true;
|
|
31
30
|
let isAdvanceSettingOn = false;
|
|
@@ -46,25 +45,9 @@ const syncQT = () => {
|
|
|
46
45
|
});
|
|
47
46
|
seaweedTemplateData.queryTermMap = seaweedTemplateData.queryTermMap;
|
|
48
47
|
};
|
|
49
|
-
const
|
|
50
|
-
console.log("parsing", seaweedTemplateData.queryTermMap.size);
|
|
48
|
+
const parseQueryTermsLocal = async () => {
|
|
51
49
|
const qtSet = /* @__PURE__ */ new Set();
|
|
52
|
-
|
|
53
|
-
[...Object.values(entryList).map((e) => e.default), selfContent].forEach((body) => {
|
|
54
|
-
console.log("parsing", body);
|
|
55
|
-
rawTermList.push(
|
|
56
|
-
...body.split('"').filter((s) => s.startsWith("qt-"))
|
|
57
|
-
// step 2: filter out texts that does not begin with "qt-"
|
|
58
|
-
);
|
|
59
|
-
});
|
|
60
|
-
rawTermList.forEach((t) => {
|
|
61
|
-
t.split(" ").forEach((nt) => {
|
|
62
|
-
if (["qt-1", "qt-2", "qt-*", "qt-"].includes(nt)) {
|
|
63
|
-
return;
|
|
64
|
-
}
|
|
65
|
-
qtSet.add(nt);
|
|
66
|
-
});
|
|
67
|
-
});
|
|
50
|
+
parseQueryTerms(document.body, qtSet);
|
|
68
51
|
qtSet.forEach((t) => seaweedTemplateData.queryTermMap.set(t, true));
|
|
69
52
|
seaweedTemplateData.queryTermMap = seaweedTemplateData.queryTermMap;
|
|
70
53
|
syncQT();
|
|
@@ -126,8 +109,13 @@ onMount(async () => {
|
|
|
126
109
|
if (letChaos) {
|
|
127
110
|
runChaos(document.body);
|
|
128
111
|
chaosDone = true;
|
|
129
|
-
}
|
|
130
|
-
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
let isParsed = false;
|
|
115
|
+
afterUpdate(async () => {
|
|
116
|
+
if (!letChaos && !isParsed) {
|
|
117
|
+
isParsed = true;
|
|
118
|
+
await parseQueryTermsLocal();
|
|
131
119
|
}
|
|
132
120
|
});
|
|
133
121
|
const toggleTerm = (term) => {
|
|
@@ -90,120 +90,120 @@ const removeEntry = (entry, group) => {
|
|
|
90
90
|
};
|
|
91
91
|
const allDefaultEntries = Array.from(GetAllEntryFromGlobal().keys());
|
|
92
92
|
console.log("Test", Array.from(GetAllEntryFromGlobal().keys()));
|
|
93
|
-
</script>
|
|
94
|
-
|
|
95
|
-
<h3>Site ordering</h3>
|
|
96
|
-
<blockquote>Sorry! This part of the website is still WIP, but here it is anyway. As long as it functions</blockquote>
|
|
97
|
-
|
|
98
|
-
<!-- formatting: group1:entry1|entry2,group2:entry3
|
|
99
|
-
: <= separates the group header, the entries, and the class
|
|
100
|
-
| <= separates each entries
|
|
101
|
-
, <= separates each group
|
|
102
|
-
-->
|
|
103
|
-
<div class="advanced-setting-list">
|
|
104
|
-
<!-- todo: we might have to extract this into it's own component -->
|
|
105
|
-
<!-- todo: NOW!!! -->
|
|
106
|
-
{#each seaweedEntries as group, groupIndex}
|
|
107
|
-
<div>
|
|
108
|
-
<div>
|
|
109
|
-
<button class="editable-button" on:click={removeGroup(group)}>X</button>
|
|
110
|
-
<!-- todo: move group up or down -->
|
|
111
|
-
<button class="editable-button" on:click={swapGroups(groupIndex, true)}>^</button>
|
|
112
|
-
<button class="editable-button" on:click={swapGroups(groupIndex, false)}>v</button>
|
|
113
|
-
{group.name}
|
|
114
|
-
</div>
|
|
115
|
-
<div class="advanced-setting-list card">
|
|
116
|
-
{#each group.items as entry, entryIndex}
|
|
117
|
-
<div class="editable-entry">
|
|
118
|
-
<button on:click={removeEntry(entry, group)}>-</button>
|
|
119
|
-
<button on:click={swapEntry(entryIndex, group, true)}>^</button>
|
|
120
|
-
<button on:click={swapEntry(entryIndex, group, false)}>v</button>
|
|
121
|
-
{entry.name}
|
|
122
|
-
</div>
|
|
123
|
-
{/each}
|
|
124
|
-
</div>
|
|
125
|
-
|
|
126
|
-
<ComboBoxWithButton stringItems={allDefaultEntries}
|
|
127
|
-
onClick={addEntry(group)}></ComboBoxWithButton>
|
|
128
|
-
|
|
129
|
-
</div>
|
|
130
|
-
{/each}
|
|
131
|
-
</div>
|
|
132
|
-
|
|
133
|
-
<style>
|
|
134
|
-
.advanced-setting-list {
|
|
135
|
-
display: flex;
|
|
136
|
-
flex-direction: column;
|
|
137
|
-
}
|
|
138
|
-
|
|
139
|
-
:is(.dark .editable-entry > button),:is(.dark .editable-button) {
|
|
140
|
-
--tw-bg-opacity: 1;
|
|
141
|
-
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
142
|
-
color: rgb(var(--on-primary));
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
.editable-entry > button:disabled, .editable-button:disabled {
|
|
146
|
-
cursor: not-allowed;
|
|
147
|
-
opacity: 0.5;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
.editable-entry > button:disabled:hover, .editable-button:disabled:hover {
|
|
151
|
-
--tw-brightness: brightness(1);
|
|
152
|
-
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
.editable-entry > button:disabled:active, .editable-button:disabled:active {
|
|
156
|
-
--tw-scale-x: 1;
|
|
157
|
-
--tw-scale-y: 1;
|
|
158
|
-
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
.editable-entry > button, .editable-button {
|
|
162
|
-
font-size: 1rem;
|
|
163
|
-
line-height: 1.5rem;
|
|
164
|
-
padding-left: 1.25rem;
|
|
165
|
-
padding-right: 1.25rem;
|
|
166
|
-
padding-top: 9px;
|
|
167
|
-
padding-bottom: 9px;
|
|
168
|
-
white-space: nowrap;
|
|
169
|
-
text-align: center;
|
|
170
|
-
display: inline-flex;
|
|
171
|
-
align-items: center;
|
|
172
|
-
justify-content: center;
|
|
173
|
-
transition-property: all;
|
|
174
|
-
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
175
|
-
transition-duration: 150ms;
|
|
176
|
-
border-radius: var(--theme-rounded-base);
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
.editable-entry > button > :not([hidden]) ~ :not([hidden]), .editable-button > :not([hidden]) ~ :not([hidden]) {
|
|
180
|
-
--tw-space-x-reverse: 0;
|
|
181
|
-
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
|
182
|
-
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
.editable-entry > button:hover, .editable-button:hover {
|
|
186
|
-
--tw-brightness: brightness(1.15);
|
|
187
|
-
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
.editable-entry > button:active, .editable-button:active {
|
|
191
|
-
--tw-scale-x: 95%;
|
|
192
|
-
--tw-scale-y: 95%;
|
|
193
|
-
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
194
|
-
--tw-brightness: brightness(.9);
|
|
195
|
-
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
.editable-entry > button, .editable-button {
|
|
199
|
-
--tw-bg-opacity: 1;
|
|
200
|
-
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
201
|
-
color: rgb(var(--on-primary));
|
|
202
|
-
}
|
|
203
|
-
|
|
204
|
-
:is(.dark .editable-entry > button),:is(.dark .editable-button) {
|
|
205
|
-
--tw-bg-opacity: 1;
|
|
206
|
-
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
207
|
-
color: rgb(var(--on-primary));
|
|
208
|
-
}
|
|
209
|
-
</style>
|
|
93
|
+
</script>
|
|
94
|
+
|
|
95
|
+
<h3>Site ordering</h3>
|
|
96
|
+
<blockquote>Sorry! This part of the website is still WIP, but here it is anyway. As long as it functions</blockquote>
|
|
97
|
+
|
|
98
|
+
<!-- formatting: group1:entry1|entry2,group2:entry3
|
|
99
|
+
: <= separates the group header, the entries, and the class
|
|
100
|
+
| <= separates each entries
|
|
101
|
+
, <= separates each group
|
|
102
|
+
-->
|
|
103
|
+
<div class="advanced-setting-list">
|
|
104
|
+
<!-- todo: we might have to extract this into it's own component -->
|
|
105
|
+
<!-- todo: NOW!!! -->
|
|
106
|
+
{#each seaweedEntries as group, groupIndex}
|
|
107
|
+
<div>
|
|
108
|
+
<div>
|
|
109
|
+
<button class="editable-button" on:click={removeGroup(group)}>X</button>
|
|
110
|
+
<!-- todo: move group up or down -->
|
|
111
|
+
<button class="editable-button" on:click={swapGroups(groupIndex, true)}>^</button>
|
|
112
|
+
<button class="editable-button" on:click={swapGroups(groupIndex, false)}>v</button>
|
|
113
|
+
{group.name}
|
|
114
|
+
</div>
|
|
115
|
+
<div class="advanced-setting-list card">
|
|
116
|
+
{#each group.items as entry, entryIndex}
|
|
117
|
+
<div class="editable-entry">
|
|
118
|
+
<button on:click={removeEntry(entry, group)}>-</button>
|
|
119
|
+
<button on:click={swapEntry(entryIndex, group, true)}>^</button>
|
|
120
|
+
<button on:click={swapEntry(entryIndex, group, false)}>v</button>
|
|
121
|
+
{entry.name}
|
|
122
|
+
</div>
|
|
123
|
+
{/each}
|
|
124
|
+
</div>
|
|
125
|
+
|
|
126
|
+
<ComboBoxWithButton stringItems={allDefaultEntries}
|
|
127
|
+
onClick={addEntry(group)}></ComboBoxWithButton>
|
|
128
|
+
|
|
129
|
+
</div>
|
|
130
|
+
{/each}
|
|
131
|
+
</div>
|
|
132
|
+
|
|
133
|
+
<style>
|
|
134
|
+
.advanced-setting-list {
|
|
135
|
+
display: flex;
|
|
136
|
+
flex-direction: column;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
:is(.dark .editable-entry > button),:is(.dark .editable-button) {
|
|
140
|
+
--tw-bg-opacity: 1;
|
|
141
|
+
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
142
|
+
color: rgb(var(--on-primary));
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.editable-entry > button:disabled, .editable-button:disabled {
|
|
146
|
+
cursor: not-allowed;
|
|
147
|
+
opacity: 0.5;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
.editable-entry > button:disabled:hover, .editable-button:disabled:hover {
|
|
151
|
+
--tw-brightness: brightness(1);
|
|
152
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
.editable-entry > button:disabled:active, .editable-button:disabled:active {
|
|
156
|
+
--tw-scale-x: 1;
|
|
157
|
+
--tw-scale-y: 1;
|
|
158
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
.editable-entry > button, .editable-button {
|
|
162
|
+
font-size: 1rem;
|
|
163
|
+
line-height: 1.5rem;
|
|
164
|
+
padding-left: 1.25rem;
|
|
165
|
+
padding-right: 1.25rem;
|
|
166
|
+
padding-top: 9px;
|
|
167
|
+
padding-bottom: 9px;
|
|
168
|
+
white-space: nowrap;
|
|
169
|
+
text-align: center;
|
|
170
|
+
display: inline-flex;
|
|
171
|
+
align-items: center;
|
|
172
|
+
justify-content: center;
|
|
173
|
+
transition-property: all;
|
|
174
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
175
|
+
transition-duration: 150ms;
|
|
176
|
+
border-radius: var(--theme-rounded-base);
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
.editable-entry > button > :not([hidden]) ~ :not([hidden]), .editable-button > :not([hidden]) ~ :not([hidden]) {
|
|
180
|
+
--tw-space-x-reverse: 0;
|
|
181
|
+
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
|
182
|
+
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
.editable-entry > button:hover, .editable-button:hover {
|
|
186
|
+
--tw-brightness: brightness(1.15);
|
|
187
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
.editable-entry > button:active, .editable-button:active {
|
|
191
|
+
--tw-scale-x: 95%;
|
|
192
|
+
--tw-scale-y: 95%;
|
|
193
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
194
|
+
--tw-brightness: brightness(.9);
|
|
195
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
.editable-entry > button, .editable-button {
|
|
199
|
+
--tw-bg-opacity: 1;
|
|
200
|
+
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
201
|
+
color: rgb(var(--on-primary));
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
:is(.dark .editable-entry > button),:is(.dark .editable-button) {
|
|
205
|
+
--tw-bg-opacity: 1;
|
|
206
|
+
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
207
|
+
color: rgb(var(--on-primary));
|
|
208
|
+
}
|
|
209
|
+
</style>
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
import "./combo-box.postcss";
|
|
3
|
-
|
|
4
|
-
export let stringItems: string[] = ["Select item"];
|
|
5
|
-
export let selectedValue = "";
|
|
6
|
-
selectedValue = stringItems.length === 0 ? "" : stringItems[0];
|
|
7
|
-
</script>
|
|
8
|
-
|
|
9
|
-
<select bind:value={selectedValue} class="select">
|
|
10
|
-
{#each stringItems as item}
|
|
11
|
-
<option value={item}>{item}</option>
|
|
12
|
-
{/each}
|
|
13
|
-
</select>
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import "./combo-box.postcss";
|
|
3
|
+
|
|
4
|
+
export let stringItems: string[] = ["Select item"];
|
|
5
|
+
export let selectedValue = "";
|
|
6
|
+
selectedValue = stringItems.length === 0 ? "" : stringItems[0];
|
|
7
|
+
</script>
|
|
8
|
+
|
|
9
|
+
<select bind:value={selectedValue} class="select">
|
|
10
|
+
{#each stringItems as item}
|
|
11
|
+
<option value={item}>{item}</option>
|
|
12
|
+
{/each}
|
|
13
|
+
</select>
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
<script lang="ts">
|
|
2
|
-
import ComboBox from "./ComboBox.svelte";
|
|
3
|
-
import "./combo-box.postcss";
|
|
4
|
-
|
|
5
|
-
export let selectedValue = "";
|
|
6
|
-
export let stringItems: string[] = [];
|
|
7
|
-
export let onClick: undefined | ((selected: string) => void) = undefined;
|
|
8
|
-
|
|
9
|
-
let onClickInternal = () => {
|
|
10
|
-
onClick?.(selectedValue);
|
|
11
|
-
};
|
|
12
|
-
</script>
|
|
13
|
-
|
|
14
|
-
<div class="combo-box-wrapper">
|
|
15
|
-
<button class="combo-box-side-button btn variant-filled-primary" on:click={onClickInternal}>+ Add entry</button>
|
|
16
|
-
<ComboBox bind:selectedValue={selectedValue}
|
|
17
|
-
bind:stringItems={stringItems}></ComboBox>
|
|
18
|
-
</div>
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import ComboBox from "./ComboBox.svelte";
|
|
3
|
+
import "./combo-box.postcss";
|
|
4
|
+
|
|
5
|
+
export let selectedValue = "";
|
|
6
|
+
export let stringItems: string[] = [];
|
|
7
|
+
export let onClick: undefined | ((selected: string) => void) = undefined;
|
|
8
|
+
|
|
9
|
+
let onClickInternal = () => {
|
|
10
|
+
onClick?.(selectedValue);
|
|
11
|
+
};
|
|
12
|
+
</script>
|
|
13
|
+
|
|
14
|
+
<div class="combo-box-wrapper">
|
|
15
|
+
<button class="combo-box-side-button btn variant-filled-primary" on:click={onClickInternal}>+ Add entry</button>
|
|
16
|
+
<ComboBox bind:selectedValue={selectedValue}
|
|
17
|
+
bind:stringItems={stringItems}></ComboBox>
|
|
18
|
+
</div>
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
.combo-box-wrapper {
|
|
2
|
-
display: flex;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
.select {
|
|
6
|
-
flex-grow: 1;
|
|
7
|
-
@apply variant-filled-primary;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
.dark .select option {
|
|
11
|
-
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
.combo-box-side-button {
|
|
15
|
-
@apply btn variant-filled-primary;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.dark .option,
|
|
19
|
-
.dark .select,
|
|
20
|
-
.dark .combo-box-side-button {
|
|
21
|
-
color: var(--color-text-50);
|
|
22
|
-
}
|
|
1
|
+
.combo-box-wrapper {
|
|
2
|
+
display: flex;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.select {
|
|
6
|
+
flex-grow: 1;
|
|
7
|
+
@apply variant-filled-primary;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.dark .select option {
|
|
11
|
+
background-color: rgb(var(--color-primary-500) / var(--tw-bg-opacity));
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.combo-box-side-button {
|
|
15
|
+
@apply btn variant-filled-primary;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.dark .option,
|
|
19
|
+
.dark .select,
|
|
20
|
+
.dark .combo-box-side-button {
|
|
21
|
+
color: var(--color-text-50);
|
|
22
|
+
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
export const parseQueryTerms = (node: Element, querySet: Set<string>) => {
|
|
2
|
+
// change all text content to gibberish
|
|
3
|
+
for (const child of Array.from(node.children)) {
|
|
4
|
+
if (child.nodeType === Node.ELEMENT_NODE) {
|
|
5
|
+
parseQueryTerms(child, querySet);
|
|
6
|
+
// todo: if it's a span and it wraps a word, and qt class then we count that as query
|
|
7
|
+
// for (const childOfChild of child.childNodes) {
|
|
8
|
+
// if (childOfChild.nodeType === Node.TEXT_NODE && childOfChild.textContent?.trim()) {
|
|
9
|
+
// // todo analyze textcontent
|
|
10
|
+
// }
|
|
11
|
+
// }
|
|
12
|
+
|
|
13
|
+
// Warning: below is not redundant and is a catch-all
|
|
14
|
+
// Long-term solution: figure out the correct typing
|
|
15
|
+
if ((typeof child.className === "string") && child.className?.includes("qt-")) {
|
|
16
|
+
child.className.split(" ").forEach(c => {
|
|
17
|
+
|
|
18
|
+
if (c.startsWith("qt-")) {
|
|
19
|
+
querySet.add(c);
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
};
|
|
@@ -1,44 +1,44 @@
|
|
|
1
|
-
const chaoticWordBank = ["niko", "toba", "seal", "aquarium", "ojisan", "baikal"];
|
|
2
|
-
|
|
3
|
-
export const runChaos = (node: Element) => {
|
|
4
|
-
// change all text content to gibberish
|
|
5
|
-
for (const child of Array.from(node.children)) {
|
|
6
|
-
if (child.nodeType === Node.ELEMENT_NODE) {
|
|
7
|
-
runChaos(child);
|
|
8
|
-
for (const childOfChild of child.childNodes) {
|
|
9
|
-
if (childOfChild.nodeType === Node.TEXT_NODE && childOfChild.textContent?.trim()) {
|
|
10
|
-
const max = childOfChild.textContent.length;
|
|
11
|
-
childOfChild.textContent = "";
|
|
12
|
-
while (childOfChild.textContent.length < max) {
|
|
13
|
-
childOfChild.textContent += (chaoticWordBank[Math.floor(Math.random() * chaoticWordBank.length)] + " ");
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
// change all links to crouton
|
|
19
|
-
if (child.hasAttribute("href")) {
|
|
20
|
-
child.setAttribute("href", "https://crouton.net/");
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
// change all images to niko if aria != hidden?
|
|
24
|
-
if (child.hasAttribute("src") && !child.hasAttribute("aria-hidden")) {
|
|
25
|
-
if (child.hasAttribute("alt")) {
|
|
26
|
-
child.setAttribute("src", "https://p.potaufeu.asahi.com/a2b9-p/picture/21583312/5c3310aec77068e24844c663aa62b37c.jpg");
|
|
27
|
-
} else {
|
|
28
|
-
child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
|
|
29
|
-
child.setAttribute("muted", "true");
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
if (child.tagName.trim() === "VIDEO") {
|
|
33
|
-
child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
|
|
34
|
-
child.setAttribute("muted", "true");
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
// change all button events
|
|
38
|
-
if (child.tagName.trim() === "BUTTON") {
|
|
39
|
-
// remove anon function: https://stackoverflow.com/a/41343451/17836168
|
|
40
|
-
child.setAttribute("disabled", "true");
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
};
|
|
1
|
+
const chaoticWordBank = ["niko", "toba", "seal", "aquarium", "ojisan", "baikal"];
|
|
2
|
+
|
|
3
|
+
export const runChaos = (node: Element) => {
|
|
4
|
+
// change all text content to gibberish
|
|
5
|
+
for (const child of Array.from(node.children)) {
|
|
6
|
+
if (child.nodeType === Node.ELEMENT_NODE) {
|
|
7
|
+
runChaos(child);
|
|
8
|
+
for (const childOfChild of child.childNodes) {
|
|
9
|
+
if (childOfChild.nodeType === Node.TEXT_NODE && childOfChild.textContent?.trim()) {
|
|
10
|
+
const max = childOfChild.textContent.length;
|
|
11
|
+
childOfChild.textContent = "";
|
|
12
|
+
while (childOfChild.textContent.length < max) {
|
|
13
|
+
childOfChild.textContent += (chaoticWordBank[Math.floor(Math.random() * chaoticWordBank.length)] + " ");
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
// change all links to crouton
|
|
19
|
+
if (child.hasAttribute("href")) {
|
|
20
|
+
child.setAttribute("href", "https://crouton.net/");
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
// change all images to niko if aria != hidden?
|
|
24
|
+
if (child.hasAttribute("src") && !child.hasAttribute("aria-hidden")) {
|
|
25
|
+
if (child.hasAttribute("alt")) {
|
|
26
|
+
child.setAttribute("src", "https://p.potaufeu.asahi.com/a2b9-p/picture/21583312/5c3310aec77068e24844c663aa62b37c.jpg");
|
|
27
|
+
} else {
|
|
28
|
+
child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
|
|
29
|
+
child.setAttribute("muted", "true");
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
if (child.tagName.trim() === "VIDEO") {
|
|
33
|
+
child.setAttribute("src", "https://video.twimg.com/ext_tw_video/1318728494256410624/pu/vid/640x360/TMklz6hiTkQu3xhn.mp4");
|
|
34
|
+
child.setAttribute("muted", "true");
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
// change all button events
|
|
38
|
+
if (child.tagName.trim() === "BUTTON") {
|
|
39
|
+
// remove anon function: https://stackoverflow.com/a/41343451/17836168
|
|
40
|
+
child.setAttribute("disabled", "true");
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
};
|