Que un escritorio muestre apps instaladas

Iniciado por GeorgArming, 10 Junio 2012, 14:32 PM

0 Miembros y 1 Visitante están viendo este tema.

GeorgArming

Hola. Estoy creando un escritorio web, y quiero que haga lo siguiente:

Tengo un archivo index.html. Quiero que dicho archivo muestre las apps instaladas, es decir, las que se encuentran en el directorio /apps. ¿De qué forma? Pues quiero que muestre un archivo concreto de cada app (el icono).

¿Cómo lo puedo hacer? Porque de momento lo que he conseguido es estático, es decir, muestro las apps que he puesto que se muestren en el index.html, pero quiero que se muestren las que estén en /apps. Muchas gracias.

#!drvy

#1
Tienes que recordar que html es un lenguaje de "decoracion".. lo que haces lo interpreta el navegador y no puedes hacer cosas complejas..

Para ello.. puedes recurrir a javascript.. y en particular te recomiendo un archivo .xml con todas las Apps instaladas.

Ejemplo del xml.
Código (html4strict) [Seleccionar]
<?xml version="1.0" encoding="utf-8" ?>
<Aplicaciones>

<aplicacion>
<icono>blabla.png</icono>
<titulo>Mi Primera aplicacion</titulo>
</aplicacion>

<aplicacion>
<icono>omgwtf.png</icono>
<titulo>Mi Segunda aplicacion</titulo>
</aplicacion>

</Aplicaciones>


Luego, (yo lo voy a hacer con jQuery para mostrártelo..) con javascript lo procesas..

Código (javascript) [Seleccionar]
<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function() {

// Obtener el archivo .xml
  $.ajax({
     type: "GET",
     url: "apps.xml",
     dataType: "xml",
     // Ejecutar ParsearXML
     success: ParsearXML
 });
});

function ParsearXML(xml){
 // Por cada tag <aplicacion>
 $(xml).find("aplicacion").each(function(){

 // Encontrar tag <icono>
 var icono = $(this).find('icono').text();

 // Encontrar tag <titulo>
 var titulo = $(this).find('titulo').text();

 // Añadir a id="apps" una imagen con el src del icono y el alt del titulo.
  $("#apps").append('<img src="'+ icono +'" alt="'+ titulo +'" />' + "<br />");
});
</script>
</head>
<body>
  <div id="apps">

  </div>
</body>
</html>


El resultado seria:
Código (html4strict) [Seleccionar]
<img alt="Mi Primera aplicacion" src="blabla.png"><br>
<img alt="Mi Segunda aplicacion" src="omgwtf.png"><br>


Saludos

GeorgArming

¡Muchísimas gracias, drvy! Voy a probar :) .

GeorgArming

Tengo otra duda relacionada:

Me gustaría que, de forma predeterminada o si el cuadro de búsqueda está en blanco, se muestren las apps instaladas. Si hay escrito algo en el cuadro de búsqueda, que salgan las apps que concuerden con lo buscado, en tiempo real (es decir, justo cuando escribes "A" SALEN TODAS las apps que contienen a, cuando ya llevas escrito "Abc" salen todas las apps que empiezan por abc,...). ¿Sabríais cómo hacerlo?