En una plática con DS, me mostraba el sistema de 2advanced, en el que usando solamente Flash tambien se puede navegar usando los botones de "Atrás" y "Adelante" del navegador. Le comenté que es muy complejo lo que hacían ellos y que podía hacerlo mejor. Puede ser mejor estructurado y más sencillo de usar. Yo tenía varias teorías, pero como no me dedico a hacer webs, núnca he tenido la necesidad real de hacerlo. No me gusta comerme mis palabras, así que me dí a la tarea de hacer el sistema, en un rato libre, en cosa de 20 minutos estaba funcionando(en Firefox), gracias a FSM mi hipótesis funcionó.
Basicamente mi idea era: 1.- Verificar la posición actual. Que es esa que se encuentra despues de un signo de numero dentro de una URL, por ejemplo:
www.cristalab.com/pagina.php?algo=1#Esto es posicion
A eso que esta después del signo de numero, se le denomina hash. 2.- Cada vez que el hash cambie, será envíado a Flash como una variable String. 3.- Flash la interpretará como una variable que define la sección actual. Por ejemplo:
Código :
loadMovie(variableHash);
Funcionalidad:
Haciendo copy/paste de la url
Utilizando las flechas, atrás y adelante
Moviendole a lo wey en el navegador
Requerimientos:
Para el funcionamiento de la versión Alpha 0.2, se requiere FF, en futuras versiones será multi-navegador
Requiere tener activo JS(¿quién carajos no lo tiene?).
Aqui tienen el ejemplo funcionando(REPITO SóLO ESTA ASEGURADA LA CALIDAD de funcionamiento en FIREFOX): http://www.danonino.org/BrowseSystem/BrowseSystem.html
PERO para Internet Explorer, la cosa va distinto, requiere un poco de mas trabajo, sobre todo que accedemos a métodos y funciones que no son parte de ningún estandar (de por si IE no se apega). Tengo teorías acerca de como resolverlo, pero no el tiempo para hacerlo, si existe un developer valiente haganmelo saber por un Mensaje Privado. Requiere de mucho tiempo de test, test y test, no es tanto el código necesario, mas bien son muchas horas de prueba lo que necesito. Terminando de solucionar el detalle en IE, tendremos un sistema para navegar en Flash, de forma fácil y c00l.
PD. Gracias DanielSemper por ser mi beta tester y reportar el primer bug, el cual bautizamos como el "Bug virgen". Siento decirlo pero lo desvirgue, el bug esta corregido.
NOTA: descubrimos un BUG en Google Talk, borra las etiquetas(hash) de las url.
Dano, flashblorg.org utiliza algo parecido, utilizan los "anchors" del html para ir a diferentes secciones. Eso fue algo que no implementé en mi propio blog pues no servía con el mod_rewrite, que es más C00L , mira a ver como lo tienen montado ellos que imagino les irá en todos los navegadores. Aunque aún no termino de entender "el sistema e navegación" (soy tonto) Por:_CONEJO
Se pueden combinar el anchor y el mod_rewrite, eso es lo mas c00l. De flashblog, revisa la url y no cambia, lo que funciona con ellos es las flechas atras y adelante. Esa es una gran diferencia. Y no se que tan fácil/dificil este de utilizar y que tan dinámico sea. Aqui la idea es hacer un componente que solo tengas que arrastrarlo y listo.
Te explico un poco, en tu blog, si entras por: http://www.theninjabunny.com/ Y te pones a ver posts, la URL en tu navegador NUNCA cambiará, por lo que el usuario común, acostumbrado a hacer copy/paste de la URL, esta jodido. (Tendría que hacer clic en el boton de link permanente) En cambio con el sistema de navegación si puede hacer copy/paste. Y como te decía arriba, en tu sistema puedes usar mod_rewrite y "anchors"(hash), se pueden combinar, dependiendo de las necesidades. Un ejemplo de combinación: Todos los links que haces desde fuera, los haces de la siguiente forma: www.theninjabunny.com/seccion_conejo1
Y para los que esten dentro de tu blog, navegando entre varias secciones podrán ver: www.theninjabunny.com/#seccion_conejo1
Que es mucho mejor, que simplemente ver: www.theninjabunny.com/ <- Como si estuvieran en un frame o algo así
De tal forma que seguiras explotando el mod_rewrite para los buscadores(o para lo que lo ocupes), y el "sistema de navegación" interno, será un plus que tus visitantes agradecerán
Aqui hay otros ejemplos, al parecer de aqui sacaron la info los de 2advanced.
Enlaces permanentes http://www.klynch.com/apps/flashlinking/#id=1
Enlaces permanentes aún más profundos http://www.magicpixel.com.au/tutorials/flash/deeplinking.cfm Por:NEO_JP
Conejo, las soluciones epecíficas las tiene que hacer uno mismo(se que no quieres resolver algo tuyo, que es solo un ejemplo), te planteo una tentativa solución: - En el contenido que indexas para los buscadores(<noscript></noscript>), tienes los links así: www.theninjabunny.com/conejo1 www.theninjabunny.com/conejo2 Así dejalos, no los muevas
- En tu control de mod_rewrite(Que solo se activa LA PRIMERA vez que llega un visitante a tu blog), limpia el contenido de la URL y remplazalo por el anchor. De tal manera que el mod_rewrite sigue funcionando para lo que lo quieres(links claros y legibles, y mas facilmente indexados, links externos y demás), pero una vez que llegan a tu sitio, tienes una navegación c00l para tus visitantes, la URL cambia dependiendo la sección en la que esten.
Me gustaría poder documentar todas las variantes, pero primero quiero lograr tener un motor de navegación: - Fácil de usar - Que funcione en todos los navegadores - Que este pensando para trabajar en distintos ambientes
p.d. Neo, pruebalo en IE, creo que tiene el mismo problema(repito sé la solución es cosa de tiempo para hacerlo) Por:Dano
touché, no sabía que pudiera hacer eso ', pensaba que la URL seguía igual... Por:_CONEJO
Les agradeceria mucho si llegaran a resolver este caso, he visto una pagina la cual si funciona en los dos navegadores y es http://flash-vortex.com/ Espero q sirva de algo. Por:Josue Jovel_blog
Anonymous :
Les agradeceria mucho si llegaran a resolver este caso, he visto una pagina la cual si funciona en los dos navegadores y es http://flash-vortex.com/ Espero q sirva de algo.
En la pagina de vortex no se utiliza ese sistema... ya que la url no aparece en la barra de direcciones...
En la que si funciona en los dos navegadores es en la de 2advanced que es por lo cual empezo todo esto... Por:maxer3d
Hola, les cuento q burguer king ya tiene un sistema q funciona en ie6 por lo menos. A ver si tambien sirve de algo. Aunque al paso q vamos me va a tocar desifrarlo a mi.. jejeje
Ej:
http://www.bk.com/#menu=5,-1,-1 Por:shenlong_blog
y si es para un proyecto.exe como se podria implementar un boton atras y adelante? Por:David Castro_blog
david, para un exe solo maneja variables dentro del exe que te indiquen la ruta que has venido siguiendo, tal vez pòr medio de un array Por:FeNtO
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>BrowseSystem</title>
<script src="swfobject.js"></script>
<script>
document.isIE = navigator.appName.indexOf("Microsoft") != -1;
var current = "";
var actual = "";
var ready = false;
function callReady(value){
ready = value;
}
function addSection(str){
top.location.hash = str;
if(document.isIE){
document.getElementById('flashnav').setAttribute('src', 'auxContent.php?hash='+str);
}
}
function verific(){
if(document.isIE){
actualizarHash();
}
if((top.location.hash != current) && ready){
current = top.location.hash;
defineSection(current);
}
}
function actualizarHash(){
var src_elements = document.frames['flashnav'].location.href.split("?hash=");
var newHash = src_elements[src_elements.length-1];
if(top.location.hash.substr(1) != newHash){
top.location.hash = newHash;
}
}
function thisMovie(movieName) {
return (document.isIE) ? window[movieName] : document[movieName];
}
function defineSection(str) {
str = str.substr(1);
thisMovie("BrowseSystem").defineSection(str);
}
setInterval(verific, 100);
</script>
</head>
<body>
<div id="BrowseSystemDiv"></div>
<script>
var so = new SWFObject("BrowseSystem.swf", "BrowseSystem", "550", "400", "8", "#2E5881");
so.write("BrowseSystemDiv");
</script>
<script language="javascript" type="text/javascript">
if(document.isIE) {
var firstHash = top.location.hash.substr(1);
document.write("<iframe id='flashnav' name='flashnav' src='auxContent.php?hash="+firstHash+"' style='display: none;'></iframe>");
}
</script>
</body>
</html>
Y tambien funciona en Firefox , pero no lo he probado en otros navegadores. Por:Adrián
Genial Adrián, pinta bien por lo que dices, no lo pude ver funcionando, si pudieras subir un swf de prueba, o quieres el fla que yo use, para verlo funcionando, envíame un mp para refinar lo que se tiene, pasarlo a Clase en JS y liberarlo, si gustas.
Ya le envíe el fla a Adrián y amablemente ha actualizado el addOn que ha hecho aqui:
http://www.iconperu.net/adrian/browse/
YA funciona en FF e IE, ahora es cuestión de tiempo, para revisarlo, probarlo y pasarlo a una clase de JS, formalizar la documentación y liberarlo como recurso.
Los interesados pueden colaborar probando el sistema, y enviandome un MP con bugs que encuentren.
Por nada, y con ganas de seguir aportando. Por:Adrián
quisiera saber como puedo hacer para el java scrip es un boton colgante a debajo de mi archivo tengo una pelicula flas bueno lo que hace al flash ponerse sobre del boton colante obviamente no se lee. si alguien sabe. necesito su ayuda les estare muy agradecida. eneidavich@yahoo.es Por:poner a tras aun flash_b
gracias a los amos del universo por hacer que todo al final funcione Por:tato_blog
Si vieron? lo del swfaddress? estaba usando la tecnica propuesta pero tenia problemas cuando los swf se quedaban cargando eternamente.. una vez tras otra.. lo raro es q no era siempre sino de vez en cuando... como 2 veces de 10... raro no? tonces segui buscando otra opcion para solucionarlo hasta q encontre esta.. vamos a ver q tal..
Comparto codigo que funciona en todos los exploradores sin necesidad de tener un iframe para que IE guarde el historial...
Código :
/*
Object Page
*/
var Page = {
anchorAdded : null,
Nav : {
createAnchor : function (anchorName){
/*
In order to see this working on IE 6 I should create a Iframe to add to the browser Story
*/
if (!$(anchorName)){
var obj_anchor = elements.htmlElement('a', {id:anchorName, name:anchorName});
var obj_body = document.body;
obj_body.appendChild(obj_anchor);
}
top.location.hash = anchorName;
},
readAnchor : function (){
return top.location.hash.replace("#", "");
}
}
};
/**
Put all generic DOM methods here
Object created by Juan Sebastian Romero
*/
var elements = {
/*
Creates an HTML Object with attributes
@Usage:
var div = elements.htmlElement('div', {id:5, class:'base'})
*/
htmlElement : function(elementType, attributes){
var html_object = document.createElement(elementType);
if(attributes){
for (var i in attributes){
switch (i) {
case 'class' :
html_object.className = attributes[i];
break;
default :
html_object.setAttribute(i, attributes[i]);
break;
}
}
}
return html_object;
}
};
Llevo dos días probando todas vuestras soluciones, y otras que he encontrado por la web, pero no llego a nada. No me funciona y me gustaría conseguirlo.
Si alguien tiene tiempo, le agradecería que me ayudase.