nodePong/client/js/core/page_base.js~

/**
 * @file AppPage.js
 * @author frtk@tetalab
 */

NPGClient.AppPage = function(n) { 
    
  Object.defineProperty(this, 'id', { value: NPGClient.pageCount++ });
   
  this.name = n || '';
  // draw loop paramaters
  this.loopIntervalId = 0;
  this.loopDelay = 40; 
  // canvas 
  this.canvas_id = "";
  this.canvas_bcol = "";
  this.canvas = {};
  this.ctx = {};

  // ui elements   
  this.uiElems = [];

};

NPGClient.AppPage.prototype = {

  constructor: NPGClient.AppPage,

  //
  setLoopDelay: function(d) {
    this.loopDelay = d;
  },

  //
  startDrawLoop: function() {
    var self = this;
    self.loopIntervalId = setInterval(function() { 
      self.run(); 
    }, self.loopDelay);
  },

  //
  stopDrawLoop: function() {
    var self = this;
    clearInterval(self.loopIntervalId); 
    self.loopIntervalId = 0;            
  },

  //
  run: function() {
    var self = this;
    self.drawUI();
  },

  //
  configUI: function(id, w, h, c) {
    var self = this;
    self.canvas_id = id;
    self.canvas = document.getElementById(id); 
    self.ctx = self.canvas.getContext("2d");
    self.canvas.width = w;
    self.canvas.height = h;
    self.canvas_bcol = c;
  },

  //
  addUIObject: function(c) {
    var self = this;
    self.uiElems.push(c);
  },

  //
  getUIElemByName: function(name) {
    var self = this;
    if (self.uiElems.length > 0) {
      for (var i = 0; i < self.uiElems.length; i++)
 	if (self.uiElems[i].name == name) return self.uiElems[i];
    }
    return undefined;
  },

  //
  drawUI: function() {
    var self = this;
    self.clear();
    self.drawUIBackground();
    self.drawUIObjects();	
  },

  //
  drawUIBackground: function() {
    var self = this;
    self.ctx.fillStyle = self.canvas_bcol;
    self.ctx.fillRect(0, 0, self.canvas.width, self.canvas.height);
  },
  
  //
  drawUIObjects: function() {
    var self = this;
    if (self.uiElems.length > 0) {
      for (var i = 0; i < self.uiElems.length; i++)
	self.uiElems[i].draw(self.ctx);
    }
  },

  //
  clear: function() {
    var self = this;
    self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height); 
  },

    
};