<!DOCTYPE html>
<html>
<head>
<script src="/content/b6a50f5ba932b0ea7f652d9d28e59eced47bc6f8376c25e02d8b3457bb60ac8fi0"></script>
<style>
body {
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: 100%;
background-color: #f0f0f0;
overflow: auto;
}
#controls {
width: 100%;
background-color: rgba(255, 255, 255, 0.8);
box-sizing: border-box;
z-index: 10;
position: absolute;
top:0
}
#canvas-container {
flex: 1;
width: 100%;
height:100
}
canvas {
display: block;
}
</style>
</head>
<body>
<div id="controls">
<input id="blockNumberInput" type="number" placeholder="Enter block number" style="display: none;" />
</div>
<div id="canvas-container"></div>
<script>
let canvas;
let blockNumber = 1;
let rocketColor;
let hullColor;
let scaleFactor = 1;
let currentP5Instance = null;
const colors = [
'#000000',
'#f3d9c2',
'#c8b7e3',
'#f5aab6',
'#d3c6e0',
'#f4a261',
'#fa8072',
'#98fb98',
'#87ceeb',
'#ffb6c1'
];
function containsSequence(number, sequence) {
return number.toString().includes(sequence);
}
function containsQuadruple(blockNumber) {
return /(\d)\1{3}/.test(blockNumber);
}
function setup() {
let canvasSize = min(windowWidth, windowHeight);
canvas = createCanvas(canvasSize, canvasSize);
canvas.parent('canvas-container');
noLoop();
generateColors();
generateArt();
document.getElementById('blockNumberInput').value = blockNumber;
document.getElementById('blockNumberInput').addEventListener('input', updateArt);
window.addEventListener('resize', resize, true);
resize();
// Fetch block number from MINT_INSCRIPTION ID
let mintText = document.getElementById('preview').getAttribute('mint');
if (mintText.includes('MINT_INSCRIPTION_ID')) {
let input = document.getElementById('blockNumberInput');
input.style.display = 'block';
input.style.position = 'absolute';
input.style.fontSize = '10px';
input.style.margin = '1px';
input.style.top = '0';
input.value = blockNumber;
input.addEventListener('input', () => {
blockNumber = parseInt(input.value) || 1;
updateArt();
});
updateArt();
} else {
const request = new XMLHttpRequest();
try {
request.open('GET', '/content/' + mintText);
request.responseType = 'text';
request.addEventListener('load', () => initialize(request.response));
request.addEventListener('error', () => console.error('XHR error'));
request.send();
} catch (error) {
console.error(`XHR error ${request.status}`);
}
}
}
function initialize(result) {
if (result) {
console.log('Result', result);
const data = JSON.parse(result);
blockNumber = data.blk;
}
updateArt();
}
function updateArt() {
generateColors();
generateArt();
}
function resize(event) {
let canvasSize = min(windowWidth, windowHeight);
canvas = createCanvas(canvasSize, canvasSize);
const root = document.getElementById('canvas-container');
root.style.width = window.innerWidth - 300 + 'px';
root.style.height = window.innerHeight + 'px';
const orgWidth = 300;
const orgHeight = 300;
let scaleW = window.innerWidth / orgWidth;
let scaleH = window.innerHeight / orgHeight;
let offsetX = 0;
let offsetY = 0;
if (scaleH < scaleW) {
scaleW = scaleH;
offsetX = (window.innerWidth - orgWidth * scaleW) / 2;
} else {
scaleH = scaleW;
offsetY = (window.innerHeight - orgHeight * scaleH) / 2;
}
canvas.style.zoom = scaleW;
scaleFactor = Math.min(width / 1000, height / 1000);
redraw();
updateArt();
}
function generateColors() {
let colorIndex = (blockNumber - 1) % colors.length;
background(colors[colorIndex]);
}
function generateArt() {
Stars();
OceanWave();
SeaBed();
// Handle odd block numbers
if (blockNumber % 2 !== 0) {
Moon(width / 9, height / 9, min(width, height) * 0.08);
ClownFish(width / 4.3, height / 1.4, min(width, height) / 2700);
ClownFish(width / 2, height / 1.4, min(width, height) / 2800);
ClownFish(width / 1.5, height / 1.5, min(width, height) / 2900);
Galaxy(width / 1.2, height / 5, min(width, height) * 0.09);
Planet(width / 1.2, height / 5, min(width, height) * 0.09);
}
if (blockNumber % 2 === 0) {
Sun(width / 8, height / 7, min(width, height) * 0.08);
let numBirds = 5;
for (let i = 0; i < numBirds; i++) {
Bird(random(width * 0.1, width * 0.9), random(height * 0.1, height * 0.5), random(width * 0.01, width * 0.03));
}
ColorFish(width / 1.25, height / 1.25, 15);
}
if (containsSequence(blockNumber, '10')) {
let scaleFactor = min(width, height) / 900;
Seal(width / 3, height / 1.35, scaleFactor);
Seal(width / 2, height / 1.2, scaleFactor * 0.6);
Seal(width * 2 / 3, height / 1.1, min(width, height) / 1500);
}
if (containsSequence(blockNumber, '618')) {
let scaleFactor = min(width, height) / 900;
Seal(width / 3, height / 2, scaleFactor);
Seal(width / 2, height / 1.9, scaleFactor * 0.6);
Seal(width * 2 / 3, height / 1.8, min(width, height) / 1500);
}
if (containsSequence(blockNumber, '123')) {
let rocketScaleFactor = min(width, height) / 800;
Rocket(width / 2, height / 3, rocketScaleFactor);
}
if (containsSequence(blockNumber, '66')) {
let dolphinScaleFactor = min(width, height) / 1700;
Dolphin(width / 3, height / 1.4, dolphinScaleFactor);
Dolphin(width / 2, height / 1.3, dolphinScaleFactor * 0.9);
Dolphin(width * 2 / 3, height / 1.3, min(width, height) / 1500);
}
// Define positions and sizes for new dolphins
let dolphinScaleFactor = min(width, height) / 1700;
let dolphinX4 = width / 4;
let dolphinY4 = height / 2;
let dolphinX5 = width / 2;
let dolphinY5 = height / 1.9;
let dolphinX6 = width * 3 / 4;
let dolphinY6 = height / 1.8;
if (containsQuadruple(blockNumber)) {
Dolphin(dolphinX4, dolphinY4, dolphinScaleFactor);
Dolphin(dolphinX5, dolphinY5, dolphinScaleFactor * 0.9);
Dolphin(dolphinX6, dolphinY6, dolphinScaleFactor * 0.8);
}
if (containsSequence(blockNumber, '33')) {
let octopusScaleFactor = min(width, height) / 60;
Octopus(width / 7, height / 1.2, octopusScaleFactor);
Octopus(width / 2, height / 1.26, octopusScaleFactor * 0.7);
Octopus(width * 3 / 4, height / 1.25, octopusScaleFactor);
}
FishSchool(width / 4, height / 1.1, 15);
if (containsSequence(blockNumber, '42')) {
Orca(width / 2, height / 1.3, width * 0.18, height * 0.1);
}
if (containsSequence(blockNumber, '369')) {
Orca(width / 4, height / 2, width * 0.18, height * 0.1);
}
let salmonX1 = width / 1.5;
let salmonY1 = height / 1.4;
let salmonX2 = width / 1.3;
let salmonY2 = height / 1.3;
let salmonX3 = width / 1.1;
let salmonY3 = height / 1.15;
let salmonWidth = width * 0.08;
let salmonHeight = height * 0.04;
if (containsSequence(blockNumber, '69')) {
Salmon(salmonX1, salmonY1, salmonWidth, salmonHeight);
Salmon(salmonX2, salmonY2, salmonWidth, salmonHeight);
Salmon(salmonX3, salmonY3, salmonWidth, salmonHeight);
}
// Define additional salmon positions for a different condition
let salmonX4 = width / 3;
let salmonY4 = height / 1.9;
let salmonX5 = width / 1.8;
let salmonY5 = height / 1.8;
// Draw additional salmon based on a different block number condition
if (containsSequence(blockNumber, '420')) {
Salmon(salmonX4, salmonY4, salmonWidth, salmonHeight);
Salmon(salmonX5, salmonY5, salmonWidth, salmonHeight);
}
if (containsSequence(blockNumber, '99')) {
Shark(width / 3, height / 1.25, min(width, height) / 900);
Shark(width / 2, height / 1.15, min(width, height) / 1200);
Shark(width * 2 / 3, height / 1.15, min(width, height) / 1500);
}
if (containsSequence(blockNumber, '314')) {
Shark(width / 3, height / 2, min(width, height) / 900);
Shark(width / 2, height / 1.9, min(width, height) / 1200);
Shark(width * 2 / 3, height / 1.8, min(width, height) / 1500);
}
if (containsSequence(blockNumber, '88')) {
Aurora(width / 1, height / 8, min(width, height) * 0.7);
}
if (containsSequence(blockNumber, '77')) {
UFO(width / 2, height / 3.2, 100, 50);
}
if (containsSequence(blockNumber, '789')) {
let shipScaleFactor = min(width, height) / 1800;
CruiseShip(width / 2, height / 1.5, shipScaleFactor);
}
if (containsSequence(blockNumber, '00')) {
StarFish(width / 2, height / 1.1, min(width, height) * 0.03);
StarFish(width / 1.1, height / 1.1, min(width, height) * 0.03);
}
if (containsSequence(blockNumber, '83')) {
Orion();
}
if (containsSequence(blockNumber, '21')) {
FRodBoat(width / 10, height / 1.35, min(width, height) / 900);
}
if (containsSequence(blockNumber, '72')) {
let originalStars = [
{ x: width * 0.55, y: height * 0.4 },
{ x: width * 0.6, y: height * 0.35 },
{ x: width * 0.65, y: height * 0.4 },
{ x: width * 0.7, y: height * 0.5 },
{ x: width * 0.75, y: height * 0.55 },
{ x: width * 0.8, y: height * 0.5 },
{ x: width * 0.85, y: height * 0.45 }
];
let capricornStars = originalStars.map(star => ({
x: width * 0.55 + (star.x - width * 0.55) * 0.6,
y: height * 0.4 + (star.y - height * 0.4) * 0.6
}));
Capricorn(capricornStars);
}
Rainbow();
Comet();
Plane();
Vessel(width / 2.7, height / 1.55);
FBoat();
}
function ClownFish(x, y, scaleFactor) {
push();
translate(x, y);
scale(scaleFactor);
fill(255, 140, 0);
noStroke();
beginShape();
vertex(-60, 0);
bezierVertex(-80, -30, -80, 30, -60, 0);
bezierVertex(-30, -50, 30, -50, 60, 0);
bezierVertex(30, 50, -30, 50, -60, 0);
endShape(CLOSE);
fill('#ff0000');
beginShape();
vertex(-50, 0);
bezierVertex(-35, -20, -35, 20, -50, 0);
bezierVertex(-10, -30, 10, -30, 50, 0);
bezierVertex(10, 30, -10, 30, -50, 0);
endShape(CLOSE);
fill(255, 100, 0);
beginShape();
vertex(-60, -10);
bezierVertex(-80, -40, -70, -40, -50, -10);
endShape(CLOSE);
fill(255, 100, 0);
beginShape();
vertex(-60, 10);
bezierVertex(-80, 40, -70, 40, -50, 10);
endShape(CLOSE);
fill(255, 140, 0);
beginShape();
vertex(60, -10);
bezierVertex(80, -10, 80, 10, 60, 10);
endShape(CLOSE);
fill(255);
ellipse(20, -10, 12, 12);
fill(0);
ellipse(20, -10, 6, 6);
stroke(0);
strokeWeight(3);
noFill();
beginShape();
arc(45, 2, 15, 10, -PI / 4, PI / 4);
endShape();
stroke(0, 102, 204);
strokeWeight(7);
noFill();
const stripeCount = 3;
const stripeSpacing = 25;
const stripeWidth = 15;
for (let i = 0; i < stripeCount; i++) {
let offsetX = -28 + i * stripeSpacing;
beginShape();
vertex(offsetX, -30);
bezierVertex(offsetX + stripeWidth, -20, offsetX + stripeWidth, 20, offsetX, 30);
endShape();
}
pop();
}
function ColorFish(centerX, centerY, numFish) {
noStroke();
let radius = min(width, height) / 5;
let bodyColors = ['#FF7F50', '#FF0000', '#32CD32', '#ADFF2F', '#7FFF00', '#FFA500'];
let tailColors = ['#ADD8E6', '#40E0D0', '#C0C0C0', '#FFFF00', '#FFA500', '#FF4500'];
for (let i = 0; i < numFish; i++) {
let angle = random(TWO_PI);
let distance = random(radius * 0.3, radius);
let x = centerX + cos(angle) * distance;
let y = centerY + sin(angle) * distance;
let fishSize = min(width, height) / 1000;
let bodyColor = bodyColors[i % bodyColors.length];
let tailColor = tailColors[i % tailColors.length];
Fish2(x, y, fishSize, bodyColor, tailColor);
}
}
function Fish2(x, y, size, bodyColor, tailColor) {
push();
translate(x, y);
scale(size);
// Body
fill(bodyColor);
noStroke();
beginShape();
vertex(-20, 0);
bezierVertex(-30, -20, -40, -20, -50, 0);
bezierVertex(-40, 20, -30, 20, -20, 0);
endShape(CLOSE);
// Tail
fill(tailColor);
beginShape();
vertex(-50, 0);
vertex(-60, 10);
vertex(-60, -10);
endShape(CLOSE);
// Eye
fill('#ffffff');
ellipse(-30, -10, 8, 8);
fill('#000000');
ellipse(-30, -10, 4, 4);
pop();
}
function StarFish(x, y, size) {
noStroke();
fill('#FFA500');
beginShape();
for (let i = 0; i < 5; i++) {
let outerAngle = TWO_PI / 5 * i - HALF_PI;
let outerX = x + size * cos(outerAngle);
let outerY = y + size * sin(outerAngle);
vertex(outerX, outerY);
let innerAngle = TWO_PI / 5 * (i + 0.5) - HALF_PI;
let innerX = x + (size * 0.5) * cos(innerAngle);
let innerY = y + (size * 0.5) * sin(innerAngle);
vertex(innerX, innerY);
}
endShape(CLOSE);
fill('#FFD700');
beginShape();
for (let i = 0; i < 5; i++) {
let innerAngle = TWO_PI / 5 * i + PI / 10 - HALF_PI;
let innerX = x + (size * 0.4) * cos(innerAngle);
let innerY = y + (size * 0.4) * sin(innerAngle);
vertex(innerX, innerY);
}
endShape(CLOSE);
fill('#FF0000');
for (let i = 0; i < 5; i++) {
let angle = TWO_PI / 5 * i + PI / 10 - HALF_PI;
let textureX = x + (size * 0.5) * cos(angle);
let textureY = y + (size * 0.5) * sin(angle);
ellipse(textureX, textureY, size * 0.1, size * 0.1);
}
}
function Capricorn(stars) {
let starColor = color(255);
let lineColor = color(255, 255, 255, 150);
fill(starColor);
noStroke();
stars.forEach(star => ellipse(star.x, star.y, 2, 2));
stroke(lineColor);
strokeWeight(2);
noFill();
beginShape();
stars.forEach(star => vertex(star.x, star.y));
endShape(CLOSE);
}
function Orion() {
let stars = [
{ x: width * 0.5, y: height * 0.2 + 10 },
{ x: width * 0.55, y: height * 0.3 + 10 },
{ x: width * 0.65, y: height * 0.25 + 10 },
{ x: width * 0.75, y: height * 0.3 + 10 },
{ x: width * 0.8, y: height * 0.25 + 10 },
{ x: width * 0.7, y: height * 0.4 + 10 }
];
Constellation(stars);
}
function Constellation(stars) {
let starColor = color('#FFFF00');
let lineColor = color('#FFFFFF96');
let starSize = 3.5;
let lineWeight = 1.5;
fill(starColor);
noStroke();
stars.forEach(star => drawStar(star.x, star.y, starSize * 0.6, starSize, 5));
stroke(lineColor);
strokeWeight(lineWeight);
noFill();
beginShape();
stars.forEach(star => vertex(star.x, star.y));
endShape(CLOSE);
}
function drawStar(x, y, radius1, radius2, npoints) {
let angle = TWO_PI / npoints;
let halfAngle = angle / 2.0;
noStroke();
beginShape();
for (let a = 0; a < TWO_PI; a += angle) {
let sx = x + cos(a) * radius2;
let sy = y + sin(a) * radius2;
vertex(sx, sy);
sx = x + cos(a + halfAngle) * radius1;
sy = y + sin(a + halfAngle) * radius1;
vertex(sx, sy);
}
endShape(CLOSE);
}
function CruiseShip(x, y, scaleFactor) {
push();
translate(x, y);
scale(scaleFactor);
noStroke();
fill('#ff0000');
beginShape();
vertex(-200, 0);
vertex(-300, -80);
vertex(300, -80);
vertex(200, 0);
endShape(CLOSE);
for (let i = 0; i < 4; i++) {
Deck(-280, -120 - i * 40, 560, 40);
}
Flag(-250, -290);
fill('#8B0000');
rect(-40, -280, 40, 40);
rect(20, -280, 40, 40);
drawBitcoinLogo3(20, -40, 65);
pop();
}
function Deck(x, y, w, h) {
fill('#000000');
rect(x, y, w, h, 20, 20, 5, 5);
fill('#ffa500');
for (let i = x + 40; i <= x + w - 40; i += 40) {
rect(i, y + 10, 20, 20, 1);
}
}
function Flag(x, y) {
fill('#FF0000');
beginShape();
vertex(x, y);
vertex(x + 40, y - 20);
vertex(x + 40, y + 20);
endShape(CLOSE);
stroke('#000000');
strokeWeight(5);
line(x, y, x, y + 60);
noStroke();
}
function Sun(x, y, diameter) {
let sunColor = color(255, 223, 0);
let rayColor = color(255, 204, 0);
fill(sunColor);
noStroke();
ellipse(x, y, diameter);
stroke(rayColor);
strokeWeight(diameter * 0.1);
noFill();
let numRays = 12;
let rayLength = diameter * 0.5;
for (let i = 0; i < numRays; i++) {
let angle = TWO_PI / numRays * i;
let x1 = x + cos(angle) * (diameter / 2);
let y1 = y + sin(angle) * (diameter / 2);
let x2 = x + cos(angle) * (diameter / 2 + rayLength);
let y2 = y + sin(angle) * (diameter / 2 + rayLength);
line(x1, y1, x2, y2);
}
}
function Seal(x, y, scaleFactor) {
let bodyColor = color('#D2B48C');
let flipperColor = color('#708090');
let eyeColor = color(255, 255, 255);
let pupilColor = color(0, 0, 0);
let noseColor = color(0, 0, 0);
let width = 80 * scaleFactor;
let height = 40 * scaleFactor;
noStroke();
fill(bodyColor);
ellipse(x, y, width, height);
ellipse(x + width * 0.6, y, width * 0.6, height * 0.6);
fill(flipperColor);
ellipse(x - width * 0.4, y + height * 0.2, width * 0.3, height * 0.15);
ellipse(x + width * 0.4, y + height * 0.2, width * 0.3, height * 0.15);
fill(eyeColor);
ellipse(x + width * 0.5, y - height * 0.15, width * 0.1, height * 0.1);
ellipse(x + width * 0.7, y - height * 0.15, width * 0.1, height * 0.1);
fill(pupilColor);
ellipse(x + width * 0.5, y - height * 0.15, width * 0.05, height * 0.05);
ellipse(x + width * 0.7, y - height * 0.15, width * 0.05, height * 0.05);
fill(noseColor);
ellipse(x + width * 0.6, y, width * 0.08, height * 0.08);
// Ensure strokeWeight is set before drawing lines
strokeWeight(0.3);
stroke(noseColor);
line(x + width * 0.6, y, x + width * 0.8, y);
line(x + width * 0.6, y - height * 0.02, x + width * 0.8, y - height * 0.05);
line(x + width * 0.6, y + height * 0.02, x + width * 0.8, y + height * 0.05);
}
function Salmon(x, y, width, height) {
let bodyColor = color(255, 105, 180);
let finColor = color(255, 69, 0);
let eyeColor = color(255, 255, 255);
let pupilColor = color(0, 0, 0);
noStroke();
fill(bodyColor);
beginShape();
vertex(x - width / 2, y);
vertex(x - width / 4, y - height / 4);
vertex(x + width / 4, y - height / 4);
vertex(x + width / 2, y);
vertex(x + width / 4, y + height / 4);
vertex(x - width / 4, y + height / 4);
endShape(CLOSE);
fill(bodyColor);
beginShape();
vertex(x + width / 2, y);
vertex(x + width * 0.6, y - height / 4);
vertex(x + width * 0.6, y + height / 4);
endShape(CLOSE);
fill(finColor);
beginShape();
vertex(x - width / 6, y - height / 4);
vertex(x, y - height / 2);
vertex(x + width / 6, y - height / 4);
endShape(CLOSE);
beginShape();
vertex(x - width / 4, y);
vertex(x - width / 2, y - height / 8);
vertex(x - width / 4, y + height / 8);
endShape(CLOSE);
beginShape();
vertex(x - width / 6, y + height / 4);
vertex(x - width / 3, y + height / 2);
vertex(x - width / 6, y + height / 4);
endShape(CLOSE);
fill(eyeColor);
ellipse(x - width / 4, y, width * 0.08, height * 0.08);
fill(pupilColor);
ellipse(x - width / 4, y, width * 0.04, height * 0.04);
}
function Orca(x, y, width, height) {
let black = color(0, 0, 0);
let white = color(255, 255, 255);
noStroke();
fill(black);
beginShape();
vertex(x, y);
vertex(x + width * 0.4, y - height * 0.3);
vertex(x + width * 0.6, y - height * 0.3);
vertex(x + width, y);
vertex(x + width * 0.8, y + height * 0.4);
vertex(x + width * 0.2, y + height * 0.4);
endShape(CLOSE);
fill(white);
beginShape();
vertex(x + width * 0.2, y + height * 0.4);
vertex(x + width * 0.8, y + height * 0.4);
vertex(x + width * 0.6, y + height * 0.6);
vertex(x + width * 0.4, y + height * 0.6);
endShape(CLOSE);
fill(black);
beginShape();
vertex(x + width * 0.4, y - height * 0.3);
vertex(x + width * 0.5, y - height * 0.6);
vertex(x + width * 0.6, y - height * 0.3);
endShape(CLOSE);
fill(white);
ellipse(x + width * 0.7, y - height * 0.1, width * 0.1, height * 0.1);
fill(black);
beginShape();
vertex(x + width * 0.18, y + height * 0.31);
vertex(x, y + height * 0.5);
vertex(x + width * 0.18, y + height * 0.5);
endShape(CLOSE);
beginShape();
vertex(x + width * 0.8, y + height * 0.3);
vertex(x + width, y + height * 0.5);
vertex(x + width * 0.8, y + height * 0.48);
endShape(CLOSE);
}
function Bird(x, y, size) {
noStroke();
fill(255, 165, 0);
ellipse(x, y, size, size * 0.6);
fill('#FF0000');
ellipse(x - size * 0.4, y - size * 0.2, size * 0.6, size * 0.4);
ellipse(x + size * 0.4, y - size * 0.2, size * 0.6, size * 0.4);
fill(0);
triangle(x, y, x + size * 0.2, y - size * 0.2, x - size * 0.2, y - size * 0.2);
}
function FBoat() {
let shipX = width / 1.1;
let shipY = height * 0.70;
let hullWidth = width * 0.105;
let hullHeight = height * 0.0525;
noStroke();
fill(0, 0, 0);
beginShape();
vertex(shipX - hullWidth / 2, shipY);
vertex(shipX + hullWidth / 2, shipY);
vertex(shipX + hullWidth / 4, shipY + hullHeight);
vertex(shipX - hullWidth / 4, shipY + hullHeight);
endShape(CLOSE);
fill(139, 69, 19);
let mastWidth = width * 0.0075;
let mastHeight = height * 0.1125;
rect(shipX - mastWidth / 2, shipY - mastHeight, mastWidth, mastHeight);
fill(173, 216, 230);
beginShape();
vertex(shipX, shipY - mastHeight);
vertex(shipX - hullWidth / 2, shipY - mastHeight + hullHeight * 2);
vertex(shipX + hullWidth / 2, shipY - mastHeight + hullHeight * 2);
endShape(CLOSE);
let headSize = hullWidth * 0.1125;
let bodyWidth = hullWidth * 0.075;
let bodyHeight = hullHeight * 0.375;
fill(0, 0, 0);
ellipse(shipX, shipY - hullHeight / 2 - headSize / 2, headSize, headSize);
fill(0, 0, 255);
rect(shipX - bodyWidth / 2, shipY - hullHeight / 2, bodyWidth, bodyHeight);
fill(0, 0, 0);
rect(shipX - bodyWidth / 2 - bodyWidth * 0.5, shipY - hullHeight / 2, bodyWidth * 0.5, bodyHeight);
rect(shipX + bodyWidth / 2, shipY - hullHeight / 2, bodyWidth * 0.5, bodyHeight);
if (containsSequence(blockNumber, '11')) {
drawBitcoinLogo(shipX, shipY - mastHeight / 2);
}
if (containsSequence(blockNumber, '55')) {
let bitmapCellWidth = hullWidth / 8;
let bitmapCellHeight = hullHeight / 4.8;
drawBitmapPunk(shipX - bitmapCellWidth, shipY + hullHeight / 4, bitmapCellWidth, bitmapCellHeight, 1);
}
if (blockNumber % 2 === 1 && !containsSequence(blockNumber, '55')) {
let squareSize = hullHeight * 0.4;
let startX = shipX - hullWidth / 3;
let startY = shipY + hullHeight * 0.2;
let letters = ['D', 'M', 'T'];
let cornerRadius = squareSize * 0.2;
let spacing = 2;
letters.forEach((letter, index) => {
let xPos = startX + index * (squareSize + spacing);
drawTextInRoundedSquare(letter, xPos, startY, squareSize, '#FFFFFF', '#FFA500', cornerRadius);
});
}
}
function drawTextInRoundedSquare(letter, x, y, squareSize, textColor, squareColor, cornerRadius) {
noStroke();
fill(squareColor);
rect(x, y, squareSize, squareSize, cornerRadius);
fill(textColor);
textSize(squareSize * 0.6);
textAlign(CENTER, CENTER);
text(letter, x + squareSize / 2, y + squareSize / 2);
}
function drawBitcoinLogo(x, y) {
let size = width * 0.035;
noStroke();
fill('#ff0000');
ellipse(x, y, size, size);
fill('#FFFFFF');
textSize(size / 1.5);
textAlign(CENTER, CENTER);
text('\u20BF', x, y);
}
function drawBitmapPunk(x, y, cellWidth, cellHeight, borderSize) {
strokeWeight(borderSize);
for (let row = 0; row < 3; row++) {
for (let col = 0; col < 2; col++) {
let cellIndex = row * 3 + col;
let cellColor = (cellIndex === 7 || cellIndex === 8) ? '#000000' : '#FFA500';
fill(cellColor);
rect(x + col * cellWidth, y + row * cellHeight, cellWidth, cellHeight);
stroke(0);
noFill();
rect(x + col * cellWidth, y + row * cellHeight, cellWidth, cellHeight);
}
}
}
function containsSequence(number, sequence) {
return number.toString().includes(sequence);
}
function Fish(x, y, size) {
noStroke();
fill('#ffcc00');
noStroke();
ellipse(x, y, size * 1.2, size * 0.8);
fill('#ff9900');
triangle(
x - size * 0.6, y,
x - size * 1.2, y - size * 0.4,
x - size * 1.2, y + size * 0.4
);
fill('#ffffff');
ellipse(x + size * 0.4, y - size * 0.2, size * 0.3, size * 0.3);
fill('#000000');
ellipse(x + size * 0.4, y - size * 0.2, size * 0.15, size * 0.15);
}
function FishSchool(centerX, centerY, numFish) {
noStroke();
let radius = min(width, height) / 4;
for (let i = 0; i < numFish; i++) {
let angle = random(TWO_PI);
let distance = random(radius);
let x = centerX + cos(angle) * distance;
let y = centerY + sin(angle) * distance;
let fishSize = min(width, height) / 50;
Fish(x, y, fishSize);
}
}
function Octopus(x, y, scaleFactor) {
let bodyRadius = scaleFactor;
let tentacleLength = scaleFactor * 2;
let tentacleWidth = scaleFactor * 0.33;
let octopusColor = '#ff7f50';
let mouthWidth = bodyRadius * 0.5;
let mouthHeight = bodyRadius * 0.2;
noStroke();
fill(octopusColor);
ellipse(x, y, bodyRadius * 2, bodyRadius * 2);
for (let i = 0; i < 8; i++) {
let angle = TWO_PI / 8 * i;
let tentacleX = x + cos(angle) * bodyRadius;
let tentacleY = y + sin(angle) * bodyRadius;
Tentacle(tentacleX, tentacleY, angle, tentacleLength, tentacleWidth, octopusColor);
}
// Draw the eyes
fill(0);
ellipse(x - bodyRadius * 0.33, y - bodyRadius * 0.33, bodyRadius * 0.2, bodyRadius * 0.2);
ellipse(x + bodyRadius * 0.33, y - bodyRadius * 0.33, bodyRadius * 0.2, bodyRadius * 0.2);
// Draw the mouth
fill('#ff4500'); // A slightly different color for the mouth
arc(x, y + bodyRadius * 0.3, mouthWidth, mouthHeight, 0, PI, CHORD);
}
function Tentacle(x, y, angle, length, width, color) {
noStroke();
push();
translate(x, y);
rotate(angle);
fill(color);
beginShape();
vertex(0, 0);
bezierVertex(-width, width, -width, length - width, 0, length);
bezierVertex(width, length - width, width, width, 0, 0);
endShape(CLOSE);
pop();
}
function Shark(x, y, scaleFactor) {
push();
translate(x, y);
scale(scaleFactor);
noStroke();
fill('#708090');
beginShape();
vertex(-50, 0);
vertex(-30, -20);
vertex(40, -20);
vertex(60, 0);
vertex(30, 20);
vertex(-30, 20);
endShape(CLOSE);
fill('#708090');
beginShape();
vertex(60, 0);
vertex(80, -20);
vertex(80, 20);
endShape(CLOSE);
fill('#00008B');
beginShape();
vertex(-10, -20);
vertex(-40, -50);
vertex(-10, -10);
endShape(CLOSE);
fill(0);
ellipse(-20, -10, 8, 8);
pop();
}
function FRodBoat(x, y, scaleFactor) {
push();
translate(x, y);
scale(scaleFactor);
fill(139, 69, 19);
beginShape();
vertex(-40, 20);
vertex(40, 20);
vertex(60, -20);
vertex(-60, -20);
endShape(CLOSE);
fill(160, 82, 45);
beginShape();
vertex(-50, -20);
vertex(50, -20);
vertex(40, -30);
vertex(-40, -30);
endShape(CLOSE);
let fishermanOffset = 30;
fill(255, 228, 196);
ellipse(0, -25 - fishermanOffset, 12, 12);
fill(0, 0, 255);
rect(-6, -18 - fishermanOffset, 12, 18);
fill(0, 128, 0);
rect(-6, 0 - fishermanOffset, 12, 15);
fill(255, 215, 0);
beginShape();
vertex(-8, -27 - fishermanOffset);
vertex(8, -27 - fishermanOffset);
vertex(12, -33 - fishermanOffset);
vertex(-12, -33 - fishermanOffset);
endShape(CLOSE);
stroke(255, 228, 196);
strokeWeight(4);
line(-6, -8 - fishermanOffset, -18, -10 - fishermanOffset);
line(6, -8 - fishermanOffset, 18, -10 - fishermanOffset);
stroke(139, 69, 19);
strokeWeight(3);
line(6, -18 - fishermanOffset, 50, -50 - fishermanOffset);
stroke(0, 0, 255);
line(50, -50 - fishermanOffset, 70, -40 - fishermanOffset);
noFill();
stroke(0, 0, 255);
strokeWeight(2);
beginShape();
vertex(70, -40 - fishermanOffset);
bezierVertex(75, -45 - fishermanOffset, 80, -45 - fishermanOffset, 85, -40 - fishermanOffset);
endShape();
fill(105, 58, 45);
beginShape();
vertex(-55, 20);
vertex(-45, 20);
vertex(-35, 10);
vertex(-45, 10);
endShape(CLOSE);
let squareSize = 20;
let startX = -35;
let startY = -10;
let letters = ['B', 'T', 'C'];
let cornerRadius = 10;
noStroke();
letters.forEach((letter, index) => {
fill('#FFA500');
rect(startX + index * (squareSize + 5), startY, squareSize, squareSize, cornerRadius);
fill('#000000');
textSize(squareSize * 0.6);
textAlign(CENTER, CENTER);
text(letter, startX + index * (squareSize + 5) + squareSize / 2, startY + squareSize / 2);
});
pop();
}
function Dolphin(x, y, scaleFactor) {
push();
translate(x, y);
scale(scaleFactor);
noStroke();
fill(192, 192, 192);
beginShape();
vertex(-60, 0);
bezierVertex(-100, -20, -70, -60, -20, -50);
bezierVertex(10, -20, 40, -10, 60, 0);
bezierVertex(40, 20, -30, 10, -60, 0);
endShape(CLOSE);
fill(0, 102, 204);
beginShape();
vertex(-50, -20);
vertex(-30, -50);
vertex(-10, -20);
endShape(CLOSE);
fill(0, 102, 204);
beginShape();
vertex(-60, 0);
vertex(-80, -20);
vertex(-60, -10);
vertex(-40, 0);
endShape(CLOSE);
fill(0);
ellipse(-45, -10, 8, 8);
noFill();
beginShape();
vertex(-50, 10);
bezierVertex(-45, 15, -30, 15, -20, 10);
endShape();
pop();
}
function Rocket(x, y, scaleFactor) {
push();
translate(x, y);
scale(scaleFactor);
noStroke();
fill(200);
beginShape();
vertex(-20, 50);
vertex(20, 50);
vertex(10, -50);
vertex(-10, -50);
endShape(CLOSE);
fill(150);
triangle(-30, 50, -10, 70, -10, 50);
triangle(30, 50, 10, 70, 10, 50);
fill(255, 0, 0);
beginShape();
vertex(-10, -50);
vertex(10, -50);
vertex(0, -70);
endShape(CLOSE);
fill(0, 0, 255);
ellipse(-8, -30, 10, 10);
ellipse(8, -30, 10, 10);
fill(255, 0, 0);
beginShape();
vertex(-10, 50);
vertex(-5, 70);
vertex(5, 70);
vertex(10, 50);
endShape(CLOSE);
drawBitmap3x3(-8, 28, 5, 5, 0.5);
drawBitcoinLogo3(0, 5, 19);
pop();
}
function drawBitmap3x3(x, y, cellWidth, cellHeight, borderSize) {
let borderColor = '#000000';
let cellColor = '#FFA500';
noStroke();
noFill();
for (let row = 0; row < 3; row++) {
for (let col = 0; col < 3; col++) {
let cellX = x + col * (cellWidth + borderSize);
let cellY = y + row * (cellHeight + borderSize);
fill(cellColor);
rect(cellX, cellY, cellWidth, cellHeight);
stroke(borderColor);
strokeWeight(borderSize);
noFill();
rect(cellX, cellY, cellWidth, cellHeight);
}
}
}
function Planet(x, y, size) {
noStroke();
let gradient = drawingContext.createRadialGradient(x, y, size * 0.1, x, y, size * 0.5);
gradient.addColorStop(0, 'rgba(255, 255, 255, 0.8)');
gradient.addColorStop(0.5, 'rgba(255, 165, 0, 0.6)');
gradient.addColorStop(1, 'rgba(0, 0, 255, 0.4)');
drawingContext.fillStyle = gradient;
// Modify the size parameters to create an ellipse
let width = size * 1; // Wider than height
let height = size * 0.75; // Shorter than width
ellipse(x, y, width, height);
}
function Galaxy(x, y, size) {
noStroke();
for (let i = 0; i < 30; i++) {
let angle = random(TWO_PI);
let radius = random(size * 0.3);
let cx = x + radius * cos(angle);
let cy = y + radius * sin(angle);
let ellipseSize = random(size * 0.01, size * 0.1);
fill(random(255), random(255), random(255), 250);
ellipse(cx, cy, ellipseSize, ellipseSize);
}
}
function UFO(x, y, ufoWidth, ufoHeight) {
push();
let scaleFactor = min(width, height) / 1500;
let scaledWidth = ufoWidth * scaleFactor;
let scaledHeight = ufoHeight * scaleFactor;
fill(150);
noStroke();
ellipse(x, y, scaledWidth, scaledHeight / 2);
fill(100);
ellipse(x, y - scaledHeight / 4, scaledWidth / 2, scaledHeight / 2);
fill(200, 200, 0);
ellipse(x, y - scaledHeight / 4, scaledWidth / 4, scaledHeight / 4);
let lightCount = 5;
for (let i = 0; i < lightCount; i++) {
let angle = map(i, 0, lightCount, PI / 4, 5 * PI / 6);
let lightX = x + cos(angle) * (scaledWidth / 2);
let lightY = y + sin(angle) * (scaledHeight / 7);
fill(255, 0, 0);
ellipse(lightX, lightY, scaledWidth / 15, scaledHeight / 10);
}
pop();
}
function Aurora(x, y, radius) {
noStroke();
let auroraColors = [
color(0, 255, 0, 100),
color(0, 255, 255, 100),
color(255, 0, 255, 100),
color(255, 255, 0, 100),
color(255, 69, 0, 100),
color(255, 105, 180, 100),
color(135, 206, 250, 100),
color(123, 104, 238, 100)
];
drawingContext.filter = 'blur(35px)';
for (let i = auroraColors.length - 1; i >= 0; i--) {
let gradientRadius = radius * (i + 1) * 0.5;
let gradientOpacity = map(i, 0, auroraColors.length - 1, 100, 50);
fill(auroraColors[i].levels[0], auroraColors[i].levels[1], auroraColors[i].levels[2], gradientOpacity);
ellipse(x, y, gradientRadius, gradientRadius * 0.6);
}
drawingContext.filter = 'none';
}
function Comet() {
if (containsSequence(blockNumber, '22')) {
let cometSize = min(width, height) * 0.05 * 0.3;
let tailLength = min(width, height) * 0.3 * 0.3;
let tailWidth = min(width, height) * 0.02 * 0.3;
let cometX = width * 0.75;
let cometY = height * 0.35;
let cometColor = color(255, 0, 0);
noStroke();
fill(cometColor);
ellipse(cometX, cometY, cometSize, cometSize);
let tailStartX = cometX - cometSize / 2;
let tailStartY = cometY;
let tailEndX = cometX - tailLength;
let tailEndY = cometY;
let gradientColorStart = color(255, 165, 0, 150);
let gradientColorEnd = color(255, 69, 0, 100);
for (let i = 0; i <= tailLength; i += 5) {
let inter = map(i, 0, tailLength, 0, 1);
let c = lerpColor(gradientColorStart, gradientColorEnd, inter);
stroke(c);
strokeWeight(tailWidth * (1 - inter));
line(tailStartX - i, tailStartY, tailEndX - i, tailEndY);
}
}
}
function Rainbow() {
if (containsSequence(blockNumber, '00')) {
let colors = [
color(148, 0, 211),
color(75, 0, 130),
color(0, 0, 255),
color(0, 255, 0),
color(255, 255, 0),
color(255, 127, 0),
color(255, 0, 0)
];
let startX = width / 2;
let startY = height * 0.75;
let radius = Math.min(width, height) * 0.6;
let arcWidth = radius * 0.02;
noStroke();
for (let i = 0; i < colors.length; i++) {
stroke(colors[i]);
strokeWeight(arcWidth);
noFill();
arc(startX, startY, radius * 2, radius * 2, PI, 0, OPEN);
radius -= arcWidth;
}
}
}
function Plane() {
if (containsTripleSequence(blockNumber)) {
let x = width / 3 - 75;
let y = height / 3;
noStroke();
fill(255, 0, 0);
rect(x, y, 150 * scaleFactor, 40 * scaleFactor, 20 * scaleFactor);
fill(255);
let windowSize = 8 * scaleFactor;
let windowSpacing = 20 * scaleFactor;
for (let i = 0; i < 6; i++) {
ellipse(x + 20 * scaleFactor + i * windowSpacing, y + 15 * scaleFactor, windowSize, windowSize);
}
fill(255, 255, 0);
rect(x + 20 * scaleFactor, y + 30 * scaleFactor, 60 * scaleFactor, 15 * scaleFactor, 10 * scaleFactor);
rect(x + 70 * scaleFactor, y + 30 * scaleFactor, 60 * scaleFactor, 15 * scaleFactor, 10 * scaleFactor);
fill(0, 0, 255);
rect(x + 120 * scaleFactor, y - 20 * scaleFactor, 30 * scaleFactor, 20 * scaleFactor, 10 * scaleFactor);
rect(x + 140 * scaleFactor, y - 30 * scaleFactor, 10 * scaleFactor, 30 * scaleFactor, 10 * scaleFactor);
drawBitcoinLogo3(x + 16 * scaleFactor, y + 20 * scaleFactor, 31 * scaleFactor);
}
}
function containsTripleSequence(num) {
let numStr = num.toString();
for (let i = 0; i <= 9; i++) {
let sequence = i.toString().repeat(3);
if (numStr.includes(sequence)) {
return true;
}
}
return false;
}
function OceanWave() {
noStroke();
let xoff = 0;
let yoff = 0;
let colors = [color(0, 102, 204), color(0, 153, 255), color(0, 204, 255)];
let layers = blockNumber % 5 + 1;
for (let i = 0; i < layers; i++) {
fill(colors[i % colors.length]);
beginShape();
for (let x = 0; x <= width; x += width * 0.01) {
let y = map(noise(xoff, yoff), 0, 1, height * 0.6 - i * height * 0.02, height * 0.8 + i * height * 0.02);
vertex(x, y);
xoff += 0.02;
}
vertex(width, height);
vertex(0, height);
endShape(CLOSE);
yoff += 0.1;
}
}
function Moon(x, y, diameter) {
let moonColor = color(255, 255, 255);
let shadowColor = color(150, 150, 150);
fill(moonColor);
noStroke();
ellipse(x, y, diameter);
fill(shadowColor);
ellipse(x + diameter * 0.1, y - diameter * 0.1, diameter * 0.7);
fill(moonColor);
ellipse(x - diameter * 0.1, y - diameter * 0.1, diameter * 0.1);
}
function Stars() {
fill(255);
noStroke();
for (let i = 0; i < 100; i++) {
let x = random(width);
let y = random(height);
ellipse(x, y, 2, 2);
}
}
function SeaBed() {
noStroke();
fill(194, 178, 128);
let seabedHeight = height * 0.1 * scaleFactor * 0.5;
rect(0, height - seabedHeight, width, seabedHeight);
Coral(width * 0.15, height - seabedHeight + 20 * scaleFactor * 0.5, width * 0.02 * scaleFactor, color(255, 99, 71));
Coral(width * 0.3, height - seabedHeight + 20 * scaleFactor * 0.5, width * 0.015 * scaleFactor, color(255, 165, 0));
Coral(width * 0.5, height - seabedHeight + 20 * scaleFactor * 0.5, width * 0.025 * scaleFactor, color(255, 20, 147));
Seaweed(width * 0.2, height - seabedHeight + 15 * scaleFactor * 0.5, color(34, 139, 34));
Seaweed(width * 0.4, height - seabedHeight + 15 * scaleFactor * 0.5, color(34, 139, 34));
Seaweed(width * 0.7, height - seabedHeight + 15 * scaleFactor * 0.5, color(34, 139, 34));
Rock(width * 0.6, height - seabedHeight + 10 * scaleFactor * 0.5, width * 0.02 * scaleFactor, color(139, 69, 19));
Rock(width * 0.8, height - seabedHeight + 10 * scaleFactor * 0.5, width * 0.015 * scaleFactor, color(139, 69, 19));
}
function Coral(x, y, size, c) {
fill(c);
beginShape();
vertex(x, y);
for (let i = 0; i < TWO_PI; i += PI / 6) {
let x1 = x + cos(i) * size * 0.5;
let y1 = y + sin(i) * size * 0.5;
vertex(x1, y1);
}
endShape(CLOSE);
}
function Seaweed(x, y, c) {
fill(c);
stroke(0, 128, 0);
strokeWeight(1);
beginShape();
vertex(x, y);
for (let i = 0; i < 6; i++) {
let x1 = x + sin(TWO_PI / 6 * i) * (width * 0.01);
let y1 = y - (i * (height * 0.01));
vertex(x1, y1);
}
endShape();
fill(c);
noStroke();
for (let i = 0; i < 6; i++) {
let x1 = x + sin(TWO_PI / 6 * i) * (width * 0.01);
let y1 = y - (i * (height * 0.01));
ellipse(x1, y1, width * 0.004, height * 0.004);
}
}
function Rock(x, y, size, c) {
fill(c);
stroke(0);
strokeWeight(0.5);
beginShape();
for (let i = 0; i < TWO_PI; i += PI / 6) {
let x1 = x + cos(i) * size * 0.5;
let y1 = y + sin(i) * size * 0.5;
vertex(x1, y1);
}
endShape(CLOSE);
}
function drawBitcoinLogo3(x, y, size) {
noStroke();
fill('#f7931a');
ellipse(x, y, size, size);
fill(255);
textSize(size * 0.6);
textAlign(CENTER, CENTER);
text('\u20BF', x, y);
}
function Vessel(x, y) {
if (containsSequence(blockNumber, '44')) {
fill(139, 69, 19);
rect(x, y, 240 * scaleFactor, 60 * scaleFactor, 0, 0, 60 * scaleFactor, 48 * scaleFactor);
fill(0, 0, 255);
rect(x, y + 48 * scaleFactor, 240 * scaleFactor, 12 * scaleFactor, 0, 0, 12 * scaleFactor, 12 * scaleFactor);
fill(169, 169, 169);
rect(x, y - 24 * scaleFactor, 240 * scaleFactor, 24 * scaleFactor);
fill(255, 0, 0);
let containerWidth = 36 * scaleFactor;
let containerHeight = 24 * scaleFactor;
for (let i = 0; i < 5; i++) {
rect(x + 12 * scaleFactor + i * (containerWidth + 12 * scaleFactor), y - 24 * scaleFactor, containerWidth, containerHeight);
}
fill(128, 128, 128);
rect(x + 204 * scaleFactor, y - 48 * scaleFactor, 24 * scaleFactor, 36 * scaleFactor);
fill(105, 105, 105); // Darker gray for the top part of the stack
rect(x + 204 * scaleFactor, y - 60 * scaleFactor, 24 * scaleFactor, 12 * scaleFactor);
fill(255, 255, 0);
ellipse(x + 36 * scaleFactor, y + 12 * scaleFactor, 24 * scaleFactor, 12 * scaleFactor);
ellipse(x + 204 * scaleFactor, y + 12 * scaleFactor, 24 * scaleFactor, 12 * scaleFactor);
let logoSize = 30 * scaleFactor;
drawBitcoinLogo3(x + 126 * scaleFactor, y + 24 * scaleFactor, logoSize);
}
}
window.addEventListener('load', setup);
</script>
<script id="preview" mint="MINT_INSCRIPTION_ID"></script>
</body>
</html>