mycosystems/myco.systems
3
0
Fork 0
Code Pull requests Activity Actions

update

Browse source
This commit is contained in:
rouce 2023-10-14 23:18:46 -04:00
parent d8194a2aa4
commit 2d1e2a32af
3 changed files with 146 additions and 154 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

96
public/index.html Normal file → Executable file
View file

File diff suppressed because one or more lines are too long

189
public/scripts.js → public/script.js Normal file → Executable file
View file

@ -1,109 +1,119 @@
// <CRYPTO_DONATION> // <CRYPTO_DONATION>
var donateButton = document.getElementById('donateButton'); var donateButton = document.getElementById("donateButton");
var card = document.getElementById('card'); var card = document.getElementById("card");
donateButton.addEventListener('click', function(event) { donateButton.addEventListener("click", function (event) {
event.stopPropagation(); event.stopPropagation();
if (card.classList.contains('card-out')) { if (card.classList.contains("card-out")) {
card.classList.remove('card-out'); card.classList.remove("card-out");
card.classList.add('card-in'); card.classList.add("card-in");
} else { } else {
card.classList.remove('card-in'); card.classList.remove("card-in");
card.classList.add('card-out'); card.classList.add("card-out");
} }
}); });
window.addEventListener('click', function(event) { window.addEventListener("click", function (event) {
if(event.target === card || card.contains(event.target)) { if (event.target === card || card.contains(event.target)) {
return; return;
} }
if (card.classList.contains('card-in')) { if (card.classList.contains("card-in")) {
card.classList.remove('card-in'); card.classList.remove("card-in");
card.classList.add('card-out'); card.classList.add("card-out");
} }
}); });
var cryptoWallets = [ var cryptoWallets = [
{ {
symbol: 'XMR', symbol: "XMR",
name: 'Monero', name: "Monero",
address: '49r2aeun8DtV5VqZpZSwRpS83WfUWEaLt4NG8HJwwVkbiT1vSsXTXrPFKkKTdc6MPX9iezbTidNPvhGZKCnM1338TfK6Hgi', address:
}, "49r2aeun8DtV5VqZpZSwRpS83WfUWEaLt4NG8HJwwVkbiT1vSsXTXrPFKkKTdc6MPX9iezbTidNPvhGZKCnM1338TfK6Hgi"
{ },
symbol: 'LTC', {
name: 'Litecoin', symbol: "LTC",
address: 'LRAm7h5XENknfYEpbdVsvyGY8D6MiXGTDV', name: "Litecoin",
}, address: "LRAm7h5XENknfYEpbdVsvyGY8D6MiXGTDV"
{ },
symbol: 'BTC', {
name: 'Bitcoin', symbol: "BTC",
address: 'bc1qkv97ajh7f0a72l9rsjd3fmmly5q5uywr06q3x0', name: "Bitcoin",
} address: "bc1qkv97ajh7f0a72l9rsjd3fmmly5q5uywr06q3x0"
}
]; ];
var walletsContainer = document.getElementById('wallets'); var walletsContainer = document.getElementById("wallets");
var qrImage = document.getElementById('qrImage'); var qrImage = document.getElementById("qrImage");
var donateTitle = document.getElementById('donateTitle'); var donateTitle = document.getElementById("donateTitle");
var donateWarn = document.getElementById('donateWarn'); var donateWarn = document.getElementById("donateWarn");
var walletAddress = document.getElementById('walletAddress'); var walletAddress = document.getElementById("walletAddress");
var copyButton = document.getElementById('copyButton'); var copyButton = document.getElementById("copyButton");
function selectWallet(symbol) { function selectWallet(symbol) {
var wallet = cryptoWallets.find(function (w) { var wallet = cryptoWallets.find(function (w) {
return w.symbol === symbol; return w.symbol === symbol;
}); });
if (!wallet) return; if (!wallet) return;
var buttons = Array.from(walletsContainer.children); var buttons = Array.from(walletsContainer.children);
buttons.forEach(function (button) { buttons.forEach(function (button) {
button.classList.remove('active'); button.classList.remove("active");
if (button.textContent === symbol) { if (button.textContent === symbol) {
button.classList.add('active'); button.classList.add("active");
} }
}); });
qrImage.src = 'https://api.qrserver.com/v1/create-qr-code/?size=180x180&data=' + wallet.address; qrImage.src =
donateTitle.textContent = 'Donate ' + wallet.name; "https://api.qrserver.com/v1/create-qr-code/?size=180x180&data=" +
donateWarn.textContent = 'Send only ' + wallet.name + ' (' + wallet.symbol + ') to this deposit address. Sending any other coin or token to this address may result in the loss of your donation. Thanks!'; wallet.address;
walletAddress.value = wallet.address; donateTitle.textContent = "Donate " + wallet.name;
copyButton.textContent = '✚ Copy'; donateWarn.textContent =
"Send only " +
wallet.name +
" (" +
wallet.symbol +
") to this deposit address. Sending any other coin or token to this address may result in the loss of your donation. Thanks!";
walletAddress.value = wallet.address;
copyButton.textContent = "✚ Copy";
} }
function copyText() { function copyText() {
var input = document.createElement('input'); var input = document.createElement("input");
document.body.appendChild(input); document.body.appendChild(input);
input.value = walletAddress.value; input.value = walletAddress.value;
input.select(); input.select();
document.execCommand('copy'); document.execCommand("copy");
document.body.removeChild(input); document.body.removeChild(input);
copyButton.textContent = '✔ Copied'; copyButton.textContent = "✔ Copied";
} }
cryptoWallets.forEach(function (wallet) { cryptoWallets.forEach(function (wallet) {
var button = document.createElement('button'); var button = document.createElement("button");
button.textContent = wallet.symbol; button.textContent = wallet.symbol;
button.addEventListener('click', function () { button.addEventListener("click", function () {
selectWallet(wallet.symbol); selectWallet(wallet.symbol);
}); });
walletsContainer.appendChild(button); walletsContainer.appendChild(button);
}); });
copyButton.addEventListener('click', copyText); copyButton.addEventListener("click", copyText);
selectWallet(cryptoWallets[0].symbol); selectWallet(cryptoWallets[0].symbol);
// </CRYPTO_DONATION> // </CRYPTO_DONATION>
let globalUniforms = { let globalUniforms = {
time: { value: 0 } time: { value: 0 }
}; };
import * as THREE from "https://cdn.skypack.dev/three@0.136.0"; import * as THREE from "https://cdn.skypack.dev/three@0.136.0";
import { OrbitControls } from "https://cdn.skypack.dev/three@0.136.0/examples/jsm/controls/OrbitControls"; import { OrbitControls } from "https://cdn.skypack.dev/three@0.136.0/examples/jsm/controls/OrbitControls";
import { CSS2DRenderer, CSS2DObject } from 'https://cdn.skypack.dev/three@0.136.0/examples/jsm/renderers/CSS2DRenderer.js'; import {
CSS2DRenderer,
CSS2DObject
} from "https://cdn.skypack.dev/three@0.136.0/examples/jsm/renderers/CSS2DRenderer.js";
let scene = new THREE.Scene(); let scene = new THREE.Scene();
let camera = new THREE.PerspectiveCamera(45, innerWidth / innerHeight, 1, 2000); let camera = new THREE.PerspectiveCamera(45, innerWidth / innerHeight, 1, 2000);
@ -117,8 +127,8 @@ document.body.appendChild(renderer.domElement);
let labelRenderer = new CSS2DRenderer(); let labelRenderer = new CSS2DRenderer();
labelRenderer.setSize(window.innerWidth, window.innerHeight); labelRenderer.setSize(window.innerWidth, window.innerHeight);
labelRenderer.domElement.style.position = 'absolute'; labelRenderer.domElement.style.position = "absolute";
labelRenderer.domElement.style.top = '0px'; labelRenderer.domElement.style.top = "0px";
document.body.appendChild(labelRenderer.domElement); document.body.appendChild(labelRenderer.domElement);
window.addEventListener("resize", onWindowResize); window.addEventListener("resize", onWindowResize);
@ -220,13 +230,13 @@ const pinGeometryAtlanta = new THREE.SphereGeometry(0.05, 32, 32);
const pinMaterialAtlanta = new THREE.MeshBasicMaterial({ color: 0x31302c }); const pinMaterialAtlanta = new THREE.MeshBasicMaterial({ color: 0x31302c });
const pinMeshAtlanta = new THREE.Mesh(pinGeometryAtlanta, pinMaterialAtlanta); const pinMeshAtlanta = new THREE.Mesh(pinGeometryAtlanta, pinMaterialAtlanta);
const labelDivAtlanta = document.createElement('div'); const labelDivAtlanta = document.createElement("div");
labelDivAtlanta.className = 'label-atl'; labelDivAtlanta.className = "label-atl";
labelDivAtlanta.textContent = 'Atlanta'; labelDivAtlanta.textContent = "Atlanta";
const labelObjectAtlanta = new CSS2DObject(labelDivAtlanta); const labelObjectAtlanta = new CSS2DObject(labelDivAtlanta);
const pinLatitudeAtlanta = 33.74932660; const pinLatitudeAtlanta = 33.7493266;
const pinLongitudeAtlanta = -95.39035664; const pinLongitudeAtlanta = -95.39035664;
const sphericalAtlanta = new THREE.Spherical(); const sphericalAtlanta = new THREE.Spherical();
@ -249,9 +259,9 @@ const pinGeometrySanJose = new THREE.SphereGeometry(0.05, 32, 32);
const pinMaterialSanJose = new THREE.MeshBasicMaterial({ color: 0x31302c }); const pinMaterialSanJose = new THREE.MeshBasicMaterial({ color: 0x31302c });
const pinMeshSanJose = new THREE.Mesh(pinGeometrySanJose, pinMaterialSanJose); const pinMeshSanJose = new THREE.Mesh(pinGeometrySanJose, pinMaterialSanJose);
const labelDivSanJose = document.createElement('div'); const labelDivSanJose = document.createElement("div");
labelDivSanJose.className = 'label-san'; labelDivSanJose.className = "label-san";
labelDivSanJose.textContent = 'San Jose'; labelDivSanJose.textContent = "San Jose";
const labelObjectSanJose = new CSS2DObject(labelDivSanJose); const labelObjectSanJose = new CSS2DObject(labelDivSanJose);
@ -276,11 +286,14 @@ scene.add(labelObjectSanJose);
const pinGeometryVintHill = new THREE.SphereGeometry(0.05, 32, 32); const pinGeometryVintHill = new THREE.SphereGeometry(0.05, 32, 32);
const pinMaterialVintHill = new THREE.MeshBasicMaterial({ color: 0x31302c }); const pinMaterialVintHill = new THREE.MeshBasicMaterial({ color: 0x31302c });
const pinMeshVintHill = new THREE.Mesh(pinGeometryVintHill, pinMaterialVintHill); const pinMeshVintHill = new THREE.Mesh(
pinGeometryVintHill,
pinMaterialVintHill
);
const labelDivVintHill = document.createElement('div'); const labelDivVintHill = document.createElement("div");
labelDivVintHill.className = 'label-vint'; labelDivVintHill.className = "label-vint";
labelDivVintHill.textContent = 'Vint Hill'; labelDivVintHill.textContent = "Vint Hill";
const labelObjectVintHill = new CSS2DObject(labelDivVintHill); const labelObjectVintHill = new CSS2DObject(labelDivVintHill);
@ -306,9 +319,9 @@ const pinGeometryChicago = new THREE.SphereGeometry(0.05, 32, 32);
const pinMaterialChicago = new THREE.MeshBasicMaterial({ color: 0x31302c }); const pinMaterialChicago = new THREE.MeshBasicMaterial({ color: 0x31302c });
const pinMeshChicago = new THREE.Mesh(pinGeometryChicago, pinMaterialChicago); const pinMeshChicago = new THREE.Mesh(pinGeometryChicago, pinMaterialChicago);
const labelDivChicago = document.createElement('div'); const labelDivChicago = document.createElement("div");
labelDivChicago.className = 'label-cha'; labelDivChicago.className = "label-cha";
labelDivChicago.textContent = 'Chicago'; labelDivChicago.textContent = "Chicago";
const labelObjectChicago = new CSS2DObject(labelDivChicago); const labelObjectChicago = new CSS2DObject(labelDivChicago);
@ -334,9 +347,9 @@ const pinGeometryNewYork = new THREE.SphereGeometry(0.05, 32, 32);
const pinMaterialNewYork = new THREE.MeshBasicMaterial({ color: 0x31302c }); const pinMaterialNewYork = new THREE.MeshBasicMaterial({ color: 0x31302c });
const pinMeshNewYork = new THREE.Mesh(pinGeometryNewYork, pinMaterialNewYork); const pinMeshNewYork = new THREE.Mesh(pinGeometryNewYork, pinMaterialNewYork);
const labelDivNewYork = document.createElement('div'); const labelDivNewYork = document.createElement("div");
labelDivNewYork.className = 'label-york'; labelDivNewYork.className = "label-york";
labelDivNewYork.textContent = 'New York'; labelDivNewYork.textContent = "New York";
const labelObjectNewYork = new CSS2DObject(labelDivNewYork); const labelObjectNewYork = new CSS2DObject(labelDivNewYork);
@ -357,8 +370,6 @@ labelObjectNewYork.position.copy(positionNewYork);
scene.add(pinMeshNewYork); scene.add(pinMeshNewYork);
scene.add(labelObjectNewYork); scene.add(labelObjectNewYork);
// ARCS // ARCS
function renderArc(startPosition, endPosition) { function renderArc(startPosition, endPosition) {
@ -407,4 +418,4 @@ function onWindowResize() {
camera.updateProjectionMatrix(); camera.updateProjectionMatrix();
renderer.setSize(innerWidth, innerHeight); renderer.setSize(innerWidth, innerHeight);
labelRenderer.setSize(innerWidth, innerHeight); labelRenderer.setSize(innerWidth, innerHeight);
} }

15
public/styles.css → public/style.css Normal file → Executable file
View file

@ -1,7 +1,7 @@
body { body {
overflow: hidden; overflow: hidden;
margin: 0; margin: 0;
font-family: 'Open Sans', sans-serif; font-family: "Open Sans", sans-serif;
} }
.header-container { .header-container {
@ -25,7 +25,7 @@ body {
.header-container h1 { .header-container h1 {
display: inline-block; display: inline-block;
font-family: 'Open Sans', sans-serif; font-family: "Open Sans", sans-serif;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
@ -133,7 +133,8 @@ body {
border: 0; border: 0;
text-decoration: none; text-decoration: none;
box-sizing: border-box; box-sizing: border-box;
transition: color 300ms ease-out, background 300ms ease-out, border 300ms ease-out, transform 300ms ease-out, opacity 300ms ease-out; transition: color 300ms ease-out, background 300ms ease-out,
border 300ms ease-out, transform 300ms ease-out, opacity 300ms ease-out;
} }
input, input,
@ -265,10 +266,14 @@ button {
font-size: 1em; font-size: 1em;
} }
.label-york, .label-atl, .label-cha, .label-vint, .label-san { .label-york,
.label-atl,
.label-cha,
.label-vint,
.label-san {
color: white; color: white;
background-color: rgba(0, 0, 0, 0.7); background-color: rgba(0, 0, 0, 0.7);
padding: 4px; padding: 4px;
border-radius: 4px; border-radius: 4px;
font-size: 14px; font-size: 14px;
} }