lunes, 14 de abril de 2008

Ejemplo de Ajax

Proporcionado por Xakutin. Gracias

//URLs de las JSPs encargadas de realizar la operacion en el servidor
var WS_URL_ADD_CAMERA= URL_OPERATIONS + 'addCamara.jsp';
var WS_URL_ADD_RECORDING=URL_OPERATIONS + 'addGrabacion.jsp';
var WS_URL_DEL_CAMERA=URL_OPERATIONS + 'delCamara.jsp';
var WS_URL_DEL_RECORDING=URL_OPERATIONS + 'delGrabacion.jsp';
var WS_URL_ADD_SCHEDULE=URL_OPERATIONS + 'addProgramacion.jsp';
var WS_URL_GET_ID_RECORDING=URL_OPERATIONS + 'getIdGrabacion.jsp';
var WS_URL_MOD_CAMERA=URL_OPERATIONS + "modCamara.jsp";
var WS_URL_MOD_PROGRAMACION=URL_OPERATIONS + "modProgramacion.jsp";
var WS_ANADIR_TAREA="agregarTarea.jsp";
var WS_URL_START_RECORD = URL_OPERATIONS + "recordCam.jsp";
var WS_URL_STOP_RECORD = URL_OPERATIONS + "stopRecordCam.jsp";
var WS_URL_SAVE_PHRASE = URL_OPERATIONS + "savePhrase.jsp";


/* Funciones encargadas de hacer peticiones al servidor sin tener que
volver a cargar la página
Parametros:
*/
function addCamaraToServerXML(sNombre, sIp, sModelo){
var bResult=bMakeSyncRequest(WS_URL_ADD_CAMERA + '?txtNombre='+sNombre+'&txtIp='+sIp+'&selModelo='+sModelo);

return(bResult);
}

/* Descripcion
Parametros: -
*/
function anadirTarea(sIp,sFecha,sSegundo,sMinuto,sHora,sDuracion,sSegundoFin,sMinutoFin,sHoraFin){
var resultad_peticion = bMakeSyncRequest("http://tehuelche.hi.inet:8082/vigilaepc/agregarTarea.jsp?sFecha"+"=" + sFecha + "&sIp"+"="+sIp+"&sSegundoInicio="+sSegundo+"&sMinutoInicio="+sMinuto+"&sHoraInicio="+sHora+"&sDuracion="+sDuracion+"&sSegundoFin="+sSegundoFin+"&sMinutoFin="+sMinutoFin+"&sHoraFin="+sHoraFin );

}

/* Descripcion
Parametros: -
*/
function savePhrase(sFrase){
var bResult=bMakeSyncRequest(WS_URL_SAVE_PHRASE + '?frase='+sFrase);
return(bResult);

}

/* Descripcion
Parametros: -
*/
function startRecordFromServer(sNombreGrabacion, sUrlImage, sTempDir, sWidth, sHeight){
//var bResult=bMakeSyncRequest(WS_URL_START_RECORD + '?nombreGrabacion='+sNombreGrabacion+'&urlCamImage='+sUrlImage+'&tempDir='+sTempDir);
var bResult=bMakeSyncRequest(WS_URL_START_RECORD + '?nombreGrabacion='+sNombreGrabacion+'&urlCamImage='+sUrlImage+'&tempDir='+sTempDir+'&width='+sWidth+'&height='+sHeight);

return(bResult);
}

/* Descripcion
Parametros: -
*/
function stopRecordFromServer(){
var bResult=bMakeSyncRequest(WS_URL_STOP_RECORD);
return(bResult);
}

/* Descripcion
Parametros: -
*/
function addGrabacionToServerXML(sNombreGrabacion, sArchivo, sIpCamara){
var bResult=bMakeSyncRequest(WS_URL_ADD_RECORDING + '?nombreGrabacion='+sNombreGrabacion+'&nombreArchivo='+sArchivo+'&ipCamara='+sIpCamara);
return(bResult);
}

/* Descripcion
Parametros: -
*/
function delCamaraToServerXML(sIp){
var bResult=bMakeSyncRequest(WS_URL_DEL_CAMERA + '?ipCamara='+sIp);
return(bResult);
}

/* Descripcion
Parametros: -
*/
function delGrabacionToServerXML(sIpCamara,sIpCliente,sNombreGrabacion){
var bResult=bMakeSyncRequest(WS_URL_DEL_RECORDING + '?ipCamara='+sIpCamara+'&nombreGrabacion='+sNombreGrabacion + '&ipCliente=' + sIpCliente);
return(bResult);
}

/* Descripcion
Parametros: -
*/
function addProgramacionToServerXML(sDiaProgramacion,sHoraInicio,sMinutosInicio,sHoraFin,sMinutosFin){
var bResult=bMakeSyncRequest(WS_URL_ADD_SCHEDULE + '?diaProgramacion='+sDiaProgramacion+'&horaInicio='+sHoraInicio+'&minutosInicio='+sMinutosInicio+'&horaFin='+sHoraFin+'&minutosFin='+sMinutosFin);
return(bResult);
}

/* Descripcion
Parametros: -
*/
function getIdGrabacionFromServerXML(sIpCamara){
var sResult=sMakeSyncRequest(WS_URL_GET_ID_RECORDING + '?ipCamara='+sIpCamara);
return(sResult);
}

/* Descripcion
Parametros: -
*/
function modCamaraToServerXML(sXML){
var bResult=bMakeSyncRequestXML(WS_URL_MOD_CAMERA,sXML);
return(bResult);
}


function modProgramacionToServerXML(sXML){


var bResult=bMakeSyncRequestXML(WS_URL_MOD_PROGRAMACION,sXML);

return(bResult);
}


//Crea el objeto XMLHttpRequest
function getXMLHttpRequest(){
var oXMLHttpRequest = false;
if (window.ActiveXObject) { // IE
try {
oXMLHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {

try {
oXMLHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
return(oXMLHttpRequest);
}

//Realiza una petición a una URL y devuelve true si la operación ha sido correcta
//y false en caso contrario
function bMakeSyncRequest(url) {

oXMLHttpRequest=getXMLHttpRequest();

if (!oXMLHttpRequest) {
}else{

oXMLHttpRequest.open('GET', url, false);

oXMLHttpRequest.send(null);

var oXMLDocument=oXMLHttpRequest.responseXML;

//Consultamos el nodo status
var oNodeStatus = oXMLDocument.selectSingleNode("//status");

//alert(" tt"+oNodeStatus.text);
if (oNodeStatus.text=="OK"){

return(true);
}
}

//alert(url);
return(false);
}

//Realiza una petición a una URL y devuelve el texto del nodo DATA de la respuesta
//Se devuelve NULL en caso contario
function sMakeSyncRequest(url) {
var sResult=null;

oXMLHttpRequest=getXMLHttpRequest();

if (!oXMLHttpRequest) {
}else{
oXMLHttpRequest.open('GET', url, false);
oXMLHttpRequest.send(null);
var oXMLDocument=oXMLHttpRequest.responseXML;
//Consultamos el nodo status
var oNodeStatus = oXMLDocument.selectSingleNode("//status");
if (oNodeStatus.text=="OK"){
var oNodeDATA = oXMLDocument.selectSingleNode("//data");
sResult=oNodeDATA.text;
}
}

return(sResult);
}

//Envia un XML a una URL, devuelve true si ha ido todo bien, y false en
//caso contrario
function bMakeSyncRequestXML(sUrl, sXML){
oXMLHttpRequest=getXMLHttpRequest();

if (!oXMLHttpRequest) {
}else{
var oXMLDom = new ActiveXObject("Microsoft.XMLDOM");
oXMLDom.loadXML(sXML);
//Mandamos el XML

oXMLHttpRequest.open('POST', sUrl, false);

oXMLHttpRequest.send(oXMLDom);

var oXMLDocument=oXMLHttpRequest.responseXML;
//Consultamos el nodo status

var oNodeStatus = oXMLDocument.selectSingleNode("//status");


if (oNodeStatus.text=="OK") {

return(true);
}
}

return(false);
}

// Reliza una petición a una URL de forma asíncrona
function makeAsyncRequest(url) {
oXMLHttpRequest=getXMLHttpRequest();

if (!oXMLHttpRequest) {
}else{
oXMLHttpRequest.open('GET', url, true);
oXMLHttpRequest.send(null);
}
}


// Reliza una petición a una URL de forma asíncrona
function makeAsyncRequestNoCache(url) {
oXMLHttpRequest=getXMLHttpRequest();

if (!oXMLHttpRequest) {
}else{
url+="&rnd="+Math.floor(Math.random()*1000000); //Le añadimos este parametro para evitar la cache del navegador
oXMLHttpRequest.open('GET', url, true);
oXMLHttpRequest.send(null);
}
}

// Reliza una petición a una URL de forma síncrona
function makeSyncRequest(url) {
oXMLHttpRequest=getXMLHttpRequest();

if (!oXMLHttpRequest) {
}else{
oXMLHttpRequest.open('GET', url, false);
oXMLHttpRequest.send(null);
}
}

sábado, 12 de abril de 2008

Frames en Internet Explorer Mobile

A la hora de insertar frames en una página diseñada para win mobile, me he encontrado con el problema de que era imposible insertar un frame oculto. Según la página de elementos permitidos para explorer (la versión de móvil completa está aquí) dice que hay una serie de valores mínimo para tamaño de los frames, es decir que nunca podrán ser cero algunos elementos.

Lo solucionamos con Ajax, que está permitido para la versión Windows Mobile 6 (y las anteriores también, pero no doy fé de ello). Queda pendiente incluir un ejemplo de Ajax.

Actualización a Windows Mobile 6.1

Si os toca pegaros con Windows Mobile, este cuadro resume las diferencias entre las distintas versiones.

Nuevas librerías javascript

He encontrado un par de librerías de Javascript que pueden ser interesantes.

Jquery y Prototype

El primero de ellos intenta simplificar al máximo el desarrollo en javascript, mediante la Chainability (encadenabilidad :) ) de métodos ya creados.

El segundo se basa en la libería Json para llegar a lo mismo.