servo/system-prompts
1
0
Fork 0
mirror of https://github.com/LouisShark/chatgpt_system_prompt.git synced 2025-07-06 14:50:31 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

files

Browse source
This commit is contained in:
Elias Bachaalany 2024-02-10 08:24:48 -08:00
parent b57b60e3ca
commit 5dd2f7bee4
2 changed files with 109 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

63
prompts/gpts/knowledge/Create or Refactor your Web Component/element.source.js Normal file
View file

@ -0,0 +1,63 @@
customElements.define(
"file-size",
class extends HTMLElement {
connectedCallback(
// BYTE SAVINGS: DECLARE variables/functions as parameters to prevent 4 bytes let statement
// source file to get content-length of:
source = this.getAttribute("src") ||
"https://file-size.github.io/element.js",
// global state to load gzthermal IMG once
img = false,
// display bigger than maxbytes in red color
maxbytes = this.getAttribute("max") || 49152, // 48 kByte, because my first TRS-80 had 48 kB RAM
// load GZThermal IMG function:
gzthermal = () => {
if (!img) {
this.querySelector("i").innerHTML = "Loading GZIP Thermal analysis";
img = this.querySelector("img");
img.onerror = (e) =>
(this.querySelector("i").innerHTML = "Too many bytes for analysis");
img.onload = (e) => {
this.querySelector("i").innerHTML = "";
img.style.width = (this.getAttribute("width") || "700") + "px";
this.querySelector("details").setAttribute("open", "open");
img.onclick = (e) => {
if (e.altKey) open(source, "_blank").focus(); // open new tab with source code
else this.querySelector("details").removeAttribute("open");
};
};
img.src = "https://gzthermal.vercel.app/?url=" + source;
}
}
) {
this.setAttribute("title", source);
fetch(source, {
mode: "cors",
})
.then((response) => {
this.length = Number(response.headers.get("content-length"));
this.innerHTML =
`<details style="cursor:pointer;font:16px arial">` +
`<summary>` +
`<b style="color:dark${
this.length < maxbytes ? "green" : "red"
};display:inline-block;width:4em;text-align:right">${
this.length
}</b> &nbsp;Bytes ${source} <i/>` +
`</summary><img/>` +
`</details>`;
// toggle display GZThermal IMG
this.querySelector("details").ontoggle = (e) => {
this.querySelector("details").open && gzthermal();
};
if (this.hasAttribute("gz")) gzthermal(); // load GZThermal IMG by default
})
.catch((e) => {
this.innerHTML = `<b style="font:16px arial;color:red">&lt;file-size> ${e} : ${source}</b>`;
});
}
}
);