sábado, 6 de junio de 2009

Practica 3

Lo que hace el programa es facil de explicar, simplemente es un menú de la asignatura en tu boton derecho, de forma que es mucho más rápido acceder a los lugares frecuentados en clase. Además maximiza la ventana del navegador.


He decidido hacer esto, en principio porque no se me ocurria nada (yo de imaginación 0 está visto), habia pensado modificar las fuentes de las páginas pero, además de que no me salia (tampoco me entretení mucho), no le veía utilidad. Pero al final se me ocurrió lo del menú en el botón derecho, y como eso de estar para atrás ahora al tema 2, luego para atrás y cambiando de tema (sobre todos cuando aún estabamos viendo algo de javascript), me mareaba y al final no sabia donde estaba (jeje), me pareció una buena idea, así que aquí está el resultado. Lo de maximizar la ventana es más por manía mia que por otra cosa pero como resultó facil lo puse



Código del programa



// ==UserScript==

// @name AAP-Nav-BotonDerecho

// @namespace http://geneura.org/projects/greasemonkey

// @description Navegador en el botón derecho por las distintas páginas de AAP

// @include http://geneura.ugr.es/~jmerelo/asignaturas/*

// ==/UserScript==



var head = document.getElementsByTagName('head');



//Crearemos el estilo del menu, para ello creo una etiqueta de CSS y le inserto el codigo

var miStyle = document.createElement('style');


miStyle.innerHTML='.tipo1{position: absolute;background-color: Menu;width: 200px;visibility: hidden;}a.menuitem {font-size: 0.8em; font-family: Arial, Serif; text-decoration: none;}';


//todo esto lo meto al final de la cabecera (donde suele ir el codigo CSS si no va en un archivo aparte)

head[0].appendChild(miStyle);



//Igual que antes creamos una etiqueta pero ahora de javaScript (el codigo fue creado y probado primero en una pagina html para ver si funcionaba)

var miScript = document.createElement('script');


miScript.innerHTML='var menutipo = 1;function sombra(e){ if (document.getElementById) { mimenu = document.getElementById("menurapido") }else if (document.all) { mimenu = document.all.menurapido } if (!e) {var e = window.event} var borde_derecho = document.body.clientWidth - e.clientX; var borde_inferior = document.body.clientHeight - e.clientY; if (borde_derecho < mimenu.offsetWidth){ mimenu.style.left = document.body.scrollLeft + e.clientX - menurapido.offsetWidth + "px"} else{ mimenu.style.left = document.body.scrollLeft + e.clientX + "px"} if (borde_inferior < mimenu.offsetHeight){ mimenu.style.top = document.body.scrollTop + e.clientY - menurapido.offsetHeight} else{ mimenu.style.top = document.body.scrollTop + e.clientY} mimenu.style.visibility = "visible"; return false}function visibilidad(){ if (document.getElementById) { mimenu = document.getElementById("menurapido") }else if (document.all) { mimenu = document.all.menurapido } mimenu.style.visibility = "hidden"}document.oncontextmenu = sombra;document.onclick = visibilidad;';



//Al igual que antes insertamos la etiqueta en la cabecera

head[0].appendChild(miScript);




<
>//Ahora es el turno de crear lo que lleva el menú en sí

//Primero la etiqueta div donde va todo esto con la identificación id=menurapido para que el menu sea esto

var menu = document.createElement('div');

menu.setAttribute('id','menurapido');



//El primer enlace a la pagina principal

//Creo un enlace con su class y su href y lo meto en el div

var enlace1 = document.createElement('a');

enlace1.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/');

enlace1.setAttribute('class','menuitem');

//A este enlace (por ser la página principal) lo pongo un poco más grande creando la etiqueta font dentro de a dentro de div

var fuente = document.createElement('font');

fuente.setAttribute('size','4');

var txt1=document.createTextNode('Pagina principal');

//se añade el texto que aparecera en el menu a la etiqueta fuente

fuente.appendChild(txt1);

//se añade la etiqueta fuente al hipervínculo

enlace1.appendChild(fuente);

//se añade el hipervínculo a la etiqueta div

menu.appendChild(enlace1);



//creo el salto de línea

var enlacea = document.createElement('br');

menu.appendChild(enlacea);



//creo la barra horizontal para separar secciones

var enlaceb = document.createElement('hr');

menu.appendChild(enlaceb);



//el título de la sección (este no tiene enlace pero lo remarco con la etiqueta n)

var enlacec = document.createElement('b');

var txtc=document.createTextNode('Temario');

enlacec.appendChild(txtc);

menu.appendChild(enlacec);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



//Ahora voy creando cada enlace a cada tema

var enlace2 = document.createElement('a');

enlace2.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/AAP-Tema-1.mhtml');

var txt2=document.createTextNode('Tema 1: Introducción');

enlace2.setAttribute('class','menuitem');

enlace2.appendChild(txt2);

menu.appendChild(enlace2);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



var enlace3 = document.createElement('a');

enlace3.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/AAP-Taller-1.mhtml');

var txt3=document.createTextNode('Taller 1: Javascript');

enlace3.setAttribute('class','menuitem');

enlace3.appendChild(txt3);

menu.appendChild(enlace3);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



var enlace4 = document.createElement('a');

enlace4.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/AAP-Taller-2.mhtml');

var txt4=document.createTextNode('Taller 2: XML');

enlace4.setAttribute('class','menuitem');

enlace4.appendChild(txt4);

menu.appendChild(enlace4);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



var enlace4 = document.createElement('a');

enlace4.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/AAP-Taller-3.mhtml');

var txt4=document.createTextNode('Taller 3: Servicios Web');

enlace4.setAttribute('class','menuitem');

enlace4.appendChild(txt4);

menu.appendChild(enlace4);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



//separando secciones

var enlaceb = document.createElement('hr');

menu.appendChild(enlaceb);



//Título de sección

var enlacec = document.createElement('b');

var txtc=document.createTextNode('Prácticas');

enlacec.appendChild(txtc);

menu.appendChild(enlacec);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



//En lugar de poner el nombre de cada práctica simplemente pondremos Practia1,2,etc, por lo que ahora si podemos hacer un bucle que nos meta todos los enlaces de golpe

for (var prac = 1; prac < 8 ; prac ++ ) {

var enlaceprac = document.createElement('a');

enlaceprac.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/AAP-Practica-'+prac+'.mhtml');

var txtprac=document.createTextNode('Práctica '+prac);

enlaceprac.setAttribute('class','menuitem');

enlaceprac.appendChild(txtprac);

menu.appendChild(enlaceprac);

var enlacea = document.createElement('br');

menu.appendChild(enlacea);

}



//separando secciones

var enlaceb = document.createElement('hr');

menu.appendChild(enlaceb);



//Título de sección

var enlacec = document.createElement('b');

var txtc=document.createTextNode('Otros enlaces');

enlacec.appendChild(txtc);

menu.appendChild(enlacec);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



//Otros enlaces que se suelen usar en la asignatura, al menos yo

var enlace5 = document.createElement('a');

enlace5.setAttribute('href','http://aap-ugr-2007.wikispaces.com/');

var txt5=document.createTextNode('Wiki');

enlace5.setAttribute('class','menuitem');

enlace5.appendChild(txt5);

menu.appendChild(enlace5);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



var enlace6 = document.createElement('a');

enlace6.setAttribute('href','http://tech.groups.yahoo.com/group/aap-ugr/');

var txt6=document.createTextNode('Lista de correo');

enlace6.setAttribute('class','menuitem');

enlace6.appendChild(txt6);

menu.appendChild(enlace6);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



var enlace7 = document.createElement('a');

enlace7.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/cgi/enviarPracticas.cgi');

var txt7=document.createTextNode('Enviar Prácticas');

enlace7.setAttribute('class','menuitem');

enlace7.appendChild(txt7);

menu.appendChild(enlace7);



var enlacea = document.createElement('br');

menu.appendChild(enlacea);



var enlace7 = document.createElement('a');

enlace7.setAttribute('href','http://geneura.ugr.es/~jmerelo/asignaturas/AAP/planet.cgi');

var txt7=document.createTextNode('Planet');

enlace7.setAttribute('class','menuitem');

enlace7.appendChild(txt7);

menu.appendChild(enlace7);



document.body.appendChild(menu);





//Por último metemos el escript que es el que "llama" al menú y le da forma (la que le hemos puesto en la etiqueta style

var miScript2 = document.createElement('script');




miScript2.innerHTML='if (document.getElementById) { document.getElementById("menurapido").className = "tipo1" } else if (document.all) { document.all.menurapido.className = "tipo1" } ';



document.body.appendChild(miScript2);



//Al final también he visto que siempre estaba maximizando la pantalla del navegador para ver bien el menú o por manía asi que me creado otra aplicación que me maximizara todas las páginas (que perro soy to por no darle a un botoncito), asi que he insertado aqui el pequeño codigo.

var miScript3 = document.createElement('script');


miScript3.innerHTML='window.moveTo(0,0);top.window.resizeTo(screen.availWidth,screen.availHeight);';


head[0].appendChild(miScript3);







Está puesto en la dirección: http://www.fileden.com/getfile.php?file_path=http://www.fileden.com/files/2007/11/7/1570028/aap-menuderecho.zip


Lo he subido en un zip porque el no me dejaba subirlo en la extension .user.js.


El menú queda de la siguiente forma:




No hay comentarios: