Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

View Explosion-Scratch's full-sized avatar

--Explosion-- Explosion-Scratch

View GitHub Profile
@adtac
adtac / Dockerfile
Last active April 13, 2024 22:33
#!/usr/bin/env docker run
#!/usr/bin/env -S bash -c "docker run -p 8080:8080 -it --rm \$(docker build --progress plain -f \$0 . 2>&1 | tee /dev/stderr | grep -oP 'sha256:[0-9a-f]*')"
# syntax = docker/dockerfile:1.4.0
FROM node:20
WORKDIR /root
RUN npm install sqlite3
@Explosion-Scratch
Explosion-Scratch / hotreload.js
Created July 10, 2022 19:26
Hotreload a page (uses fetch to check for updates, automatically senses resources)
(async ({
interval = 500,
method = "fetch",
useIframe = false,
resources = [],
autoDetect = true,
resourceTypes = ["navigation", "script", "resource", "link", "img", "other"],
}) => {
if (autoDetect) {
resources = performance
@Explosion-Scratch
Explosion-Scratch / Compress string.js
Created November 1, 2021 18:51
Compress string using gzip and native browser APIs
function compress(string, encoding) {
const byteArray = new TextEncoder().encode(string);
const cs = new CompressionStream(encoding);
const writer = cs.writable.getWriter();
writer.write(byteArray);
writer.close();
return new Response(cs.readable).arrayBuffer();
}
function decompress(byteArray, encoding) {
@Explosion-Scratch
Explosion-Scratch / Favicon counter.js
Last active May 6, 2023 04:47
Shows a number in the favicon like Discord and Gmail do.
/**
* Generates a data URL of the current favicon with a number added on top.
* @param {Object} options
* @param {String} [options.type = "image/png"] The mime type of the image to return.
* @param {String} [options.text = ""] The text to display on the favicon, if left blank will simply show a dot on the favicon.
* @param {String} [options.background = "white"] A CSS color for the background of the notification badge.
* @param {String} [options.color = "white"] A CSS color for the color of the text on the notification badge.
* @param {Number} [options.size = 10] The size of the notification badge. The badge generated will be size * 2 pixels in width and height, then added on top of the current favicon.
* @param {String} [options.pos = "bottom-right"] The position of the badge, either "bottom-right", "top-right", "bottom-left" or "top-left"
* @param {String} [options.font = "Monospace"] The font to use
@Explosion-Scratch
Explosion-Scratch / Quizlet flashcards.js
Created October 12, 2021 23:55
Get Quizlet flashcards via API
async function quizlet(id){
let res = await fetch(`https://quizlet.com/webapi/3.4/studiable-item-documents?filters%5BstudiableContainerId%5D=${id}&filters%5BstudiableContainerType%5D=1&perPage=5&page=1`).then(res => res.json())
let currentLength = 5;
let token = res.responses[0].paging.token
let terms = res.responses[0].models.studiableItem;
let page = 2;
console.log({token, terms})
while (currentLength >= 5){
let res = await fetch(`https://quizlet.com/webapi/3.4/studiable-item-documents?filters%5BstudiableContainerId%5D=${id}&filters%5BstudiableContainerType%5D=1&perPage=5&page=${page++}&pagingToken=${token}`).then(res => res.json());
terms.push(...res.responses[0].models.studiableItem);
@Explosion-Scratch
Explosion-Scratch / meta.js
Last active March 3, 2022 17:12
Generate meta
const generate = (meta) => {
return [
{ charset: "utf-8" },
{ lang: "en" },
{ name: "viewport", content: "width=device-width, initial-scale=1" },
{ name: "format-detection", content: "telephone=no" },
{ name: "title", content: meta.title },
{ name: "author", content: meta.author },
{
name: "keywords",
@Explosion-Scratch
Explosion-Scratch / SvelteComponent.svelte
Last active May 6, 2023 04:48
Get metadata from a URL and parse it.
<script>
import {onMount} from "svelte";
export let link = "";
let m, title, description, img, img_el;
onMount(async () => {
m = await meta(link);
m = parseMeta(m);
title = m.title;
description = m.description;
img = m.image;
((window) => {
var _fetch = window.fetch; //Get the original fetch functionm
window.fetch = (url, opts = {}) => {
if (!window.FETCH_CACHE) {
window.FETCH_CACHE = {};
}
return new Promise((resolve) => {
/*
Generate a sort of unique key about this fetch request.
@Explosion-Scratch
Explosion-Scratch / spreadsheets.md
Last active September 6, 2021 19:17
Fetch data from google sheets as a JavaScript object!!

Get data from google sheets!

This script gets data from a google sheets table and returns it in easy to use JSON. Tables must have a header 😃

How to get the spreadsheet ID:

Publish it to the web:

image

The ID is in the link that publish to the web gives you, NOT the webpage URL

@Explosion-Scratch
Explosion-Scratch / preload.js
Last active April 28, 2021 18:24
Preloads a webpage through an iframe.
//Set window.load and window.show so that the child iframe element can access those functions.
window.load = load;
window.show = show;
//Convert all links to preload on hover.
[...document.querySelectorAll("a")].forEach((a) => {
a.addEventListener("click", (e) => {
e.preventDefault();
show(a.href);
});
a.addEventListener("mouseenter", (e) => {