/**
 * JavaScript draggable virtual keyboard
 *
 * Virtual keyboard with drag`n`drop function
 * and two keyboard languages. Thanks for looking
 * in code xD. Respect dhtmlgoodies.com for drag example.
 * Have troubles with small content size pages - fixed,
 * works fine with all browsers. visibility property 
 * was deprecated.
 *    
 * @author  NextMail
 */

    var userAgent       = navigator.userAgent.toLowerCase().indexOf('msie') > -1 ? 'msie' : 'gecko';
    var activeElement   = null;
    var language        = 'ru';
    var langBoard       = null;
	var shiftPressed    = false;
    var capsPressed      = false;
	var req 			= createRequestObject();
	var range 			= '';

        
    /**
	 * Return html object element, selected by id.
	 */
    window.$i = function (id)
    {
        return document.getElementById(id);
    }
    
    /**
	 * Return html object style, selected by id.
	 */
    window.$$ = function (id)
    {
        return $i(id).style;
    }

    /**
	 * Insert characted
	 */
    function _(f,e){
		activeElement.focus();
      e = e.replace(/&amp;/,'&');
      e = e.replace(/&lt;/,'<');
      e = e.replace(/&gt;/,'>');
		if (typeof activeElement.setSelectionRange != 'undefined')
        {
			var oldSelectionStart = activeElement.selectionStart;
			var oldSelectionEnd = activeElement.selectionEnd;
			activeElement.value = activeElement.value.substring(0, oldSelectionStart)
								+ ((shiftPressed || capsPressed) ? e.toUpperCase(): e)
								+ activeElement.value.substring(oldSelectionEnd);
			activeElement.setSelectionRange(oldSelectionStart + e.length, oldSelectionStart + e.length);
		}
        else
        {
			if(activeElement.createTextRange && range)
            {
                try { range.select(); } catch(e) {}
                range = document.selection.createRange();
                range.text = (shiftPressed || capsPressed) ? e.toUpperCase(): e;
                range.collapse(true);
                range.select();
			}else
            {
				activeElement.value +=  (shiftPressed || capsPressed) ? e.toUpperCase(): e 
			}
		}
		activeElement.focus();
        if(shiftPressed)
        {
         $z();
         $i('shift').className = '';
         shiftPressed = false;
        }
        setTimeout(function(){f.className='';}, 50);
    }
    
    /**
	 * Delete character
	 */
    window.$b = function(f)
    {
        activeElement.focus();
		if (typeof activeElement.setSelectionRange != 'undefined'){
			var oldSelectionStart = activeElement.selectionStart;
			var oldSelectionEnd = activeElement.selectionEnd;
			activeElement.value = activeElement.value.substring(0, oldSelectionStart - 1) + activeElement.value.substring(oldSelectionEnd);
			activeElement.setSelectionRange(oldSelectionStart - 1, oldSelectionStart - 1);
		}
        else
        {
			if(activeElement.createTextRange && range)
            {
                try { range.select(); } catch(e) {}
                range = document.selection.createRange();
                if (!range.text.length) range.moveStart('character', -1);
                range.text = "";
			}else
            {
				activeElement.value = activeElement.value.substring(0, activeElement.value.length);
			}
		}
		activeElement.focus();
		setTimeout(function(){f.className='';}, 100);
    }    

    
    window.$e = function(f)
    {
        _(f,"\r\n");
    }   
	

    window.$t = function(f)
    {
        _(f,"\t");
    } 
    
    function amp(t)
    {
       if(shiftPressed) _(f,"&");
       else _(f,"7");
     }
      
    /**
	 * onShift pressed
	 */    
    window.$z = function()
    {
		enshift = [['1','!'],['2','@'],['3','#'],['4','$'],['5','%'],['6','^'],['7','&amp;'],
                           ['8','*'],['9','('],['0',')'],['-','_'],['=','+'],['[','{'],[']','}'],
                           [';',':'],['\'','"'],['\\','|'],[',','&lt;'],['.','&gt;'],['/','?']];
        rushift = [['1','"'],['2','#'],['3',';'],['4','$'],['5','%'],['6',':'],['7','?'],
                           ['8','*'],['9','('],['0',')'],['\\','/'],['.',','],['-','_'],['=','+']];   
		shift = new Array();    
		langBoard = (language == 'ru') ? rushift : enshift;
		keys = new Array();
        chars = $i('keyboard').getElementsByTagName('td');
        for (i = 0; i < chars.length; i++)
        {
            keys[i] = chars[i];
        }
        for (i = 0; i < langBoard.length; i ++)
        {
            keys.foreach(function(item)
            {
                if(item.innerHTML.length == 1 || item.innerHTML[0] == '&')
                {
                    if (langBoard[i].indexOf(item.innerHTML) > -1)
                    {
                            if (shiftPressed == false) 
                            {
								pos = langBoard[i].indexOf(item.innerHTML);
								item.innerHTML = langBoard[i][pos+1];
							}
							else 
								item.innerHTML = langBoard[i][0];
                    }
                }
            });
        };
        showKeyboard();
		shiftPressed = !shiftPressed;
    }
    
    /**
	 * TAB
	 */
    window.$s = function()
    {
        capsPressed = !capsPressed;
    }      
	
    /**
	 * createRange
	 */
	function cr()
    {
		if (activeElement.createTextRange) range = document.selection.createRange();
	}

    /**
	 * Find elements, that can be edited by our virtual
	 * keyboard, then we found our keyboard to make it
	 * drag`n`drop.
	 */
    function findElements()
    {    	    	
        var searchElements  = new Array();
        var resultElements  = new Array();
        searchElements      = document.getElementsByTagName('*');
        for (i = 0; i < searchElements.length; i++) {
            resultElements[i] = searchElements[i];
        }        
        if (resultElements.some(function(item){ return (item.type == 'textarea' || item.type == 'text'); })){
            	
            resultElements = resultElements.filter(function(item){ return (item.type == 'textarea' || item.type == 'text'); });
                        
            resultElements.foreach(function(item){

                item.onclick = function(){cr();activeElement = this;};
                if(typeof item.getAttribute('onkeyup') == 'function' || typeof item.getAttribute('onkeyup') == 'string') 
                {
                    newfunction = item.onkeyup.toString().replace(/;/,';if (activeElement.createTextRange) range = document.selection.createRange();');
                    newfunction = newfunction.replace('function onkeyup(event) {','');
                    if(userAgent != 'msie')
                    {
                        newfunction = newfunction.substr(0, newfunction.length-1);
                        item.setAttribute('onkeyup',newfunction);
                    }
                    else
                    {
                        item.setAttribute('onkeyup',eval(newfunction));
                    }   
                        
                } 
                else 
                {
                    item.onkeyup = function(){if (activeElement.createTextRange) range = document.selection.createRange();};
                }
                item.setAttribute('onselect', function(){if (activeElement.createTextRange) range = document.selection.createRange();});
                }
            );
        }

            
        if(activeElement != null)
        {
            showKeyboard();
        }
        else 
        {
			if(document.getElementsByTagName('textarea').length > 0)
            {
				activeElement = document.getElementsByTagName('textarea')[0];
				showKeyboard();    
			}
			else if(document.getElementsByTagName('input').length >0)
            {
                inputs = document.getElementsByTagName('input');
                for(i=0;i<inputs.length;i++)
                {
                    if(inputs[i].type == 'text')
                    {
                        activeElement = inputs[i];
                        showKeyboard();
                        return;
                    }
                }
            }       
       }
    }
    
    // virtual keyboard starts here ^__^
	
	/**
	 * Make keyboard buttons useable
	 */
    function showKeyboard()
    {
        keys = new Array();
        chars = $i('keyboard').getElementsByTagName('td');
        for (i = 0; i < chars.length; i++) 
        {
            keys[i] = chars[i];
        }
        keys.foreach(function(item)
        {
            if(item.innerHTML.length == 1 || item.innerHTML[0] == '&'  )
                item.onclick = function() {this.className = "pressed";_(this,this.innerHTML);};});
        skeys = new Array();
		activeElement.focus();
        if(shiftPressed) 
        {
         $i('shift').className = 'pressed';
        }
         if(capsPressed) 
        {
         $i('caps').className = 'pressed';
        }

		canShown = true;
    }
	
	/**
	 * Async load keyboard
	 */
	function loadKeyboard()
	{
		req = createRequestObject();
		if(req)
        {
			req.onreadystatechange = function()
            {
                try{
                    if (req.readyState == 4) 
                    {
                        if (req.status == 200)
                        {
                            $i('window').innerHTML = req.responseText;
                            if (userAgent != 'msie') $$('cl').marginTop = 3;
                            if (userAgent == 'msie' || window.opera) $$('cl').marginTop = 0;
                            findElements();
                                 $i('shift').className = '';
                                 shiftPressed = false;
                                 $i('caps').className = '';
                                 capsPressed = false;
                        }
                    }
                } catch(e){}
            };
            lang = (language == 'ru') ? 'russian' : 'english';
            req.open("GET", '/vkb/'+lang+'.phtml?hash='+ Math.random(), true);
            req.send(null);
        }
		document.body.onkeypress =  _close;
		document.body.onkeypress = _close;
		document.body.onkeyup = _close;
	}
	
	/**
	 * Close keyboard window
	 */
	function _close(e)
	{
		if (!e) var e = window.event;
		if (e.keyCode == 27) closeWindow();
	}
	
	/**
	 * Crossbrowser XMLHttpRequest creating
	 */
	function createRequestObject()
	{
		var xmlhttp;
		try 
        {
			xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e)
        {
			try 
            {
				xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
			} 
            catch (E) 
            {
				xmlhttp = false;
			}
		}
		if (!xmlhttp && typeof XMLHttpRequest!='undefined') 
        {
			xmlhttp = new XMLHttpRequest();
		}
		return xmlhttp;
	}
		
	/**
	 * Browser window size
	 */
	function getPageSize()
    {
		var xScroll, yScroll;
		var windowWidth, windowHeight;
		if(window.innerHeight && window.scrollMaxY)
        {	
			xScroll=document.body.scrollWidth;
			yScroll=window.innerHeight + window.scrollMaxY;
		} 
        else if(document.body.scrollHeight>document.body.offsetHeight)
        {
			xScroll=document.body.scrollWidth;
			yScroll=document.body.scrollHeight;
		}
        else
        {
			xScroll=document.body.offsetWidth;
			yScroll=document.body.offsetHeight;
		}

		if(self.innerHeight)
        {
			windowWidth=self.innerWidth;
			windowHeight=self.innerHeight;
		}else if(document.documentElement && document.documentElement.clientHeight)
        {
			windowWidth=document.documentElement.clientWidth;
			windowHeight=document.documentElement.clientHeight;
		}else if(document.body)
        {
			windowWidth=document.body.clientWidth;
			windowHeight=document.body.clientHeight;
		}	
		if(yScroll<windowHeight)
        {
			pageHeight=windowHeight;
		}
        else
        { 
			pageHeight=yScroll;
		}
		if(xScroll<windowWidth)
        {	
			pageWidth=windowWidth;
		}
        else
        {
			pageWidth=xScroll;
		}
		return [pageWidth, pageHeight]
	}
	
    /**
	 * Create div element with keyboard
	 */
	function openWindow(startTop, startLeft, width, height)
	{
		if (startTop ==0 && startLeft == 0) 
        {
			startTop	= parseInt($$('vkeyboard').top);
			startLeft	= parseInt($$('vkeyboard').left);
		}
		else
        {
			// -> disable HTML editor
			if (document.getElementById('messagecomposetextarea') && document.getElementById('disable_wysiwyg') && tinyMCE)
			{
				if (document.getElementById('disable_wysiwyg').value == 'HTML')
				{
					toggle_editor('Текст', 'messagecomposetextarea');
					document.getElementById('disable_wysiwyg').value = 'Текст';
				}
			}
			
			if (document.getElementsByTagName('textarea')[0])
			{
				var t = 0;
				var l = 0;
				obj = document.getElementsByTagName('textarea')[0];
				while( obj )
				{
					var d = obj.tagName;
					t += parseInt( obj.offsetTop );
					l += parseInt( obj.offsetLeft );
					obj = obj.offsetParent;
				}
				obj = document.getElementsByTagName('textarea')[0];
				startTop = obj.parentNode.clientHeight + t-height-5;
				startLeft = l;
				if (userAgent == 'gecko' && !window.opera) startTop = startTop - 5; 
			}
			else 
            {
				startTop	= '250';
				startLeft	= '250';
			}
		}
	
		var load=document.getElementById('zloading');
		load.style.display='block';
		load.style.width	= 1
		load.style.height	= 1;
		var template	='<div id="vkeyboard" style=\'top:'+startTop+';left:'+startLeft+';width:'+width+'px;height:'+height
					+'px;\' class=\'window\'><ul class=\'wul\'><li id=\'li\' class=\'wzag\' onmousedown=\'dragWindow'
					+'(this.parentNode.parentNode, event)\'><font>Экранная клавиатура&nbsp;<a href="javascript:language=\'en\';'
					+'openWindow(0, 0, '+width+', '+height+');">'
					+'анг</a><a href="javascript:language=\'ru\';openWindow(0,0 , '
					+width+', '+height+');">рус</a></font><b><a id=\'cl\' href=\'javascript:void'
					+'(0);\' onclick=\'javascript:closeWindow();\' class=\'close\'>&nbsp;</a></b></li><li class'
					+'=\'inner\' id=\'window\'><h1></h1></li></ul></div>';
					loadKeyboard();
		load.innerHTML=template;
	}
    
	/**
	 * Close window
	 */
	function closeWindow()
    {
		document.getElementById('zloading').style.display='none';
		document.getElementById('zloading').innerHTML='';
	}
	
    /**
	 * Drag`n`drop
	 */
	function dragWindow(element, event)
	{
		var dX=event.clientX-parseInt(element.style.left);
		var dY=event.clientY-parseInt(element.style.top);
		if(document.addEventListener)
        {
			document.addEventListener("mousemove", moveWindow, true);
			document.addEventListener("mouseup", upMouse, true);
		}
        else if(document.attachEvent)
        {
			document.attachEvent("onmousemove", moveWindow);
			document.attachEvent("onmouseup", upMouse);
		}
		if(event.stopPropagation)
        {
			event.stopPropagation();
		}
        else
        {
			event.cancleBubble=true;
		}
		if(event.preventDefault)
        {
			event.preventDefault(); 
		}
        else
        {
			event.returnValue=false;
		}
		function moveWindow(e)
		{
			if(!e){e=window.event}
			element.style.filter="alpha(opacity:75)";
			element.style.KHTMLOpacity="0.75";
			element.style.MozOpacity="0.75";
			element.style.opacity="0.75";
			element.style.left=(e.clientX-dX)+'px';
			element.style.top=(e.clientY-dY)+'px';
			element.style.cursor='move';
			if(event.stopPropagation)
            {
				event.stopPropagation();
			}
            else
            {
				event.cancleBubble=true;
			}
			if(parseInt(element.style.left)<0){element.style.left='1px';}
			if(parseInt(element.style.left)+parseInt(element.style.width)>getPageSize()[0]){element.style.left=getPageSize()[0]-parseInt(element.style.width)-1+'px';}
			if(parseInt(element.style.top)<0){element.style.top='1px';}
			if(parseInt(element.style.top)+parseInt(element.style.height)>getPageSize()[1]){element.style.top=getPageSize()[1]-parseInt(element.style.height)-1+'px';}
		}
		function upMouse(e)
        {
			if(!e){e=window.event}
			if(document.removeEventListener)
            {
				document.removeEventListener("mouseup", upMouse, true);
				document.removeEventListener("mousemove", moveWindow, true);
			}
            else if(document.detachEvent)
            {
				document.detachEvent("onmouseup", upMouse);
				document.detachEvent("onmousemove", moveWindow);
			}
			element.style.filter="alpha(opacity:100)";
			element.style.KHTMLOpacity="1";
			element.style.MozOpacity="1";
			element.style.opacity="1";
			element.style.cursor='default';
			if(event.stopPropagation)
            {
				event.stopPropagation();
			}
            else
            {
				event.cancleBubble=true;
			}
		}
	}

function vkbd_resized()
{
   closeWindow();
}
window.onresize = vkbd_resized;
