lemansky

Untitled

Nov 26th, 2020
517
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Document</title>
  7.     <script>
  8.  
  9.         document.addEventListener('DOMContentLoaded', function(){
  10.             const canvas = document.getElementById("canvasId");
  11.             const canvasId = canvas.getContext("2d");
  12.  
  13.             // canvas.addEventListener("mousemove", function(evt){
  14.             //  const mouse = mouse_player1(evt, canvas);
  15.                
  16.             //  // do some tasks
  17.  
  18.             // });
  19.  
  20.             let x = 50; //
  21.             let y = 50; //
  22.  
  23.             const executeTasks = () =>{
  24.                     moveTask();
  25.                     drawTask();
  26.             }
  27.  
  28.             const moveTask = () => {
  29.                 x += 10;
  30.             }
  31.  
  32.             const drawTask = () => {
  33.                 canvasId.fillStyle = "black";
  34.                 canvasId.fillRect(0, 0, canvas.width, canvas.height);
  35.                 canvasId.fillStyle = "green";
  36.                 canvasId.beginPath();
  37.                 canvasId.arc(x, y, 20, 0, Math.PI*2);
  38.                 canvasId.fill();
  39.             }
  40.  
  41.             setInterval(executeTasks, 24);
  42.         });
  43.  
  44.  
  45.  
  46.  
  47.         // const mouse_player1 = (evt, canvas) => {
  48.         //  let rect = canvas.getBoundingClientRect(); // взима позицията на платното в документа, в случай, че то не започва от горния ляв ъгъл
  49.         //  let mouseX = evt.clientX - rect.left; // позицията на курсора по хоризонтала
  50.         //  let mouseY = evt.clientY - rect.top; // позиията на курсора по вертикала
  51.         //  return {
  52.         //      cursor_x: mouseX,
  53.         //      cursor_y: mouseY,
  54.         //  } // фунцкията връша два параметъра, cursor_x и cursor_y
  55.         // }
  56.  
  57.            
  58.     </script>
  59.     <style>
  60.         #canvasId{
  61.             background:black;
  62.         }
  63.     </style>
  64. </head>
  65. <body>
  66.     <canvas id="canvasId" width="800" height="600"></canvas>
  67. </body>
  68. </html>
RAW Paste Data