2016-02-14 14:37:31 +11:00
|
|
|
/**
|
|
|
|
* @file client_utils.js
|
|
|
|
* @author frtk@tetalab
|
|
|
|
*/
|
|
|
|
|
|
|
|
NPGClient.Utils = {
|
|
|
|
|
2016-02-17 11:01:18 +11:00
|
|
|
/**
|
|
|
|
* UI draw
|
|
|
|
*/
|
|
|
|
//
|
|
|
|
log: function(t) {
|
|
|
|
console.log('[NPGClient]' + t);
|
|
|
|
},
|
|
|
|
|
|
|
|
|
2016-02-14 14:37:31 +11:00
|
|
|
/**
|
2016-02-16 10:47:28 +11:00
|
|
|
* UI draw
|
|
|
|
*/
|
|
|
|
//
|
|
|
|
drawText: function(ctx, x1, y1, t, s, c) {
|
|
|
|
ctx.font = s;
|
|
|
|
ctx.fillStyle = c;
|
|
|
|
ctx.fillText(t, x1, y1);
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
|
|
|
drawFillRect: function(ctx, x1, y1, w, h) {
|
|
|
|
ctx.fillRect(x1, y1, w, h);
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
|
|
|
drawRect: function(ctx, x1, y1, w, h) {
|
|
|
|
ctx.beginPath();
|
|
|
|
ctx.rect(x1, y1, w, h);
|
|
|
|
ctx.stroke();
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
|
|
|
drawLine: function(ctx, x1, y1, x2, y2) {
|
|
|
|
ctx.beginPath();
|
|
|
|
ctx.moveTo(x1, y1);
|
|
|
|
ctx.lineTo(x2, y2);
|
|
|
|
ctx.stroke();
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
|
|
|
drawSemiCircle: function(ctx, x, y, r, a1, a2, o, w, c) {
|
|
|
|
ctx.lineWidth = w;
|
|
|
|
ctx.strokeStyle = c;
|
|
|
|
ctx.beginPath();
|
|
|
|
ctx.arc(x, y, r, a1, a2, o);
|
|
|
|
ctx.closePath();
|
|
|
|
ctx.stroke();
|
|
|
|
},
|
|
|
|
|
|
|
|
drawFillCircle: function(ctx, x, y, r) {
|
|
|
|
ctx.beginPath();
|
|
|
|
ctx.arc(x, y, r, 0, Math.PI*2, false);
|
|
|
|
ctx.fill();
|
|
|
|
ctx.stroke();
|
|
|
|
ctx.closePath();
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
|
|
|
drawCircle: function(ctx, x, y, r) {
|
|
|
|
ctx.beginPath();
|
|
|
|
ctx.arc(x, y, r, 0, Math.PI*2, false);
|
|
|
|
ctx.closePath();
|
|
|
|
ctx.stroke();
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* UI Style
|
2016-02-14 14:37:31 +11:00
|
|
|
*/
|
|
|
|
//
|
|
|
|
setTxtStyle : function(ctx, style) {
|
|
|
|
ctx.font = style.font;
|
|
|
|
ctx.fillStyle = style.col;
|
|
|
|
ctx.textAlign = style.align;
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
|
|
|
applyStyle : function(ctx, style) {
|
|
|
|
//
|
|
|
|
if (style.bm) {
|
|
|
|
ctx.lineWidth = style.bw;
|
|
|
|
ctx.strokeStyle = style.bc;
|
|
|
|
}
|
|
|
|
//
|
|
|
|
if (style.fm) {
|
|
|
|
ctx.fillStyle = style.fc;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* User Name
|
|
|
|
*/
|
|
|
|
//
|
|
|
|
addChar : function(key) {
|
|
|
|
//console.log(key + ' ' + NPGClient.userName);
|
|
|
|
if (NPGClient.userName.length < NPGClient.NAMEMAXSIZE) {
|
|
|
|
NPGClient.userName = NPGClient.userName + String.fromCharCode(key).toLowerCase();
|
2016-02-16 10:47:28 +11:00
|
|
|
//console.log(NPGClient.userName);
|
2016-02-14 14:37:31 +11:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
2016-02-16 10:47:28 +11:00
|
|
|
removeChar: function(key) {
|
2016-02-14 14:37:31 +11:00
|
|
|
if (NPGClient.userName.length > 0) {
|
|
|
|
NPGClient.userName = NPGClient.userName.substring(0, NPGClient.userName.length - 1);
|
2016-02-16 10:47:28 +11:00
|
|
|
//console.log(NPGClient.userName);
|
2016-02-14 14:37:31 +11:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
2016-02-16 10:47:28 +11:00
|
|
|
validChar: function(key) {
|
2016-02-14 14:37:31 +11:00
|
|
|
return NPGClient.evtHandler.loginValidKey(key);
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
2016-02-16 10:47:28 +11:00
|
|
|
validName: function() {
|
2016-02-14 14:37:31 +11:00
|
|
|
var len = NPGClient.userName.length;
|
2016-02-16 10:47:28 +11:00
|
|
|
return (len >= 3 && len <= NPGClient.NAMEMAXSIZE);
|
|
|
|
},
|
|
|
|
|
|
|
|
//
|
|
|
|
maxNameSize: function() {
|
|
|
|
return NPGClient.userName.length == NPGClient.NAMEMAXSIZE;
|
2016-02-14 14:37:31 +11:00
|
|
|
},
|
|
|
|
|
|
|
|
//
|
2016-02-16 10:47:28 +11:00
|
|
|
resetName: function() {
|
2016-02-14 14:37:31 +11:00
|
|
|
NPGClient.userName = '';
|
|
|
|
},
|
2016-02-16 10:47:28 +11:00
|
|
|
|
|
|
|
//
|
|
|
|
nameEmpty: function() {
|
|
|
|
return (NPGClient.userName.length == 0);
|
|
|
|
},
|
2016-02-14 14:37:31 +11:00
|
|
|
|
|
|
|
}
|