lavender.software webring #2
16 changed files with 589 additions and 569 deletions
|
|
@ -3,7 +3,7 @@ root = true
|
||||||
[*]
|
[*]
|
||||||
indent_style = space
|
indent_style = space
|
||||||
indent_size = 2
|
indent_size = 2
|
||||||
end_of_line = crlf
|
end_of_line = lf
|
||||||
charset = utf-8
|
charset = utf-8
|
||||||
trim_trailing_whitespace = false
|
trim_trailing_whitespace = false
|
||||||
insert_final_newline = true
|
insert_final_newline = true
|
||||||
|
|
|
||||||
15
README.md
15
README.md
|
|
@ -2,8 +2,23 @@
|
||||||
|
|
||||||
Static site generated using [siru](https://github.com/videogame-hacker/siru) and hosted at [lavender.software](https://lavender.software/).
|
Static site generated using [siru](https://github.com/videogame-hacker/siru) and hosted at [lavender.software](https://lavender.software/).
|
||||||
|
|
||||||
|
## Setting Up
|
||||||
|
|
||||||
|
```shell
|
||||||
|
$ git clone 'git@lavender.software:lavender/lavender.software.git'
|
||||||
|
$ cd lavender.software/
|
||||||
|
lavender.software/ $ mkdir dist # or follow instructions in 'Deploying'
|
||||||
|
lavender.software/ $ cargo run
|
||||||
|
...
|
||||||
|
lavender.software/ $ # Built files are in dist/
|
||||||
|
```
|
||||||
|
|
||||||
|
You may want to `cd dist && python -m http.server` to get a local HTTP server.
|
||||||
|
|
||||||
## Deploying
|
## Deploying
|
||||||
|
|
||||||
|
**Note:** You don't need to do this unless you're th eone deploying the site to the production environment.
|
||||||
|
|
||||||
```shell
|
```shell
|
||||||
$ # To set up, ensure that the 'dist' folder reflects the VPS
|
$ # To set up, ensure that the 'dist' folder reflects the VPS
|
||||||
$ git clone 'root@lavender.software:/srv/http/lavender.software' dist
|
$ git clone 'root@lavender.software:/srv/http/lavender.software' dist
|
||||||
|
|
|
||||||
162
src/webring/webring-0.1.0.js
Normal file
162
src/webring/webring-0.1.0.js
Normal file
|
|
@ -0,0 +1,162 @@
|
||||||
|
(function () {
|
||||||
|
function getUID() {
|
||||||
|
var array = new Uint8Array(8);
|
||||||
|
window.crypto.getRandomValues(array);
|
||||||
|
return Array.from(array)
|
||||||
|
.map((b) => b.toString(16).padStart(2, "0"))
|
||||||
|
.join("");
|
||||||
|
}
|
||||||
|
|
||||||
|
const params = document.currentScript.dataset;
|
||||||
|
const UID = getUID();
|
||||||
|
|
||||||
|
const css = `
|
||||||
|
#--lavender-cssreset-${UID} {
|
||||||
|
all: unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
#--lavender-webring-container-${UID} {
|
||||||
|
background-color: rgb(28, 23, 36);
|
||||||
|
background-blend-mode: multiply;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
background-color: ${params.backgroundColor || "purple"};
|
||||||
|
color: ${params.textColor || "white"};
|
||||||
|
text-shadow: 0px 1px 1px ${params.textShadowColor || "black"};
|
||||||
|
padding: 1px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-family: sans-serif;
|
||||||
|
|
||||||
|
margin: 10px 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#--lavender-webring-container-${UID} a {
|
||||||
|
color: inherit !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#--lavender-webring-container-${UID}::before {
|
||||||
|
display: block;
|
||||||
|
content: ' ';
|
||||||
|
top: 0; left: 0; bottom: 0; right: 0;
|
||||||
|
position: absolute;
|
||||||
|
box-sizing: border-box;
|
||||||
|
pointer-events: none;
|
||||||
|
border: 5px outset;
|
||||||
|
opacity: 0.25;
|
||||||
|
border-color: white black black white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#--lavender-webring-container-${UID} #--lavender-webring-title-${UID} {
|
||||||
|
margin: 10px 10px 0px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
#--lavender-webring-container-${UID} #--lavender-webring-item-container-${UID} {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
#--lavender-webring-container-${UID} #--lavender-webring-item-container-${UID} {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#--lavender-webring-container-${UID} .--lavender-webring-items-${UID} {
|
||||||
|
font-size: 14px;
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
padding: 0px;
|
||||||
|
margin: 10px 10px 8px;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#--lavender-webring-container-${UID} #--lavender-webring-item-1-${UID}::before {
|
||||||
|
display: inline;
|
||||||
|
content: '\\2190\\00a0';
|
||||||
|
}
|
||||||
|
#--lavender-webring-container-${UID} #--lavender-webring-item-3-${UID}::after {
|
||||||
|
display: inline;
|
||||||
|
content: '\\00a0\\2192';
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
|
const webring_content = `
|
||||||
|
<div id="--lavender-cssreset-${UID}">
|
||||||
|
<div id="--lavender-webring-container-${UID}">
|
||||||
|
<p id="--lavender-webring-title-${UID}">This website is a part of the Lavender Software webring</p>
|
||||||
|
<div id="--lavender-webring-item-container-${UID}">
|
||||||
|
<a class="--lavender-webring-items-${UID}" id="--lavender-webring-item-1-${UID}"></a>
|
||||||
|
<a class="--lavender-webring-items-${UID}" id="--lavender-webring-item-2-${UID}"></a>
|
||||||
|
<a class="--lavender-webring-items-${UID}" id="--lavender-webring-item-3-${UID}"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
function renderIdx(data, element, idx) {
|
||||||
|
idx = (idx + data.length) % data.length;
|
||||||
|
|
||||||
|
datum = data[idx];
|
||||||
|
element.textContent = datum.name;
|
||||||
|
element.href = datum.url;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getElementByPostfixedId(path) {
|
||||||
|
return document.getElementById(path + "-" + UID);
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderContent(currentScript, data) {
|
||||||
|
const params = currentScript.dataset;
|
||||||
|
|
||||||
|
var headstyle = document.createElement("style");
|
||||||
|
headstyle.innerHTML = css;
|
||||||
|
document.head.appendChild(headstyle);
|
||||||
|
|
||||||
|
currentScript.insertAdjacentHTML("afterend", webring_content);
|
||||||
|
|
||||||
|
const container = getElementByPostfixedId("--lavender-webring-container");
|
||||||
|
|
||||||
|
const item1 = getElementByPostfixedId("--lavender-webring-item-1");
|
||||||
|
const item2 = getElementByPostfixedId("--lavender-webring-item-2");
|
||||||
|
const item3 = getElementByPostfixedId("--lavender-webring-item-3");
|
||||||
|
|
||||||
|
const id = params.siteId;
|
||||||
|
var idindex = -1;
|
||||||
|
|
||||||
|
for (var i = 0; i < data.length; i++) {
|
||||||
|
if (data[i].id == id) {
|
||||||
|
idindex = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (idindex == -1) {
|
||||||
|
item2.textContent =
|
||||||
|
"this site was not found in the list. please check that you don't have any typos in the id!";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ("hideTitle" in params) {
|
||||||
|
getElementByPostfixedId("--lavender-webring-title").style.display =
|
||||||
|
"none";
|
||||||
|
}
|
||||||
|
|
||||||
|
renderIdx(data, item1, idindex - 1);
|
||||||
|
renderIdx(data, item2, idindex);
|
||||||
|
renderIdx(data, item3, idindex + 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
const currentScript = document.currentScript;
|
||||||
|
if (currentScript) {
|
||||||
|
fetch("https://lavender.software/webring/data.json")
|
||||||
|
.then(function (response) {
|
||||||
|
return response.json();
|
||||||
|
})
|
||||||
|
.then(function (data) {
|
||||||
|
renderContent(currentScript, data);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
console.log("cannot locate document.currentScript element. aborting...");
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
@ -1,157 +0,0 @@
|
||||||
(function() {
|
|
||||||
function getUID() {
|
|
||||||
var array = new Uint8Array(8);
|
|
||||||
window.crypto.getRandomValues(array);
|
|
||||||
return Array.from(array).map(b => b.toString(16).padStart(2, "0")).join("");
|
|
||||||
}
|
|
||||||
|
|
||||||
const params = document.currentScript.dataset;
|
|
||||||
const UID = getUID();
|
|
||||||
|
|
||||||
const css = `
|
|
||||||
#--lavender-cssreset-${UID} {
|
|
||||||
all: unset;
|
|
||||||
}
|
|
||||||
|
|
||||||
#--lavender-webring-container-${UID} {
|
|
||||||
background-color: rgb(28, 23, 36);
|
|
||||||
background-blend-mode: multiply;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
background-color: ${params.backgroundColor || "purple"};
|
|
||||||
color: ${params.textColor || "white"};
|
|
||||||
text-shadow: 0px 1px 1px ${params.textShadowColor || "black"};
|
|
||||||
padding: 1px;
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: sans-serif;
|
|
||||||
|
|
||||||
margin: 10px 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#--lavender-webring-container-${UID} a {
|
|
||||||
color: inherit !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#--lavender-webring-container-${UID}::before {
|
|
||||||
display: block;
|
|
||||||
content: ' ';
|
|
||||||
top: 0; left: 0; bottom: 0; right: 0;
|
|
||||||
position: absolute;
|
|
||||||
box-sizing: border-box;
|
|
||||||
pointer-events: none;
|
|
||||||
border: 5px outset;
|
|
||||||
opacity: 0.25;
|
|
||||||
border-color: white black black white;
|
|
||||||
}
|
|
||||||
|
|
||||||
#--lavender-webring-container-${UID} #--lavender-webring-title-${UID} {
|
|
||||||
margin: 10px 10px 0px;
|
|
||||||
text-align: center;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
#--lavender-webring-container-${UID} #--lavender-webring-item-container-${UID} {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 600px) {
|
|
||||||
#--lavender-webring-container-${UID} #--lavender-webring-item-container-${UID} {
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#--lavender-webring-container-${UID} .--lavender-webring-items-${UID} {
|
|
||||||
font-size: 14px;
|
|
||||||
display: block;
|
|
||||||
text-align: center;
|
|
||||||
padding: 0px;
|
|
||||||
margin: 10px 10px 8px;
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
#--lavender-webring-container-${UID} #--lavender-webring-item-1-${UID}::before {
|
|
||||||
display: inline;
|
|
||||||
content: '\\2190\\00a0';
|
|
||||||
}
|
|
||||||
#--lavender-webring-container-${UID} #--lavender-webring-item-3-${UID}::after {
|
|
||||||
display: inline;
|
|
||||||
content: '\\00a0\\2192';
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const webring_content = `
|
|
||||||
<div id="--lavender-cssreset-${UID}">
|
|
||||||
<div id="--lavender-webring-container-${UID}">
|
|
||||||
<p id="--lavender-webring-title-${UID}">This website is a part of the Lavender Software webring</p>
|
|
||||||
<div id="--lavender-webring-item-container-${UID}">
|
|
||||||
<a class="--lavender-webring-items-${UID}" id="--lavender-webring-item-1-${UID}"></a>
|
|
||||||
<a class="--lavender-webring-items-${UID}" id="--lavender-webring-item-2-${UID}"></a>
|
|
||||||
<a class="--lavender-webring-items-${UID}" id="--lavender-webring-item-3-${UID}"></a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
function renderIdx(data, element, idx) {
|
|
||||||
idx = (idx + data.length) % data.length;
|
|
||||||
|
|
||||||
datum = data[idx];
|
|
||||||
element.textContent = datum.name;
|
|
||||||
element.href = datum.url;
|
|
||||||
}
|
|
||||||
|
|
||||||
function getElementByPostfixedId(path) {
|
|
||||||
return document.getElementById(path + "-" + UID);
|
|
||||||
}
|
|
||||||
|
|
||||||
function renderContent(currentScript, data) {
|
|
||||||
const params = currentScript.dataset;
|
|
||||||
|
|
||||||
var headstyle = document.createElement('style');
|
|
||||||
headstyle.innerHTML = css;
|
|
||||||
document.head.appendChild(headstyle);
|
|
||||||
|
|
||||||
currentScript.insertAdjacentHTML("afterend", webring_content);
|
|
||||||
|
|
||||||
const container = getElementByPostfixedId('--lavender-webring-container');
|
|
||||||
|
|
||||||
const item1 = getElementByPostfixedId('--lavender-webring-item-1');
|
|
||||||
const item2 = getElementByPostfixedId('--lavender-webring-item-2');
|
|
||||||
const item3 = getElementByPostfixedId('--lavender-webring-item-3');
|
|
||||||
|
|
||||||
const id = params.siteId;
|
|
||||||
var idindex = -1;
|
|
||||||
|
|
||||||
for (var i = 0; i < data.length; i++) {
|
|
||||||
if (data[i].id == id) {
|
|
||||||
idindex = i;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (idindex == -1) {
|
|
||||||
item2.textContent = "this site was not found in the list. please check that you don't have any typos in the id!";
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if ("hideTitle" in params) {
|
|
||||||
getElementByPostfixedId('--lavender-webring-title').style.display = 'none';
|
|
||||||
}
|
|
||||||
|
|
||||||
renderIdx(data, item1, idindex - 1);
|
|
||||||
renderIdx(data, item2, idindex);
|
|
||||||
renderIdx(data, item3, idindex + 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
const currentScript = document.currentScript;
|
|
||||||
if (currentScript) {
|
|
||||||
fetch("https://lavender.software/webring/data.json").then(function(response) {
|
|
||||||
return response.json();
|
|
||||||
}).then(function(data) {
|
|
||||||
renderContent(currentScript, data);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
console.log("cannot locate document.currentScript element. aborting...");
|
|
||||||
}
|
|
||||||
|
|
||||||
})();
|
|
||||||
Loading…
Reference in a new issue