(function(exports){
var KeyBoard = function(input, options){
var body = document.getElementsByTagName('body')[0];
var DIV_ID = options && options.divId || '__w_l_h_v_c_z_e_r_o_divid';
if(document.getElementById(DIV_ID)){
body.removeChild(document.getElementById(DIV_ID));
}
this.input = input;
this.el = document.createElement('div');
var self = this;
var zIndex = options && options.zIndex || 1000;
var width = options && options.width || '100%';
var height = options && options.height || '177px';
var fontSize = options && options.fontSize || '15px';
var backgroundColor = options && options.backgroundColor || '#fff';
var TABLE_ID = options && options.table_id || 'table_0909099';
var mobile = typeof orientation !== 'undefined';
this.el.id = DIV_ID;
this.el.style.position = 'fixed';
this.el.style.left = 0;
this.el.style.right = 0;
this.el.style.bottom = 0;
this.el.style.zIndex = zIndex;
this.el.style.width = width;
this.el.style.height = height;
this.el.style.backgroundColor = backgroundColor;
//样式
var cssStr = '<style type="text/css">';
cssStr += '#' + TABLE_ID + '{text-align:center;width:100%;height:160px;border-top:1px solid #DDD;background-color:#FFF;}';
cssStr += '#' + TABLE_ID + ' td{font-size:22px;width:33%;border:1px solid #ddd;border-right:0;border-top:0;}';
//手机样式
//if(!mobile){
cssStr += '#' + TABLE_ID + ' td:active {background-color:#1FB9FF;color:#FFF;}';
//}
cssStr += '</style>';
//Button
/*var btnStr = '<span class="aa" style="width:100%;height:18px;background-color:#139fdd;';
btnStr += 'text-align:center;color:#fff;';
btnStr += 'line-height:18px;background: url(../images/more_unfold.png) center center no-repeat;border-radius:3px;cursor:pointer;display:inline-block;"></span>';
*/
//table
var tableStr = '<table id="' + TABLE_ID + '" border="0" cellspacing="0" cellpadding="0">';
tableStr += '<tr style="height: 44px;"><td>1</td><td>2</td><td>3</td></tr>';
tableStr += '<tr style="height: 44px;"><td>4</td><td>5</td><td>6</td></tr>';
tableStr += '<tr style="height: 44px;"><td>7</td><td>8</td><td>9</td></tr>';
tableStr += '<tr style="height: 44px;"><td style="background-color:#D3D9DF;">.</td><td>0</td>';
tableStr += '<td style="background-color:#D3D9DF;"><div style="height:100%;width:100%;background: url(../images/del.png) center center no-repeat;"><img class="Img"></div></td></tr>';
tableStr += '</table>';
/*this.el.innerHTML = cssStr + btnStr + tableStr;*/
this.el.innerHTML = cssStr + tableStr;
function addEvent(e){
var ev = e || window.event;
var clickEl = ev.element || ev.target;
var value = clickEl.textContent || clickEl.innerText;
var cc = clickEl.innerHTML;
e.stopPropagation();
if(clickEl.tagName.toLocaleLowerCase() === 'td' && value !== ""){
if(self.input){
//self.input.value += value;
var num2 = self.input.value + value ;
//var num1 = (self.input.value).substr(0, (self.input.value).length - 1);
var num1 = self.input.value;
if(num2.indexOf(".") != -1){
var num11 = self.input.value;
if(num2.length-num2.indexOf(".")<4){
self.input.value = num2;
}
}else{
self.input.value = num2;
}
if(clickEl.tagName.toLocaleLowerCase() === 'td' && value === "."){
if(num1.indexOf(".") != -1){
self.input.value = num1;
}
}
}
}else if(clickEl.tagName.toLocaleLowerCase() === 'span' && value === ""){
body.removeChild(self.el);
}else if((clickEl.tagName.toLocaleLowerCase() === 'div' && value === "") || clickEl.tagName.toLocaleLowerCase() === 'img'){
var num = self.input.value;
if(num){
var newNum = num.substr(0, num.length - 1);
self.input.value = newNum;
}
}
}
if(mobile){
this.el.ontouchstart = addEvent;
}else{
this.el.onclick = addEvent;
}
body.appendChild(this.el);
}
exports.KeyBoard = KeyBoard;
})(window);
