Depurar código js para tablets es una lata. Hay una manera cómoda de hacerlo con el simulador Genymotion para artefactos que no son de apple y también es cierto que funciona muy bien la consola del chrome en modo simulación, pero además puede resultar útil un script que me ha pasado Kike, que comparto a su vez con vosotros.
function consolaTablet() {
/* Con esta variable activamos la ventana de "consola" dentro de la aplicación */
var debug = true;
var objLog = window.console;
// Si hay debug, sobreescribimos el console.log para que nos saque los mensajes por pantalla.
if (debug) {
window.console = {
log: function(msg) {
printDebug(msg);
}
};
}
/* Método con el que pintamos en la capa la salida de la consola. Si no existiera la capa, la crea. */
function printDebug(msj) {
if (!$("#debug").is('*')) {
$("body").append("<div id='debug'></div>");
var alto = $(window).height() - $("#debug").height() - 20 - $("footer").height();
var ancho = $(window).width() - $("#debug").width() - 25;
$("#debug").css("top", alto + "px");
$("#debug").css("left", ancho + "px");
}
/* Comprobamos si es un objeto. Si lo fuera se va a la consola del navegador. */
if (typeof(msj) != 'object') {
$("#debug").append('> ' + msj + '<br>');
} else {
objLog.log(msj);
}
}
Y un poquito de css...
#debug {
position: fixed;
width: 400px;
opacity: 0.6;
height: 200px;
overflow-y: auto;
border: solid 1px #CCCCCC;
background: white;
box-shadow: 0 0 6px rgba(0, 0, 0, .4);
font-size: 10px;
padding: 5px;
z-index: 20000;
color: black;
}
