// Construction Chaos



ctx.fillStyle = '#ffffff'; // setting background color to white

ctx.fillRect(0, 0, 512, 512); // creating a white canvas



// Drawing the construction scene



// Drawing the sky

ctx.fillStyle = '#87ceeb'; // setting sky color to light blue

ctx.fillRect(0, 0, 512, 256); // creating a light blue rectangle for the sky



// Drawing the sun

ctx.beginPath(); // starting a new path for the sun

ctx.arc(100, 100, 50, 0, 2 * Math.PI); // drawing a circle for the sun

ctx.fillStyle = '#ffd700'; // setting sun color to gold

ctx.fill(); // filling the sun with color



// Drawing the grass

ctx.fillStyle = '#00b300'; // setting grass color to green

ctx.fillRect(0, 256, 512, 256); // creating a green rectangle for the grass



// Drawing the construction site

ctx.fillStyle = '#d3d3d3'; // setting construction site color to light gray

ctx.fillRect(150, 200, 200, 150); // creating a rectangle for the construction site



// Drawing the crane

ctx.fillStyle = '#ff0000'; // setting crane color to red

ctx.fillRect(200, 150, 100, 50); // creating a rectangle for the crane base

ctx.fillRect(225, 100, 50, 50); // creating a rectangle for the crane arm



// Drawing the construction worker

ctx.fillStyle = '#0000ff'; // setting construction worker color to blue

ctx.fillRect(175, 250, 50, 50); // creating a rectangle for the worker's body

ctx.fillRect(150, 225, 100, 25); // creating a rectangle for the worker's helmet



// Drawing the construction cone

ctx.fillStyle = '#ff8000'; // setting cone color to orange

ctx.beginPath(); // starting a new path for the cone

ctx.moveTo(275, 250); // moving to the top of the cone

ctx.lineTo(235, 300); // drawing a line to the bottom left of the cone

ctx.lineTo(315, 300); // drawing a line to the bottom right of the cone

ctx.closePath(); // closing the path

ctx.fill(); // filling the cone with color



// Drawing the sign

ctx.fillStyle = '#ffffff'; // setting sign color to white

ctx.fillRect(250, 225, 50, 25); // creating a rectangle for the sign



// Adding text to the sign

ctx.fillStyle = '#000000'; // setting text color to black

ctx.font = '14px Arial'; // setting font size and type

ctx.fillText('CAUTION', 255, 242); // adding text to the sign



// Drawing the construction tools

ctx.fillStyle = '#808080'; // setting tools color to gray



// Drawing the hammer

ctx.beginPath(); // starting a new path for the hammer

ctx.moveTo(275, 275); // moving to the top of the hammer

ctx.lineTo(275, 300); // drawing a line to the bottom of the hammer

ctx.lineTo(290, 305); // drawing a line to the bottom right of the hammer

ctx.lineTo(290, 280); // drawing a line to the top right of the hammer

ctx.closePath(); // closing the path

ctx.fill(); // filling the hammer with color



// Drawing the wrench

ctx.beginPath(); // starting a new path for the wrench

ctx.moveTo(300, 275); // moving to the top left of the wrench

ctx.lineTo(310, 275); // drawing a line to the top right of the wrench

ctx.lineTo(305, 285); // drawing a line to the bottom right of the wrench

ctx.lineTo(295, 285); // drawing a line to the bottom left of the wrench

ctx.closePath(); // closing the path

ctx.fill(); // filling the wrench with color



// Drawing the paintbrush

ctx.beginPath(); // starting a new path for the paintbrush

ctx.moveTo(320, 275); // moving to the top of the paintbrush

ctx.lineTo(320, 300); // drawing a line to the bottom of the paintbrush

ctx.lineTo(330, 295); // drawing a line to the bottom right of the paintbrush

ctx.lineTo(330, 270); // drawing a line to the top right of the paintbrush

ctx.closePath(); // closing the path

ctx.fill(); // filling the paintbrush with color



// Drawing the screwdriver

ctx.beginPath(); // starting a new path for the screwdriver

ctx.moveTo(340, 275); // moving to the top left of the screwdriver

ctx.lineTo(350, 275); // drawing a line to the top right of the screwdriver

ctx.lineTo(345, 285); // drawing a line to the bottom right of the screwdriver

ctx.lineTo(335, 285); // drawing a line to the bottom left of the screwdriver

ctx.closePath(); // closing the path

ctx.fill(); // filling the screwdriver with color



// Having fun while constructing!



// "Why did the construction worker always carry a pencil and paper?"

// "Because he wanted to draw some blueprints for his future projects!"