feat: Add color variations for natural elements and dynamic water colors

js/elements/basic.js

@@ -22,19 +22,40 @@ function updateSand(x, y) {
 }
 
 function updateWater(x, y) {
+    // Update water color dynamically
+    const metadata = getMetadata(x, y);
+    if (metadata) {
+        if (metadata.waterColorTimer === undefined) {
+            metadata.waterColorTimer = 0;
+        }
+        
+        metadata.waterColorTimer++;
+        
+        // Change color occasionally
+        if (metadata.waterColorTimer > 20 && Math.random() < 0.1) {
+            metadata.colorIndex = Math.floor(Math.random() * 10);
+            metadata.waterColorTimer = 0;
+        }
+        
+        setMetadata(x, y, metadata);
+    }
+    
     // Try to move down
     if (getPixel(x, y + 1) === EMPTY) {
         setPixel(x, y, EMPTY);
         setPixel(x, y + 1, WATER);
+        moveMetadata(x, y, x, y + 1);
     } 
     // Try to move down-left or down-right
     else if (getPixel(x - 1, y + 1) === EMPTY) {
         setPixel(x, y, EMPTY);
         setPixel(x - 1, y + 1, WATER);
+        moveMetadata(x, y, x - 1, y + 1);
     } 
     else if (getPixel(x + 1, y + 1) === EMPTY) {
         setPixel(x, y, EMPTY);
         setPixel(x + 1, y + 1, WATER);
+        moveMetadata(x, y, x + 1, y + 1);
     } 
     // Try to spread horizontally
     else {

js/elements/trees.js

@@ -34,10 +34,16 @@ function growTree(x, y) {
     // Determine tree height (50-80 blocks, 10x bigger)
     const treeHeight = 50 + Math.floor(Math.random() * 31);
     
+    // Generate consistent wood color for this tree
+    const woodColorIndex = Math.floor(Math.random() * 10);
+    setMetadata(x, y, { colorIndex: woodColorIndex });
+    
     // Grow the trunk upward
     for (let i = 1; i < treeHeight; i++) {
         if (getPixel(x, y - i) === EMPTY) {
             setPixel(x, y - i, WOOD);
+            // Use the same wood color for the entire trunk
+            setMetadata(x, y - i, { colorIndex: woodColorIndex });
         } else {
             break; // Stop if we hit something
         }
@@ -85,6 +91,14 @@ function addBranches(x, y, treeHeight) {
 }
 
 function addLeaves(x, y, radius) {
+    // Generate a few leaf color variations for this tree
+    const baseLeafColorIndex = Math.floor(Math.random() * 10);
+    const leafColorIndices = [
+        baseLeafColorIndex,
+        (baseLeafColorIndex + 1) % 10,
+        (baseLeafColorIndex + 2) % 10
+    ];
+    
     // Add a cluster of leaves around the point
     for (let dy = -radius; dy <= radius; dy++) {
         for (let dx = -radius; dx <= radius; dx++) {
@@ -100,6 +114,9 @@ function addLeaves(x, y, radius) {
                 if (Math.random() < (1 - distance/radius/density)) {
                     if (getPixel(x + dx, y + dy) === EMPTY) {
                         setPixel(x + dx, y + dy, LEAF);
+                        // Assign one of the tree's leaf colors
+                        const colorIndex = leafColorIndices[Math.floor(Math.random() * leafColorIndices.length)];
+                        setMetadata(x + dx, y + dy, { colorIndex });
                     }
                 }
             }