asd

31

Dic

Incluir videos de Youtube en tu swf, descagar video youtube con flash, lista personalizada de videos youtube en flash

Publicado por: LeoBaraldi

(08-10-2009) NOTICIA!: Nuevamente el problema de que no se veian los videos ya esta solucionado! descarguen los nuevos files ;)

Navegando por la pagina de unijimpe me encontré con un tuto en php para descargar video de youtube simplemente indicando el valor de id del video, me pareció una excelente idea más si dicha idea podíamos aprovecharla en flash para crear un reproductor con nuestra propia lista de videos y un reproductor armado por nosotros mismos.

reproductor.jpg

Bueno ante que todo se agradece a unijimpe por el php que dio origen a todo el AS que desarrolle.

Es muy simple de utilizar, para flash simplemente utilizamos la clase NetStream y para indicar los videos que deseamos, construimos un archivo de tipo xml para indicar la lista de videos de youtube a reproducir. Con la posibilidad de también cargar un titulo y pequeña descripción del video.

En la estructura del xml, el atributo id=”” dentro de las comillas debe ir el id de video que vemos en youtube, en la siguiente imagen se resalta lo que deben copiar y pegar.
Puede pasar que la url sea así: http://youtube.com/watch?v=NyoCQ9WA0PY&feature=related en ese caso el id es el la parte resaltada en bold http://youtube.com/watch?v=NyoCQ9WA0PY&feature=related

id.jpg

Entre las etiquetas CDATA indicamos la descripción del video como así en el atributo titulo el valor o cadena de texto para dicho título.

El xml utilizado:

XML:
  1. <![CDATA[Presentación equipo subaru rally 2007 para el campeonato del mundo 2008]]>
  2. </video>
  3. <video id="GF4qad2sj00" titulo="Capusotto">
  4. <![CDATA[Me encanta este video!]]>
  5. </video>
  6. <video id="6qEcX01WrNk" titulo="Previa de Soda en Cba">
  7. <![CDATA[Se presento soda y fue toda una fiesta, impresionante!]]>
  8. </video>
  9. <video id="do1dAX-IVTE" titulo="El bananero - Harry Potter">
  10. <![CDATA[Aca un video para morirse de risa del amigo elbananero]]>
  11. </video>
  12. <video id="qAWFk63Lrmw" titulo="Battlefield 2142 U2">
  13. <![CDATA[Este un video que lo puse porque si nomas no tenia ganas de buscar ni de escribir]]>

Actionscript utilizado para el reproductor:

Actionscript:
  1. //Dominio donde esta alojado nuestro php
  2. var dominio:String = "";
  3. //nuestro php propiamente dicho
  4. var FilePHP:String = "phpyoutube.php";
  5. //nuestro xml con la lista de videos
  6. var FileXML:String = "videos.xml";
  7. //el valor de id del video en youtube
  8. var id:String = "";
  9. //
  10. var contador:Number = 0;
  11. //
  12. var miXML:XML = new XML();
  13. miXML.ignoreWhite = true;
  14. //
  15. var ListVideos:Array = new Array();
  16. miXML.onLoad = function(ok) {
  17. if (ok) {
  18. ListVideos = this.firstChild.childNodes;
  19. cantVideos_txt.text = "total videos: "+String(ListVideos.length);
  20. id = ListVideos[0].attributes.id;
  21. cargarVideo();
  22. loadDtaVdo();
  23. //
  24. } else {
  25. }
  26. };
  27. miXML.load(dominio+FileXML);
  28. //aca recibimos el resultado del php
  29. var result_lv:LoadVars = new LoadVars();
  30. result_lv.onLoad = function(success:Boolean) {
  31. if (success) {
  32. /*********************************************/
  33. //desde aqui el cambio realizado para el 08-10-2009
  34. var varsTemp:LoadVars = new LoadVars()
  35. varsTemp.decode(String(this))
  36. var urlText:String = varsTemp.toString()
  37. urlText = urlText.substr(35,urlText.length)
  38. urlText = urlText.split('%2C').join(',');
  39. urlText = urlText.split('%2E').join('.');
  40. urlText = urlText.split('%2F').join('/');
  41. urlText = urlText.split('%3F').join('?');
  42. urlText = urlText.split('%3D').join('=');
  43. urlText = urlText.split('%3A').join(':');
  44. my_ns.play(urlText);
  45. //hasta aqui el cambio realizado para el 08-10-2009
  46.  
  47. } else {
  48. trace("Error connecting to server.");
  49. }
  50. };
  51. //enviamos los datos al php
  52. var send_lv:LoadVars = new LoadVars();
  53. function cargarVideo() {
  54. status_txt._visible = true;
  55. status_txt.text = "cargando...";
  56. send_lv.item = id;
  57. send_lv.type = 0;
  58. send_lv.sendAndLoad(dominio+FilePHP,result_lv,"GET");
  59. }
  60. //el encargado de cargar y reproducir el video
  61. var my_video:Video;
  62. var my_nc:NetConnection = new NetConnection();
  63. my_nc.connect(null);
  64. var my_ns:NetStream = new NetStream(my_nc);
  65. my_video.attachVideo(my_ns);
  66. //suavizado del video
  67. my_video.smoothing = true;
  68. //duracion del buffer
  69. my_ns.setBufferTime(4);
  70. //duracion del video
  71. my_ns.onMetaData = function(infoObject:Object) {
  72. //trace(Math.floor(infoObject.duration));
  73. };
  74. //enviamos datos de que esta sucediendo
  75. my_ns.onStatus = function(infoObject:Object) {
  76. if (infoObject.code == "NetStream.Buffer.Full") {
  77. status_txt._visible = false;
  78. }
  79. if (infoObject.code == "NetStream.Play.Start") {
  80. status_txt._visible = true;
  81. buffer();
  82. }
  83. if (infoObject.code == "NetStream.Play.Stop") {
  84. status_txt.text = "Video finalizado!";
  85. }
  86. if (infoObject.code == "NetStream.Play.StreamNotFound") {
  87. status_txt.text = "No se encontro el video!!!";
  88. }
  89. };
  90. //con esto sabemos si ya esta el buffer listo!
  91. function buffer() {
  92. this.onEnterFrame = function() {
  93. var porcentaje:Number = Math.min(Math.round(my_ns.bufferLength/my_ns.bufferTime*100), 100);
  94. status_txt.text = "Buffer:"+porcentaje+"%";
  95. if (porcentaje == 100) {
  96. delete this.onEnterFrame;
  97. }
  98. };
  99. }
  100. //un efectito fade
  101. MovieClip.prototype.fade = function(direccion:String, velocidad:Number) {
  102. if (direccion == "in") {
  103. var efecto = mx.transitions.easing.Regular.easeIn;
  104. this.mi_Tween = new mx.transitions.Tween(this, '_alpha', efecto, this._alpha, 100, velocidad, true);
  105. } else {
  106. var efecto = mx.transitions.easing.Regular.easeOut;
  107. this.mi_Tween = new mx.transitions.Tween(this, '_alpha', efecto, this._alpha, 0, velocidad, true);
  108. }
  109. };
  110. //creamos la funcionalidad de los botones y cargamos los datos de la info
  111. function loadDtaVdo() {
  112. for (var i = 0; i&lt;2; i++) {
  113. this["video"+i].fdoFicha_mc._alpha = 0;
  114. this["video"+i]._alpha = 0;
  115. this["video"+i].fade("in",0.5);
  116. var temp = this["video"+i].fdoFicha_mc;
  117. this["video"+i].reproducir_mc.fondo = temp;
  118. this["video"+i].mini_mc.loadMovie("http://img.youtube.com/vi/"+ListVideos[contador].attributes.id+"/1.jpg");
  119. this["video"+i].titulo_txt.text = ListVideos[contador].attributes.titulo;
  120. this["video"+i].descripcion_txt.text = ListVideos[contador].firstChild;
  121. //
  122. this["video"+i].reproducir_mc.id = ListVideos[contador].attributes.id;
  123. this["video"+i].reproducir_mc.onRelease = function() {
  124. video0.fdoFicha_mc._alpha = 0;
  125. video1.fdoFicha_mc._alpha = 0;
  126. this.fondo.fade("in",0.5);
  127. id = this.id;
  128. cargarVideo();
  129. //
  130. };
  131. if (this["video"+i].reproducir_mc.id == id) {
  132. this["video"+i].fdoFicha_mc.fade("in",0.5);
  133. }
  134. if (contador == ListVideos.length-1) {
  135. contador = 0;
  136. } else {
  137. contador++;
  138. }
  139. }
  140. }
  141. //accion boton siguiente
  142. siguiente_btn.onRelease = function() {
  143. loadDtaVdo();
  144. };
  145. //

19

Dic

Tutorial de CSS

Publicado por: LeoBaraldi

Excelente curso, tutorial de css totalmente en español, muy recomendable para aquellos que recién comienzan o también para aquellos que quieran saciar algunas dudas básicas y otras más avanzadas.

Les dejo un detalle de los contenidos:
CAPITULO 1
Hojas de estilo con CSS1

CAPITULO 2
Estructura de una hoja de estilo CSS

CAPITULO 3
Usar hojas de estilo en documentos HTML

CAPITULO 4
La cascada de CSS

CAPITULO 5
Unidades de medida

CAPITULO 6
Propiedades de CSS1

19

Dic

For web designers

Publicado por: LeoBaraldi


Este es un excelente repositorio de recursos para diseñadores y desarrolladores web, los mejores sitios de recursos en JavaScrip, ActionScrip, CCS, HTML, Fotos, AJAX, fuentes e iconos. Todo lo que necesitas para comenzar, mejorar y aprender sobre la web. Excelente Site!!!

categorias: Recursos Coment.: 2

7

Dic

Día Internacional de las Personas con Discapacidad

Publicado por: LeoBaraldi

INTRODUCCION

Con el lema "Hagamos posible una Argentina para todos", instituciones de personas con capacidades diferentes de todo el país, que conforman hace diez años el Foro Pro presidido por el Padre Pablo Molero, se reunieron en el casco histórico para pedir "políticas activas y coordinadas para una genuina inclusión".

El objetivo es dar a conocer a la sociedad las dificultades que padecen para acceder a medios de transporte, cajeros automáticos y muchos otros lugares públicos y privados.

Más de 300 entidades conmemoraron con actos en el Obelisco, Plaza de Mayo, Parque Centenario y otros puntos de la Ciudad de Buenos Aires y del país, el Día Internacional de las Personas con Discapacidad, establecido por las Naciones Unidas en 1992.

Con el lema "Hagamos posible una Argentina para todos"...

Fuente: Agencia Federal de noticias

¿PORQUE ESTE POST?


Hace ya un tiempo que estoy armando la nueva versión de mi blog, y me encontré un día con la duda de quienes leen mi blog. Llegue a la conclusión viendo los resúmenes de estadísticas que los que leen diariamente mi blog son usuarios tan variados tanto en tecnología que usan, como con qué fin llegaron a mi sitio. Se me ocurrió evaluar que tan compatible es mi sitio antiguo (actual) y que tan compatible será mi nuevo sitio. Entre los tantos análisis logre llegar a una estructura compatible en IE y FireFox, una resolución mínima de 1024x768 px con todo mi código XHTML validado. Me sentí muy conforme en un primer momento, pero mi necesidad de ir un poco más me llevo a encontrar que aparte de validar CSS y XHTMl están las validaciones WAI (Iniciativa para la Accesibilidad Web), erróneamente supuse que si mi sitio nuevo valida CSS y XHTML estricto sin problemas validara WAI y por lo contrario me encontré que ni siquiera pasa la primera validación (A = criterios mínimos de accesibilidad). Sinceramente en un principio no me importo pero luego de unos días me vino a la cabeza muchas preguntas y respuestas. ¿Es mi sitio solamente para un grupo de personas? ¿La filosofía de mi sitio es informar? ¿Si yo tuviera una capacidad diferente, encontraría sitios con accesibilidad? ¿Podría saber yo lo mismo que sé, si por ejemplo no pudiera ver y por ende no leer en pantalla lo que un blog pública? ¿Mis visitas aumentarían o disminuirían? ¿Implica un gasto extra hacer cosas accesibles?

Como verán me encontré en un mar de preguntas y las respuestas de cada una de ellas fueron tan positivas y convencedoras que llevaron todo mi trabajo sobre la nueva plantilla de mi blog a la basura. No desespere para nada, ni dude en un instante que fue la mejor decisión que tome, sin dudas sera útil como individuo aprendiendo a trabajar haciendo cosas accesibles y generando contenidos para todos disponibles.

Y aparte de todo esto me lo ordena mi peluche que me dice como hacer las cosas jajajaj!!!
Para los que hacen web y quieren comenzar a informarse de todo esto les recomiendo los siguientes links.

Qué es la Accesibilidad Web
¿Por qué la web debe ser accesible?
Campaña crea web accesibles

categorias: Otros , Recursos Coment.: 2

Leonardo David Baraldi

Leonardo Baraldi

Nací en Villa Carlos Paz, tengo 33 años y me dedico a desarrollos para la web desde el año 99, preferentemente en las aéreas de ActionScript y CSS. Trabajo para la firma Manifesto Solutions como jefe de producción.

ultimos post

Usa Firefox es mejor che!!!
Copyright © 2008 LeoBaraldi. Todos los derechos reservados.
Designed by LeoBaraldi and powered by Wordpress | RSS Feed
Love WordPress
Manifesto
Manifesto solutions
Sponsort Oficial de LeoBaraldi