Comunidad de diseño web y desarrollo en internet online

Sistema de noticias para una web en Flash, XML y CSS

Citar            
MensajeEscrito el 20 May 2008 08:51 pm
Hola,

Encontre un ejemplo de un sistema de noticias aqui en cristalab: http://www.cristalab.com/ejemplos/45/sistema-de-noticias-para-una-web-en-flash-xml-y-css, el tema es que esta armado para mostrarse de arriba hacia abajo y necesitaria que estuviera al reves, realmente por mas que este comentado no es claro.

Alguien me podria dar una mano? aca esta el codigo:

Código :

stop();

//Cargar XML de las noticias
noticias = new XML();
noticias.ignoreWhite = true;
noticias.onLoad = function (){

   //Porcentajes y esas cosas
   totalxml = noticias.getBytesTotal();
   cargadoxml = noticias.getBytesLoaded();
   porcentajexml = Math.round((cargadoxml/totalxml)*100);

   //Si esta cargado del todo
   if (porcentajexml >= 100) {
      //Borramos el cargando
      removeMovieClip(cargando);
      
      //Shortcuts del XML
      notis_puerto = new Array();
      titulo = new Array();
      urls = new Array();
      
      //Cogemos el numero de noticias
      long = noticias.firstChild.childNodes.length;
      
      cargarCSS();
   }
}

//Atacheamos y posicionamos el "cargando xml"
attachMovie("carga_xml","cargando",2);
cargando._x = 45;
cargando._y = 94;

//Atacheamos la linea de abajo del todo
attachMovie("linea","linea_abajo",5000);
linea_abajo._x = 0;
linea_abajo._y = 329;

//Atacheamos la caja de fondo

//Cargamos XML
noticias.load("noticias.xml");


/*-------------------------------------------------------------------------------*/
/*---------------------   FUNCION PARA CARGAR LA HOJA CSS    --------------------*/
/*-------------------------------------------------------------------------------*/
function cargarCSS(){
   //Creamos la hoja de estilo
   estailo = new TextField.StyleSheet();
   
   //Cuando este cargando...
   estailo.onLoad = function(){
      
      //Porcentajes y esas cosas
      totalcss = estailo.getBytesTotal();
      cargadocss = estailo.getBytesLoaded();
      porcentajecss = Math.round((cargadocss/totalcss)*100);
   
      //Si esta cargado del todo
      if (porcentajecss >= 100) {
         //Borramos el cargando
         removeMovieClip(cargando2);
         
         //Una vez esta cargada la CSS ya podemos saber cuantas lineas hay
         //por cada caja de texto
         
         //Creamos un clip y un campo de texto temporales
         _root.createEmptyMovieClip("temp_mc", 7);
         
         //Al campo de texto le ponemos el mismo tamaño de ancho que va a haber en
         //el de verdad. Le ponemos alto 16, que es lo que mide una linea. Así 
         //podemos saber el número de líneas que tenemos.
         temp_mc.createTextField ("notis_txt",8,-150,-20,168,16);
         
         //Ponemos las propiedades a nuestro campo de texto nuevo
         temp_mc.notis_txt.multiline = true;
         temp_mc.notis_txt.wordWrap = true;
         temp_mc.notis_txt.html = true;
         
         for (i=0; i<long; i++){
            //Cogemos los titulos de las noticias
            titulo[i] = noticias.firstChild.childNodes[i].attributes.titulo;
            
            //Cogemos las urls de las noticias
            urls[i] = noticias.firstChild.childNodes[i].attributes.urls;
   
            //Cogemos el texto y lo ponemos en la caja de texto temporal
            temp_mc.notis_txt.htmlText = "<p class='tit'>"+titulo[i]+"</p><br><p class='txt'>"+noticias.firstChild.childNodes[i].firstChild+"</p>";
            
            //Cogemos el numero de lineas por texto
            notis_puerto[i] = temp_mc.notis_txt.maxscroll-1;
         }
         //Eliminamos el clip temporal
         removeMovieClip(_root["temp_mc"]);
         //Montamos las noticias
         montarNoticias();
      }

   }
   attachMovie("carga_css","cargando2",3);
   cargando2._x = 45;
   cargando2._y = 94;
   estailo.load("noticias.css");
}


/*-------------------------------------------------------------------------------*/
/*---------------------   FUNCION PARA MONTAR LAS NOTICIAS    -------------------*/
/*-------------------------------------------------------------------------------*/
function montarNoticias(){
   par = true;
   for (i=0; i<long; i++){
      //Ponemos la caja
      _root.attachMovie ("caja_info","caja"+i,i*10);
      //Creamos el color
      _root["caja"+i].colorcaja = new Color(_root["caja"+i].fondo.fondocolor);
      //Le damos una altura igual a 16 por el numero de lineas que tenga
      _root["caja"+i].fondo._height = 16 * notis_puerto[i];
      
      //Pintamos la caja
      if (par == true){
         _root["caja"+i].colorcaja.setRGB(0xEEEEEE);
         _root["caja"+i].micolor = "0xEEEEEE";
         par = false;
      }
      else{
         _root["caja"+i].colorcaja.setRGB(0xFFFFFF);
         _root["caja"+i].micolor = "0xFFFFFF";
         par = true;
      }
      
      //Si no existe altura, le damos 0 y asi se posiciona la primera caja
      //en y=0
      if (altura == undefined){
         altura = 0;
      }
      //Si existe, le damos una altura igual, a:
      //"altura acumulada" = "altura acumulada" + "altura anterior clip"
      else{
         altura = altura + _root["caja"+(i-1)].fondo._height;
      }
      
      //Posicionamos la caja
      _root["caja"+i]._x = 0;
      _root["caja"+i]._y = altura;
      
      //Creamos la caja de texto y ponemos sus propiedades
      _root["caja"+i].createTextField("texto_txt",i*37,2,1,168,16 * notis_puerto[i]);
      _root["caja"+i].texto_txt.html = true;
      _root["caja"+i].texto_txt.multiline = true;
      _root["caja"+i].texto_txt.wordWrap = true;
      _root["caja"+i].texto_txt.border = false;
      _root["caja"+i].texto_txt.selectable = false;
      _root["caja"+i].direc_url = urls[i];
      
      //Atacheamos al texto la hoja CSS
      _root["caja"+i].texto_txt.styleSheet = estailo;
      
      //Ponemos el titulo
      _root["caja"+i].texto_txt.htmlText = "<p class='tit'>"+titulo[i]+"</p><br>";

      //Ponemos los textos de las noticias
      _root["caja"+i].texto_txt.htmlText += "<p class='txt'>"+noticias.firstChild.childNodes[i].firstChild+"</p>";
   }
   //Mostramos la pestañita
   attachMovie("pestana","pestanita",2000);
   pestanita._x = 0;
   pestanita._y = 0;
   
   siguiente_y = 0;
   y_arriba = 0;
   
   //Posicionamos todos los clips por debajo de 330 sobre 0
   //Empezamos por el ultimo y vamos subiendo
   for (i=long; i>0; i--){
      if (_root["caja"+i]._y > 330){
         siguiente_y = siguiente_y - _root["caja"+i]._height + 1;
         _root["caja"+i]._y = siguiente_y;
      }
   }
   
   //Una vez esta todo montado movemos las noticias
   moverNoticias();
}

/*-------------------------------------------------------------------------------*/
/*---------------------   FUNCION PARA MOVER LAS NOTICIAS    --------------------*/
/*-------------------------------------------------------------------------------*/
function moverNoticias(){
   //Si es la primera vez forzamos el movimiento, si no empiezan paradas las cajas
   if (primera_vez == undefined){
      //Creamos el evento y se empiezan a mover las cajas
      _root.onEnterFrame = function(){
         
         for (i=0; i<long; i++){
            //Si la caja llega a abajo del todo
            if (_root["caja"+i]._y > 330){
               y_arriba = 0;
               
               //Calculamos donde hay que posicionar el clip que llega abajo
               for (j=0; j<long; j++){
                  //Todos los clips que esten por encima de 0
                  if (_root["caja"+j]._y < 0){
                     //Cogemos la posicion y que haya mas arriba
                     y_actual = _root["caja"+j]._y;
                     if (y_actual < y_arriba){
                        y_arriba = y_actual;
                     }
                  }
               }
               //Lo posicionamos arriba, siendo esta posicion:
               //"y del clip actual" = "posicion del clip de mas arriba" - "altura del clip actual" + 1;
               _root["caja"+i]._y = y_arriba - _root["caja"+i]._height + 1;
            }
            //Hacemos que vayan bajando las cajas
            _root["caja"+i]._y += 1;
         }
      }
      primera_vez = false;
   }
   /***************************************************************************/
   
   
   //"el_fondo" controla a cada fotograma si estamos o no encima de las noticias
   el_fondo.onEnterFrame = function(){
      for (i=0; i<long; i++){
         //Si clicamos en la caja, vamos a la direccion "x"
         _root["caja"+i].onPress = function(){
            getURL (this.direc_url, "_blank");
         }
         //Si nos ponemos encima de la caja, eliminamos el evento y se para
         _root["caja"+i].onRollOver = function(){
            //Iluminar
            this.colorcaja.setRGB(0xCDFBFE);
            delete _root.onEnterFrame;
         }
         //Si nos salimos de las cajas, se empieza a mover otra vez
         _root["caja"+i].onRollOut = function(){
            //Pintamos la caja con el color anterior
            this.colorcaja.setRGB(this.micolor);
            
            //Creamos el evento y se empiezan a mover las cajas
            _root.onEnterFrame = function(){
               
               for (i=0; i<long; i++){
                  //Si la caja llega a abajo del todo
                  if (_root["caja"+i]._y > 330){
                     y_arriba = 0;
                     
                     //Calculamos donde hay que posicionar el clip que llega abajo
                     for (j=0; j<long; j++){
                        //Todos los clips que esten por encima de 0
                        if (_root["caja"+j]._y < 0){
                           //Cogemos la posicion y que haya mas arriba
                           y_actual = _root["caja"+j]._y;
                           if (y_actual < y_arriba){
                              y_arriba = y_actual;
                           }
                        }
                     }
                     //Lo posicionamos arriba, siendo esta posicion:
                     //"y del clip actual" = "posicion del clip de mas arriba" - "altura del clip actual" + 1;
                     _root["caja"+i]._y = y_arriba - _root["caja"+i]._height + 1;
                  }
                  //Hacemos que vayan bajando las cajas
                  _root["caja"+i]._y += 1;
               }
            }
         }
      }
   }
}

Por martingb

6 de clabLevel



Genero:Masculino  

msie7
Citar            
MensajeEscrito el 20 May 2008 08:59 pm
Ponlas en el XML al revés

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 20 May 2008 09:07 pm
Ya trate pero no es realmente eso lo que hay que solucionar, segun lo que tengo visto primer es cambiarle el signo al contador que incrementa la velocidad... en vez de ser + que sea - para que cambie el movimiento, el tema es que... en este esta calculado para que cada uno de las cajas cuando pase su limite, vuelva al otro lado y vuelva a pasar... es medio confuso el codigo como para cambiarlo.. que me sugieren :shock:

Por martingb

6 de clabLevel



Genero:Masculino  

msie7
Citar            
MensajeEscrito el 22 Mar 2009 04:20 pm
Bueno, creo que es medio tarde para responderte, pero lo hago por si alguien más lo necesita.
No lo he probado a fondo, por lo tanto no estoy seguro que esté todo correcto y por cuestiones de tiempo le he deshabilitado que se detenga cuando pasas el mouse por encima.
Espero que a alguien le sirva.
Un abrazo.-

Código :

stop();

//Cargar XML de las noticias
noticias = new XML();
noticias.ignoreWhite = true;
noticias.onLoad = function (){

   //Porcentajes y esas cosas
   totalxml = noticias.getBytesTotal();
   cargadoxml = noticias.getBytesLoaded();
   porcentajexml = Math.round((cargadoxml/totalxml)*100);

   //Si esta cargado del todo
   if (porcentajexml >= 100) {
      //Borramos el cargando
      removeMovieClip(cargando);
      
      //Shortcuts del XML
      notis_puerto = new Array();
      titulo = new Array();
      urls = new Array();
      
      //Cogemos el numero de noticias
      long = noticias.firstChild.childNodes.length;
      
      cargarCSS();
   }
}

//Atacheamos y posicionamos el "cargando xml"
attachMovie("carga_xml","cargando",2);
cargando._x = 45;
cargando._y = 94;

//Atacheamos la linea de abajo del todo
attachMovie("linea","linea_abajo",5000);
linea_abajo._x = 0;
linea_abajo._y = 329;

//Atacheamos la caja de fondo

//Cargamos XML
noticias.load("noticias.xml");


/*-------------------------------------------------------------------------------*/
/*---------------------   FUNCION PARA CARGAR LA HOJA CSS    --------------------*/
/*-------------------------------------------------------------------------------*/
function cargarCSS(){
   //Creamos la hoja de estilo
   estailo = new TextField.StyleSheet();
   
   //Cuando este cargando...
   estailo.onLoad = function(){
      
      //Porcentajes y esas cosas
      totalcss = estailo.getBytesTotal();
      cargadocss = estailo.getBytesLoaded();
      porcentajecss = Math.round((cargadocss/totalcss)*100);
   
      //Si esta cargado del todo
      if (porcentajecss >= 100) {
         //Borramos el cargando
         removeMovieClip(cargando2);
         
         //Una vez esta cargada la CSS ya podemos saber cuantas lineas hay
         //por cada caja de texto
         
         //Creamos un clip y un campo de texto temporales
         _root.createEmptyMovieClip("temp_mc", 7);
         
         //Al campo de texto le ponemos el mismo tamaño de ancho que va a haber en
         //el de verdad. Le ponemos alto 16, que es lo que mide una linea. Así 
         //podemos saber el número de líneas que tenemos.
         temp_mc.createTextField ("notis_txt",8,-150,-20,168,16);
         
         //Ponemos las propiedades a nuestro campo de texto nuevo
         temp_mc.notis_txt.multiline = true;
         temp_mc.notis_txt.wordWrap = true;
         temp_mc.notis_txt.html = true;
         
         for (i=0; i<long; i++){
            //Cogemos los titulos de las noticias
            titulo[i] = noticias.firstChild.childNodes[i].attributes.titulo;
            
            //Cogemos las urls de las noticias
            urls[i] = noticias.firstChild.childNodes[i].attributes.urls;
   
            //Cogemos el texto y lo ponemos en la caja de texto temporal
            temp_mc.notis_txt.htmlText = "<p class='tit'>"+titulo[i]+"</p><br><p class='txt'>"+noticias.firstChild.childNodes[i].firstChild+"</p>";
            
            //Cogemos el numero de lineas por texto
            notis_puerto[i] = temp_mc.notis_txt.maxscroll-1;
         }
         //Eliminamos el clip temporal
         removeMovieClip(_root["temp_mc"]);
         //Montamos las noticias
         montarNoticias();
      }

   }
   attachMovie("carga_css","cargando2",3);
   cargando2._x = 45;
   cargando2._y = 94;
   estailo.load("noticias.css");
}


/*-------------------------------------------------------------------------------*/
/*---------------------   FUNCION PARA MONTAR LAS NOTICIAS    -------------------*/
/*-------------------------------------------------------------------------------*/
function montarNoticias(){
   par = true;
   for (i=0; i<long; i++){
      //Ponemos la caja
      _root.attachMovie ("caja_info","caja"+i,i*10);
      //Creamos el color
      _root["caja"+i].colorcaja = new Color(_root["caja"+i].fondo.fondocolor);
      //Le damos una altura igual a 16 por el numero de lineas que tenga
      _root["caja"+i].fondo._height = 16 * notis_puerto[i];
      
      //Pintamos la caja
      if (par == true){
         _root["caja"+i].colorcaja.setRGB(0xEEEEEE);
         _root["caja"+i].micolor = "0xEEEEEE";
         par = false;
      }
      else{
         _root["caja"+i].colorcaja.setRGB(0xFFFFFF);
         _root["caja"+i].micolor = "0xFFFFFF";
         par = true;
      }
      
      //Si no existe altura, le damos 0 y asi se posiciona la primera caja
      //en y=0
      if (altura == undefined){
         altura = 330;
      }
      //Si existe, le damos una altura igual, a:
      //"altura acumulada" = "altura acumulada" + "altura anterior clip"
      else{
         altura = altura + _root["caja"+(i-1)].fondo._height;
      }
      
      //Posicionamos la caja
      _root["caja"+i]._x = 0;
      _root["caja"+i]._y = altura;
      
      //Creamos la caja de texto y ponemos sus propiedades
      _root["caja"+i].createTextField("texto_txt",i*37,2,1,168,16 * notis_puerto[i]);
      _root["caja"+i].texto_txt.html = true;
      _root["caja"+i].texto_txt.multiline = true;
      _root["caja"+i].texto_txt.wordWrap = true;
      _root["caja"+i].texto_txt.border = false;
      _root["caja"+i].texto_txt.selectable = false;
      _root["caja"+i].direc_url = urls[i];
      
      //Atacheamos al texto la hoja CSS
      _root["caja"+i].texto_txt.styleSheet = estailo;
      
      //Ponemos el titulo
      _root["caja"+i].texto_txt.htmlText = "<p class='tit'>"+titulo[i]+"</p><br>";

      //Ponemos los textos de las noticias
      _root["caja"+i].texto_txt.htmlText += "<p class='txt'>"+noticias.firstChild.childNodes[i].firstChild+"</p>";
   }
   //Mostramos la pestañita
   attachMovie("pestana","pestanita",2000);
   pestanita._x = 0;
   pestanita._y = 0;
   
   siguiente_y = 0;
   y_arriba = 0;
   
   //Una vez esta todo montado movemos las noticias
   moverNoticias();
}

/*-------------------------------------------------------------------------------*/
/*---------------------   FUNCION PARA MOVER LAS NOTICIAS    --------------------*/
/*-------------------------------------------------------------------------------*/
function moverNoticias(){
   //Si es la primera vez forzamos el movimiento, si no empiezan paradas las cajas
   if (primera_vez == undefined){
      //Creamos el evento y se empiezan a mover las cajas
      _root.onEnterFrame = function(){
         
         for (i=0; i<long; i++){
            //Si la caja llega a arriba del todo
            if (_root["caja"+i]._y + _root["caja"+i]._height < 0){
               // Ale: Ultimo.
               y_arriba = 0;
               y_arriba = y_arriba - _root["caja"+i]._height;
               
               for (j=0; j<long; j++){
                  y_arriba = y_arriba + _root["caja"+j]._height;
               }
               
               _root["caja"+i]._y = y_arriba;// - _root["caja"+i]._height + 1;
               
            }
            //Hacemos que vayan bajando las cajas
                               _root["caja"+i]._y -= 1;
         }
      }
      primera_vez = false;
   }
}

Por AleFdez

0 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.