Compare commits

..

14 Commits

Author SHA1 Message Date
naomi 7f8bcb31f0 release: v3.4.0
Node.js CI / Lint and Test (push) Successful in 23s
2025-12-10 19:07:02 -08:00
naomi 7a5032c112 feat: migrate analytics to latest plausible version 2025-12-10 19:06:34 -08:00
naomi f77c890e8e fix: decrease global font size, handle small screens in footer 2025-12-10 19:00:47 -08:00
naomi 923c44e634 feat: larger font size
Node.js CI / Lint and Test (push) Successful in 1m15s
2025-11-10 09:46:29 -08:00
naomi 9124ba2faa release: v3.3.0
Node.js CI / Lint and Test (push) Successful in 42s
2025-10-30 10:49:01 -07:00
naomi 11786260d8 feat: add more metadata
Node.js CI / Lint and Test (push) Has been cancelled
2025-10-30 10:48:42 -07:00
naomi aec68b86bb release: v3.2.0
Node.js CI / Lint and Test (push) Successful in 45s
2025-10-29 12:56:18 -07:00
naomi 791a0fab4f feat: new font wooooo 2025-10-29 12:56:18 -07:00
naomi a7540edb8f chore: remove sonar
Node.js CI / Lint and Test (push) Successful in 43s
2025-09-03 16:19:48 -07:00
naomi eee2fb7de3 release: v3.1.0
Code Analysis / SonarQube (push) Failing after 17s
Node.js CI / Lint and Test (push) Successful in 43s
2025-09-03 16:18:46 -07:00
naomi ee00ff835a feat: update theme colours (#6)
Code Analysis / SonarQube (push) Failing after 18s
Node.js CI / Lint and Test (push) Has been cancelled
### 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: #6
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
2025-09-03 16:18:35 -07:00
naomi 58773fc193 release: v3.0.0
Code Analysis / SonarQube (push) Failing after 17s
Node.js CI / Lint and Test (push) Successful in 40s
2025-07-08 16:46:48 -07:00
naomi 5d0660c003 feat!: rename variables to avoid collision (#5)
Code Analysis / SonarQube (push) Failing after 16s
Node.js CI / Lint and Test (push) Has been cancelled
### Explanation

_No response_

### Issue

_No response_

### Attestations

- [x] I have read and agree to the [Code of Conduct](https://docs.nhcarrigan.com/community/coc/)
- [x] I have read and agree to the [Community Guidelines](https://docs.nhcarrigan.com/community/guide/).
- [x] My contribution complies with the [Contributor Covenant](https://docs.nhcarrigan.com/dev/covenant/).

### Dependencies

- [x] I have pinned the dependencies to a specific patch version.

### Style

- [x] I have run the linter and resolved any errors.
- [x] My pull request uses an appropriate title, matching the conventional commit standards.
- [x] 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

Major - My pull request introduces a breaking change.

Reviewed-on: #5
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
2025-07-08 16:46:34 -07:00
naomi ab663e9f4b feat: add full social list to footer (#4)
Code Analysis / SonarQube (push) Failing after 16s
Node.js CI / Lint and Test (push) Successful in 39s
### Explanation

_No response_

### Issue

_No response_

### Attestations

- [x] I have read and agree to the [Code of Conduct](https://docs.nhcarrigan.com/community/coc/)
- [x] I have read and agree to the [Community Guidelines](https://docs.nhcarrigan.com/community/guide/).
- [x] My contribution complies with the [Contributor Covenant](https://docs.nhcarrigan.com/dev/covenant/).

### Dependencies

- [x] I have pinned the dependencies to a specific patch version.

### Style

- [x] I have run the linter and resolved any errors.
- [x] My pull request uses an appropriate title, matching the conventional commit standards.
- [x] 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: #4
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>
2025-07-08 16:32:40 -07:00
4 changed files with 442 additions and 252 deletions
-34
View File
@@ -1,34 +0,0 @@
name: Code Analysis
on:
push:
branches:
- main
jobs:
sonar:
name: SonarQube
steps:
- name: Checkout Source Files
uses: actions/checkout@v4
with:
fetch-depth: 0
- name: SonarCube Scan
uses: SonarSource/sonarqube-scan-action@v4
timeout-minutes: 10
env:
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
SONAR_HOST_URL: "https://quality.nhcarrigan.com"
with:
args: >
-Dsonar.sources=.
-Dsonar.projectKey=website-headers
- name: SonarQube Quality Gate check
uses: sonarsource/sonarqube-quality-gate-action@v1
with:
pollingTimeoutSec: 600
env:
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
SONAR_HOST_URL: "https://quality.nhcarrigan.com"
+6 -1
View File
@@ -8,5 +8,10 @@
"sonarlint.connectedMode.project": { "sonarlint.connectedMode.project": {
"connectionId": "nhcarrigan", "connectionId": "nhcarrigan",
"projectKey": "nhcarrigan_website-headers" "projectKey": "nhcarrigan_website-headers"
} },
"cSpell.words": [
"Adsense",
"nhcarrigan",
"noreferrer"
]
} }
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "website-headers", "name": "website-headers",
"version": "2.1.0", "version": "3.4.0",
"description": "", "description": "",
"main": "index.js", "main": "index.js",
"type": "module", "type": "module",
+435 -216
View File
@@ -5,13 +5,13 @@
*/ */
// #region Version // #region Version
const version = "{{ version }}"; const nhcarriganHeadersVersion = "{{ version }}";
console.log(` console.log(`
======================================== ========================================
Loading NHCarrigan library v${version}. Loading NHCarrigan library v${nhcarriganHeadersVersion}.
Copyright (c) ${new Date().getFullYear(). Copyright (c) ${new Date().getFullYear().
toString()} NHCarrigan toString()} NHCarrigan
Changelog: https://codeberg.org/nhcarrigan/website-headers/releases Changelog: https://git.nhcarrigan.com/nhcarrigan/website-headers/releases
Licensed under our public license: https://docs.nhcarrigan.com/legal/license Licensed under our public license: https://docs.nhcarrigan.com/legal/license
Questions? Contact us at https://docs.nhcarrigan.com/about/contact Questions? Contact us at https://docs.nhcarrigan.com/about/contact
======================================== ========================================
@@ -19,12 +19,18 @@ Questions? Contact us at https://docs.nhcarrigan.com/about/contact
// #endregion // #endregion
// #region Query Selectors // #region Query Selectors
const head = document.querySelector("head"); const nhcarriganHeadersHead = document.querySelector("head");
const body = document.querySelector("body"); const nhcarriganHeadersBody = document.querySelector("body");
const title = document.querySelector("title"); const nhcarriganHeadersTitle = document.querySelector("title");
const description = document.querySelector(`meta[name="description"]`); const nhcarriganHeadersDescription = document.querySelector(
`meta[name="description"]`,
);
const { href: url, hostname, pathname } = window.location; const {
href: nhcarriganHeadersUrl,
hostname: nhcarriganHeadersHostname,
pathname: nhcarriganHeadersPathname,
} = window.location;
// #endregion // #endregion
@@ -34,87 +40,155 @@ const { href: url, hostname, pathname } = window.location;
* The title and description are set by each website. This should * The title and description are set by each website. This should
* only load things like open graph data and favicons. * only load things like open graph data and favicons.
*/ */
const openGraphTitle = document.createElement("meta"); const nhcarriganHeadersCharacterSet = document.createElement("meta");
openGraphTitle.setAttribute("property", "og:title"); nhcarriganHeadersCharacterSet.setAttribute("charset", "UTF-8");
openGraphTitle.setAttribute("content", title?.innerText ?? "NHCarrigan"); const nhcarriganHeadersViewport = document.createElement("meta");
const openGraphDescription = document.createElement("meta"); nhcarriganHeadersViewport.setAttribute("name", "viewport");
openGraphDescription.setAttribute("property", "og:description"); nhcarriganHeadersViewport.setAttribute(
openGraphDescription.setAttribute(
"content", "content",
description?.getAttribute("content") "width=device-width, initial-scale=1.0",
// eslint-disable-next-line stylistic/max-len -- big boi string
?? "We are a software engineering and community management consulting firm.",
); );
const openGraphImage = document.createElement("meta"); const nhcarriganHeadersThemeColor = document.createElement("meta");
openGraphImage.setAttribute("property", "og:image"); nhcarriganHeadersThemeColor.setAttribute("name", "theme-color");
openGraphImage.setAttribute( nhcarriganHeadersThemeColor.setAttribute("content", "#E1F6F9");
const nhcarriganHeadersReferrer = document.createElement("meta");
nhcarriganHeadersReferrer.setAttribute("name", "referrer");
nhcarriganHeadersReferrer.setAttribute(
"content",
"strict-origin-when-cross-origin",
);
const nhcarriganHeadersOpenGraphTitle = document.createElement("meta");
nhcarriganHeadersOpenGraphTitle.setAttribute("property", "og:title");
nhcarriganHeadersOpenGraphTitle.setAttribute(
"content",
nhcarriganHeadersTitle?.innerText ?? "NHCarrigan",
);
const nhcarriganHeadersOpenGraphDescription = document.createElement("meta");
nhcarriganHeadersOpenGraphDescription.setAttribute(
"property",
"og:description",
);
nhcarriganHeadersOpenGraphDescription.setAttribute(
"content",
nhcarriganHeadersDescription?.getAttribute("content")
?? "We are a software engineering and community management consulting firm.",
);
const nhcarriganHeadersOpenGraphImage = document.createElement("meta");
nhcarriganHeadersOpenGraphImage.setAttribute("property", "og:image");
nhcarriganHeadersOpenGraphImage.setAttribute(
"content", "content",
"https://cdn.nhcarrigan.com/og-image.png", "https://cdn.nhcarrigan.com/og-image.png",
); );
const openGraphUrl = document.createElement("meta"); const nhcarriganHeadersOpenGraphUrl = document.createElement("meta");
openGraphUrl.setAttribute("property", "og:url"); nhcarriganHeadersOpenGraphUrl.setAttribute("property", "og:url");
openGraphUrl.setAttribute("content", url); nhcarriganHeadersOpenGraphUrl.setAttribute("content", nhcarriganHeadersUrl);
const openGraphType = document.createElement("meta"); const nhcarriganHeadersOpenGraphType = document.createElement("meta");
openGraphType.setAttribute("property", "og:type"); nhcarriganHeadersOpenGraphType.setAttribute("property", "og:type");
openGraphType.setAttribute("content", "website"); nhcarriganHeadersOpenGraphType.setAttribute("content", "website");
const nhcarriganHeadersOpenGraphSiteName = document.createElement("meta");
nhcarriganHeadersOpenGraphSiteName.setAttribute("property", "og:site_name");
nhcarriganHeadersOpenGraphSiteName.setAttribute("content", "NHCarrigan");
const nhcarriganHeadersOpenGraphLocale = document.createElement("meta");
nhcarriganHeadersOpenGraphLocale.setAttribute("property", "og:locale");
nhcarriganHeadersOpenGraphLocale.setAttribute("content", "en_US");
const nhcarriganHeadersOpenGraphImageAlt = document.createElement("meta");
nhcarriganHeadersOpenGraphImageAlt.setAttribute("property", "og:image:alt");
nhcarriganHeadersOpenGraphImageAlt.
setAttribute("content", "NHCarrigan logo and branding");
const nhcarriganHeadersOpenGraphImageWidth = document.createElement("meta");
nhcarriganHeadersOpenGraphImageWidth.setAttribute("property", "og:image:width");
nhcarriganHeadersOpenGraphImageWidth.setAttribute("content", "1920");
const nhcarriganHeadersOpenGraphImageHeight = document.createElement("meta");
nhcarriganHeadersOpenGraphImageHeight.
setAttribute("property", "og:image:height");
nhcarriganHeadersOpenGraphImageHeight.setAttribute("content", "1080");
const twitterCard = document.createElement("meta"); const nhcarriganHeadersTwitterCard = document.createElement("meta");
twitterCard.setAttribute("name", "twitter:card"); nhcarriganHeadersTwitterCard.setAttribute("name", "twitter:card");
twitterCard.setAttribute("content", "summary_large_image"); nhcarriganHeadersTwitterCard.setAttribute("content", "summary_large_image");
const twitterDomain = document.createElement("meta"); const nhcarriganHeadersTwitterDomain = document.createElement("meta");
twitterDomain.setAttribute("name", "twitter:domain"); nhcarriganHeadersTwitterDomain.setAttribute("name", "twitter:domain");
twitterDomain.setAttribute("content", hostname); nhcarriganHeadersTwitterDomain.setAttribute(
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", "content",
description?.getAttribute("content") nhcarriganHeadersHostname,
// eslint-disable-next-line stylistic/max-len -- big boi string
?? "We are a software engineering and community management consulting firm.",
); );
const twitterImage = document.createElement("meta"); const nhcarriganHeadersTwitterUrl = document.createElement("meta");
twitterImage.setAttribute("name", "twitter:image"); nhcarriganHeadersTwitterUrl.setAttribute("name", "twitter:url");
twitterImage.setAttribute("content", "https://cdn.nhcarrigan.com/og-image.png"); nhcarriganHeadersTwitterUrl.setAttribute("content", nhcarriganHeadersUrl);
const nhcarriganHeadersTwitterTitle = document.createElement("meta");
nhcarriganHeadersTwitterTitle.setAttribute("name", "twitter:title");
nhcarriganHeadersTwitterTitle.setAttribute(
"content",
nhcarriganHeadersTitle?.innerText ?? "NHCarrigan",
);
const nhcarriganHeadersTwitterDescription = document.createElement("meta");
nhcarriganHeadersTwitterDescription.setAttribute("name", "twitter:description");
nhcarriganHeadersTwitterDescription.setAttribute(
"content",
nhcarriganHeadersDescription?.getAttribute("content")
?? "We are a software engineering and community management consulting firm.",
);
const nhcarriganHeadersTwitterImage = document.createElement("meta");
nhcarriganHeadersTwitterImage.setAttribute("name", "twitter:image");
nhcarriganHeadersTwitterImage.setAttribute(
"content",
"https://cdn.nhcarrigan.com/og-image.png",
);
const nhcarriganHeadersTwitterSite = document.createElement("meta");
nhcarriganHeadersTwitterSite.setAttribute("name", "twitter:site");
nhcarriganHeadersTwitterSite.setAttribute("content", "@nhcarrigan1");
const nhcarriganHeadersTwitterCreator = document.createElement("meta");
nhcarriganHeadersTwitterCreator.setAttribute("name", "twitter:creator");
nhcarriganHeadersTwitterCreator.setAttribute("content", "@nhcarrigan1");
const nhcarriganHeadersFormatDetection = document.createElement("meta");
nhcarriganHeadersFormatDetection.setAttribute("name", "format-detection");
nhcarriganHeadersFormatDetection.setAttribute("content", "telephone=no");
const nhcarriganHeadersRobots = document.createElement("meta");
nhcarriganHeadersRobots.setAttribute("name", "robots");
nhcarriganHeadersRobots.setAttribute("content", "index, follow");
const nhcarriganHeadersAuthor = document.createElement("meta");
nhcarriganHeadersAuthor.setAttribute("name", "author");
nhcarriganHeadersAuthor.setAttribute("content", "Naomi Carrigan");
// #endregion // #endregion
// #region Favicon // #region Favicon
const favicon = document.createElement("link"); const nhcarriganHeadersFavicon = document.createElement("link");
favicon.rel = "icon"; nhcarriganHeadersFavicon.rel = "icon";
favicon.type = "image/x-icon"; nhcarriganHeadersFavicon.type = "image/x-icon";
favicon.href = "https://cdn.nhcarrigan.com/favicon/favicon.ico"; nhcarriganHeadersFavicon.href
const appleTouchIcon = document.createElement("link"); = "https://cdn.nhcarrigan.com/favicon/favicon.ico";
appleTouchIcon.rel = "apple-touch-icon"; const nhcarriganHeadersAppleTouchIcon = document.createElement("link");
appleTouchIcon.href = "https://cdn.nhcarrigan.com/favicon/apple-touch-icon.png"; nhcarriganHeadersAppleTouchIcon.rel = "apple-touch-icon";
const smallIcon = document.createElement("link"); nhcarriganHeadersAppleTouchIcon.href
smallIcon.rel = "icon"; = "https://cdn.nhcarrigan.com/favicon/apple-touch-icon.png";
smallIcon.href = "https://cdn.nhcarrigan.com/favicon/favicon-16x16.png"; const nhcarriganHeadersSmallIcon = document.createElement("link");
const largeIcon = document.createElement("link"); nhcarriganHeadersSmallIcon.rel = "icon";
largeIcon.rel = "icon"; nhcarriganHeadersSmallIcon.href
largeIcon.href = "https://cdn.nhcarrigan.com/favicon/favicon-32x32.png"; = "https://cdn.nhcarrigan.com/favicon/favicon-16x16.png";
const nhcarriganHeadersLargeIcon = document.createElement("link");
nhcarriganHeadersLargeIcon.rel = "icon";
nhcarriganHeadersLargeIcon.href
= "https://cdn.nhcarrigan.com/favicon/favicon-32x32.png";
// #endregion // #endregion
// #region Styles // #region Styles
const styles = document.createElement("style"); const nhcarriganHeadersStyles = document.createElement("style");
styles.id = "nhcarrigan-global-styles"; nhcarriganHeadersStyles.id = "nhcarrigan-global-styles";
styles.innerHTML = ` nhcarriganHeadersStyles.innerHTML = `
@font-face { @font-face {
font-family: 'OpenDyslexic'; font-family: 'Vampyr';
src: url('https://cdn.nhcarrigan.com/fonts/OpenDyslexicMono-Regular.otf') format('opentype'); src: url('https://cdn.nhcarrigan.com/fonts/vampyr.ttf') format('truetype');
} }
:root { :root {
--foreground: #2a0a18; --foreground: #8F2447;
--background: #ffb6c1bb; --background: #E1F6F9DC;
font-size: 12pt;
} }
* { * {
@@ -124,7 +198,7 @@ styles.innerHTML = `
} }
html { html {
font-family: 'OpenDyslexic', monospace; font-family: 'Vampyr', monospace;
cursor: url('https://cdn.nhcarrigan.com/cursors/cursor.cur'), auto; cursor: url('https://cdn.nhcarrigan.com/cursors/cursor.cur'), auto;
min-height: 100vh; min-height: 100vh;
min-width: 100vw; min-width: 100vw;
@@ -177,11 +251,16 @@ footer {
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
} }
#audio-theme-button, #theme-select-button { #show-socials-button, #theme-select-button {
background: none; background: none;
border: none; border: none;
cursor: url('https://cdn.nhcarrigan.com/cursors/pointer.cur'), pointer; cursor: url('https://cdn.nhcarrigan.com/cursors/pointer.cur'), pointer;
color: var(--foreground); color: var(--foreground);
font-size: 1rem;
font-family: 'Vampyr', monospace;
}
#show-socials-button > i, #theme-select-button > i {
font-size: 1.5rem;
} }
a { a {
color: unset; color: unset;
@@ -191,9 +270,40 @@ a {
display: flex; display: flex;
align-items: center; align-items: center;
} }
#social-list {
position: absolute;
bottom: 75px;
left: 0;
right: 0;
width: 100vw;
max-width: 400px;
padding: 10px;
background-color: var(--background);
color: var(--foreground);
border-radius: 10px;
border: 1px solid var(--foreground);
display: none;
z-index: 1000;
}
.social-list-item {
padding: 10px;
}
.social-list-item > a {
display: flex;
align-items: center;
justify-content: space-between;
text-decoration: none;
}
.social-list-divider {
border: 0.5px solid var(--foreground);
}
.social-list-item:hover {
background-color: var(--foreground);
color: var(--background);
}
.is-dark { .is-dark {
--foreground: #ffb6c1; --foreground: #E1F6F9;
--background: #2a0a18bb; --background: #8F2447bb;
} }
@media screen and (max-width: 625px) { @media screen and (max-width: 625px) {
#tree-nation-offset-website { #tree-nation-offset-website {
@@ -207,40 +317,104 @@ a {
margin-bottom: 60px; margin-bottom: 60px;
} }
} }
@media screen and (max-width: 425px) {
#donate-badge {
display: none;
}
}
@media screen and (max-width: 350px) {
footer, #show-socials-button, #theme-select-button, #show-socials-button > i, #theme-select-button > i {
font-size: 10pt;
}
}
`; `;
// #endregion // #endregion
// #region Components // #region Components
const footer = document.createElement("footer"); const nhcarriganHeadersFooter = document.createElement("footer");
footer.innerHTML = ` nhcarriganHeadersFooter.innerHTML = `
<div id="footer-inner-container"> <div id="footer-inner-container">
<p>&copy; <a href="https://nhcarrigan.com" target="_blank">Naomi Carrigan</a></p> <p id="footer-copyright">&copy; <a href="https://nhcarrigan.com" target="_blank">Naomi Carrigan</a></p>
<a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer"> <button id="show-socials-button" type="button">
<i class="fa-solid fa-comments"></i> <i class="fa-solid fa-share-nodes"></i> Connect with Us
</a>
<button id="theme-select-button" type="button">
<i id="theme-select-icon" class="fa-solid fa-moon"></i>
</button> </button>
<a href="https://buy.stripe.com/cN24iTfqu1j6b3afZ2" target="_blank" rel="noreferrer"> <button id="theme-select-button" type="button">
<i id="theme-select-icon" class="fa-solid fa-moon"></i> Toggle Theme
</button>
<a id="donate-badge" href="https://buy.stripe.com/cN24iTfqu1j6b3afZ2" target="_blank" rel="noreferrer">
<img src="https://cdn.nhcarrigan.com/donate.png" alt="Donate" style="width: 70px; height: 70px;"> <img src="https://cdn.nhcarrigan.com/donate.png" alt="Donate" style="width: 70px; height: 70px;">
</a> </a>
<div id="tree-nation-offset-website"></div> <div id="tree-nation-offset-website"></div>
</div> </div>
<div id="social-list">
<div class="social-list-item">
<a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer">
<i class="fa-brands fa-discord"></i><span>Join our Discord~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://forum.nhcarrigan.com" target="_blank" rel="noreferrer">
<i class="fa-brands fa-discourse"></i><span>Sign up for our forum~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://git.nhcarrigan.com" target="_blank" rel="noreferrer">
<i class="fa-brands fa-git-alt"></i><span>Check out our source code~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://bsky.app/profile/nhcarrigan.com" target="_blank" rel="noreferrer">
<i class="fa-brands fa-bluesky"></i><span>Follow us on Bluesky~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://www.linkedin.com/company/nhcarrigan" target="_blank" rel="noreferrer">
<i class="fa-brands fa-linkedin"></i><span>Connect with us on LinkedIn~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://www.reddit.com/r/nhcarrigan/" target="_blank" rel="noreferrer">
<i class="fa-brands fa-reddit"></i><span>Join our subreddit~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://www.youtube.com/@naomilgbt" target="_blank" rel="noreferrer">
<i class="fa-brands fa-youtube"></i><span>Subscribe to our YouTube~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://twitch.tv/naomilgbt" target="_blank" rel="noreferrer">
<i class="fa-brands fa-twitch"></i><span>Subscribe to our Twitch~!</span>
</a>
</div>
<hr class="social-list-divider" />
<div class="social-list-item">
<a href="https://x.com/nhcarrigan1" target="_blank" rel="noreferrer">
<i class="fa-brands fa-twitter"></i><span>We are even on Twitter~!</span>
</a>
</div>
</div>
`; `;
// #endregion
// #region Scripts // #region Scripts
const treeNation = document.createElement("script"); const nhcarriganHeadersTreeNation = document.createElement("script");
treeNation.src nhcarriganHeadersTreeNation.src
= "https://widgets.tree-nation.com/js/widgets/v1/widgets.min.js?v=1.0"; = "https://widgets.tree-nation.com/js/widgets/v1/widgets.min.js?v=1.0";
const treeNationBottom = document.createElement("script"); const nhcarriganHeadersTreeNationBottom = document.createElement("script");
treeNationBottom.defer = true; nhcarriganHeadersTreeNationBottom.defer = true;
treeNationBottom.async = true; nhcarriganHeadersTreeNationBottom.async = true;
treeNationBottom.innerHTML = ` nhcarriganHeadersTreeNationBottom.innerHTML = `
const interval = setInterval(() => { const interval = setInterval(() => {
const tree = document.querySelector("#tree-nation-offset-website"); const tree = document.querySelector("#tree-nation-offset-website");
if (!tree) { if (!tree) {
@@ -255,134 +429,164 @@ const interval = setInterval(() => {
clearInterval(interval); clearInterval(interval);
}, 1000); }, 1000);
`; `;
const fontAwesome = document.createElement("script"); const nhcarriganHeadersFontAwesome = document.createElement("script");
fontAwesome.src = "https://kit.fontawesome.com/f949111719.js"; nhcarriganHeadersFontAwesome.src = "https://kit.fontawesome.com/f949111719.js";
const analytics = document.createElement("script"); const nhcarriganHeadersAnalytics = document.createElement("script");
analytics.defer = true; nhcarriganHeadersAnalytics.defer = true;
analytics.setAttribute("domain", "nhcarrigan.com"); nhcarriganHeadersAnalytics.src
analytics.src
// eslint-disable-next-line stylistic/max-len = "https://analytics.nhcarrigan.com/js/pa-YUXAn1vhhRttySUAw_LMN.js";
= "https://analytics.nhcarrigan.com/js/script.file-downloads.hash.outbound-links.pageview-props.revenue.tagged-events.js"; const nhcarriganHeadersAnalytics2 = document.createElement("script");
analytics.setAttribute("event-domain", hostname); nhcarriganHeadersAnalytics2.innerHTML = `
analytics.setAttribute("data-domain", "nhcarrigan.com"); window.plausible=window.plausible||function(){(plausible.q=plausible.q||[]).push(arguments)},plausible.init=plausible.init||function(i){plausible.o=i||{}};
analytics.setAttribute("event-page", title?.innerText ?? "Unknown Page"); plausible.init({
analytics.setAttribute("event-path", pathname); domain: "${nhcarriganHeadersHostname}",
const analytics2 = document.createElement("script"); page: "${nhcarriganHeadersTitle?.innerText ?? "Unknown Page"}",
analytics2.innerHTML = ` path: "${nhcarriganHeadersPathname}",
window.plausible = window.plausible ?? })
function() {
(window.plausible.q = window.plausible.q ?? []).push(arguments)
}
`; `;
const googleAdsense = document.createElement("script"); const nhcarriganHeadersGoogleAdsense = document.createElement("script");
googleAdsense.async = true; nhcarriganHeadersGoogleAdsense.async = true;
googleAdsense.src nhcarriganHeadersGoogleAdsense.src
// eslint-disable-next-line stylistic/max-len -- big boi string // eslint-disable-next-line stylistic/max-len -- big boi string
= "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3569924701890974"; = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3569924701890974";
googleAdsense.setAttribute("crossorigin", "anonymous"); nhcarriganHeadersGoogleAdsense.setAttribute("crossorigin", "anonymous");
// #endregion // #endregion
// #region Inject Elements // #region Inject Elements
head?.appendChild(openGraphTitle); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersCharacterSet);
head?.appendChild(openGraphDescription); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersViewport);
head?.appendChild(openGraphImage); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersThemeColor);
head?.appendChild(openGraphUrl); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersReferrer);
head?.appendChild(openGraphType); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphTitle);
head?.appendChild(twitterCard); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphDescription);
head?.appendChild(twitterDomain); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImage);
head?.appendChild(twitterUrl); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphUrl);
head?.appendChild(twitterTitle); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphType);
head?.appendChild(twitterDescription); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphSiteName);
head?.appendChild(twitterImage); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphLocale);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImageAlt);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImageWidth);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImageHeight);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterCard);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterDomain);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterUrl);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterTitle);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterDescription);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterImage);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterSite);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterCreator);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersFavicon);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAppleTouchIcon);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersSmallIcon);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersLargeIcon);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersFormatDetection);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersRobots);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAuthor);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersStyles);
head?.appendChild(favicon); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTreeNation);
head?.appendChild(appleTouchIcon); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersFontAwesome);
head?.appendChild(smallIcon); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAnalytics);
head?.appendChild(largeIcon); nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAnalytics2);
nhcarriganHeadersHead?.appendChild(nhcarriganHeadersGoogleAdsense);
head?.appendChild(styles);
head?.appendChild(treeNation);
head?.appendChild(fontAwesome);
head?.appendChild(analytics);
head?.appendChild(analytics2);
head?.appendChild(googleAdsense);
body?.appendChild(footer);
body?.appendChild(treeNationBottom);
// #endregion
// #region Audio
const playButton = document.querySelector("#audio-theme-button");
const audio = new Audio("https://cdn.nhcarrigan.com/theme.mp3");
let playing = false;
playButton?.addEventListener("click", () => {
if (playing) {
audio.pause();
playing = false;
playButton.innerHTML = "<i class=\"fa-solid fa-play\"></i>";
} else {
void audio.play();
playing = true;
playButton.innerHTML = "<i class=\"fa-solid fa-pause\"></i>";
}
});
nhcarriganHeadersBody?.appendChild(nhcarriganHeadersFooter);
nhcarriganHeadersBody?.appendChild(nhcarriganHeadersTreeNationBottom);
// #endregion // #endregion
// #region Theme // #region Theme
const themeButton = document.querySelector("#theme-select-button"); const nhcarriganHeadersThemeButton = document.querySelector(
const themeIcon = document.querySelector("#theme-select-icon"); "#theme-select-button",
);
const nhcarriganHeadersThemeIcon = document.querySelector("#theme-select-icon");
if (localStorage.getItem("theme") === "dark") { if (localStorage.getItem("theme") === "dark") {
themeIcon?.classList.remove("fa-moon"); nhcarriganHeadersThemeIcon?.classList.remove("fa-moon");
themeIcon?.classList.add("fa-sun"); nhcarriganHeadersThemeIcon?.classList.add("fa-sun");
document.querySelector("html")?.classList.add("is-dark"); document.querySelector("html")?.classList.add("is-dark");
} }
const toggleTheme = (): void => { const nhcarriganHeadersToggleTheme = (): void => {
const currentTheme = localStorage.getItem("theme"); const nhcarriganHeadersCurrentTheme = localStorage.getItem("theme");
if (currentTheme === "dark") { if (nhcarriganHeadersCurrentTheme === "dark") {
localStorage.setItem("theme", "light"); localStorage.setItem("theme", "light");
themeIcon?.classList.remove("fa-sun"); nhcarriganHeadersThemeIcon?.classList.remove("fa-sun");
themeIcon?.classList.add("fa-moon"); nhcarriganHeadersThemeIcon?.classList.add("fa-moon");
document.querySelector("html")?.classList.remove("is-dark"); document.querySelector("html")?.classList.remove("is-dark");
return; return;
} }
localStorage.setItem("theme", "dark"); localStorage.setItem("theme", "dark");
themeIcon?.classList.remove("fa-moon"); nhcarriganHeadersThemeIcon?.classList.remove("fa-moon");
themeIcon?.classList.add("fa-sun"); nhcarriganHeadersThemeIcon?.classList.add("fa-sun");
document.querySelector("html")?.classList.add("is-dark"); document.querySelector("html")?.classList.add("is-dark");
}; };
themeButton?.addEventListener("click", toggleTheme); nhcarriganHeadersThemeButton?.addEventListener(
const prefersDark = window.matchMedia("(prefers-color-scheme: dark)"); "click",
if (prefersDark.matches && localStorage.getItem("theme") !== null) { nhcarriganHeadersToggleTheme,
);
const nhcarriganHeadersPrefersDark = window.matchMedia(
"(prefers-color-scheme: dark)",
);
if (
nhcarriganHeadersPrefersDark.matches
&& localStorage.getItem("theme") !== null
) {
localStorage.setItem("theme", "dark"); localStorage.setItem("theme", "dark");
themeIcon?.classList.remove("fa-moon"); nhcarriganHeadersThemeIcon?.classList.remove("fa-moon");
themeIcon?.classList.add("fa-sun"); nhcarriganHeadersThemeIcon?.classList.add("fa-sun");
document.querySelector("html")?.classList.add("is-dark"); document.querySelector("html")?.classList.add("is-dark");
} }
// #endregion // #endregion
// #region Social Toggle
const nhcarriganHeadersShowSocialsButton
= document.querySelector<HTMLButtonElement>("#show-socials-button");
const nhcarriganHeadersSocialList
= document.querySelector<HTMLDivElement>("#social-list");
const nhcarriganHeadersToggleSocials = (): void => {
if (!nhcarriganHeadersSocialList) {
throw new Error("Social list element not found.");
}
if (nhcarriganHeadersSocialList.style.display === "block") {
nhcarriganHeadersSocialList.style.display = "none";
nhcarriganHeadersShowSocialsButton?.setAttribute("aria-expanded", "false");
nhcarriganHeadersShowSocialsButton?.setAttribute(
"aria-label",
"Show Socials",
);
return;
}
nhcarriganHeadersSocialList.style.display = "block";
nhcarriganHeadersShowSocialsButton?.setAttribute("aria-expanded", "true");
nhcarriganHeadersShowSocialsButton?.setAttribute(
"aria-label",
"Hide Socials",
);
};
nhcarriganHeadersShowSocialsButton?.addEventListener(
"click",
nhcarriganHeadersToggleSocials,
);
// #region CTA // #region CTA
const cta = document.createElement("dialog"); const nhcarriganHeadersCta = document.createElement("dialog");
cta.style.position = "fixed"; nhcarriganHeadersCta.style.position = "fixed";
cta.style.top = "50%"; nhcarriganHeadersCta.style.top = "50%";
cta.style.left = "50%"; nhcarriganHeadersCta.style.left = "50%";
cta.style.transform = "translate(-50%, -50%)"; nhcarriganHeadersCta.style.transform = "translate(-50%, -50%)";
cta.style.padding = "10px"; nhcarriganHeadersCta.style.padding = "10px";
cta.style.borderRadius = "10px"; nhcarriganHeadersCta.style.borderRadius = "10px";
cta.style.backgroundColor = "var(--background)"; nhcarriganHeadersCta.style.backgroundColor = "var(--background)";
cta.style.color = "var(--foreground)"; nhcarriganHeadersCta.style.color = "var(--foreground)";
cta.style.textAlign = "center"; nhcarriganHeadersCta.style.textAlign = "center";
cta.style.width = "95%"; nhcarriganHeadersCta.style.width = "95%";
cta.style.maxWidth = "400px"; nhcarriganHeadersCta.style.maxWidth = "400px";
cta.id = "community-cta"; nhcarriganHeadersCta.id = "community-cta";
cta.innerHTML = ` nhcarriganHeadersCta.innerHTML = `
<h1 autofocus>Hello~!</h1> <h1 autofocus>Hello~!</h1>
<div style="display: flex; justify-content: space-around; margin-bottom: 10px;"> <div style="display: flex; justify-content: space-around; margin-bottom: 10px;">
<img src="https://cdn.nhcarrigan.com/logo.png" alt="NHCarrigan Logo" style="width: 100px; height: 100px;"> <img src="https://cdn.nhcarrigan.com/logo.png" alt="NHCarrigan Logo" style="width: 100px; height: 100px;">
@@ -393,47 +597,62 @@ cta.innerHTML = `
<a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer" style="padding: 10px; background: var(--foreground); color: var(--background); outline: none">Okay, take me there~!</a> <a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer" style="padding: 10px; background: var(--foreground); color: var(--background); outline: none">Okay, take me there~!</a>
`; `;
const modalBg = document.createElement("div"); const nhcarriganHeadersModalBg = document.createElement("div");
modalBg.style.zIndex = "4999"; nhcarriganHeadersModalBg.style.zIndex = "4999";
modalBg.style.position = "fixed"; nhcarriganHeadersModalBg.style.position = "fixed";
modalBg.style.top = "0"; nhcarriganHeadersModalBg.style.top = "0";
modalBg.style.left = "0"; nhcarriganHeadersModalBg.style.left = "0";
modalBg.style.width = "100vw"; nhcarriganHeadersModalBg.style.width = "100vw";
modalBg.style.height = "100vh"; nhcarriganHeadersModalBg.style.height = "100vh";
modalBg.style.backgroundColor = "rgba(0, 0, 0, 0.5)"; nhcarriganHeadersModalBg.style.backgroundColor = "rgba(0, 0, 0, 0.5)";
modalBg.style.display = "none"; nhcarriganHeadersModalBg.style.display = "none";
modalBg.id = "modal-bg"; nhcarriganHeadersModalBg.id = "modal-bg";
const closeModal = (): void => { const nhcarriganHeadersCloseModal = (): void => {
cta.close(); nhcarriganHeadersCta.close();
modalBg.style.display = "none"; nhcarriganHeadersModalBg.style.display = "none";
}; };
const handleModalClick = (event: MouseEvent): void => { const nhcarriganHeadersHandleModalClick = (event: MouseEvent): void => {
event.stopPropagation(); event.stopPropagation();
if (event.target === cta) { if (event.target === nhcarriganHeadersCta) {
closeModal(); nhcarriganHeadersCloseModal();
} }
}; };
const showModal = (): void => { const nhcarriganHeadersShowModal = (): void => {
const lastShown = Number.parseInt( const nhcarriganHeadersLastShown = Number.parseInt(
localStorage.getItem("naomi-community-cta") ?? "0", localStorage.getItem("naomi-community-cta") ?? "0",
10, 10,
); );
const lastShownDate = new Date(lastShown); const nhcarriganHeadersLastShownDate = new Date(nhcarriganHeadersLastShown);
const diff = Date.now() - lastShownDate.getTime(); const nhcarriganHeadersDiff
console.table({ diff, lastShown, lastShownDate }); = Date.now() - nhcarriganHeadersLastShownDate.getTime();
console.table({
diff: nhcarriganHeadersDiff,
lastShown: nhcarriganHeadersLastShown,
lastShownDate: nhcarriganHeadersLastShownDate,
});
// We only want to show this once a week. // We only want to show this once a week.
if (diff < 1000 * 60 * 60 * 24 * 7) { if (nhcarriganHeadersDiff < 1000 * 60 * 60 * 24 * 7) {
return; return;
} }
cta.showModal(); nhcarriganHeadersCta.showModal();
modalBg.style.display = "block"; nhcarriganHeadersModalBg.style.display = "block";
modalBg.addEventListener("click", closeModal); nhcarriganHeadersModalBg.addEventListener(
const closeButton = cta.querySelector("button"); "click",
closeButton?.addEventListener("click", closeModal); nhcarriganHeadersCloseModal,
cta.addEventListener("click", handleModalClick); );
const nhcarriganHeadersCloseButton
= nhcarriganHeadersCta.querySelector("button");
nhcarriganHeadersCloseButton?.addEventListener(
"click",
nhcarriganHeadersCloseModal,
);
nhcarriganHeadersCta.addEventListener(
"click",
nhcarriganHeadersHandleModalClick,
);
localStorage.setItem("naomi-community-cta", Date.now().toString()); localStorage.setItem("naomi-community-cta", Date.now().toString());
}; };
body?.appendChild(cta); nhcarriganHeadersBody?.appendChild(nhcarriganHeadersCta);
body?.appendChild(modalBg); nhcarriganHeadersBody?.appendChild(nhcarriganHeadersModalBg);
showModal(); nhcarriganHeadersShowModal();