Js maze game

<! DOCTYPE HTML> 
<HTML> 
  <head> 
    <title> MyHtml.html </ title>     
  </ head> 
  <body> 
  <Canvas ID = " MyCanvas " width = " 600px " height = " 600px " > </ Canvas> 
  </ body> 
  <Script type = " text / JavaScript " >
     // drawing board 14 is provided with a line for each cell, a total of 196 grid, the grid size of 30 X-30 
    var AA = 14 ;
     var Chess = document.getElementById ( " MyCanvas " );
    var context = chess.getContext('2D ' ); 
    function drawChessBoard () { // Painting 
        for ( var I = 0 ; I <+ AA . 1 ; I ++ ) { 
            context.strokeStyle = ' Gray ' ; // optional area 
            context.moveTo ( 15 + I * 30 , 15 ); // vertical line 15 drawn apart 30px; 
            context.lineTo ( 15 + I * 30 , 15 + 30 * AA); 
            context.stroke (); 
            context.moveTo ( 15, 15 + I * 30 ); // horizontal line 15 drawn apart 30px; 14 * board to 14; 
            context.lineTo ( 15 + 30 * AA, 15 + I * 30 ); 
            context.stroke (); 
        } 
    } 
    drawChessBoard (); 

   // if two adjacent lattice is disposed in the same two-dimensional array Access 
   var Access = [];
    for ( var I = 0 ; I <* AA AA; I ++ ) { 
       Access [I] = [];
       for ( var J = 0 ; J <* AA AA; J ++ ) {
         Access [I] [J] = - . 1 ; 
      } 
   } 

    // generated maze when used disjoint-set 
     var   ARR = [];
     for ( var J = 0 ; J < 196 ; J ++ ) { 
      ARR [J] = J ; 
    } 
    function Search (A) { 
       the while (A =! ARR [A]) { 
         A = ARR [A]; 
        } 
        return A; 
    } 
    function Union (A, B) { 
       var   PA = Search (A);
        var   Pb = Search (B); 
       ARR [Pb]= PA; 
    } 
    

    function getnei (A) // get the neighbor number Random 
    {
         var Y = the parseInt (A / AA); // To precisely an integer 
        var X = A% AA;
         var mynei = new new the Array (); // store neighbor 
        IF (X- . 1 > = 0 ) {mynei.push (+ Y * X-AA . 1 );} // left node 
        IF (X + . 1 < 14 ) {mynei.push (AA + X + Y * . 1 );} // right node 
        IF (Y + . 1 < 14 ) {mynei.push ((Y + . 1) * X + AA);} //
         IF (Y- . 1 > = 0 ) {mynei.push ((Y- . 1 ) * X + AA);} //
         var RAN = the parseInt (Math.random () * mynei .length);
         return mynei [RAN]; 
    } 

    function DrawLine (A, B) // chain line, is determined to be approximately vertical or 
    {
         var Y1 = the parseInt (A / AA);
         var X1 = A% AA;    // transverse coordinate 
        var Y2 = the parseInt (B / AA);
         var X2 = B% AA;
         var X3 = X1 <X2? X1: X2;
         IF (Y1-Y2 == 0) {    // o'clock direction needs underlined x1 is the smaller 
           context.clearRect ( 15 + (+ X3 . 1 ) * 30 - . 1 , 15 + Y2 * 30 + . 1 , 2 , 28 ); 
        } the else { 
           context.clearRect (X1 * 30 + 15 + . 1 , ((Y1 + Y2) / 2 + . 1 ) * 30 - . 1 , 28 , 2 ); 
        } 
    } 
     
     // DrawLine (18,32);
    the while (Search ( 0 !) = Search ( 195 )) // main ideas 
    {
         var NUM = the parseInt (Math.random () * AA * AA); // generates a random number less than 196 
        var Neighbor = getnei (NUM) ;
         IF (Search (NUM) == Search (Neighbor)) { Continue ;}
         the else // not on a 
        { 
            DrawLine (NUM, Neighbor); // scribe 
            Union (NUM, Neighbor); 
            Access [NUM] [Neighbor] = . 1 ; 
            Access [Neighbor] [NUM] = . 1 ; 
        }
    } 
    
    // draw the (0,0) position of a blue box 
    var currentLine = 0 ;
     var currentCol = 0 ; 
    context.fillStyle = " Blue " ; 
    context.fillRect (currentLine * 30 + 2 + 15 , currentCol * 30 + 2 + 15 , 25 , 25 ); 
    
    // in (13, 13) draw a green box 
    context.fillStyle = " green " ; 
    context.fillRect ( 13 is * 30 +2 + 15 , 13 is * 30 + 2 + 15 , 25 , 25 ); 
    context.fillStyle = " Blue " ; 
    
    // listening left keyboard arrow keys 
    document.onkeydown = function (E) {
      var tempLine = currentLine;
      var tempCol = currentCol ;
      var isExceed = to false ; 
     E . = window Event || E;
      var NUM =   e.keyCode;
       Switch(e.keyCode){
        case 37: //左键
          currentLine--;
          if(currentLine < 0 || currentLine > 13 || !checkAccess(tempLine,tempCol , currentLine ,currentCol)){
             currentLine++;
            isExceed = true;
            break;
          }
          break;
        case 38: //上键
          currentCol--;
          if(currentCol < 0 || currentCol > 13 || !checkAccess(tempLine,tempCol , currentLine ,currentCol)){
            currentCol++;
            isExceed = true;
            break;
          }
          break;
        case 39: //右键
          currentLine++;
          if(currentLine < 0 || currentLine > 13 || !checkAccess(tempLine,tempCol , currentLine ,currentCol)){
            currentLine--;
            isExceed = true;
            break;
          }
          break;
        case 40: //下键
          currentCol++;
          if(currentCol < 0 || currentCol > 13 || !checkAccess(tempLine,tempCol , currentLine ,currentCol)){
            currentCol--;
            isExceed = true;
            break;
          }
          break;
        default:
          break;
      }
      if( (num == 37 || num == 38 || num == 39 || num == 40 ) && !isExceed){
           context.clearRect(tempLine*30+2+15, tempCol*30+2+15, 25, 25);
           context.fillRect(currentLine*30+2+15,currentCol*30+2+15,25,25);
      }
      checkSucess(currentLine ,currentCol );
    }

    function checkAccess(tempLine,tempCol , currentLine ,currentCol){
        var oldSeq = tempCol*14+tempLine;
        var newSeq = currentCol*14+currentLine;
        if(access[oldSeq][newSeq] == 1 || access[newSeq][oldSeq] == 1 ){
            return true;
        }else{
           return false;
        }
    }
    
    function  checkSucess(currentLine ,currentCol ){
       if(currentLine == 13 && currentCol == 13){
          alert("success!");
          window.location.reload();
          return ;
       }
    }
    
  </script>
</html>
Guess you like
