Youtor
JS Dots and Boxes Part 1 Game Board and Mouse Events
>> YOUR LINK HERE: ___ http://youtube.com/watch?v=vAeysIanWTw
In the first part of this JavaScript tutorial to create the pen-and-pencil game, Dots and Boxes, we create the game board, handle mouse movement and clicks, and set up a basic scoring system to allow a game between a player and the computer. The computer is not automated at this stage, but will be in Part 2 of this tutorial. Download the code below! • CONTENTS • 0:10 Game information • 0:38 Set up the game board • 7:24 Set up the game grid • 12:19 Create the “Square” object constructor • 18:42 Draw square highlighting • 31:06 “mousemove” event listener and highlighting • 38:35 “click” event listener and selecting a side • 47:16 Fix highlighting issue by selecting the cell’s neighbour • 51:44 Filling a completed square with colour • 58:08 Add text to a completed square • 1:03:27 Title bar with players’ names and scores • 1:09:03 Game over and starting a new game • CODE • JavaScript Template: • https://drive.google.com/open?id=1W8v... • Dots and Boxes Part 1 (Game Board, Mouse Events, and Highlighting): • https://drive.google.com/open?id=1SsH... • USEFUL LINKS • Dots and Boxes: • https://en.wikipedia.org/wiki/Dots_an... • “for...of” loop: • https://developer.mozilla.org/en-US/d... • “mousemove” Event: • https://www.w3schools.com/jsref/event... • Visual Studio Code: • https://code.visualstudio.com/ • FIND US ON FACEBOOK • / mountfordstudios
#############################
