Skip to content

Commit 4f859a3

Browse files
kevinlinxckevinlinxc
committed
Move javascript from submit.html to separate file for better organization cough
1 parent 7e9bfb6 commit 4f859a3

File tree

2 files changed

+164
-164
lines changed

2 files changed

+164
-164
lines changed

‎assets/js/formula-suggest.js‎

Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,162 @@
1+
function sanitizeInput(input) {
2+
return DOMPurify.sanitize(input);
3+
}
4+
// Function to render the preview
5+
function renderPreview() {
6+
const title = sanitizeInput(document.getElementById('title').value);
7+
const body = sanitizeInput(document.getElementById('body').value);
8+
const latex = sanitizeInput(document.getElementById('latex').value);
9+
const tags = sanitizeInput(document.getElementById('tags').value).split(',').map(tag => tag.trim());
10+
const parsedBody = marked.parse(body);
11+
12+
const tagsHTML = tags
13+
.map((tag) => {
14+
return `
15+
<a
16+
class="rounded-md border border-neutral-200 px-2 py-[1px] hover:border-black hover:text-primary-700 dark:border-neutral-600 dark:hover:border-primary-600 dark:hover:text-primary-400"
17+
>
18+
${tag}
19+
</a>
20+
`;
21+
})
22+
.join(' '); // Join the tags with a space
23+
24+
const previewContent = `
25+
<article>
26+
<header class="max-w-prose">
27+
<h1 class="mt-0 text-4xl font-extrabold text-neutral-900 dark:text-neutral">
28+
${title}
29+
</h1>
30+
<div class="my-2 text-xs text-neutral-500 dark:text-neutral-400">
31+
${tagsHTML}
32+
</div>
33+
<div class="mt-8 mb-12 text-base text-neutral-500 dark:text-neutral-400 print:hidden prose">
34+
${parsedBody}
35+
</div>
36+
</header>
37+
</article>
38+
`;
39+
40+
document.getElementById('preview-content').innerHTML = previewContent;
41+
document.getElementById('preview').classList.remove('hidden');
42+
43+
// Render LaTeX
44+
if (typeof renderMathInElement !== 'undefined') {
45+
renderMathInElement(document.getElementById('preview-content'), {
46+
delimiters: [
47+
{ left: '$$', right: '$$', display: true },
48+
{ left: '\\(', right: '\\)', display: false }
49+
]
50+
});
51+
}
52+
}
53+
54+
// Function to send data to Discord webhook
55+
function submitToDiscord() {
56+
const title = sanitizeInput(document.getElementById('title').value);
57+
const description = sanitizeInput(document.getElementById('description').value);
58+
const tags = sanitizeInput(document.getElementById('tags').value);
59+
const latex = sanitizeInput(document.getElementById('latex').value);
60+
const body = sanitizeInput(document.getElementById('body').value);
61+
62+
const webhookURL = 'https://discord.com/api/webhooks/1059998584889688134/eUqXbInp90bcFdL1A3ly141TAtn9jiPjbYwCzSfjPV2-4kx2UIX3M-soCJxWTrvSNbLP'; // Replace with your Discord webhook URL
63+
64+
const data = {
65+
embeds: [
66+
{
67+
title: "New stemformulas.com formula suggestion",
68+
fields: [
69+
{
70+
name: "Title",
71+
value: title,
72+
inline: true,
73+
},
74+
{
75+
name: "Description",
76+
value: description,
77+
inline: true,
78+
},
79+
{
80+
name: "Tags",
81+
value: tags,
82+
inline: true,
83+
},
84+
{
85+
name: "LaTeX",
86+
value: `\`\`\`latex\n${latex}\n\`\`\``,
87+
inline: false,
88+
},
89+
{
90+
name: "Body",
91+
value: `\`\`\`markdown\n${body}\n\`\`\``,
92+
inline: false,
93+
},
94+
],
95+
color: 0x00ff00, // Green color for the embed
96+
},
97+
],
98+
};
99+
100+
fetch(webhookURL, {
101+
method: 'POST',
102+
headers: {
103+
'Content-Type': 'application/json',
104+
},
105+
body: JSON.stringify(data),
106+
})
107+
.then((response) => {
108+
if (response.ok) {
109+
alert('Submission sent successfully. Thank you!');
110+
} else {
111+
alert('Failed to send submission. Please try again.');
112+
}
113+
})
114+
.catch((error) => {
115+
console.error('Error:', error);
116+
alert('An error occurred. Please try again.');
117+
});
118+
}
119+
120+
// Attach the form submission handler
121+
document.getElementById('formula-suggestion-form').addEventListener('submit', function(event) {
122+
event.preventDefault();
123+
renderPreview();
124+
// Show the "Submit" button once the preview has been rendered once
125+
document.getElementById('submit-button').classList.remove('hidden');
126+
});
127+
128+
function handleRateLimit() {
129+
// limit submissions so we can't get spammed
130+
const submitButton = document.getElementById('submit-button');
131+
const lastSubmissionTime = localStorage.getItem('lastSubmissionTime');
132+
const currentTime = new Date().getTime();
133+
134+
// Check if 5 minutes have passed since the last submission
135+
const timeLeft = 120000 - (currentTime - lastSubmissionTime);
136+
if (lastSubmissionTime && timeLeft > 0) {
137+
alert(`Please wait ${Math.ceil(timeLeft / 1000)} seconds before submitting again.`);
138+
return;
139+
}
140+
141+
// Disable the button and store the current time
142+
submitButton.disabled = true;
143+
localStorage.setItem('lastSubmissionTime', currentTime);
144+
145+
// Submit the data to Discord
146+
submitToDiscord();
147+
148+
// Re-enable the button after the correct time has elapsed
149+
setTimeout(() => {
150+
submitButton.disabled = false;
151+
}, timeLeft);
152+
}
153+
154+
// Attach the "Submit" button click handler
155+
document.getElementById('submit-button').addEventListener('click', function() {
156+
handleRateLimit();
157+
});
158+
159+
// Render the preview when the page loads
160+
document.addEventListener('DOMContentLoaded', function() {
161+
renderPreview();
162+
});

‎layouts/_default/submit.html‎

Lines changed: 2 additions & 164 deletions
Original file line numberDiff line numberDiff line change
@@ -128,168 +128,6 @@ <h2 class="mb-6 text-2xl font-bold text-neutral-900 dark:text-neutral">Preview</
128128
</section>
129129
</article>
130130
<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/3.2.3/purify.min.js"></script>
131-
<script>
132-
function sanitizeInput(input) {
133-
return DOMPurify.sanitize(input);
134-
}
135-
// Function to render the preview
136-
function renderPreview() {
137-
const title = sanitizeInput(document.getElementById('title').value);
138-
const body = sanitizeInput(document.getElementById('body').value);
139-
const latex = sanitizeInput(document.getElementById('latex').value);
140-
const tags = sanitizeInput(document.getElementById('tags').value).split(',').map(tag => tag.trim());
141-
const parsedBody = marked.parse(body);
142-
143-
const tagsHTML = tags
144-
.map((tag) => {
145-
return `
146-
<a
147-
class="rounded-md border border-neutral-200 px-2 py-[1px] hover:border-black hover:text-primary-700 dark:border-neutral-600 dark:hover:border-primary-600 dark:hover:text-primary-400"
148-
>
149-
${tag}
150-
</a>
151-
`;
152-
})
153-
.join(' '); // Join the tags with a space
154-
155-
const previewContent = `
156-
<article>
157-
<header class="max-w-prose">
158-
<h1 class="mt-0 text-4xl font-extrabold text-neutral-900 dark:text-neutral">
159-
${title}
160-
</h1>
161-
<div class="my-2 text-xs text-neutral-500 dark:text-neutral-400">
162-
${tagsHTML}
163-
</div>
164-
<div class="mt-8 mb-12 text-base text-neutral-500 dark:text-neutral-400 print:hidden prose">
165-
${parsedBody}
166-
</div>
167-
</header>
168-
</article>
169-
`;
170-
171-
document.getElementById('preview-content').innerHTML = previewContent;
172-
document.getElementById('preview').classList.remove('hidden');
173-
174-
// Render LaTeX
175-
if (typeof renderMathInElement !== 'undefined') {
176-
renderMathInElement(document.getElementById('preview-content'), {
177-
delimiters: [
178-
{ left: '$$', right: '$$', display: true },
179-
{ left: '\\(', right: '\\)', display: false }
180-
]
181-
});
182-
}
183-
}
184-
185-
// Function to send data to Discord webhook
186-
function submitToDiscord() {
187-
const title = sanitizeInput(document.getElementById('title').value);
188-
const description = sanitizeInput(document.getElementById('description').value);
189-
const tags = sanitizeInput(document.getElementById('tags').value);
190-
const latex = sanitizeInput(document.getElementById('latex').value);
191-
const body = sanitizeInput(document.getElementById('body').value);
192-
193-
const webhookURL = 'https://discord.com/api/webhooks/1059998584889688134/eUqXbInp90bcFdL1A3ly141TAtn9jiPjbYwCzSfjPV2-4kx2UIX3M-soCJxWTrvSNbLP'; // Replace with your Discord webhook URL
194-
195-
const data = {
196-
embeds: [
197-
{
198-
title: "New stemformulas.com formula suggestion",
199-
fields: [
200-
{
201-
name: "Title",
202-
value: title,
203-
inline: true,
204-
},
205-
{
206-
name: "Description",
207-
value: description,
208-
inline: true,
209-
},
210-
{
211-
name: "Tags",
212-
value: tags,
213-
inline: true,
214-
},
215-
{
216-
name: "LaTeX",
217-
value: `\`\`\`latex\n${latex}\n\`\`\``,
218-
inline: false,
219-
},
220-
{
221-
name: "Body",
222-
value: `\`\`\`markdown\n${body}\n\`\`\``,
223-
inline: false,
224-
},
225-
],
226-
color: 0x00ff00, // Green color for the embed
227-
},
228-
],
229-
};
230-
231-
fetch(webhookURL, {
232-
method: 'POST',
233-
headers: {
234-
'Content-Type': 'application/json',
235-
},
236-
body: JSON.stringify(data),
237-
})
238-
.then((response) => {
239-
if (response.ok) {
240-
alert('Submission sent successfully. Thank you!');
241-
} else {
242-
alert('Failed to send submission. Please try again.');
243-
}
244-
})
245-
.catch((error) => {
246-
console.error('Error:', error);
247-
alert('An error occurred. Please try again.');
248-
});
249-
}
250-
251-
// Attach the form submission handler
252-
document.getElementById('formula-suggestion-form').addEventListener('submit', function(event) {
253-
event.preventDefault();
254-
renderPreview();
255-
// Show the "Submit" button once the preview has been rendered once
256-
document.getElementById('submit-button').classList.remove('hidden');
257-
});
258-
259-
function handleRateLimit() {
260-
// limit submissions so we can't get spammed
261-
const submitButton = document.getElementById('submit-button');
262-
const lastSubmissionTime = localStorage.getItem('lastSubmissionTime');
263-
const currentTime = new Date().getTime();
264-
265-
// Check if 5 minutes have passed since the last submission
266-
const timeLeft = 120000 - (currentTime - lastSubmissionTime);
267-
if (lastSubmissionTime && timeLeft > 0) {
268-
alert(`Please wait ${Math.ceil(timeLeft / 1000)} seconds before submitting again.`);
269-
return;
270-
}
271-
272-
// Disable the button and store the current time
273-
submitButton.disabled = true;
274-
localStorage.setItem('lastSubmissionTime', currentTime);
275-
276-
// Submit the data to Discord
277-
submitToDiscord();
278-
279-
// Re-enable the button after the correct time has elapsed
280-
setTimeout(() => {
281-
submitButton.disabled = false;
282-
}, timeLeft);
283-
}
284-
285-
// Attach the "Submit" button click handler
286-
document.getElementById('submit-button').addEventListener('click', function() {
287-
handleRateLimit();
288-
});
289-
290-
// Render the preview when the page loads
291-
document.addEventListener('DOMContentLoaded', function() {
292-
renderPreview();
293-
});
294-
</script>
131+
{{ $js := resources.Get "js/formula-suggest.js" | fingerprint }}
132+
<script src="{{ $js.Permalink }}"></script>
295133
{{ end }}

0 commit comments

Comments
 (0)