about summary refs log tree commit diff stats
path: root/js
diff options
context:
space:
mode:
authorelioat <elioat@tilde.institute>2024-01-07 19:06:39 -0500
committerelioat <elioat@tilde.institute>2024-01-07 19:06:39 -0500
commit4c732e8889e895ce1a22ee4df88c42e0afd8bc63 (patch)
treeb76dd8f5268b1eb89a184b49e255e7e1eafe22a4 /js
parentf3a044a1d6f70ea823cbff66cf59d3825bcf7182 (diff)
downloadtour-4c732e8889e895ce1a22ee4df88c42e0afd8bc63.tar.gz
*
Diffstat (limited to 'js')
-rw-r--r--js/toadmode/toad.js27
1 files changed, 8 insertions, 19 deletions
diff --git a/js/toadmode/toad.js b/js/toadmode/toad.js
index f0dc0db..73d4cbf 100644
--- a/js/toadmode/toad.js
+++ b/js/toadmode/toad.js
@@ -1,23 +1,16 @@
-// Get the viewport's width and height
 const viewportWidth = window.innerWidth;
 const viewportHeight = window.innerHeight;
 
-// Select the existing canvas element
-const canvas = document.getElementById('toad'); // replace 'your-canvas-id' with the id of your canvas
-
-// Set the canvas's width and height to the viewport's width and height
+const canvas = document.getElementById('toad');
 canvas.width = viewportWidth;
 canvas.height = viewportHeight;
 
-// Get the canvas's context
 const context = canvas.getContext('2d');
 
-// Set the canvas's background color to grey
 context.fillStyle = '#f0f0f0';
 context.fillRect(0, 0, canvas.width, canvas.height);
 
-// Draw a grid of white lines on the canvas
-const gridSize = 50; // Change this value to change the size of the grid cells
+const gridSize = 50;
 context.strokeStyle = 'white';
 
 const drawLine = (x1, y1, x2, y2) => {
@@ -34,7 +27,6 @@ for (let y = 0; y <= viewportHeight; y += gridSize) {
     drawLine(0, y, viewportWidth, y);
 }
 
-// Create a custom context menu
 const contextMenu = document.createElement('ul');
 contextMenu.id = 'context-menu';
 contextMenu.style.display = 'none';
@@ -46,20 +38,20 @@ contextMenu.style.border = '1px solid black';
 
 const drawShape = (shape, x, y) => {
     context.beginPath();
-    context.strokeStyle = '#2d2d2d'; // Change this to the color you want
-    context.fillStyle = '#2d2d2d'; // Change this to the color you want
+    context.strokeStyle = '#2d2d2d';
+    context.fillStyle = '#2d2d2d';
     if (shape === 'square') {
         context.rect(x, y, gridSize, gridSize);
-        context.fill(); // Fill the square shape
+        context.fill();
     } else if (shape === 'triangle') {
         context.moveTo(x, y);
         context.lineTo(x + gridSize, y);
         context.lineTo(x + gridSize / 2, y + gridSize);
         context.closePath();
-        context.fill(); // Fill the triangle shape
+        context.fill();
     } else if (shape === 'circle') {
         context.arc(x + gridSize / 2, y + gridSize / 2, gridSize / 2, 0, 2 * Math.PI);
-        context.fill(); // Fill the circle shape
+        context.fill();
     }
     context.stroke();
     shapes.push({ type: shape, x, y, color: '#2d2d2d' });
@@ -68,7 +60,7 @@ const drawShape = (shape, x, y) => {
 ['Square', 'Triangle', 'Circle'].forEach(shape => {
     const option = document.createElement('li');
     option.textContent = shape;
-    option.style.cursor = 'pointer'; // Add this line
+    option.style.cursor = 'pointer';
     option.addEventListener('click', (event) => {
         contextMenu.style.display = 'none';
         const cellX = Math.floor(lastRightClick.x / gridSize) * gridSize;
@@ -80,10 +72,8 @@ const drawShape = (shape, x, y) => {
 
 document.body.appendChild(contextMenu);
 
-// Store the last right click position
 let lastRightClick = { x: 0, y: 0 };
 
-// Add an event listener for the 'contextmenu' event on the canvas
 canvas.addEventListener('contextmenu', (event) => {
     event.preventDefault();
     lastRightClick = { x: event.clientX, y: event.clientY };
@@ -94,7 +84,6 @@ canvas.addEventListener('contextmenu', (event) => {
 
 let shapes = [];
 
-// Hide the context menu when clicking anywhere else
 window.addEventListener('click', () => {
     contextMenu.style.display = 'none';
 });
\ No newline at end of file