Source: ball.js

/*jslint plusplus: true, white: true, indent: 2, maxlen: 90 */
/**
 *  @author    Wolfgang Kowarschick
 *  @copyright 2013, Wolfgang Kowarschick
 *  <br/>
 *  Redistribution and use in source and binary forms, with or without
 *  modification, are permitted under the terms of the 
 *  Creative Commons License Attribution-NonCommercial-ShareAlike 3.0 Unported    
 *  (CC BY-NC-SA 3.0: http://creativecommons.org/licenses/by-nc-sa/3.0/). 
 */

(function($wk$)
{ "use strict"; 

////////////////////////////////////////////////////////////////////////////////
// Class "Ball"
////////////////////////////////////////////////////////////////////////////////

var Math = $wk$.Math; // import

//------------------------------------------------------------------------------
// Constructor
//------------------------------------------------------------------------------

/** 
 *  @class
 *  @property {Number} r - The radius of the ball. 
 *  @property {Number} x - The x-position of the ball.
 *  @property {Number} y - The y-position of the ball.
 *  @property {Number} vx - The vx-velocity of the ball.
 *  @property {Number} vy - The vy-velocity of the ball. 
 *
 *  @property {Number|Array} rInit - The initial radius of the ball. 
 *  @property {Number|Array} xInit - The initial x-position of the ball.
 *  @property {Number|Array} yInit - The initial y-position of the ball.
 *  @property {Number|Array} vxInit - The initial vx-velocity of the ball.
 *  @property {Number|Array} vyInit - The initial vy-velocity of the ball. 
 *  
 *  @property {int}    borderWidth - The width of the border of the ball. 
 *  @property {String} borderColor - The color of the border of the ball. 
 *  @property {String} color       - The color of the ball. 
 *
 *  @name $wk$.Ball
 *  @this $wk$.Ball
 *  @param {CanvasRenderingContext2D} p_context 
 *         The 2d context of the canvas upon which the ball is to be drawn.
 *  @param {Object} p_init
 *         An object that contains initialization values for the attributes
 *         <code>rInit</code>, <code>xInit</code>, <code>yInit</code>, 
 *         <code>vxInit</code>, <code>vyInit</code>, 
 *         <code>borderWidth</code>, <code>borderColor</code>, 
 *         and <code>color</code>. 
 */
function Ball(p_context, p_init)
{ var l_key = null;

  this.v_context = p_context;

  // initialize the ball
  /*jslint forin: true*/
  for (l_key in p_init)
  {  this[l_key] = p_init[l_key]; }

  this.reset();
}

//------------------------------------------------------------------------------
// End of Constructor
//------------------------------------------------------------------------------


Ball.prototype =
{ //----------------------------------------------------------------------------
  // Methods (Data)
  //----------------------------------------------------------------------------

//get r()    { return this.v_r; },
//set r(p_r) { this.v_r = p_r;  },

//get x()    { return this.v_x; },
//set x(p_x) { this.v_x = p_x;  },

//get y()    { return this.v_y; },
//set y(p_y) { this.v_y = p_y;  },

//get vx()     { return this.v_vx; },
//set vx(p_vx) { this.v_vx = p_vx; },

//get vy()     { return this.v_vy; },
//set vy(p_vy) { this.v_vy = p_vy; },

  //----------------------------------------------------------------------------
  // Methods (Logic)
  //----------------------------------------------------------------------------

  /** 
   *  Resets the ball: 
   *    Moves the ball to its starting position 
   *    and computes randomly a velocity vector.
   * 
   *  @method
   *  @name $wk$.Ball#reset
   */
  reset:
    function()
    { this.r  = Math.randomInt(this.rInit);
      this.x  = Math.randomNum(this.xInit);
      this.y  = Math.randomNum(this.yInit);
      this.vx = (Math.random()<0.5?1:-1) * Math.randomNum(this.vxInit);
      this.vy = (Math.random()<0.5?1:-1) * Math.randomNum(this.vyInit);
    },

  /** 
   *  Moves the ball in direction (vx,vy); the step size depends on FPS. 
   * 
   *  @method
   *  @name $wk$.Ball#move
   *  @param {Number} p_delta_t The time elapsed since 
   *                            the last call of <code>move</code>.
   */
  move:
    function(p_delta_t)
    { this.x += this.vx*p_delta_t/1000;
      this.y += this.vy*p_delta_t/1000;
    },

  //----------------------------------------------------------------------------
  // Methods (View)
  //----------------------------------------------------------------------------

  /** 
   *  Draws the ball at its current position onto a 2d context.
   *
   *  @method
   *  @name $wk$.Ball#draw
   */
  draw:
    function()
    { this.v_context.beginPath();
      this.v_context.arc(this.x, this.y, this.r, 0, 2*Math.PI, true);
      this.v_context.lineWidth   = this.borderWidth;
      this.v_context.strokeStyle = this.borderColor;
      this.v_context.fillStyle   = this.color;
      this.v_context.stroke();
      this.v_context.fill();
    }

  //----------------------------------------------------------------------------
  // End of Methods
  //----------------------------------------------------------------------------
};

$wk$.Ball = Ball;

////////////////////////////////////////////////////////////////////////////////
// End of Class "Ball"
////////////////////////////////////////////////////////////////////////////////

}(this.$wk$));