mirror of
https://github.com/milk-net/milk-net.github.io.git
synced 2025-04-20 18:23:41 -05:00
Compare commits
No commits in common. "f387478ad123eb34d4364fe7ae853dacdb18656d" and "cdaa7b8383be158229c3df994f64eeed0c36e837" have entirely different histories.
f387478ad1
...
cdaa7b8383
7 changed files with 3 additions and 725 deletions
|
|
@ -1,71 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>MilkNet | Casino</title>
|
|
||||||
<link id="favicon" rel="icon" href="/assets/img/milk.png" type="image/x-icon">
|
|
||||||
<link rel="stylesheet" href="style.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h1>MilkNet Casino</h1>
|
|
||||||
<p>Feeling lucky? Inspired by github.com/Xameren/Casino</p>
|
|
||||||
<p id="balance">Balance: $1000</p>
|
|
||||||
|
|
||||||
<!-- Bet amount input -->
|
|
||||||
<label for="bet-amount">Bet Amount:</label>
|
|
||||||
<input type="number" id="bet-amount" value="100">
|
|
||||||
|
|
||||||
<!-- Navigation buttons -->
|
|
||||||
<div>
|
|
||||||
<button onclick="showGame('horse-racing')">Horse Racing</button>
|
|
||||||
<button onclick="showGame('blackjack')">Blackjack</button>
|
|
||||||
<button onclick="showGame('slots')">Slots</button>
|
|
||||||
<button onclick="showGame('coin-flip')">Coin Flip</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Horse Racing Game -->
|
|
||||||
<div id="horse-racing" class="game" style="display:none;">
|
|
||||||
<h2>Horse Racing</h2>
|
|
||||||
<label for="horse-selection">Choose your horse:</label>
|
|
||||||
<select id="horse-selection">
|
|
||||||
<option value="Horse 1">Horse 1</option>
|
|
||||||
<option value="Horse 2">Horse 2</option>
|
|
||||||
<option value="Horse 3">Horse 3</option>
|
|
||||||
<option value="Horse 4">Horse 4</option>
|
|
||||||
</select>
|
|
||||||
<button onclick="startHorseRacing()">Start Race</button>
|
|
||||||
<p id="race-result"></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Blackjack Game -->
|
|
||||||
<div id="blackjack" class="game" style="display:none;">
|
|
||||||
<h2>Blackjack</h2>
|
|
||||||
<button onclick="startBlackjack()">Start Game</button>
|
|
||||||
<button onclick="hit()">Hit</button>
|
|
||||||
<button onclick="stand()">Stand</button>
|
|
||||||
<p id="blackjack-cards"></p>
|
|
||||||
<p id="blackjack-status"></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Slots Game -->
|
|
||||||
<div id="slots" class="game" style="display:none;">
|
|
||||||
<h2>Slots</h2>
|
|
||||||
<button onclick="playSlots()">Spin</button>
|
|
||||||
<p id="slots-result"></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Coin Flip Game -->
|
|
||||||
<div id="coin-flip" class="game" style="display:none;">
|
|
||||||
<h2>Coin Flip</h2>
|
|
||||||
<label for="coin-choice">Choose:</label>
|
|
||||||
<select id="coin-choice">
|
|
||||||
<option value="Heads">Heads</option>
|
|
||||||
<option value="Tails">Tails</option>
|
|
||||||
</select>
|
|
||||||
<button onclick="flipCoin()">Flip Coin</button>
|
|
||||||
<p id="coin-flip-result"></p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="script.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,174 +0,0 @@
|
||||||
let balance = 1000;
|
|
||||||
|
|
||||||
// Update balance display
|
|
||||||
function updateBalance() {
|
|
||||||
document.getElementById('balance').innerText = `Balance: $${balance}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Show selected game
|
|
||||||
function showGame(gameId) {
|
|
||||||
const games = document.querySelectorAll('.game');
|
|
||||||
games.forEach(game => game.style.display = 'none');
|
|
||||||
document.getElementById(gameId).style.display = 'block';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Get bet amount
|
|
||||||
function getBetAmount() {
|
|
||||||
const bet = parseInt(document.getElementById('bet-amount').value);
|
|
||||||
if (bet > balance) {
|
|
||||||
alert("You don't have enough balance for this bet.");
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
if (bet <= 0) {
|
|
||||||
alert("Please enter a valid bet amount.");
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
return bet;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Horse Racing Game
|
|
||||||
function startHorseRacing() {
|
|
||||||
const bet = getBetAmount();
|
|
||||||
if (bet === null) return;
|
|
||||||
|
|
||||||
const playerHorse = document.getElementById('horse-selection').value;
|
|
||||||
const horses = ['Horse 1', 'Horse 2', 'Horse 3', 'Horse 4'];
|
|
||||||
const winner = horses[Math.floor(Math.random() * horses.length)];
|
|
||||||
|
|
||||||
let resultMessage = `You bet on ${playerHorse}. ${winner} wins the race! `;
|
|
||||||
|
|
||||||
if (playerHorse === winner) {
|
|
||||||
balance += bet;
|
|
||||||
resultMessage += `You win $${bet}!`;
|
|
||||||
} else {
|
|
||||||
balance -= bet;
|
|
||||||
resultMessage += `You lose $${bet}.`;
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementById('race-result').innerText = resultMessage;
|
|
||||||
updateBalance();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Blackjack Game
|
|
||||||
let playerCards = [];
|
|
||||||
let dealerCards = [];
|
|
||||||
|
|
||||||
function startBlackjack() {
|
|
||||||
const bet = getBetAmount();
|
|
||||||
if (bet === null) return;
|
|
||||||
|
|
||||||
playerCards = [drawCard(), drawCard()];
|
|
||||||
dealerCards = [drawCard(), drawCard()];
|
|
||||||
|
|
||||||
document.getElementById('blackjack-status').innerText = 'Game started. Your move!';
|
|
||||||
showBlackjackCards();
|
|
||||||
}
|
|
||||||
|
|
||||||
function drawCard() {
|
|
||||||
return Math.floor(Math.random() * 11) + 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
function calculateTotal(cards) {
|
|
||||||
return cards.reduce((a, b) => a + b, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
function showBlackjackCards() {
|
|
||||||
document.getElementById('blackjack-cards').innerText =
|
|
||||||
`Your cards: ${playerCards.join(', ')} (Total: ${calculateTotal(playerCards)})\n` +
|
|
||||||
`Dealer shows: ${dealerCards[0]}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function hit() {
|
|
||||||
playerCards.push(drawCard());
|
|
||||||
showBlackjackCards();
|
|
||||||
const total = calculateTotal(playerCards);
|
|
||||||
if (total > 21) endBlackjackGame('lose');
|
|
||||||
}
|
|
||||||
|
|
||||||
function stand() {
|
|
||||||
while (calculateTotal(dealerCards) < 17) {
|
|
||||||
dealerCards.push(drawCard());
|
|
||||||
}
|
|
||||||
|
|
||||||
const playerTotal = calculateTotal(playerCards);
|
|
||||||
const dealerTotal = calculateTotal(dealerCards);
|
|
||||||
|
|
||||||
if (dealerTotal > 21 || playerTotal > dealerTotal) {
|
|
||||||
endBlackjackGame('win');
|
|
||||||
} else if (playerTotal === dealerTotal) {
|
|
||||||
endBlackjackGame('draw');
|
|
||||||
} else {
|
|
||||||
endBlackjackGame('lose');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function endBlackjackGame(result) {
|
|
||||||
const bet = getBetAmount();
|
|
||||||
if (bet === null) return;
|
|
||||||
|
|
||||||
let message = '';
|
|
||||||
if (result === 'win') {
|
|
||||||
balance += bet;
|
|
||||||
message = `You win $${bet}!`;
|
|
||||||
} else if (result === 'lose') {
|
|
||||||
balance -= bet;
|
|
||||||
message = `You lose $${bet}.`;
|
|
||||||
} else {
|
|
||||||
message = "It's a draw!";
|
|
||||||
}
|
|
||||||
|
|
||||||
updateBalance();
|
|
||||||
document.getElementById('blackjack-status').innerText =
|
|
||||||
`${message} Dealer's cards: ${dealerCards.join(', ')} (Total: ${calculateTotal(dealerCards)})`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Slots Game
|
|
||||||
function playSlots() {
|
|
||||||
const bet = getBetAmount();
|
|
||||||
if (bet === null) return;
|
|
||||||
|
|
||||||
const symbols = ['🍒', '🍋', '🍊', '🍉', '⭐'];
|
|
||||||
const spin = [randomSymbol(symbols), randomSymbol(symbols), randomSymbol(symbols)];
|
|
||||||
|
|
||||||
let resultMessage = `Result: ${spin.join(' ')}`;
|
|
||||||
if (spin.every(s => s === spin[0])) {
|
|
||||||
balance += bet * 5;
|
|
||||||
resultMessage += `\nJackpot! You win $${bet * 5}!`;
|
|
||||||
} else if (new Set(spin).size === 2) {
|
|
||||||
balance += bet * 2;
|
|
||||||
resultMessage += `\nTwo of a kind! You win $${bet * 2}!`;
|
|
||||||
} else {
|
|
||||||
balance -= bet;
|
|
||||||
resultMessage += `\nYou lose $${bet}.`;
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementById('slots-result').innerText = resultMessage;
|
|
||||||
updateBalance();
|
|
||||||
}
|
|
||||||
|
|
||||||
function randomSymbol(symbols) {
|
|
||||||
return symbols[Math.floor(Math.random() * symbols.length)];
|
|
||||||
}
|
|
||||||
|
|
||||||
// Coin Flip Game
|
|
||||||
function flipCoin() {
|
|
||||||
const bet = getBetAmount();
|
|
||||||
if (bet === null) return;
|
|
||||||
|
|
||||||
const playerChoice = document.getElementById('coin-choice').value;
|
|
||||||
const outcomes = ['Heads', 'Tails'];
|
|
||||||
const result = outcomes[Math.floor(Math.random() * outcomes.length)];
|
|
||||||
|
|
||||||
let resultMessage = `You chose ${playerChoice}. The coin landed on ${result}. `;
|
|
||||||
|
|
||||||
if (playerChoice === result) {
|
|
||||||
balance += bet;
|
|
||||||
resultMessage += `You win $${bet}!`;
|
|
||||||
} else {
|
|
||||||
balance -= bet;
|
|
||||||
resultMessage += `You lose $${bet}.`;
|
|
||||||
}
|
|
||||||
|
|
||||||
document.getElementById('coin-flip-result').innerText = resultMessage;
|
|
||||||
updateBalance();
|
|
||||||
}
|
|
||||||
|
|
@ -1,88 +0,0 @@
|
||||||
/* Apply global styles */
|
|
||||||
body {
|
|
||||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
background: linear-gradient(to right, #000000, #1e3c72); /* Black to blue gradient */
|
|
||||||
color: #fff;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
height: 100vh;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
header {
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 3em;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Game selection buttons */
|
|
||||||
.game-selection {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
gap: 20px;
|
|
||||||
margin-bottom: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
padding: 10px 20px;
|
|
||||||
font-size: 1.2em;
|
|
||||||
cursor: pointer;
|
|
||||||
background-color: #1e3c72;
|
|
||||||
color: white;
|
|
||||||
border: 2px solid #fff;
|
|
||||||
border-radius: 8px;
|
|
||||||
transition: background-color 0.3s, transform 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover {
|
|
||||||
background-color: #154c79;
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
|
|
||||||
button:active {
|
|
||||||
background-color: #0d3a56;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Game container styles */
|
|
||||||
.game {
|
|
||||||
display: none;
|
|
||||||
text-align: center;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game h2 {
|
|
||||||
font-size: 2em;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.game p {
|
|
||||||
font-size: 1.2em;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
footer {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 20px;
|
|
||||||
font-size: 1em;
|
|
||||||
color: #ddd;
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Game results */
|
|
||||||
#race-result, #blackjack-result, #slots-result, #coin-flip-result {
|
|
||||||
font-size: 1.5em;
|
|
||||||
margin-top: 20px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
273
draw/index.html
273
draw/index.html
|
|
@ -1,273 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>MilkNet | Draw</title>
|
|
||||||
<link id="favicon" rel="icon" href="/assets/img/milk.png" type="image/x-icon">
|
|
||||||
<style>
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-start;
|
|
||||||
align-items: center;
|
|
||||||
height: 100vh;
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
font-family: 'Segoe UI', sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
#drawingCanvas {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
cursor: crosshair;
|
|
||||||
}
|
|
||||||
|
|
||||||
.controls {
|
|
||||||
position: fixed;
|
|
||||||
top: 20px;
|
|
||||||
right: 20px;
|
|
||||||
background-color: #fff;
|
|
||||||
border: 2px solid #ccc;
|
|
||||||
padding: 20px;
|
|
||||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
|
|
||||||
width: 250px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-between;
|
|
||||||
height: calc(100vh - 40px);
|
|
||||||
font-family: 'Segoe UI', sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.controls label {
|
|
||||||
margin-top: 10px;
|
|
||||||
display: block;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.controls input[type="color"],
|
|
||||||
.controls input[type="range"],
|
|
||||||
.controls select {
|
|
||||||
width: 100%;
|
|
||||||
margin: 5px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.controls button {
|
|
||||||
margin-top: 10px;
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
padding: 10px;
|
|
||||||
background-color: #000;
|
|
||||||
color: white;
|
|
||||||
font-size: 18px;
|
|
||||||
border: none;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: background-color 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.controls button:hover {
|
|
||||||
background-color: #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
#shapeSelector {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<canvas id="drawingCanvas"></canvas>
|
|
||||||
|
|
||||||
<div class="controls">
|
|
||||||
<div>
|
|
||||||
<label for="toolSelector">Tool</label>
|
|
||||||
<select id="toolSelector">
|
|
||||||
<option value="brush">Brush</option>
|
|
||||||
<option value="rainbow">Rainbow Brush</option>
|
|
||||||
<option value="eraser">Eraser</option>
|
|
||||||
<option value="shape">Shape</option>
|
|
||||||
</select>
|
|
||||||
|
|
||||||
<label for="shapeSelector">Shape</label>
|
|
||||||
<select id="shapeSelector">
|
|
||||||
<option value="square">Square</option>
|
|
||||||
<option value="circle">Circle</option>
|
|
||||||
<option value="triangle">Triangle</option>
|
|
||||||
</select>
|
|
||||||
|
|
||||||
<label for="colorPicker">Color</label>
|
|
||||||
<input type="color" id="colorPicker" value="#000000">
|
|
||||||
|
|
||||||
<label for="brushSize">Thickness</label>
|
|
||||||
<input type="range" id="brushSize" min="1" max="50" value="5">
|
|
||||||
|
|
||||||
<button id="undoButton">Undo</button>
|
|
||||||
<button id="redoButton">Redo</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button id="clearButton">Clear</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
const canvas = document.getElementById('drawingCanvas');
|
|
||||||
const ctx = canvas.getContext('2d');
|
|
||||||
const clearButton = document.getElementById('clearButton');
|
|
||||||
const colorPicker = document.getElementById('colorPicker');
|
|
||||||
const brushSize = document.getElementById('brushSize');
|
|
||||||
const toolSelector = document.getElementById('toolSelector');
|
|
||||||
const shapeSelector = document.getElementById('shapeSelector');
|
|
||||||
const undoButton = document.getElementById('undoButton');
|
|
||||||
const redoButton = document.getElementById('redoButton');
|
|
||||||
|
|
||||||
let isDrawing = false;
|
|
||||||
let lastX = 0, lastY = 0;
|
|
||||||
let startX = 0, startY = 0;
|
|
||||||
let previewCanvas, previewCtx;
|
|
||||||
let hue = 0;
|
|
||||||
let currentTool = 'brush';
|
|
||||||
let currentShape = 'square';
|
|
||||||
const undoStack = [];
|
|
||||||
const redoStack = [];
|
|
||||||
|
|
||||||
function saveState() {
|
|
||||||
undoStack.push(canvas.toDataURL());
|
|
||||||
redoStack.length = 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
function restoreState(stackFrom, stackTo) {
|
|
||||||
if (stackFrom.length === 0) return;
|
|
||||||
stackTo.push(canvas.toDataURL());
|
|
||||||
const img = new Image();
|
|
||||||
img.src = stackFrom.pop();
|
|
||||||
img.onload = () => {
|
|
||||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
||||||
ctx.drawImage(img, 0, 0);
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
function resizeCanvas() {
|
|
||||||
canvas.width = window.innerWidth;
|
|
||||||
canvas.height = window.innerHeight;
|
|
||||||
}
|
|
||||||
window.addEventListener('resize', resizeCanvas);
|
|
||||||
resizeCanvas();
|
|
||||||
|
|
||||||
ctx.lineCap = 'round';
|
|
||||||
ctx.lineJoin = 'round';
|
|
||||||
|
|
||||||
function getPosition(e) {
|
|
||||||
if (e.touches && e.touches.length > 0) {
|
|
||||||
return { x: e.touches[0].clientX, y: e.touches[0].clientY };
|
|
||||||
} else {
|
|
||||||
return { x: e.clientX, y: e.clientY };
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function startDrawing(e) {
|
|
||||||
const pos = getPosition(e);
|
|
||||||
isDrawing = true;
|
|
||||||
startX = lastX = pos.x;
|
|
||||||
startY = lastY = pos.y;
|
|
||||||
if (currentTool !== 'shape') saveState();
|
|
||||||
}
|
|
||||||
|
|
||||||
function stopDrawing(e) {
|
|
||||||
if (!isDrawing) return;
|
|
||||||
isDrawing = false;
|
|
||||||
if (currentTool === 'shape') {
|
|
||||||
const pos = getPosition(e);
|
|
||||||
drawShape(startX, startY, pos.x, pos.y, true);
|
|
||||||
saveState();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function draw(e) {
|
|
||||||
const pos = getPosition(e);
|
|
||||||
if (currentTool === 'shape' && isDrawing) {
|
|
||||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
||||||
restorePreview();
|
|
||||||
drawShape(startX, startY, pos.x, pos.y, false);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isDrawing) return;
|
|
||||||
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.moveTo(lastX, lastY);
|
|
||||||
ctx.lineTo(pos.x, pos.y);
|
|
||||||
|
|
||||||
if (currentTool === 'rainbow') {
|
|
||||||
ctx.strokeStyle = `hsl(${hue}, 100%, 50%)`;
|
|
||||||
hue = (hue + 1) % 360;
|
|
||||||
} else if (currentTool === 'eraser') {
|
|
||||||
ctx.strokeStyle = '#ffffff';
|
|
||||||
} else {
|
|
||||||
ctx.strokeStyle = colorPicker.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.lineWidth = brushSize.value;
|
|
||||||
ctx.stroke();
|
|
||||||
lastX = pos.x;
|
|
||||||
lastY = pos.y;
|
|
||||||
}
|
|
||||||
|
|
||||||
function drawShape(x1, y1, x2, y2, finalDraw) {
|
|
||||||
if (finalDraw) restorePreview();
|
|
||||||
ctx.fillStyle = colorPicker.value;
|
|
||||||
ctx.lineWidth = brushSize.value;
|
|
||||||
ctx.beginPath();
|
|
||||||
|
|
||||||
if (currentShape === 'square') {
|
|
||||||
const width = x2 - x1;
|
|
||||||
const height = y2 - y1;
|
|
||||||
ctx.fillRect(x1, y1, width, height);
|
|
||||||
} else if (currentShape === 'circle') {
|
|
||||||
const radius = Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2) / 2;
|
|
||||||
ctx.arc((x1 + x2) / 2, (y1 + y2) / 2, radius, 0, Math.PI * 2);
|
|
||||||
ctx.fill();
|
|
||||||
} else if (currentShape === 'triangle') {
|
|
||||||
ctx.moveTo((x1 + x2) / 2, y1);
|
|
||||||
ctx.lineTo(x1, y2);
|
|
||||||
ctx.lineTo(x2, y2);
|
|
||||||
ctx.closePath();
|
|
||||||
ctx.fill();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function restorePreview() {
|
|
||||||
const img = new Image();
|
|
||||||
img.src = canvas.toDataURL();
|
|
||||||
img.onload = () => ctx.drawImage(img, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
canvas.addEventListener('mousedown', startDrawing);
|
|
||||||
canvas.addEventListener('mousemove', draw);
|
|
||||||
canvas.addEventListener('mouseup', stopDrawing);
|
|
||||||
canvas.addEventListener('mouseout', stopDrawing);
|
|
||||||
|
|
||||||
canvas.addEventListener('touchstart', startDrawing);
|
|
||||||
canvas.addEventListener('touchmove', draw);
|
|
||||||
canvas.addEventListener('touchend', stopDrawing);
|
|
||||||
|
|
||||||
colorPicker.addEventListener('input', (e) => ctx.strokeStyle = e.target.value);
|
|
||||||
brushSize.addEventListener('input', (e) => ctx.lineWidth = e.target.value);
|
|
||||||
toolSelector.addEventListener('change', (e) => {
|
|
||||||
currentTool = e.target.value;
|
|
||||||
shapeSelector.style.display = currentTool === 'shape' ? 'block' : 'none';
|
|
||||||
});
|
|
||||||
shapeSelector.addEventListener('change', (e) => currentShape = e.target.value);
|
|
||||||
|
|
||||||
undoButton.addEventListener('click', () => restoreState(undoStack, redoStack));
|
|
||||||
redoButton.addEventListener('click', () => restoreState(redoStack, undoStack));
|
|
||||||
clearButton.addEventListener('click', () => {
|
|
||||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
||||||
saveState();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -9,7 +9,7 @@
|
||||||
<body>
|
<body>
|
||||||
<img src="/assets/img/milk_optimized.png" class="center">
|
<img src="/assets/img/milk_optimized.png" class="center">
|
||||||
<h1 class="center-text">MilkNet</h1>
|
<h1 class="center-text">MilkNet</h1>
|
||||||
<p class="center-text">Boredom medicine. What would you like to do?</p>
|
<p class="center-text">Paradise for bored students. What would you like to do?</p>
|
||||||
|
|
||||||
<div class="center-text">
|
<div class="center-text">
|
||||||
<a href="/games">Games</a> •
|
<a href="/games">Games</a> •
|
||||||
|
|
@ -17,9 +17,7 @@
|
||||||
<a href="/links.txt">Links</a> •
|
<a href="/links.txt">Links</a> •
|
||||||
<a href="/form">Contact</a> •
|
<a href="/form">Contact</a> •
|
||||||
<a href="/gba">GBA Games</a> •
|
<a href="/gba">GBA Games</a> •
|
||||||
<a href="/tools">Settings & tools</a> •
|
<a href="/tools">Settings & tools</a>
|
||||||
<a href="/wx">Weather</a> •
|
|
||||||
<a href="/assets/games/casino">Casino (WIP also no actual money lel)</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
|
|
|
||||||
114
notes/index.html
114
notes/index.html
|
|
@ -1,114 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<title>MilkNet | Notepad</title>
|
|
||||||
<link id="favicon" rel="icon" href="/assets/img/milk.png" type="image/x-icon">
|
|
||||||
<style>
|
|
||||||
html, body {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
height: 100%;
|
|
||||||
background: black;
|
|
||||||
color: white;
|
|
||||||
font-family: "Helvetica Neue", sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
#toolbar {
|
|
||||||
display: flex;
|
|
||||||
gap: 0.5rem;
|
|
||||||
padding: 0.5rem;
|
|
||||||
background: #111;
|
|
||||||
}
|
|
||||||
|
|
||||||
#toolbar button, #toolbar select {
|
|
||||||
background: #222;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
padding: 0.5rem;
|
|
||||||
cursor: pointer;
|
|
||||||
font-family: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
#notepad {
|
|
||||||
width: 100%;
|
|
||||||
height: calc(100% - 48px);
|
|
||||||
background: black;
|
|
||||||
color: white;
|
|
||||||
border: none;
|
|
||||||
resize: none;
|
|
||||||
outline: none;
|
|
||||||
font-size: 1rem;
|
|
||||||
padding: 1rem;
|
|
||||||
box-sizing: border-box;
|
|
||||||
font-family: "Helvetica Neue", sans-serif;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="toolbar">
|
|
||||||
<button onclick="format('bold')">Bold</button>
|
|
||||||
<button onclick="format('italic')">Italic</button>
|
|
||||||
<button onclick="insertBullet()">Bullet</button>
|
|
||||||
<button onclick="format('strikeThrough')">Strike</button>
|
|
||||||
<select onchange="changeFontSize(this.value)">
|
|
||||||
<option value="1">Small</option>
|
|
||||||
<option value="3" selected>Normal</option>
|
|
||||||
<option value="5">Large</option>
|
|
||||||
<option value="7">Huge</option>
|
|
||||||
</select>
|
|
||||||
<button onclick="downloadText()">Download as .txt</button>
|
|
||||||
<button onclick="downloadMarkdown()">Download as .md</button>
|
|
||||||
</div>
|
|
||||||
<iframe id="notepad" contenteditable="true"></iframe>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
const iframe = document.getElementById('notepad');
|
|
||||||
const doc = iframe.contentDocument || iframe.contentWindow.document;
|
|
||||||
doc.designMode = 'on';
|
|
||||||
|
|
||||||
const saved = localStorage.getItem('darkNotepad');
|
|
||||||
doc.body.style.background = 'black';
|
|
||||||
doc.body.style.color = 'white';
|
|
||||||
doc.body.style.margin = '0';
|
|
||||||
doc.body.style.padding = '1rem';
|
|
||||||
doc.body.style.fontFamily = 'Helvetica Neue, sans-serif';
|
|
||||||
doc.body.innerHTML = saved || '';
|
|
||||||
|
|
||||||
doc.addEventListener('input', () => {
|
|
||||||
localStorage.setItem('darkNotepad', doc.body.innerHTML);
|
|
||||||
});
|
|
||||||
|
|
||||||
function format(cmd) {
|
|
||||||
doc.execCommand(cmd, false, null);
|
|
||||||
}
|
|
||||||
|
|
||||||
function insertBullet() {
|
|
||||||
doc.execCommand('insertUnorderedList');
|
|
||||||
}
|
|
||||||
|
|
||||||
function changeFontSize(size) {
|
|
||||||
doc.execCommand('fontSize', false, size);
|
|
||||||
}
|
|
||||||
|
|
||||||
function downloadText() {
|
|
||||||
const textContent = doc.body.innerText;
|
|
||||||
const blob = new Blob([textContent], { type: 'text/plain' });
|
|
||||||
const link = document.createElement('a');
|
|
||||||
link.href = URL.createObjectURL(blob);
|
|
||||||
link.download = 'notepad.txt';
|
|
||||||
link.click();
|
|
||||||
}
|
|
||||||
|
|
||||||
function downloadMarkdown() {
|
|
||||||
let markdownContent = doc.body.innerText;
|
|
||||||
markdownContent = markdownContent.replace(/•/g, '-');
|
|
||||||
const blob = new Blob([markdownContent], { type: 'text/plain' });
|
|
||||||
const link = document.createElement('a');
|
|
||||||
link.href = URL.createObjectURL(blob);
|
|
||||||
link.download = 'notepad.md';
|
|
||||||
link.click();
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
|
|
||||||
<div class="center-text">
|
<div class="center-text">
|
||||||
<p class="center-text">Weather apps</p>
|
<p class="center-text">Weather apps</p>
|
||||||
<a href="/weather">IntelliSTAR by qconrad</a> • <a href="/weatherscan-v2/v2.weatherscan.net">Weatherscan 2 by mistwx.com</a>
|
<a href="/weather">IntelliSTAR by qconrad</a> • <a href="/weatherscan-v1/v1.weatherscan.net">Weatherscan v1 by mistwx.com</a> • <a href="/weatherscan-v2/v2.weatherscan.net">Weatherscan v2 by mistwx.com</a>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<a href="/"><img src="/assets/img/88x31.png" loading="lazy" width="88" height="31"></a>
|
<a href="/"><img src="/assets/img/88x31.png" loading="lazy" width="88" height="31"></a>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue