new display system for socials

This commit is contained in:
bingus_violet 2024-11-14 01:59:13 -06:00
parent 8f18fe7d1f
commit e0351a1ba1
4 changed files with 66 additions and 12 deletions

View file

@ -183,7 +183,6 @@ function highlighter(json, full = true, linkParent = false) {
spanEnd -= 1 spanEnd -= 1
endContent = endContent.substring(0, endContent.length - 1) endContent = endContent.substring(0, endContent.length - 1)
} else { } else {
console.log(newStartContent)
spanStart = newSpanStart spanStart = newSpanStart
startContent = newStartContent startContent = newStartContent
} }
@ -317,7 +316,7 @@ function converter(html, dynamic = true) {
"WEATHER_MODIFIER": randomThemer.returnTheme(), "WEATHER_MODIFIER": randomThemer.returnTheme(),
"WEATHER_TEXT": "", "WEATHER_TEXT": "",
"ANNOUNCEMENT": fs.readFileSync(path.join(__dirname, "config/announcement.html")), "ANNOUNCEMENT": fs.readFileSync(path.join(__dirname, "config/announcement.html")),
"SOCIALS": () => { "SOCIALS": (full) => {
if (api.lanyard && api.lanyard.socials) { if (api.lanyard && api.lanyard.socials) {
var socials = api.lanyard.socials var socials = api.lanyard.socials
var html = `<div class="grid-container">` var html = `<div class="grid-container">`
@ -330,8 +329,9 @@ function converter(html, dynamic = true) {
for (var x = 0; x < sitesTable.length; x++) { for (var x = 0; x < sitesTable.length; x++) {
var siteName = sitesTable[x] var siteName = sitesTable[x]
var siteData = sites[siteName] var siteData = sites[siteName]
html += `<a class="chip" ${onlyIfExists(`href="${siteData.url}"`, siteData.url)}>${siteName}: <span class="noHighlight">${siteData.name}</span></a>` if (siteData.main || full) {
html += `<a class="chip ${siteData.pref || ""}pref" ${onlyIfExists(`href="${siteData.url}"`, siteData.url)}>${siteName}: <span class="noHighlight">${siteData.name}</span></a>`
}
} }
html += "</div></div>" html += "</div></div>"
} }
@ -371,6 +371,9 @@ function converter(html, dynamic = true) {
<script src="../js/lanyardSocket.js"></script> <script src="../js/lanyardSocket.js"></script>
<script src="../js/timeFormatter.js"></script> <script src="../js/timeFormatter.js"></script>
` `
},
"TEST_KEYWORD": (arg1, arg2, arg3) => {
return `<p>The arguements you inputted are "${arg1}" and "${arg2}". Wow!</p>`
} }
} }
@ -397,10 +400,34 @@ function converter(html, dynamic = true) {
for (let index = 0; index < rpTable.length; index++) { for (let index = 0; index < rpTable.length; index++) {
const text = rpTable[index]; const text = rpTable[index];
if (dynamic) { const braceText = `{${text}}`
replacers[text] = himalaya.stringify(highlighter(himalaya.parse(replacers[text])))
if (typeof replacers[text] == "function" && replacers[text].length == 0) {
replacers[text] = replacers[text]()
}
while (html.includes(braceText)) {
var posOfKeyword = html.indexOf(braceText)
var keywordLength = braceText.length
var args = undefined
if (html.charAt(posOfKeyword + keywordLength) == "(") {
args = html.substring(posOfKeyword + keywordLength + 1)
keywordLength = args.substring(0, args.indexOf(")")).length + keywordLength + 2
args = args.substring(0, args.indexOf(")"))
args = args.split(",").map(item => item.trim())
}
var fnString = replacers[text]
if (typeof fnString == "function") {
fnString = fnString.apply(null, args)
}
if (dynamic) {
fnString = himalaya.stringify(highlighter(himalaya.parse(fnString)))
}
html = html.substring(0, posOfKeyword) + fnString + html.substring(posOfKeyword + keywordLength)
// break
} }
html = html.replaceAll(`{${text}}`, replacers[text])
} }
if (!dynamic) { if (!dynamic) {

View file

@ -78,17 +78,26 @@
</div> </div>
{ANNOUNCEMENT} {ANNOUNCEMENT}
<h2><hr>Services</h2> <h1><hr>Services</h1>
<p>List of services for public use hosted on Violet's Purgatory.</p> <p>List of services for public use hosted on Violet's Purgatory.</p>
<h2><br>Public:</h2>
<a href="https://sxng.violets-purgatory.dev" class="chip">SearXNG: <span class="noHighlight">sxng.violets-purgatory.dev</span></a> <a href="https://sxng.violets-purgatory.dev" class="chip">SearXNG: <span class="noHighlight">sxng.violets-purgatory.dev</span></a>
<!-- <a class="chip">Matrix: matrix.violets-purgatory.dev</a> --> <!-- <a class="chip">Matrix: matrix.violets-purgatory.dev</a> -->
<!-- <a href="https://element.violets-purgatory.dev" class="chip">Element: element.violets-purgatory.dev</a> --> <!-- <a href="https://element.violets-purgatory.dev" class="chip">Element: element.violets-purgatory.dev</a> -->
<a href="https://git.viois.gay" class="chip">Forgejo: <span class="noHighlight">git.viois.gay</span></a>
<a href="https://univerter.dev" class="chip">Univerter: <span class="noHighlight">univerter.dev</span></a> <a href="https://univerter.dev" class="chip">Univerter: <span class="noHighlight">univerter.dev</span></a>
<a class="chip">Thumbor: <span class="noHighlight">thumbor.violets-purgatory.dev</span></a> <a class="chip">Thumbor: <span class="noHighlight">thumbor.violets-purgatory.dev</span></a>
<h2><br>Invite only:</h2>
<a href="https://git.viois.gay" class="chip">Forgejo: <span class="noHighlight">git.viois.gay</span></a>
<a href="https://pds.violets-purgatory.dev" class="chip">Bluesky: <span class="noHighlight">pds.violets-purgatory.dev</span></a>
<a href="https://sharkey.violets-purgatory.dev" class="chip">Fedi (Sharkey): <span class="noHighlight">sharkey.violets-purgatory.dev</span></a>
<br>
<p>Feel free to DM me anywhere (Discord & Fedi are best) for an invite! Do understand though, <b>my instances are not stable!<br></b>
<underline>By using my services, you are confirming you understand that there are risks of data loss, downtime, and bugs!!!</underline></p>
<hr> <hr>
<h1>Socials</h1> <h1>Socials</h1>
{PATH_SOCIALS} <p>Here's some of the sites you can find me on! Check the full <a href="./socials/">socials</a> page for more details & links.</p>
{SOCIALS}
<br> <br>
{SELECTED_VIDEO} {SELECTED_VIDEO}

View file

@ -29,8 +29,10 @@
<div class="mainDiv"> <div class="mainDiv">
<hr> <hr>
<main> <main>
<p>Here's most of the sites you can find me on-<br>if you needed that for some reason?</p> <p>Here's most of the sites you can find me on!</p>
{SOCIALS} {SOCIALS}(Full)
<p>Gray border = preferred, Yellow = neutral, Red = not preferred. <br>
Interacting via any site is perfectly fine! E.G. if you use both Fedi and Bluesky, Bluesky is yellow, so you should contact me through Fedi instead! But if you don't have Fedi, then just contact me through Bluesky!</p>
<br> <br>
</main> </main>
<div id="activityHtml"> <div id="activityHtml">

View file

@ -16,3 +16,19 @@ h1:nth-of-type(1) {
.mainDiv { .mainDiv {
margin: auto; margin: auto;
} }
.notpref {
border-color: rgb(150, 25, 25);
}
.notpref:hover {
border-color: red;
}
.neutralpref {
border-color: rgb(150, 150, 75);
}
.neutralpref:hover {
border-color: yellow;
}