nodePong/client/lib/ui/ui.js

102 lines
1.7 KiB
JavaScript

/**
* @file ui.js
* @author frtk@tetalab
*/
NPGClient.ui = {
// canvas
canvas_id: '',
canvas_bcol: '',
canvas: {},
ctx: {},
// draw loop paramaters
loopIntervalId: 0,
loopDelay: 40,
/*
* init
*/
//
setupUI: 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;
// start draw loop
self.startDrawLoop();
},
/*
* Draw loop
*/
//
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.drawPage();
},
/*
* Draw functions
*/
//
drawPage: 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;
var elems = NPGClient.PageHandler.getCurrPageUIElems();
if (elems !== undefined && elems.length > 0) {
for (var i = 0; i < elems.length; i++) elems[i].draw(self.ctx);
}
},
//
clear: function() {
var self = this;
self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height);
},
};