<!--
dirImg = httpswwwroot + '/personalizado/teclado_virtual/';
tecladoSeparacionVer = 25;
tecladoSeparacionHor = 25;

tecladoVisible = false;
tecladoTarget = '';
permiteOcultar = true; 

var bloqMinusculas = new Array(
	/* '131', '135', '140', '162', '164', '167', '247', '175', '177', '179', '182', '188', '190', '198', '215', '222' */
	'131', '179', '135', '140', '162', '164', '247', '175', '188', '190', '198', '215', '222', '167', '177'
	);

var bloqMayusculas = new Array(
	/* '134', '137', '156', '163', '165', '172', '254', '176', '178', '181', '185', '189', '197', '208', '216', '223' */
	'134', '181', '137', '156', '163', '165', '254', '176', '189', '197', '208', '216', '223', '172', '178'
	);

function tecladoBotonOver(elem) {
	$(elem).attr('class', 'over');
}

function tecladoBotonOut(elem) {
	$(elem).attr('class', 'out');
}

function findPosX(obj) {
	var curleft = 0;
	if (obj.offsetParent) 
	{
		while (obj.offsetParent)
		{
			curleft += obj.offsetLeft
			obj = obj.offsetParent;
		}
	}
	else if (obj.x)
		curleft += obj.x;
	return curleft;
}

function findPosY(obj) {
	var curtop = 0;
	if (obj.offsetParent) 
	{
		while (obj.offsetParent) 
		{
			curtop += obj.offsetTop
			obj = obj.offsetParent;
		}
	}
	else if (obj.y) curtop += obj.y;
	return curtop;
}

function posicionaTeclado() {
	inputPosX = findPosX(tecladoTarget);
	inputPosY = findPosY(tecladoTarget);
	inputHeight = $(tecladoTarget).height();
	inputWidth = $(tecladoTarget).width();
	tecladoWidth = $('#tecladoVirtual_visible').width();
	screenWidth = $('body').width();
	
	tecladoPosY = inputPosY + inputHeight + tecladoSeparacionHor;
	tecladoPosX = inputPosX + Math.round( inputWidth / 2 ) - Math.round( tecladoWidth / 2 );
	
	if( tecladoPosX < 0 ) tecladoPosX = inputPosX;
	else if( ( tecladoPosX + tecladoWidth ) > screenWidth ) tecladoPosX = screenWidth - tecladoWidth - tecladoSeparacionHor;
	
	$('#tecladoVirtual_visible').css('position', 'absolute');
	$('#tecladoVirtual_visible').css('left', tecladoPosX);
	$('#tecladoVirtual_visible').css('top', tecladoPosY);
}

function muestraTeclado() {
	posicionaTeclado();
	$('#tecladoVirtual_visible').fadeIn('normal');
	tecladoVisible = true;
}
function ocultaTeclado() {
	$('#tecladoVirtual_visible').fadeOut('normal');
	tecladoVisible = false;
}

function tecladoCambia(tipo) {
	if( tipo == 'a_mayusculas' ) {
		$('#bloqMinusculas').hide();
		$('#bloqMayusculas').show();
	} else if ( tipo == 'a_minusculas' ) {
		$('#bloqMinusculas').show();
		$('#bloqMayusculas').hide();
	}
	$(tecladoTarget).focus();
}

function insertaCodigo(elem_img) {
	num = elem_img.id;
	cod = '&#' + num.substring(5) + ';';
// HAY QUE QUITAR LA PARTE "tecla" .....
	if( tecladoTarget != '' ) 
	{
		txt = tecladoTarget.value;
		tecladoTarget.value = txt + cod;
	}
	$(tecladoTarget).focus();
}

function tecladoVirtual() {
	$('body').append('<div id="tecladoVirtual_visible"></div>');
	$('#tecladoVirtual_visible').mouseover(function() { permiteOcultar = false; });
	$('#tecladoVirtual_visible').mouseout(function() { permiteOcultar = true; });
	$('#tecladoVirtual_visible').click(function() { $(tecladoTarget).focus() });
	$('#tecladoVirtual_visible').Draggable({
		// http://interface.eyecon.ro/demos - Draggable
		snapDistance: 10, 
		frameClass: 'draggable'
	});
	if( tecladoVisible == false ) $('#tecladoVirtual_visible').hide();
	
	$('#tecladoVirtual_visible').append('<div id="tecladoHeader"></div>');
	$('#tecladoHeader').append('<p>Insertar s&iacute;mbolos tamazig </p>');

// Div con las letras en minúsculas
	$('#tecladoVirtual_visible').append('<div id="bloqMinusculas"></div>');
	for( i = 0; i < bloqMinusculas.length; i++) 
	{
		$('#bloqMinusculas').append('<img id="tecla' + bloqMinusculas[i] + '">');
		$( '#tecla' + bloqMinusculas[i] )
			.attr('src', dirImg + 'teclas_tmzig/tmzig_' + bloqMinusculas[i] + '.gif')
			.attr('class', 'out')
			.mouseover( function() { tecladoBotonOver(this); })
			.mouseout( function() { tecladoBotonOut(this); })
			.click( function() { insertaCodigo(this); });
	}

	$('#bloqMinusculas').append('<img id="caps_a_mayusculas">');
	$('#caps_a_mayusculas')
		.attr('src', dirImg + 'teclas_tmzig/caps_off.gif')
		.attr('class', 'out')
		.mouseover( function() { tecladoBotonOver(this); })
		.mouseout( function() { tecladoBotonOut(this); })
		.click( function() { tecladoCambia('a_mayusculas');});

// Div con las letras en MAYUSCULAS
	$('#tecladoVirtual_visible').append('<div id="bloqMayusculas"></div>');
	for( i = 0; i < bloqMayusculas.length; i++) 
	{
		$('#bloqMayusculas').append('<img id="tecla' + bloqMayusculas[i] + '">');
		$('#tecla' + bloqMayusculas[i])
			.attr('src', dirImg + 'teclas_tmzig/tmzig_' + bloqMayusculas[i] + '.gif')
			.attr('class', 'out')
			.mouseover( function() { tecladoBotonOver(this); })
			.mouseout( function() { tecladoBotonOut(this); })
			.click( function() { insertaCodigo(this); });
	}
	$('#bloqMayusculas').append('<img id="caps_a_minusculas">');
	$('#caps_a_minusculas')
		.attr('src', dirImg + 'teclas_tmzig/caps_on.gif')
		.attr('class', 'out')
		.mouseover( function() { tecladoBotonOver(this); })
		.mouseout( function() { tecladoBotonOut(this); })
		.click( function() { tecladoCambia('a_minusculas'); });
		
	tecladoCambia('a_minusculas');
	permiteOcultar = true;
}

function initTecladoVirtual() {
	tecladoVirtual();
}

$(document).ready( function() {
	// Crea el teclado
	initTecladoVirtual();
	tecladoVisible = false;

	$('input[@type="text"]').focus( function() {
		if( this.name.toLowerCase() != 'username' ) {
			tecladoTarget = this;
			if( tecladoVisible != true ) muestraTeclado();
		}
	});
	$('input[@type="text"]').blur( function() {
		if( tecladoVisible == true && permiteOcultar == true ) ocultaTeclado();
	});
	$('textarea').focus( function() {
		if( this.name.toLowerCase() != 'username' ) {
			tecladoTarget = this;
			if( tecladoVisible != true ) muestraTeclado(); 
		}
	});
	$('textarea').blur( function() {
		if( tecladoVisible == true && permiteOcultar == true ) ocultaTeclado(); 
	});
}); 

-->
