• Dropped comments and related code are the subjects of this post.

    Comment/code sketching the implementation design.

    p16 = // puzzle16 game (x=4,y=4) - x,y variable (screen size too)
          // - x*y-1 = m pieces with values 0..x*y-2 (regular piece) 
          // - empty slot is virtual piece w/ value -1 (empty piece)
          // - ps = y*x pieces arr of arrays [row=y][col=x] = [value]
          // - ls = x*y locations by value array [value] = [y,x]
    { h: "Puzzle 16"
    , t: 0
    , .....
    

    Comment/code sketching the main line tpd(x,y) method:

    // tapped on screen at pixel xp,yp
    //  ? i = inside of game board
    //    update time display
    //    x = piece x coord 0..x-1
    //    y = piece y coord 0..y-1
    //    ? top porch / banner menu (above pieces)
    //      handle top menu
    //    :? pieces reg y (above bottom porch / footer menu)
    //      ? pieces reg x
    //        p = piece @ x y, n = value of piece
    //        ? piece (not empty 'piece')
    //          ex ey = x y of empty piece
    //          ? ey of empty piece == y of piece
    //            move vertically +-y
    //          : (ex of empty piece == x of piece)
    //            move horizontally +-x
    //    : (bottom porch / footer menu (below pieces))
    //      handle bottom menu -+x, -+y, scramble, and 'orderly'
    //  return i (=true when inside game board and handled)   
    , tpd: function(xt,yt) { var i,xr,yr,xo,yo,dp=this.d;
        if ((i =    (xt>=this.x0) && (xt<this.x0+this.xp)
                 && (yt>=this.y0) && (yt<this.y0+this.yp) )) {
          this.upd(Math.floor(getTime() - this.t),this.ts);
          var x = Math.floor((xr=(xt-(xo=this.x0+this.bl-1­)))/dp);
          var y = Math.floor((yr=(yt-(yo=this.y0+this.bt-1­)))/dp);
          if (y < 0) {
          } else if (y < this.y) {
            if ((x >=0) && (x < this.x)) {
              var p = this.ps[y][x], n = p[0];
              if ( n >= 0) {
                var ey = this.ls[this.m][0], ex = this.ls[this.m][1];
                var e = this.ps[ey][ex];
                if (ey == y) { this.c++;
                  this.mvx(y,x,e,ex,(ex<x) ? +1 : -1,yo,xo,dp);
                } else if (ex == x) {
                  this.mvy(y,x,e,ey,(ey<y) ? +1 : -1,yo,xo,dp);
                }
              }
            }
          } else { x = Math.floor(xr/((this.xp-2*2)/8));
                  console.log(x);
            if        ((x ===  0) && (this.xn>3)) {
              this.xn--; this.upd(this.xn,this.xns);
            } else if ((x ==   1) && (this.xn<7)) { 
              this.xn++; this.upd(this.xn,this.xns);
            } else if ((x ==   2) && (this.yn>3)) { 
              this.yn--; this.upd(this.yn,this.yns);
            } else if ((x ==   3) && (this.yn<7)) { 
              this.yn++; this.upd(this.yn,this.yns);
            } else if (x>3&&x<6) { 
              this.scr(this.xn,this.yn);
            } else if (x>5&&x<8) { 
              this.lup(this.xn,this.yn);
            }
          }    
        } return i;
      }
    

    Comments added to code only available in this post:

    // .....
    p16 = // .....
          // ....
    { h: "Puzzle 16" // not used yet / anymore - default values:
    , t: 0     // getTime() of game begin
    , ts: []   // time [fontsize,x,y] display specs for upd(v,s) 
    , c: 0     // count of moves set to 0 at game begin
    , cs: []   // count [fontsize,x,y] display specs for upd(v,s) 
    , X: 240   // display size x - not used yet / anymore
    , Y: 320   // display size y- not used yet / anymore
    , x0: 0    // x / left in display of board top/left corner
    , y0: 0    // y / top in display of board top/left corner
    , xp: 240  // x board size in pixels
    , yp: 320  // y board size in pixels
    , x: 4     // x - horizontal - number of pieces (columns)
    , y: 4     // y - vertical - number of pieces (rows)
    , xn: 4    // x next for the next scramble or orderly setup
    , yn: 4    // y next for the next scramble or orderly setup
    , xns: []  // x next [fontsize,x,y] display specs for upd(v,s) 
    , yns: []  // y next [fontsize,x,y] display specs for upd(v,s)
    , m: 15    // max internal piece val 0..x*y-1, m = 'empty' piece 
    , bl: 2    // border left in pixels
    , bt: 40   // border top in px for time and moves display
    , br: 2    // border right
    , bb: 40   // border bottom for menu (+-x, +-y, SCR, ORD)
    , xe: 0    // x (column 0..x-1) position of empty slot (piece) 
    , ye: 0    // y (column 0..y-1) position of empty slot (piece)
    , d: 60    // piece with and height (is always calc'd on scr / ord
    , clrs: [[0,0,0],[1,1,1],[1,1,0],[0,0,1]] // rgb colors 0..3 used
    , ps: []   // pieces (piece itself if array with value as 1st elt)
    , ls: []   // locations of pieces by value (empty slot is last)
    // tapped on screen at pixel xp,yp
    //  .....
    

    So much so far...

About

Avatar for allObjects @allObjects started