derek/MistoxCom-Angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Init Commit

Browse Source
This commit is contained in:
Derek Holloway
2025-06-16 17:04:55 -07:00
commit d21315cf32
43 changed files with 3089 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/MistoxWebsite.Server/wwwroot/PaymentFrame.html
Executable
+179
View File
@@ -0,0 +1,179 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Stripe-Payments</title>
<script src="https://js.stripe.com/v3/"></script>
<style>
#submit {
width: 200px;
height: 40px;
margin-left: calc(50% - 100px);
margin-top: 30px;
color: #fff;
background-color: #393;
font-size: 16px;
text-decoration: none;
text-transform: uppercase;
overflow: hidden;
transition: .5s;
letter-spacing: 4px;
border: 1px solid #8F7CEC;
}
#submit:hover {
background: #353;
color: #fff;
border-radius: 5px;
border-color: #353;
}
</style>
</head>
<body>
<form id="payment-form">
<div id="link-authentication-element">
<!--Stripe.js injects the Link Authentication Element-->
</div>
<div id="payment-element">
<!--Stripe.js injects the Payment Element-->
</div>
<button id="submit">
<div class="spinner hidden" id="spinner"></div>
<span id="button-text">Pay now</span>
</button>
<div id="payment-message" class="hidden"></div>
</form>
<script>
// This is your test publishable API key.
const stripe = Stripe('pk_live_51LBODxCozZzTNCNhFdVbzm93F1N3Kk5sEiOyUYeU8GlqxF8AkS6h1JOkIqmFJ1hBmkBCEEa8cfBCY7RotHlweS7g00UzyxkUnO');
let elements;
initialize();
checkStatus();
document.querySelector("#payment-form").addEventListener("submit", handleSubmit);
let emailAddress = '';
// Fetches a payment intent and captures the client secret
async function initialize() {
const response = await fetch("/api/getCheckoutToken?userID=" + new URL(window.location.href).searchParams.get("userID"), {
method: "POST",
headers: { "Content-Type": "text/plain" },
body: ""
});
const clientSecret = await response.text();
const appearance = {
theme: 'night',
};
elements = stripe.elements({ appearance, clientSecret });
const linkAuthenticationElement = elements.create("linkAuthentication");
linkAuthenticationElement.mount("#link-authentication-element");
linkAuthenticationElement.on('change', (event) => {
emailAddress = event.value.email;
});
const paymentElementOptions = {
layout: "tabs",
};
const paymentElement = elements.create("payment", paymentElementOptions);
paymentElement.mount("#payment-element");
}
async function handleSubmit(e) {
e.preventDefault();
setLoading(true);
const { error } = await stripe.confirmPayment({
elements,
confirmParams: {
// Make sure to change this to your payment completion page
return_url: "https://mistox.net/store/payment/success",
receipt_email: emailAddress,
},
});
// This point will only be reached if there is an immediate error when
// confirming the payment. Otherwise, your customer will be redirected to
// your `return_url`. For some payment methods like iDEAL, your customer will
// be redirected to an intermediate site first to authorize the payment, then
// redirected to the `return_url`.
if (error.type === "card_error" || error.type === "validation_error") {
showMessage(error.message);
} else {
showMessage("An unexpected error occurred.");
}
setLoading(false);
}
// Fetches the payment intent status after payment submission
async function checkStatus() {
const clientSecret = new URLSearchParams(window.location.search).get(
"payment_intent_client_secret"
);
if (!clientSecret) {
return;
}
const { paymentIntent } = await stripe.retrievePaymentIntent(clientSecret);
switch (paymentIntent.status) {
case "succeeded":
showMessage("Payment succeeded!");
break;
case "processing":
showMessage("Your payment is processing.");
break;
case "requires_payment_method":
showMessage("Your payment was not successful, please try again.");
break;
default:
showMessage("Something went wrong.");
break;
}
}
// ------- UI helpers -------
function showMessage(messageText) {
const messageContainer = document.querySelector("#payment-message");
messageContainer.classList.remove("hidden");
messageContainer.textContent = messageText;
setTimeout(function () {
messageContainer.classList.add("hidden");
messageText.textContent = "";
}, 4000);
}
// Show a spinner on payment submission
function setLoading(isLoading) {
if (isLoading) {
// Disable the button and show a spinner
document.querySelector("#submit").disabled = true;
document.querySelector("#spinner").classList.remove("hidden");
document.querySelector("#button-text").classList.add("hidden");
} else {
document.querySelector("#submit").disabled = false;
document.querySelector("#spinner").classList.add("hidden");
document.querySelector("#button-text").classList.remove("hidden");
}
}
</script>
</body>
</html>
src/MistoxWebsite.Server/wwwroot/Snake.html
Executable
+192
View File
@@ -0,0 +1,192 @@
<html>
<head>
<title>HTML_Snake</title>
</head>
<body onkeydown='return keyDown(event)'; style="background-color: #333;">
<h1 id="Score" style="width: 100%; text-align: center; color:#fff;">Score : 0</h1>
<div id="BODY" style="position: relative; margin-bottom: 5px; margin-left: 50%; right: 300px; background-color: #666; width: 600px; height: 600px;">
<script>
var snake = [];
var score = 0;
var posX = 12;
var posY = 15;
var colX, colY;
var saves = "";
var paused = false;
var direction = 2;
var wasCollected = false;
var body = document.getElementById("BODY");
function set(name,value) {
var expires = "";
var date = new Date();
date.setTime(date.getTime() + (9999*24*60*60*1000));
expires = "; expires=" + date.toUTCString();
document.cookie = name + "=" + (value || "") + expires + "; path=/";
}
function get(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function hsl2rgb(h,s,l) {
let a=s*Math.min(l,1-l);
let f= (n,k=(n+h/30)%12) => l - a*Math.max(Math.min(k-3,9-k,1),-1);
return [f(0),f(8),f(4)];
}
var degree = 0;
function newTail(x, y){
degree += 5;
if(degree > 359){
degree = 0;
}
var color = hsl2rgb(degree, .6, .5);
var r = Math.floor(color[0] * 255).toString(16);
var g = Math.floor(color[1] * 255).toString(16);
var b = Math.floor(color[2] * 255).toString(16);
var nX = (10*x)-10;
var nY = (10*y)-10;
var id = x + "," + y;
if (x == colX){
if (y == colY){
var item = document.getElementById("collectable");
item.parentNode.removeChild(item);
wasCollected = true;
newCollectable();
score += 1;
document.getElementById("Score").innerHTML = "Score : " + score;
}
}
body.innerHTML = body.innerHTML + "<div id='" + id + "'; style='position: absolute; left: " + nX + "px; top:" + nY + "px; width: 10px; height: 10px; background-color: #" + r+g+b + "; border: 0; padding: 0; margin: 0;'></div>";
return id;
}
function randInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function newCollectable(){
colX = randInt(1, 59);
colY = randInt(1, 59);
body.innerHTML = body.innerHTML + "<div id='collectable'; style='position: absolute; left: " + (colX*10-10) + "px; top:" + (colY*10-10) + "px; width: 10px; height: 10px; background-color: #f00; border: 0; padding: 0; margin: 0;'></div>";
}
function isBound(x, y){
if (x > 0 && x < 61){
if (y > 0 && y < 61){
return true;
}
}
return false;
}
function die(){
set("data", saves + "|" + score );
location.reload();
}
function update(){
if (paused == false){
if (direction == 1){
posY -= 1;
}else if(direction == 2){
posX += 1;
}else if(direction == 3){
posY += 1;
}else if(direction == 4){
posX -= 1;
}
if (isBound(posX, posY)){
function func(item, index, arr){
var x = item.split(",")[0];
var y = item.split(",")[1];
if(posX == x){
if(posY == y){
die();
}
}
}
snake.forEach(func);
snake.push(newTail(posX, posY));
if(wasCollected == false){
var rem = snake.shift();
var remObj = document.getElementById(rem);
remObj.parentNode.removeChild(remObj);
}else{
wasCollected = false;
}
}else{
die();
}
}
}
function keyDown(event){
if (event.key == "w"){
direction = 1;
}else if(event.key == "d"){
direction = 2;
}else if(event.key == "s"){
direction = 3;
}else if(event.key == "a"){
direction = 4;
}else if(event.key == "p"){
if (paused == true){
paused = false;
document.getElementById("PauseScreen").style.display = "none";
}else{
paused = true;
document.getElementById("PauseScreen").style.display = "";
}
}
}
function loadLeaderboard(){
if (get("data") != null){
saves = get("data");
function func(item, index, arr){
document.getElementById("Scoreboard").innerHTML += '<div><h2 id="' + item + '"; style="text-align: center; font-size: 20px; padding: 0; margin: 0; border: 0;">' + item.toString() + '</h2></div>';
}
saves.split("|").forEach(func);
}
}
function start(){
newCollectable();
snake.push(newTail(10, 15));
snake.push(newTail(11, 15));
snake.push(newTail(12, 15));
setTimeout(loadLeaderboard, 100);
setInterval(update, 100);
}
start();
</script>
</div>
<div id="PauseScreen"style="position: relative; display: none; width: 500px; margin-left: 50%; right: 250px;">
<h2 style="text-align: center; color: #f00; ">Game Paused</h2>
</div>
<div style="margin: 0 40px; width: calc(100% - 80px); background-color: #777;">
<h3 style="text-align: center; font-size: 25px; color: #0f0; padding: 0; margin: 0; border: 0;">LEADERBOARD</h3>
</div>
<hr style="margin: 0px; width:calc(100% - 82px);" />
<div id="Scoreboard" style="margin: 0 40px; width: calc(100% - 80px); background-color: #777;"></div>
<h3 style="position: absolute; right: 10px; bottom: 3px; color: #fff;">Designed by Derek in California</h3>
</body>
</html>
src/MistoxWebsite.Server/wwwroot/css/app.css
Executable
+178
View File
@@ -0,0 +1,178 @@
:root {
--Mistox-Dark: #2C0703;
--Mistox-Medium: #890620;
--Mistox-Light: #B6465F;
--Mistox-Bright: #FC440F;
--Mistox-Offset: #443B75;
--Mistox-Background: #320000;
--Mistox-White: #FFF;
--Mistox-Black: #000;
}
html, body {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
main {
background-color: #000000;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg id='hexagons' fill='%23ff0000' fill-opacity='0.2' fill-rule='nonzero'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
#blazor-error-ui {
background: lightyellow;
bottom: 0;
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
display: none;
left: 0;
padding: 0.6rem 1.25rem 0.7rem 1.25rem;
position: fixed;
width: 100%;
z-index: 1000;
}
#blazor-error-ui .dismiss {
cursor: pointer;
position: absolute;
right: 0.75rem;
top: 0.5rem;
}
.blazor-error-boundary {
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
padding: 1rem 1rem 1rem 3.7rem;
color: white;
}
.blazor-error-boundary::after {
content: "An error has occurred."
}
/* CSS used for the Account Activity Pages */
.center {
position: relative;
left: 50%;
top: 50vh;
transform: translateY(-50%) translateX(-50%);
}
.horizontal-center {
position: relative;
left: 50%;
transform: translateX(-50%);
}
.vertical-center {
position: relative;
top: 50vh;
transform: translateY(-50%);
}
.background-border {
border: var(--Mistox-Background) 2px solid;
border-radius: 6px;
}
.big-frame {
background-color: var(--Mistox-Black);
padding: 4px;
max-width: 400px;
color: var(--Mistox-White);
transition-duration: 1s;
}
.big-frame h3{
margin: 15px 0 30px 0;
color: var(--Mistox-White);
text-align: center;
}
.big-frame h2{
text-align: center;
position: relative;
margin: 0;
top: -20px;
font-size: 15px;
color: var(--Mistox-Bright);
}
.big-frame .frame-item label{
position: relative;
padding: 10px 0;
font-size: 16px;
color: var(--Mistox-White);
pointer-events: none;
transition: .5s;
top: -70px;
left: 20px;
}
.big-frame .frame-item input:autofill,
.big-frame .frame-item input:-webkit-autofill,
.big-frame .frame-item input {
position: relative;
width: calc(100% - 40px);
margin: 0 20px;
padding: 10px 0;
font-size: 15px;
color: var(--Mistox-White);
margin-bottom: 30px;
border: none;
border-bottom: 1px solid var(--Mistox-White);
outline: none;
background: transparent;
}
.big-frame .frame-item input:focus ~ label,
.big-frame .frame-item input:not(:placeholder-shown) ~ label {
top: -95px;
left: 10px;
color: var(--Mistox-Light);
font-size: 12px;
}
.flex-row{
display: flex;
flex-direction: row;
justify-content: space-around;
}
.sub-frame {
text-align: center;
padding: 1px 0;
}
.submit{
position: relative;
padding: 10px 20px;
color: var(--Mistox-Black);
background-color: var(--Mistox-Light);
font-size: 16px;
text-decoration: none;
text-transform: uppercase;
overflow: hidden;
transition: transform 0.3s ease, box-shadow 0.5s ease;
letter-spacing: 4px;
border: 1px solid var(--Mistox-Light);
margin: auto;
border-radius: 5px;
}
.submit:hover {
background-color: var(--Mistox-Light);
color: var(--Mistox-White);
box-shadow: 4px 3px 6px var(--Mistox-Dark);
}
.submit:active {
transform: translate( 4px, 2px );
background-color: var(--Mistox-Dark);
border: none;
color: var(--Mistox-White);
box-shadow: none;
}
ul {
list-style: none;
color: var(--Mistox-Bright);
}
src/MistoxWebsite.Server/wwwroot/favicon.ico
Executable
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

src/MistoxWebsite.Server/wwwroot/icon-192.png
Executable
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

src/MistoxWebsite.Server/wwwroot/img/MistoxLogo.png
Executable
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 162 KiB

src/MistoxWebsite.Server/wwwroot/img/ResumeFace.jpg
Executable
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 308 KiB

src/MistoxWebsite.Server/wwwroot/img/cart.png
Executable
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

src/MistoxWebsite.Server/wwwroot/index.html
Executable
+46
View File
@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>MistoxNet</title>
<base href="/" />
<link href="MistoxWebsite.Client.styles.css" rel="stylesheet">
<link href="css/app.css" rel="stylesheet">
<script src="js/screenwidth.js"></script>
<script>
PaymentLoaded = async function () {
var iframe;
while (iframe == null) {
await new Promise(r => setTimeout(r, 50));
iframe = document.getElementById("PaymentFrame");
}
window.onresize = function () {
iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 50 + 'px';
}
window.onchange = function () {
iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 50 + 'px';
}
iframe.onload = function () {
iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 50 + 'px';
}
for (var i = 0; i < 2000; i++) {
await new Promise(r => setTimeout(r, 100));
iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 50 + 'px';
}
}
</script>
</head>
<body style="border: 0; padding: 0; margin: 0;">
<div id="app"></div>
<div id="blazor-error-ui">
An unhandled error has occurred.
<a href="" class="reload">Reload</a>
<a class="dismiss">🗙</a>
</div>
<script src="_framework/blazor.webassembly.js"></script>
</body>
</html>
src/MistoxWebsite.Server/wwwroot/js/screenwidth.js
Executable
+6
View File
@@ -0,0 +1,6 @@
window.getWindowSize = function() {
return {
width: window.innerWidth,
height: window.innerHeight
};
};