Fix long standing bug with settings and lint.
This commit is contained in:
parent
1cab054da7
commit
5246e6e83b
5 changed files with 130 additions and 137 deletions
15
index.js
15
index.js
|
|
@ -42,7 +42,7 @@ const rammerheadScopes = [
|
|||
const rammerheadSession = /^\/[a-z0-9]{32}/;
|
||||
|
||||
function shouldRouteRh(req) {
|
||||
const url = new URL(req.url, 'http://0.0.0.0');
|
||||
const url = new URL(req.url, "http://0.0.0.0");
|
||||
return rammerheadScopes.includes(url.pathname) || rammerheadSession.test(url.pathname);
|
||||
}
|
||||
|
||||
|
|
@ -91,20 +91,19 @@ app.get("/search", async (req, res) => {
|
|||
try {
|
||||
const { query } = req.query;
|
||||
|
||||
const response = await fetch(
|
||||
`http://api.duckduckgo.com/ac?q=${query}&format=json`
|
||||
).then((apiRes) => apiRes.json());
|
||||
|
||||
const response = await fetch(`http://api.duckduckgo.com/ac?q=${query}&format=json`).then(
|
||||
(apiRes) => apiRes.json()
|
||||
);
|
||||
|
||||
res.send(response);
|
||||
} catch (err) {
|
||||
res.redirect(302, "/404.html");
|
||||
}
|
||||
});
|
||||
app.get('*', function(req, res){
|
||||
res.redirect(302, '/404.html');
|
||||
app.get("*", function (req, res) {
|
||||
res.redirect(302, "/404.html");
|
||||
});
|
||||
|
||||
|
||||
console.log(chalk.gray("Starting Alu..."));
|
||||
console.log(chalk.green("Alu started successfully!"));
|
||||
server.on("listening", () => {
|
||||
|
|
|
|||
|
|
@ -29,40 +29,39 @@ const t = useTranslations(lang);
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.wave-svg-container {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: -1;
|
||||
overflow: hidden;
|
||||
height: 300px;
|
||||
filter: brightness(1.5);
|
||||
}
|
||||
<style>
|
||||
.wave-svg-container {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: -1;
|
||||
overflow: hidden;
|
||||
height: 300px;
|
||||
filter: brightness(1.5);
|
||||
}
|
||||
|
||||
.footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
color: var(--text-color);
|
||||
position: relative;
|
||||
padding-top: 200px;
|
||||
gap: 50px;
|
||||
}
|
||||
.footer-top,
|
||||
.footer-bottom {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
color: var(--text-color);
|
||||
position: relative;
|
||||
padding-top: 200px;
|
||||
gap: 50px;
|
||||
}
|
||||
.footer-top,
|
||||
.footer-bottom {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.footer-title {
|
||||
font-size: 20px;
|
||||
}
|
||||
.footer-title {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--text-color);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
a {
|
||||
color: var(--text-color);
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -47,14 +47,14 @@ const t = useTranslations(lang);
|
|||
<div id="current-content"></div>
|
||||
</div>
|
||||
<script is:inline>
|
||||
document.addEventListener("astro:after-swap", () => {
|
||||
window.currentlySelectedTab = "";
|
||||
document.removeEventListener("setting-tabChange", determineListener);
|
||||
});
|
||||
window.currentlySelectedTab;
|
||||
window.loadedContentStorage = {};
|
||||
|
||||
Array.from(document.getElementsByClassName("setting-tab")).forEach((tab) => {
|
||||
function settingsLoad() {
|
||||
document.addEventListener("astro:after-swap", () => {
|
||||
window.currentlySelectedTab = "";
|
||||
document.removeEventListener("setting-tabChange", determineListener);
|
||||
});
|
||||
window.currentlySelectedTab;
|
||||
window.loadedContentStorage = {};
|
||||
Array.from(document.getElementsByClassName("setting-tab")).forEach((tab) => {
|
||||
let contentToLoad = document.getElementById("content-" + tab.id);
|
||||
if (contentToLoad) {
|
||||
window.loadedContentStorage[tab.id] = contentToLoad.innerHTML;
|
||||
|
|
@ -159,17 +159,6 @@ const t = useTranslations(lang);
|
|||
}
|
||||
});
|
||||
});
|
||||
// Array.from(item.children).forEach((item) => {
|
||||
// item.addEventListener('click', () => {
|
||||
// localStorage.setItem(localStorageItem, item.dataset.setting)
|
||||
// applySavedLocalStorage(localStorageItem, dropdownID)
|
||||
// closeDropdown(item.parentElement.id);
|
||||
|
||||
// if (typeof optionalCallback == "function") {
|
||||
// optionalCallback();
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
}
|
||||
|
||||
function applyInputListeners(item, localStorageItem) {
|
||||
|
|
@ -353,6 +342,11 @@ const t = useTranslations(lang);
|
|||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
document.addEventListener('astro:after-swap', () => {
|
||||
settingsLoad()
|
||||
})
|
||||
settingsLoad()
|
||||
</script>
|
||||
<style is:global>
|
||||
.content-hidden {
|
||||
|
|
|
|||
|
|
@ -16,7 +16,13 @@ export function getStaticPaths() {
|
|||
<h1 class="title-text">{t("menu.welcome")}</h1>
|
||||
<div class="form-wrapper">
|
||||
<form class="url-input-form" id="url-input-form">
|
||||
<input class="url-input" id="url-input" type="text" placeholder={t("menu.search")} autocomplete="off" />
|
||||
<input
|
||||
class="url-input"
|
||||
id="url-input"
|
||||
type="text"
|
||||
placeholder={t("menu.search")}
|
||||
autocomplete="off"
|
||||
/>
|
||||
<div id="search-suggestions"></div>
|
||||
<div id="loading-content">Loading...</div>
|
||||
<div id="top-bar"></div>
|
||||
|
|
@ -37,12 +43,9 @@ export function getStaticPaths() {
|
|||
<h2>How can I contribute to the development of Alu?</h2>
|
||||
<p>
|
||||
Spreading the word of Alu is a great start, but if you really enjoy Alu, and want private
|
||||
links, consider supporting me through Patreon! You can support me
|
||||
<Link
|
||||
href="https://www.patreon.com/wearr/membership"
|
||||
newTab
|
||||
linkTextContent="Here!"
|
||||
/>, thank you for helping to make Alu great!
|
||||
links, consider supporting me through Patreon! You can support me
|
||||
<Link href="https://www.patreon.com/wearr/membership" newTab linkTextContent="Here!" />,
|
||||
thank you for helping to make Alu great!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -50,80 +53,78 @@ export function getStaticPaths() {
|
|||
</Layout>
|
||||
|
||||
<script>
|
||||
type Suggestion = {
|
||||
phrase: string;
|
||||
}
|
||||
const debounce = (func: Function, delay: number): (...args: any[]) => void => {
|
||||
let debounceTimer: NodeJS.Timeout;
|
||||
return function (this: Function, ...args: any[]) {
|
||||
const context: any = this;
|
||||
clearTimeout(debounceTimer);
|
||||
debounceTimer = setTimeout(() => {
|
||||
func.apply(context, args);
|
||||
}, delay);
|
||||
};
|
||||
type Suggestion = {
|
||||
phrase: string;
|
||||
};
|
||||
const debounce = (func: Function, delay: number): ((...args: any[]) => void) => {
|
||||
let debounceTimer: NodeJS.Timeout;
|
||||
return function (this: Function, ...args: any[]) {
|
||||
const context: any = this;
|
||||
clearTimeout(debounceTimer);
|
||||
debounceTimer = setTimeout(() => {
|
||||
func.apply(context, args);
|
||||
}, delay);
|
||||
};
|
||||
};
|
||||
|
||||
async function sendAPIRequest(urlInput: HTMLInputElement, searchSuggestions: HTMLDivElement) {
|
||||
if (!urlInput) throw new Error("urlInput is null");
|
||||
if (!searchSuggestions) throw new Error("searchSuggestions is null");
|
||||
let url = urlInput.value;
|
||||
let request = await fetch("/search?query=" + url);
|
||||
let data = await request.json();
|
||||
searchSuggestions.innerHTML = "";
|
||||
data.map((suggestion: Suggestion) => {
|
||||
let suggestionElement = document.createElement("div");
|
||||
// For some reason css classes weren't working T^T.
|
||||
suggestionElement.style.cursor = "pointer";
|
||||
suggestionElement.style.marginTop = "5px";
|
||||
suggestionElement.innerText = suggestion.phrase;
|
||||
suggestionElement.addEventListener("click", () => {
|
||||
console.log("here")
|
||||
urlInput.value = suggestion.phrase;
|
||||
// I can't be bothered to extend the window object, so I'm just going to use any
|
||||
(window as any).loadFormContent();
|
||||
});
|
||||
searchSuggestions.appendChild(suggestionElement);
|
||||
});
|
||||
if (data.length === 0) {
|
||||
urlInput.classList.remove("search-results");
|
||||
searchSuggestions.style.opacity = "0";
|
||||
} else {
|
||||
urlInput.classList.add("search-results");
|
||||
searchSuggestions.style.opacity = "1";
|
||||
}
|
||||
}
|
||||
function addEventListeners() {
|
||||
let urlInput = document.getElementById("url-input") as HTMLInputElement;
|
||||
let searchSuggestions = document.getElementById('search-suggestions') as HTMLDivElement;
|
||||
// Silently return if the required elements aren't found, this prevents the console from getting cluttered with errors.
|
||||
if (!urlInput || !searchSuggestions) return;
|
||||
urlInput.addEventListener('focus', () => {
|
||||
if (!searchSuggestions) {
|
||||
throw new Error("searchSuggestions is null");
|
||||
}
|
||||
if (searchSuggestions.children.length > 0) {
|
||||
searchSuggestions.style.opacity = "1";
|
||||
searchSuggestions.style.pointerEvents = "all";
|
||||
urlInput.classList.add("search-results");
|
||||
}
|
||||
})
|
||||
urlInput.addEventListener('blur', () => {
|
||||
searchSuggestions.style.opacity = "0";
|
||||
setTimeout(() => {
|
||||
searchSuggestions.style.pointerEvents = "none";
|
||||
}, 200);
|
||||
urlInput.classList.remove("search-results")
|
||||
})
|
||||
|
||||
urlInput.addEventListener("keyup", () => {
|
||||
debounce(sendAPIRequest, 300).apply(null, [urlInput, searchSuggestions]);
|
||||
async function sendAPIRequest(urlInput: HTMLInputElement, searchSuggestions: HTMLDivElement) {
|
||||
if (!urlInput) throw new Error("urlInput is null");
|
||||
if (!searchSuggestions) throw new Error("searchSuggestions is null");
|
||||
let url = urlInput.value;
|
||||
let request = await fetch("/search?query=" + url);
|
||||
let data = await request.json();
|
||||
searchSuggestions.innerHTML = "";
|
||||
data.map((suggestion: Suggestion) => {
|
||||
let suggestionElement = document.createElement("div");
|
||||
// For some reason css classes weren't working T^T.
|
||||
suggestionElement.style.cursor = "pointer";
|
||||
suggestionElement.style.marginTop = "5px";
|
||||
suggestionElement.innerText = suggestion.phrase;
|
||||
suggestionElement.addEventListener("click", () => {
|
||||
console.log("here");
|
||||
urlInput.value = suggestion.phrase;
|
||||
// I can't be bothered to extend the window object, so I'm just going to use any
|
||||
(window as any).loadFormContent();
|
||||
});
|
||||
searchSuggestions.appendChild(suggestionElement);
|
||||
});
|
||||
if (data.length === 0) {
|
||||
urlInput.classList.remove("search-results");
|
||||
searchSuggestions.style.opacity = "0";
|
||||
} else {
|
||||
urlInput.classList.add("search-results");
|
||||
searchSuggestions.style.opacity = "1";
|
||||
}
|
||||
document.addEventListener('astro:after-swap', addEventListeners);
|
||||
addEventListeners();
|
||||
|
||||
}
|
||||
function addEventListeners() {
|
||||
let urlInput = document.getElementById("url-input") as HTMLInputElement;
|
||||
let searchSuggestions = document.getElementById("search-suggestions") as HTMLDivElement;
|
||||
// Silently return if the required elements aren't found, this prevents the console from getting cluttered with errors.
|
||||
if (!urlInput || !searchSuggestions) return;
|
||||
urlInput.addEventListener("focus", () => {
|
||||
if (!searchSuggestions) {
|
||||
throw new Error("searchSuggestions is null");
|
||||
}
|
||||
if (searchSuggestions.children.length > 0) {
|
||||
searchSuggestions.style.opacity = "1";
|
||||
searchSuggestions.style.pointerEvents = "all";
|
||||
urlInput.classList.add("search-results");
|
||||
}
|
||||
});
|
||||
urlInput.addEventListener("blur", () => {
|
||||
searchSuggestions.style.opacity = "0";
|
||||
setTimeout(() => {
|
||||
searchSuggestions.style.pointerEvents = "none";
|
||||
}, 200);
|
||||
urlInput.classList.remove("search-results");
|
||||
});
|
||||
|
||||
urlInput.addEventListener("keyup", () => {
|
||||
debounce(sendAPIRequest, 300).apply(null, [urlInput, searchSuggestions]);
|
||||
});
|
||||
}
|
||||
document.addEventListener("astro:after-swap", addEventListeners);
|
||||
addEventListeners();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,6 @@
|
|||
"extends": "astro/tsconfigs/strict",
|
||||
"exclude": ["node_modules/**", "dist/**"],
|
||||
"compilerOptions": {
|
||||
"verbatimModuleSyntax": false,
|
||||
"verbatimModuleSyntax": false
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue