generated from nhcarrigan/template
feat: initial project version (#1)
### Explanation _No response_ ### Issue _No response_ ### Attestations - [ ] I have read and agree to the [Code of Conduct](https://docs.nhcarrigan.com/community/coc/) - [ ] I have read and agree to the [Community Guidelines](https://docs.nhcarrigan.com/community/guide/). - [ ] My contribution complies with the [Contributor Covenant](https://docs.nhcarrigan.com/dev/covenant/). ### Dependencies - [ ] I have pinned the dependencies to a specific patch version. ### Style - [ ] I have run the linter and resolved any errors. - [ ] My pull request uses an appropriate title, matching the conventional commit standards. - [ ] My scope of feat/fix/chore/etc. correctly matches the nature of changes in my pull request. ### Tests - [ ] My contribution adds new code, and I have added tests to cover it. - [ ] My contribution modifies existing code, and I have updated the tests to reflect these changes. - [ ] All new and existing tests pass locally with my changes. - [ ] Code coverage remains at or above the configured threshold. ### Documentation _No response_ ### Versioning _No response_ Reviewed-on: https://codeberg.org/nhcarrigan/website-headers/pulls/1 Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com> Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
This commit is contained in:
Naomi the Technomancer
parent
e0211be69e
commit
55f78cd29d
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
node_modules
|
||||
prod
|
||||
6
.vscode/settings.json
vendored
Normal file
6
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,6 @@
|
||||
{
|
||||
"editor.codeActionsOnSave": {
|
||||
"source.fixAll.eslint": "explicit"
|
||||
},
|
||||
"eslint.validate": ["typescript"]
|
||||
}
|
||||
16
README.md
16
README.md
@ -1,16 +1,10 @@
|
||||
# New Repository Template
|
||||
# Website Headers
|
||||
|
||||
This template contains all of our basic files for a new GitHub repository. There is also a handy workflow that will create an issue on a new repository made from this template, with a checklist for the steps we usually take in setting up a new repository.
|
||||
This project generates a JavaScript file to be uploaded to our CDN. This file automatically generates metadata, favicons, styles, and scripts for all of our production pages.
|
||||
|
||||
If you're starting a Node.JS project with TypeScript, we have a [specific template](https://github.com/naomi-lgbt/nodejs-typescript-template) for that purpose.
|
||||
To work on the file locally, you can serve the `index.html` file using your preferred application. Make changes to the `src/index.ts` file and run `pnpm build`, and the HTML will source the resulting JavaScript automatically.
|
||||
|
||||
## Readme
|
||||
|
||||
Delete all of the above text (including this line), and uncomment the below text to use our standard readme template.
|
||||
|
||||
<!-- # Project Name
|
||||
|
||||
Project Description
|
||||
When building the file, it is important to use `pnpm build` so that the minification step is run. Running `tsc` directly will bypass this step - while this is perfectly acceptable for debugging locally, the file MUST be minified before uploading to our CDN.
|
||||
|
||||
## Live Version
|
||||
|
||||
@ -36,4 +30,4 @@ Copyright held by Naomi Carrigan.
|
||||
|
||||
## Contact
|
||||
|
||||
We may be contacted through our [Chat Server](http://chat.nhcarrigan.com) or via email at `contact@nhcarrigan.com`. -->
|
||||
We may be contacted through our [Chat Server](http://chat.nhcarrigan.com) or via email at `contact@nhcarrigan.com`.
|
||||
|
||||
16
build.ts
Normal file
16
build.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { readFile, writeFile } from "fs/promises";
|
||||
import { join } from "path";
|
||||
import { minify } from "terser";
|
||||
|
||||
const code = (
|
||||
await readFile(join(process.cwd(), "prod", "index.js"), "utf-8")
|
||||
).replace("{{ version }}", process.env.npm_package_version ?? "0.0.0");
|
||||
const result = await minify(code, {
|
||||
format: {
|
||||
comments: /@license|@preserve|@copyright/,
|
||||
},
|
||||
});
|
||||
if (!result.code) {
|
||||
throw new Error("Failed to minify code.");
|
||||
}
|
||||
await writeFile(join(process.cwd(), "prod", "index.js"), result.code);
|
||||
13
eslint.config.js
Normal file
13
eslint.config.js
Normal file
@ -0,0 +1,13 @@
|
||||
import NaomisConfig from "@nhcarrigan/eslint-config";
|
||||
import globals from "globals";
|
||||
|
||||
export default [
|
||||
...NaomisConfig,
|
||||
{
|
||||
languageOptions: {
|
||||
globals: {
|
||||
...globals.browser
|
||||
}
|
||||
}
|
||||
},
|
||||
];
|
||||
45
index.html
Normal file
45
index.html
Normal file
@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Naomi's Website Headers</title>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Just a script that loads our custom CSS and JS"
|
||||
/>
|
||||
<script src="./prod/index.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>Naomi's Website Headers</h1>
|
||||
<section>
|
||||
<p>
|
||||
This repository generates a script that we serve via our CDN for all
|
||||
of our websites to load the same styles and third-party scripts.
|
||||
</p>
|
||||
<p>
|
||||
This file allows you to test changes to the script before deploying.
|
||||
</p>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Links</h2>
|
||||
<p>
|
||||
<a href="https://codeberg.org/nhcarrigan/website-headers">
|
||||
<i class="fa-solid fa-code"></i> Source Code
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://docs.nhcarrigan.com">
|
||||
<i class="fa-solid fa-book"></i> Documentation
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="https://chat.nhcarrigan.com">
|
||||
<i class="fa-solid fa-circle-info"></i> Support
|
||||
</a>
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
26
package.json
Normal file
26
package.json
Normal file
@ -0,0 +1,26 @@
|
||||
{
|
||||
"name": "website-headers",
|
||||
"version": "0.0.0",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"build": "tsc && tsx build.ts",
|
||||
"lint": "eslint src --max-warnings 0",
|
||||
"start": "echo \"This is not an executable script. Please review the README for more instructions.\" && exit 1",
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"@nhcarrigan/eslint-config": "5.0.0",
|
||||
"@nhcarrigan/typescript-config": "4.0.0",
|
||||
"@types/node": "22.10.2",
|
||||
"eslint": "9.17.0",
|
||||
"globals": "15.14.0",
|
||||
"terser": "5.37.0",
|
||||
"tsx": "4.19.2",
|
||||
"typescript": "5.7.2"
|
||||
}
|
||||
}
|
||||
4250
pnpm-lock.yaml
generated
Normal file
4250
pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load Diff
265
src/index.ts
Normal file
265
src/index.ts
Normal file
@ -0,0 +1,265 @@
|
||||
/**
|
||||
* @copyright nhcarrigan
|
||||
* @license Naomi's Public License
|
||||
* @author Naomi Carrigan
|
||||
*/
|
||||
|
||||
// #region Version
|
||||
const version = "{{ version }}";
|
||||
console.log(`
|
||||
========================================
|
||||
Loading NHCarrigan library v${version}.
|
||||
Copyright (c) ${new Date().getFullYear()} NHCarrigan
|
||||
Changelog: https://codeberg.org/nhcarrigan/website-headers/releases
|
||||
Licensed under our public license: https://docs.nhcarrigan.com/legal/license
|
||||
Questions? Contact us at https://docs.nhcarrigan.com/about/contact
|
||||
========================================
|
||||
`)
|
||||
// #endregion
|
||||
|
||||
// #region Query Selectors
|
||||
const head = document.querySelector("head");
|
||||
const body = document.querySelector("body");
|
||||
const title = document.querySelector("title");
|
||||
const description = document.querySelector(`meta[name="description"]`);
|
||||
|
||||
const { href: url, hostname } = window.location;
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Metadata and Open Graph
|
||||
|
||||
/**
|
||||
* The title and description are set by each website. This should
|
||||
* only load things like open graph data and favicons.
|
||||
*/
|
||||
const openGraphTitle = document.createElement("meta");
|
||||
openGraphTitle.setAttribute("property", "og:title");
|
||||
openGraphTitle.setAttribute("content", title?.innerText ?? "NHCarrigan");
|
||||
const openGraphDescription = document.createElement("meta");
|
||||
openGraphDescription.setAttribute("property", "og:description");
|
||||
openGraphDescription.setAttribute(
|
||||
"content",
|
||||
description?.getAttribute("content")
|
||||
// eslint-disable-next-line stylistic/max-len
|
||||
?? "We are a software engineering and community management consulting firm.",
|
||||
);
|
||||
const openGraphImage = document.createElement("meta");
|
||||
openGraphImage.setAttribute("property", "og:image");
|
||||
openGraphImage.setAttribute(
|
||||
"content",
|
||||
"https://cdn.nhcarrigan.com/og-image.png",
|
||||
);
|
||||
const openGraphUrl = document.createElement("meta");
|
||||
openGraphUrl.setAttribute("property", "og:url");
|
||||
openGraphUrl.setAttribute("content", url);
|
||||
const openGraphType = document.createElement("meta");
|
||||
openGraphType.setAttribute("property", "og:type");
|
||||
openGraphType.setAttribute("content", "website");
|
||||
|
||||
const twitterCard = document.createElement("meta");
|
||||
twitterCard.setAttribute("name", "twitter:card");
|
||||
twitterCard.setAttribute("content", "summary_large_image");
|
||||
const twitterDomain = document.createElement("meta");
|
||||
twitterDomain.setAttribute("name", "twitter:domain");
|
||||
twitterDomain.setAttribute("content", hostname);
|
||||
const twitterUrl = document.createElement("meta");
|
||||
twitterUrl.setAttribute("name", "twitter:url");
|
||||
twitterUrl.setAttribute("content", url);
|
||||
const twitterTitle = document.createElement("meta");
|
||||
twitterTitle.setAttribute("name", "twitter:title");
|
||||
twitterTitle.setAttribute("content", title?.innerText ?? "NHCarrigan");
|
||||
const twitterDescription = document.createElement("meta");
|
||||
twitterDescription.setAttribute("name", "twitter:description");
|
||||
twitterDescription.setAttribute(
|
||||
"content",
|
||||
description?.getAttribute("content")
|
||||
// eslint-disable-next-line stylistic/max-len
|
||||
?? "We are a software engineering and community management consulting firm.",
|
||||
);
|
||||
const twitterImage = document.createElement("meta");
|
||||
twitterImage.setAttribute("name", "twitter:image");
|
||||
twitterImage.setAttribute("content", "https://cdn.nhcarrigan.com/og-image.png");
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Favicon
|
||||
|
||||
const favicon = document.createElement("link");
|
||||
favicon.rel = "icon";
|
||||
favicon.type = "image/x-icon";
|
||||
favicon.href = "https://cdn.nhcarrigan.com/favicon/favicon.ico";
|
||||
const appleTouchIcon = document.createElement("link");
|
||||
appleTouchIcon.rel = "apple-touch-icon";
|
||||
appleTouchIcon.href = "https://cdn.nhcarrigan.com/favicon/apple-touch-icon.png";
|
||||
const smallIcon = document.createElement("link");
|
||||
smallIcon.rel = "icon";
|
||||
smallIcon.href = "https://cdn.nhcarrigan.com/favicon/favicon-16x16.png";
|
||||
const largeIcon = document.createElement("link");
|
||||
largeIcon.rel = "icon";
|
||||
largeIcon.href = "https://cdn.nhcarrigan.com/favicon/favicon-32x32.png";
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Styles
|
||||
|
||||
const styles = document.createElement("style");
|
||||
styles.innerHTML = `
|
||||
@font-face {
|
||||
font-family: 'OpenDyslexic';
|
||||
src: url('https://cdn.nhcarrigan.com/fonts/OpenDyslexicMono-Regular.otf') format('opentype');
|
||||
}
|
||||
|
||||
:root {
|
||||
--foreground: #04624f;
|
||||
--background: #abfcecdd;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: 'OpenDyslexic', monospace;
|
||||
cursor: url('https://cdn.nhcarrigan.com/cursors/cursor.cur'), auto;
|
||||
min-height: 100vh;
|
||||
min-width: 100vw;
|
||||
}
|
||||
body::before {
|
||||
background: url(https://cdn.nhcarrigan.com/background.png);
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: -1;
|
||||
content: "";
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 1;
|
||||
pointer-events: none;
|
||||
}
|
||||
main {
|
||||
color: var(--foreground);
|
||||
background-color: var(--background);
|
||||
text-align: center;
|
||||
border-radius: 10px;
|
||||
width: 95%;
|
||||
max-width: 1080px;
|
||||
margin: auto;
|
||||
}
|
||||
footer {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: var(--foreground);
|
||||
background-color: var(--background);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
a {
|
||||
color: unset;
|
||||
cursor: url('https://cdn.nhcarrigan.com/cursors/pointer.cur'), pointer;
|
||||
}
|
||||
span[style*="background-image"][style*="crisp.chat/avatar/website"] {
|
||||
bottom: 100px !important;
|
||||
}
|
||||
`;
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Components
|
||||
|
||||
const footer = document.createElement("footer");
|
||||
footer.innerHTML = `
|
||||
<p>© Naomi Carrigan</p>
|
||||
<a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer">
|
||||
<i class="fa-solid fa-comments"></i>
|
||||
</a>
|
||||
<div className="h-4/5" id="tree-nation-offset-website"></div>
|
||||
`;
|
||||
|
||||
const videoOverlay = document.createElement("video");
|
||||
videoOverlay.autoplay = true;
|
||||
videoOverlay.loop = true;
|
||||
videoOverlay.muted = true;
|
||||
videoOverlay.playsInline = true;
|
||||
videoOverlay.src = "https://cdn.nhcarrigan.com/overlay.webm";
|
||||
videoOverlay.style.pointerEvents = "none";
|
||||
videoOverlay.style.position = "fixed";
|
||||
videoOverlay.style.top = "0";
|
||||
videoOverlay.style.left = "0";
|
||||
videoOverlay.style.opacity = "0.25";
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Scripts
|
||||
|
||||
const treeNation = document.createElement("script");
|
||||
treeNation.src
|
||||
= "https://widgets.tree-nation.com/js/widgets/v1/widgets.min.js?v=1.0";
|
||||
const treeNationBottom = document.createElement("script");
|
||||
treeNationBottom.innerHTML = `
|
||||
TreeNationOffsetWebsite({
|
||||
code: "a17464e0cd351220",
|
||||
lang: "en",
|
||||
theme: "dark",
|
||||
}).render("#tree-nation-offset-website");
|
||||
`;
|
||||
const fontAwesome = document.createElement("script");
|
||||
fontAwesome.src = "https://kit.fontawesome.com/f949111719.js";
|
||||
const hubspot = document.createElement("script");
|
||||
hubspot.src = "https://js.hs-scripts.com/47086586.js";
|
||||
hubspot.async = true;
|
||||
hubspot.defer = true;
|
||||
hubspot.id = "hs-script-loader";
|
||||
const crisp = document.createElement("script");
|
||||
crisp.innerHTML = `
|
||||
window.$crisp=[];window.CRISP_WEBSITE_ID="5398ce41-4ceb-4e31-9049-4c784a70179a";(function(){d=document;s=d.createElement("script");s.src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();
|
||||
`;
|
||||
const analytics = document.createElement("script");
|
||||
analytics.defer = true;
|
||||
analytics.setAttribute("domain", "nhcarrigan.com");
|
||||
// eslint-disable-next-line stylistic/max-len
|
||||
analytics.src = "https://analytics.nhcarrigan.com/js/script.file-downloads.hash.outbound-links.pageview-props.revenue.tagged-events.js";
|
||||
const analytics2 = document.createElement("script");
|
||||
analytics2.innerHTML = `
|
||||
window.plausible = window.plausible ??
|
||||
function() {
|
||||
(window.plausible.q = window.plausible.q ?? []).push(arguments)
|
||||
}
|
||||
`;
|
||||
|
||||
// #endregion
|
||||
|
||||
// #region Inject Elements
|
||||
|
||||
head?.appendChild(openGraphTitle);
|
||||
head?.appendChild(openGraphDescription);
|
||||
head?.appendChild(openGraphImage);
|
||||
head?.appendChild(openGraphUrl);
|
||||
head?.appendChild(openGraphType);
|
||||
head?.appendChild(twitterCard);
|
||||
head?.appendChild(twitterDomain);
|
||||
head?.appendChild(twitterUrl);
|
||||
head?.appendChild(twitterTitle);
|
||||
head?.appendChild(twitterDescription);
|
||||
head?.appendChild(twitterImage);
|
||||
|
||||
head?.appendChild(favicon);
|
||||
head?.appendChild(appleTouchIcon);
|
||||
head?.appendChild(smallIcon);
|
||||
head?.appendChild(largeIcon);
|
||||
|
||||
head?.appendChild(styles);
|
||||
|
||||
head?.appendChild(treeNation);
|
||||
head?.appendChild(fontAwesome);
|
||||
head?.appendChild(hubspot);
|
||||
head?.appendChild(crisp);
|
||||
head?.appendChild(analytics);
|
||||
head?.appendChild(analytics2);
|
||||
|
||||
body?.appendChild(footer);
|
||||
body?.appendChild(videoOverlay);
|
||||
body?.appendChild(treeNationBottom);
|
||||
// #endregion
|
||||
9
tsconfig.json
Normal file
9
tsconfig.json
Normal file
@ -0,0 +1,9 @@
|
||||
{
|
||||
"extends": "@nhcarrigan/typescript-config",
|
||||
"compilerOptions": {
|
||||
"outDir": "./prod",
|
||||
"rootDir": "./src",
|
||||
"lib": ["DOM", "ESNext"],
|
||||
},
|
||||
"exclude": ["build.ts"]
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user