chatarras club: Ventana Remota para Blogger

:-) ... buenos días, tardes, noches.

Con el frio que hace no apatece mucho salir de casa y puede ser buen momento para seguir jugando con el diverso "codigo blogger" que tengo hace tiempo abandonado en mi baul de los recuerdos ... asi que seguimos ...

Vamos a poner de moda la Ventana Remota para Blogger de "chatarras club"

... en la que montaremos esta vez una Laser Video Disco para el blog.

... que posiblemente sea la primera operando en este formato de ventana remota.

... y que con tu imaginación es totalmente modificable y por supuesto que mejorable.

Salu2, tommy ;-)

Se parte del articulo que publiqué hace unos años ... Ventana Videos "theater" ... y como no me termino de convencer lo deje olvidado hasta hace algo mas de un año que me puse a jugar partiendo de cero y montando todo nuevo para que funcionara realmente en una ventana de las de verdad.

La clave ya le expliqué en ... Ventana Resumen de Entradas ... que recomiendo leer.

Practicamente con modificar los datos de los dos Arrays Principales una vez entendidos como estan montados y manteniendo la idea del sistema desde una ventana remota ( con algun retoque puntual ) se puede cambiar casi todo. Han quedado definidos 6 canales de Videos y 8 canales de Graficos. Una vez lanzada la ventana ... que en este caso es de 1024 x 768 pixels ... Todo Debe Funcionar desde ella misma hasta que decidamos cerrarla.

Estoy seguro que los bloggeros mas avanzados en "codigo blogger" no tendran muchos problemas en adaptar y modificar este juguete a su gusto.

Los videos utilizados para la demostración No son nada actuales dado que éste juguete lo tengo montado hace mas de un año y no me apetecia andar buscando otra vez que videos poner. Son videos/música de "youtube & vimeo" y se han dejado en "&autoplay=0" para evitar colapsos al ser estos videos de larga duracion y si tardan en cargar no deberia ser fallo del juguete. Tambien funciona bien si los ponemos en "&autoplay=1"

Tras diversas pruebas el resultado visualmente fue satisfactorio tanto en "Internet Explorer" como en "Mozilla Firefox" y tambien en "Google Chrome" aunque en este la ventana no se me dimensiono correctamente. Tambien tiene algun que otro fallo que indico en el codigo fuente que está bastante documentado y desconozco si funcionara bien en todos los blogs.

Todo ésto se presenta tal cual para quién lo quiera desarrollar mas. No hay garantias.
La idea de hacerlo en una ventana remota queda aquí funcionando.
No dispongo de mucho tiempo para dar soporte al tema y tampoco me considero un experto en la materia. Estas cosas las hago como un hobby mas. Gracias.

... edit by tommy for "chatarras club" ...

[LANZA VENTANA LASER BLOG]

~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~

*** COMO SE HACE ***

*** HOW TO ***

~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~

INICIO:

Lo ideal seria que hicieras ántes de empezar una copia de seguridad, tanto de tu blog como de tu plantilla.

En esta versión que publico lo haremos todo Dentro de una Entrada del blog y sera necesario trabajar en el modo de Edición HTML.

Leer detenidamente todo el presente articulo y cuando esteis decididos hay que crear una entrada en vuestro blog con un nombre cualquiera para montar el juguete.

PRIMERO:

Copia y pega el código del "BLOQUE 1" dentro de la entrada.

****** BLOQUE 1 ******


<!-- **********************************************************
     Estoy copiando el codigo en una entrada de Blogger
     tal como lo explican en "chatarras club"

     Cuando hayas terminado, Guardada y Publicada la entrada,
     el código fuente introducido estará aquí debajo oculto
     y sin ocupar apenas espacio visible.
*********************************************************** -->


<!-- ... ini codigo Ventana chatarrasclubLaser01Popup ... -->

<script type="text/javascript">
// <![CDATA[

// ...............................................
// ... Ventana Generica Tipo Popup Usos Varios
// ... Idea y desarrollo inicial ... Abril 2010
// ... edit by tommy for "chatarras club"
// ... http://chatarrasclub.blogspot.com/
// ...............................................
// ... inicialmente creada para Usos Varios.
// ...............................................
// ... fue modificada para Laser Externo.
// ...............................................
// ... fue modificada para Video Externo.
// ...............................................
// ... pendiente de depurar todo el codigo
// ... aunque esta funcionando bien.
// ... Gracias.
// ...............................................


var ccLaser01Popup = null;

function chatarrasclubLaser01Popup( codigoLaser01, anchoVentana, altoVentana ) {

// ... si Ventana existe Y esta abierta Y no esta cerrada ... entonces debe cerrarla y salir.

if ( ccLaser01Popup && ccLaser01Popup.open && !ccLaser01Popup.closed ) { ccLaser01Popup.close(); return; }

var   anchoVentana = anchoVentana + 000;
var    altoVentana = altoVentana  + 000;

var  izquierdaPosicion = (screen.width)?(screen.width-anchoVentana)/2:100;
var     arribaPosicion = (screen.height)?(screen.height-altoVentana)/2:100;

var parametrosVentana = 'width='   + anchoVentana + 
                        ',height=' + altoVentana + 
                        ',top='    + arribaPosicion + 
                        ',left='   + izquierdaPosicion + 
                        ',scrollbars=0,location=0,directories=0,status=0,menubar=0,toolbar=0,resizable=0';

ccLaser01Popup = window.open("", "ccLaser01Popup", parametrosVentana);
ccLaser01Popup.document.open();
ccLaser01Popup.document.write("<HTML>");
ccLaser01Popup.document.write("<HEAD>");
ccLaser01Popup.document.write("<!-- ... by tommy ... aka ymmot ( spanish ) ... Abril 2010 -->");
ccLaser01Popup.document.write("<TITLE>_ _ _ chatarrasclub.blogspot.com _ _ _</TITLE>");
ccLaser01Popup.document.write("</HEAD>");
ccLaser01Popup.document.write("<BODY STYLE='text-align: center; color: white; background-color: black;'>");
ccLaser01Popup.document.write( codigoLaser01 );
ccLaser01Popup.document.write("</BODY>");
ccLaser01Popup.document.write("</HTML>");
ccLaser01Popup.document.close();
ccLaser01Popup.document.focus();

// ... añadido para utilizar como Ventana Remota LASER Blog.
// ... ESTO ES UN APAÑO ...
// ... PROBLEMS !!!
// ... FORZAMOS LA RECARGA DE PAGINA VENTANA REMOTA
// ... DEBIDO A ALGUNOS FALLOS ESPORADICOS QUE NO ENTIENDO.

ccLaser01Popup.reload();

}

// ]]>
</script>

<!-- ... end codigo Ventana chatarrasclubLaser01Popup ... -->

SEGUNDO:

Copia y pega el código del "BLOQUE 2" ( las TRES secciones A, B y C ) a continuación y dentro de la misma entrada.

****** BLOQUE 2 - Sección A ******


<!-- no hay error, solo tiene esa linea -->

<textarea readonly="readonly" id="CODELASER01POPUP" style="width:000px; height:000px; display:none;">

****** BLOQUE 2 - Sección B ******


<!-- CODIGO BASICO HTML DE LA VENTANA -->


<div id="zonaLaserDiscoLASv02" style="position: absolute; left: 000px; top: 000px; width: 000px; height: 000px; z-index: 1; background-color: black;"></div>

<div id="zonaVideoDiscoLASv02" style="position: absolute; left: 192px; top: 204px; width: 000px; height: 000px; z-index: 2; background-color: transparent;"></div>

<div id="zonaBotonLaserDiscoLASv02" style="position: absolute; left: 000px; top: 690px; width: 1024px; height: 050px; z-index: 3; background-color: transparent;"></div>

<div id="zonaBotonVideoDiscoLASv02" style="position: absolute; left: 950px; top: 140px; width: 050px; height: 050px; z-index: 4; background-color: transparent;"></div>

<div id="zonaTextoCreditosDiscoLASv02" style="position: absolute; left: 000px; top: 020px; width: 1024px; height: 050px; z-index: 5; background-color: transparent;"><b>... edit by tommy for "chatarras club" ...</b></div>


<!-- EL RESTO DEL JUGUETE ESTA MONTADO EN JAVASCRIPT -->


<!-- ... EMPIEZA LA FIESTA ... -->
<!-- ... EMPIEZA LA FIESTA ... -->
<!-- ... EMPIEZA LA FIESTA ... -->


<script type="text/javascript">
// <![CDATA[


// ...............................................
// ... Efectos Laser Usando Graficos Estaticos.
// ... version 02 ... Octubre 2013
// ...............................................
// ... edit by tommy for "chatarras club"
// ... http://chatarrasclub.blogspot.com/
// ...............................................
// ... inicialmente creado para Laser Interno.
// ...............................................
// ... fue modificado para Laser Externo.
// ...............................................
// ... fue modificado para Video Externo.
// ...............................................
// ... pendiente de depurar todo el codigo
// ... aunque esta funcionando bien.
// ... Gracias.
// ...............................................


var indColorLASv02 = 0;

var estadoRunLASv02 = 0;

var estadoTimeLASv02 = 0;

// ... MUY IMPORTANTE !!!
// ... velocidad MAXIMO 200 EN TOTAL PARA VARIOS LASERS !!!

var velocidadTimeLASv02 = 200;  // ... NO AUMENTAR DE 200 !!!

var tipoGraficosLASv02 = 1;  // valor laser-grafico inicial.

var tipoVideoLASv02 = 0;     // valor video inicial.

// ... sera con el grafico que trabajaremos segun proceda.

var arrayGraficosLASv02 = new Array();

// ... sera uno general con todos los datos para graficos.

var arrayAllGraficosLASv02 = new Array();

// ... sera con el video que trabajaremos segun proceda.

var arrayVideosLASv02 = new Array();

// ... sera uno general con todos los datos para videos.

var arrayAllVideosLASv02 = new Array();


// ...............................................


// ... Estos graficos estan por defecto en 600 x 600 de medidas
// ... y optimizados para que sean lo menos pesados posible.
// ...
// ... La clave esta en preparar unos graficos que den buen resultado
// ... visualmente ya que se crea un Efecto Optico al Rotarlos.
// ...
// ... Menuda paliza montar los dibujitos y subirlos al blog.
// ... Van 32 pantallas-graficos y 4 gif transparentes.


arrayAllGraficosLASv02 = 
  [
  //
  // ESTRUCTURA DEL ARRAY ... son 4 datos para cada juego de graficos.
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvzpJAeFjY5lgcAKeeaz0FayBxJ1Aqsaa0h9Lg0gtXOtoh8rAvbcOl9m7WPQw5ufvQLmrcVQaOTyUA2PtX2g80GNLzzByX9ZdNmmScjnCzWT6NxlXcyNp6iLxHSmfFs9bnhfzrI7Pusgi/s0/chatarrasclub_GIF_0005x0005_TRANS.gif',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvzpJAeFjY5lgcAKeeaz0FayBxJ1Aqsaa0h9Lg0gtXOtoh8rAvbcOl9m7WPQw5ufvQLmrcVQaOTyUA2PtX2g80GNLzzByX9ZdNmmScjnCzWT6NxlXcyNp6iLxHSmfFs9bnhfzrI7Pusgi/s0/chatarrasclub_GIF_0005x0005_TRANS.gif',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvzpJAeFjY5lgcAKeeaz0FayBxJ1Aqsaa0h9Lg0gtXOtoh8rAvbcOl9m7WPQw5ufvQLmrcVQaOTyUA2PtX2g80GNLzzByX9ZdNmmScjnCzWT6NxlXcyNp6iLxHSmfFs9bnhfzrI7Pusgi/s0/chatarrasclub_GIF_0005x0005_TRANS.gif',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvzpJAeFjY5lgcAKeeaz0FayBxJ1Aqsaa0h9Lg0gtXOtoh8rAvbcOl9m7WPQw5ufvQLmrcVQaOTyUA2PtX2g80GNLzzByX9ZdNmmScjnCzWT6NxlXcyNp6iLxHSmfFs9bnhfzrI7Pusgi/s0/chatarrasclub_GIF_0005x0005_TRANS.gif',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCvwyvZrBuJSSFHlsibdJPyy6uw_O2pC3HVazGQvO7XIZ1p5S3K5RuBkrK-oHEP-i7QorqjSgx_SjO3yJWwepymQYuTapSg8RFo2WCj0ictfxn1XEM6jDzzuY4dNw4pkfEVbE3BAeHaJ3-/s0/chatarrasclub_laser_s02g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjE324IBjoT5Z7wLdXmMLzrBd1kJIDS3JaARBkgg5lcsDiw8Tww4RsOPUre13ArmoyCiTzHx_f8TP1OGHR3z_V1s1G23y-Dh8rKTNDHAUZvu7mYOTBfM0Mp0HWsg72wdy39x6uYGCTIk2E1/s0/chatarrasclub_laser_s02g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1TYEsfsaj-W4reF-oyI0oYffikqhXpT2Gw8Vxnje29_rIyoKLubk1PvlYT2sEMTVCmdiUNC44zBMtKWdqM4EogUL3O7xesjRJ8656iyzsYhrwzNb-osSCy6fcpmQf7fYMcbdYlcltQQPc/s0/chatarrasclub_laser_s02g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMocO7tmRE6EJM1p_bAIYK9a1r9_KvAQRK5wNoo0iBXZ6-0Cg7AkoBkATIsl91P_LXBFmAD1mABDRAcxC_lH9JEfDgrFhDWz2_PLkNaDpEuiGaaowRC7SB23w15tmM7CrrBtg6K1xum5iM/s0/chatarrasclub_laser_s02g04.jpg',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr7I-zAsC4LrdYBIu1-sisELH861N5zlcLWXveU0lpAPgGNHkRQIPbhebB8UYHmv1gmR4inefqCR3m02pcx025GMp8y5fvQ51rEqkLW3iPwCQaYUCk_9TvPoEQ4oh9iqy6UmewPbPsnXYp/s0/chatarrasclub_laser_s04g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUsS6aX5QBjIvFcN1aOFC15CCyRZv7L5CPdH1mLe9Ak1vqS6XAfuekhSRMi711AulQsMYo6X7iYn3jYMNEFHgRVQyNQrfWYEutgTapC5QE2zrJjSJNPTkVIK-1vDILWiHQQK4KA8etTsrp/s0/chatarrasclub_laser_s04g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuJYbgrvFIjMa19yntfuDJrGed-dkZMn1SuX0-Cvwy5cLMZUYnr7wLr9KYIItlNrM3nA05P5aH1fttLVRyOxQRlQ3EoCQcOM0vIAMPeV5q_t9meDwo9dRxLGH2g611eztIhWiej9Q9Nqfs/s0/chatarrasclub_laser_s04g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_9KDE1bBZ8KXvL-E-aBf90fAW8agFaSmaYBtstCdF-yZYj-HruwjiaQajzr7OOylIYcKceMonF1lSyTy3Yg6ID6HipRwvioweXFVqF-8U4j5RcUpe1aXDTsoTWo7esXYYQHtqGqU7SIOH/s0/chatarrasclub_laser_s04g04.jpg',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLdBqiKOQnYPlJaoc5GwgfELu3wm95cP8ppVf4fKsb5DpWKyHec1H8tfD_6H0XD4UYo1LGZ5rltrmO-olIteYTqojfWxwylqUnjqSwD6YajOUDDaspXejQJ_scgksyrzoE1UTiwLrEkp2z/s0/chatarrasclub_laser_s10g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3cCJvpORZjy9dqUTmSovPTFmoGFXMPxJlLDAitQfukGmwbsVKf1ISTcBBjF-2S4r0ZwlExKdXaNHgqTb_87tbUIE_wGrXEz6wNZArMgf8om5zaOFiOBqhmA45tY2PP1ERzhlI9jSHCmIU/s0/chatarrasclub_laser_s10g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjh0gokbk4mdQ3hT4wOZ6QkaVeuo5-XcM76saiUMIi3xn1ypLQ7SuOhkaPrp3n4MQed-vpRIRb6WBqIhNvMal_sOYjBA5kvYoKCMc2gkP88Tbqs36eMtDUbs7SzLt9Oa-nw_mBbnO9csU0U/s0/chatarrasclub_laser_s10g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnb009F_qflParKg5n9uqjuGHG6QtSC8ENeBJKPwMrhJ2VP-sOcqAwCgpcJEz_qh-4RzPgH9dZh6Clr17tqms26OOf8jJYWRBF_wzq7B9FpWCvVKQQ4y-BhB5NwrHgr5192bFGb35EAMOc/s0/chatarrasclub_laser_s10g04.jpg',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKHdCgU3phKHTR2L_EgurZ5ioh7Pmntxn1F9OL7dgOCuwf2ZhR4O7iZ5ea-gp65oZ6FFdzBwRmC8mG6LCgYxX_hyphenhyphenPSzsXuwd_3w8tF7xpYRqP3AmOWOf9N-EFcVc-JHT5dqjWVWuWwpxJ6/s0/chatarrasclub_laser_s12g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmnLf6BinGLejjxvIlA31C5GVdwRe62isUXJ2INbqgFypPDIfJBnvVmGL9z7CxGM6BCq9m1n9z14HYrqpD61NjyOgXtUsksk1f90foJT838e0zrSpMMXSAmUvnBbpEiRnscUWpFQTZAr7H/s0/chatarrasclub_laser_s12g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjRtwNISa9MDf1_VqAfxeAbbpsf68gF6I_Rv9D19N5D3_EH0Lpkjk8f82QcPTVQnaUdZmKXmy8ygOKLMpFTuZfFnDpifxO16mezqOdjwlYQAc1842z8mcbASV7k04A9d-HVWSLvIjjYO5P/s0/chatarrasclub_laser_s12g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKqUiVbzBcpYEdHdXl8NKFKHpSBPg7NdMdGmBfyAoLzqhrLKP5J64IHzKDRlTuDLX3MW59ia5_hVnb7nCGhKN9vPZAlwfQmg2XP3B4JTR7JG9nCnKAH9zdHku0iE7IJ_oy-d_R16z9HjFM/s0/chatarrasclub_laser_s12g04.jpg',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimRv4vyihsTGM8WnXsZyzaU4ZtHS_O8UQmgU2PtDa3IMzju_y_JmErTQHdntOKsYhEwkgNTcYWJ8Q8OyazZM2GvOotBLamfsBZonXs-H_0xOuJ1sIy173zm2he80y3ktzDHcMgPBNlI6Nh/s0/chatarrasclub_laser_s14g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgj9uvFxMhO6y-gCZOqmbuWLyzDwCEL3K45aoyq3aynuimW5_US6gNvejcFvAeEBpesk6qLzIOOsWuz9DQbdori6rQrKfcMyp5rTQEREYMYHytCe8r1DwGcx4j_6kaD6H1cb1jng9E7Rk_W/s0/chatarrasclub_laser_s14g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfVA8_qIqUBEjLNMJj3ry2Ex8_sSDE-H2mN1rpp70sM6_tvI_dOIp2yq8ZN5MG1BL-NmvXqeHJU3okVec1SDXFUA6HwvpweNLdxtJI6SkaTYXTXztIlvSIxnnNlU8UtKkJVYQYS_BzJft0/s0/chatarrasclub_laser_s14g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwbI4ubWKe2NuBcc4oSqKpPZiE-fuzDRQsPenKflVbC8-MR__4HXxwNFZ1TC-VySVRLkWbqhFtQUfET8r99IA-ts5J9jTC53VaLHnUVnfWJ4IQPrPVPwYeHsuIY44kV7sQK_zxG3l13Mgk/s0/chatarrasclub_laser_s14g04.jpg',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2ewZk9cwQePlFzeUC3O3NdGBXcPB4FPO9h_iWi0UvgdZ_Pvs9l22REoiKk6a1pIm__T0gnM-TapWZFM2l1OzDPCNF0cnew7Tk3p6uVQEe_drvmkiJYun1aXEXphyphenhypheniqzRqmjH7359GkEST/s0/chatarrasclub_laser_s16g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifchOhnw9hrznbf-DbELgqHDvIK630olot03PPXheyVNHuLjksiYZJ139v9xHUQQcHlgBNDeP6RGYLiHQy3L3vtjN4lOJZ2wcJ2XSKIZzd7E_Eloz4LDtCimm9fRh1yqi7gH1DiNGOakbH/s0/chatarrasclub_laser_s16g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgA8KV9Dk6oReFo2yiGND8xp9KDLDjIgZQhFybGp4ThZznC1u3BG1mMAg8PzeiejGOy0Xsm4juXHRp-Bci8NUEoGp6frZeIpH3Gsgk2wIo0r39LJfXWouCiuXOxJHVzRbNU2ZREG5OKha0D/s0/chatarrasclub_laser_s16g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNyhUsLmZQagI99MjlVTrCEdqHNxBathONFr5OUKvk2jFLEzkEXwCxV6R8hNQtS-rvZnM0qg8N-aSl0SD_4lSUKzQpCV7Q4rF3klNnCw80RQ3BV5P6GRsjZMWB5rP_bEWXc30hZpPg12h_/s0/chatarrasclub_laser_s16g04.jpg',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfztUoFZlc4dwJeyb7T_-NFLf6Noguuw1vCFzuR3OMqAFv0zJQ2_XaeUnnB1hsf16HluV0yHCI0AKOomrDa-TWsrxe-qTvHfqO2IO_AlSMPdqjSwjASRjbKULRTc07eUarFocCc2N_CsAO/s0/chatarrasclub_laser_s18g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigs-1qhjvyUIhByjPm1280lq5qcDTh1IFUPOtelu_3O4jPoubL18kATKIgHToR3GIjzwp1ypFnnrcITBOu3rhgVXrY7tsyVlXNYTEIh8gnZt-sSDTzI-Fooplxcm8JJVm1lTBEOrM2gUo0/s0/chatarrasclub_laser_s18g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6LMGN7NmBCtDKfIYVDO_HqYR6q2VoJzVJQ8GPyRw0qMMorVmdviwDFgzIjIGTmbdm61L1eN2PX_yQQjNzCT2atguCw-fqtbPfNLNwjVV8dg76xNGgz3v9dzEmev4oHjwwn19u3zK7P46T/s0/chatarrasclub_laser_s18g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3AHmDWNCgBxVp_AqlK-FLTYe7D0CqSGNePty-iX9EFCYABbbO25dXQltzv6lRjrhlN3NmHp49ggBJspa4y3Lt2S0kMLYTHJLJT8q-W8E32asor5AMj4Fja1oL5yn2Slr8Q-dv6RuM83EX/s0/chatarrasclub_laser_s18g04.jpg',
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf6u1xRw3d6apXoiEsDunjCh3MJxzvu2hf-4t0bucb-EHsYXTSI_q-_nra05W648S9hwVjSmSIOaNYLaow_FWfAvxtuXkt1bPX6EPiqbj07T1njKMriq88s-C_T6VVObVIXevICjg1-0eg/s0/chatarrasclub_laser_s20g01.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKGfIRwyistrCntWAGoLpjabh4IhBAeuiIMVnHMhGq-U1ThU9nHwk5TZr5JV3x2vzIsl5vJwFx4Ms2QpweNTzgYW1W-oDX1OnFYEXpcLkLDqu3ZbmtRdqZLru3OhihmmMRWiVEfeQg8LF-/s0/chatarrasclub_laser_s20g02.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKy3qari70HPlIXIp-3oAkY5Plj0yi_W-6jHf3pM6Pynxa8PfdOWhdD9oYQhRuUPiN3mdJWft_K8_EM6UNKdB1bdnpoM9ehtKtAdq9Fp8uP8APmDBLBB2RR4XUibgnsZkeCcZqpdVZ2Xf8/s0/chatarrasclub_laser_s20g03.jpg',
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWIe0Afqn4gTBvmX8idJSzPbi0x1SoVV8cZMVSkvekN6-JDOoyqZTV74j_NM_0kHZTJKJR5fcRib32I3XTaKKHqYAYgz-ZDp10vfc1zhqPxCTNUzZB1vmJ8lwtShprwz3eYSefji-5zeLv/s0/chatarrasclub_laser_s20g04.jpg'
  ];


// ...............................................


// ... IMPORTANTE !!!
// ...
// ... Algunas paginas en el codigo que facilitan de insercion de videos
// ... no aparece el "http:" y hay que Añadirlo en nuestro codigo.
// ...
// ... Los videos utilizados para la demostracion No son nada actuales
// ... dado que este juguete lo tengo montado hace mas de un año
// ... y no me apetecia andar buscando otra vez que videos poner.


arrayAllVideosLASv02 = 
  [
  //
  // ESTRUCTURA DEL ARRAY ... son 4 datos para cada video.
  //
  // el texto que aparecera en title y alt para el boton del video.
  //
  'Sin Video',
  //
  // enlace real a la pagina del video por si nos hiciera falta por algun motivo.
  //
  'http://www.youtube.com/watch?v=NDRkZvXOvqo',
  //
  // el grafico para el boton del video.
  //
  'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRvzpJAeFjY5lgcAKeeaz0FayBxJ1Aqsaa0h9Lg0gtXOtoh8rAvbcOl9m7WPQw5ufvQLmrcVQaOTyUA2PtX2g80GNLzzByX9ZdNmmScjnCzWT6NxlXcyNp6iLxHSmfFs9bnhfzrI7Pusgi/s0/chatarrasclub_GIF_0005x0005_TRANS.gif',
  //
  // y lo mas importante, el codigo de insercion valido que facilitan en las paginas.
  //
  '<iframe width="001" height="001" src="http://www.youtube.com/embed/NDRkZvXOvqo?rel=0&autoplay=0&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>',
  //
  'Hits 2013 Vol.3 CD1 (Official Release) TETA ... Video 1',
  'http://www.youtube.com/watch?v=qTwK-sQORIU',
  'http://i1.ytimg.com/vi/qTwK-sQORIU/mqdefault.jpg',
  '<iframe width="640" height="360" src="http://www.youtube.com/embed/qTwK-sQORIU?rel=0&autoplay=0&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>',
  //
  'Hits 2013 Vol.3 CD2 (Official Release) TETA ... Video 2',
  'http://www.youtube.com/watch?v=2_FWXK25YWk',
  'http://i1.ytimg.com/vi/2_FWXK25YWk/mqdefault.jpg',
  '<iframe width="640" height="360" src="http://www.youtube.com/embed/2_FWXK25YWk?rel=0&autoplay=0&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>',
  //
  'BONUS VIDEO MIX - DECEMBER 2013 ... Video 3',
  'http://vimeo.com/81286779',
  'http://b.vimeocdn.com/ts/457/388/457388192_150.jpg',
  '<iframe src="http://player.vimeo.com/video/81286779?title=0&byline=0&portrait=0&autoplay=0" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>',
  //
  'Dj Roger E - Live Videoset ... Video 4',
  'http://vimeo.com/82488117',
  'http://b.vimeocdn.com/ts/458/907/458907674_150.jpg',
  '<iframe src="http://player.vimeo.com/video/82488117?title=0&byline=0&portrait=0&autoplay=0" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>',
  //
  'Dj Roger E - Live Videoset Lucky ... Video 5',
  'http://vimeo.com/82429338',
  'http://b.vimeocdn.com/ts/458/855/458855943_150.jpg',
  '<iframe src="http://player.vimeo.com/video/82429338?title=0&byline=0&portrait=0&autoplay=0" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>',
  //
  'chatarrasclub - Produccion Propia ( playlist ejemplo ) ... Video 6',
  'http://www.youtube.com/playlist?list=PL89709E9A475A8222',
  'http://i1.ytimg.com/vi/71ann6vCOco/default.jpg',
  '<iframe width="640" height="360" src="http://www.youtube.com/embed/videoseries?list=PL89709E9A475A8222&rel=0&autoplay=0&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>'
  ];


// ...............................................


function dibujaBotonLaserDiscoLASv02() {

var salida01 = '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(1); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[04] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(2); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[08] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(3); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[12] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(4); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[16] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(5); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[20] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(6); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[24] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(7); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[28] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(8); return false;" title="Cambia Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[32] + ' alt="Cambia Laser" /></span>' + '&#160;&#160;&#160;&#160;&#160;&#160;' + '<span style="cursor: pointer;" onclick="cambiaGraficoDiscoLASv02(0); return false;" title="Sin Laser"><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllGraficosLASv02[00] + ' alt="Sin Laser" /></span>' ;

document.getElementById("zonaBotonLaserDiscoLASv02").innerHTML=salida01 ;

}


// ...............................................


function dibujaBotonVideoDiscoLASv02() {

var salida01 = '<span style="cursor: pointer;" onclick="cambiaVideoDiscoLASv02(1); return false;" ' + ' title=" ' + arrayAllVideosLASv02[04] + ' "><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllVideosLASv02[06] + ' alt=" ' + arrayAllVideosLASv02[04] + ' " /></span>' + '<br/><br/>' + '<span style="cursor: pointer;" onclick="cambiaVideoDiscoLASv02(2); return false;" ' + ' title=" ' + arrayAllVideosLASv02[08] + ' "><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllVideosLASv02[10] + ' alt=" ' + arrayAllVideosLASv02[08] + ' " /></span>' + '<br/><br/>' + '<span style="cursor: pointer;" onclick="cambiaVideoDiscoLASv02(3); return false;" ' + ' title=" ' + arrayAllVideosLASv02[12] + ' "><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllVideosLASv02[14] + ' alt=" ' + arrayAllVideosLASv02[12] + ' " /></span>' + '<br/><br/>' + '<span style="cursor: pointer;" onclick="cambiaVideoDiscoLASv02(4); return false;" ' + ' title=" ' + arrayAllVideosLASv02[16] + ' "><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllVideosLASv02[18] + ' alt=" ' + arrayAllVideosLASv02[16] + ' " /></span>' + '<br/><br/>' + '<span style="cursor: pointer;" onclick="cambiaVideoDiscoLASv02(5); return false;" ' + ' title=" ' + arrayAllVideosLASv02[20] + ' "><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllVideosLASv02[22] + ' alt=" ' + arrayAllVideosLASv02[20] + ' " /></span>' + '<br/><br/>' + '<span style="cursor: pointer;" onclick="cambiaVideoDiscoLASv02(6); return false;" ' + ' title=" ' + arrayAllVideosLASv02[24] + ' "><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllVideosLASv02[26] + ' alt=" ' + arrayAllVideosLASv02[24] + ' " /></span>' + '<br/><br/>' + '<span style="cursor: pointer;" onclick="cambiaVideoDiscoLASv02(0); return false;" ' + ' title=" ' + arrayAllVideosLASv02[00] + ' "><img style="width: 050px; height: 050px; border: 1px solid red;" ' + ' src = ' + arrayAllVideosLASv02[02] + ' alt=" ' + arrayAllVideosLASv02[00] + ' " /></span>' ;

document.getElementById("zonaBotonVideoDiscoLASv02").innerHTML=salida01 ;

}


// ...............................................


function rotacionDiscoLASv02() {

var salida01 = '<img style="width: 1024px; height: 768px; border: 1px solid red; background-color: black;" ' + ' src = ' +  arrayGraficosLASv02[indColorLASv02]  + ' />' ;

document.getElementById("zonaLaserDiscoLASv02").innerHTML=salida01 ;

indColorLASv02 = indColorLASv02 + 1 ;

if ( indColorLASv02 == arrayGraficosLASv02.length )  indColorLASv02 = 0;

estadoTimeLASv02=setTimeout("rotacionDiscoLASv02()", velocidadTimeLASv02);

}


// ...............................................


function startDiscoLASv02() {

if (estadoRunLASv02 == 1) return;

estadoTimeLASv02=setTimeout("rotacionDiscoLASv02()", velocidadTimeLASv02);

estadoRunLASv02 = 1;

}


// ...............................................


function stopDiscoLASv02() {

clearTimeout(estadoTimeLASv02);

indColorLASv02 = 0;

estadoRunLASv02 = 0;

estadoTimeLASv02 = 0;

var parada01 = '<img style="width: 1px; height: 1px; border: 1px solid blue; background-color: black;" ' + ' src = ' + arrayAllGraficosLASv02[00] + ' />' ;

document.getElementById("zonaLaserDiscoLASv02").innerHTML=parada01 ;

}


// ...............................................


// ... Precarga Imagenes Graficos.

function precargaImagenesDiscoLASv02() {

var myimages = new Array();

for ( i = 0; i < arrayAllGraficosLASv02.length; i++ )

    {

    myimages[i] = new Image();

    myimages[i].src = arrayAllGraficosLASv02[i];

    }

}


// ...............................................


function asignaGraficoDiscoLASv02() {

// ... 0 ... OPCION SIN GRAFICOS ...
// ... Uno cualquiera, aunque lo mejor como esta aqui es un GIF transparente.

if ( tipoGraficosLASv02 == 0 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(00, 04) ;

if ( tipoGraficosLASv02 == 1 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(04, 08) ;

if ( tipoGraficosLASv02 == 2 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(08, 12) ;

if ( tipoGraficosLASv02 == 3 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(12, 16) ;

if ( tipoGraficosLASv02 == 4 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(16, 20) ;

if ( tipoGraficosLASv02 == 5 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(20, 24) ;

if ( tipoGraficosLASv02 == 6 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(24, 28) ;

if ( tipoGraficosLASv02 == 7 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(28, 32) ;

if ( tipoGraficosLASv02 == 8 ) arrayGraficosLASv02 = arrayAllGraficosLASv02.slice(32, 36) ;

}


// info de interes sobre "slice array"
// http://www.w3schools.com/jsref/jsref_slice_array.asp



// ...............................................


// ... cambia los graficos laser -al vuelo-


function cambiaGraficoDiscoLASv02( nTipoCambio ) {

stopDiscoLASv02();   // paramos laser activo

tipoGraficosLASv02 = nTipoCambio;

indColorLASv02 = 0;

estadoTimeLASv02 = 0;

asignaGraficoDiscoLASv02();

startDiscoLASv02();  // lanzamos de nuevo

}


// ...............................................


function asignaVideoDiscoLASv02() {

var salida01 = '' ;


// ... 0 ... OPCION SIN VIDEO ...
// ... SERA UN VIDEO CUALQUIERA QUE SEA DE POCA DURACION PARA QUE CARGUE RAPIDO
// ... Y QUE PONDREMOS SUS MEDIDAS A 1 PIXEL POR 1 PIXEL.


if ( tipoVideoLASv02 == 0 ) arrayVideosLASv02 = arrayAllVideosLASv02.slice(00, 04) ; salida01 = arrayVideosLASv02[3] ;

if ( tipoVideoLASv02 == 1 ) arrayVideosLASv02 = arrayAllVideosLASv02.slice(04, 08) ; salida01 = arrayVideosLASv02[3] ;

if ( tipoVideoLASv02 == 2 ) arrayVideosLASv02 = arrayAllVideosLASv02.slice(08, 12) ; salida01 = arrayVideosLASv02[3] ;

if ( tipoVideoLASv02 == 3 ) arrayVideosLASv02 = arrayAllVideosLASv02.slice(12, 16) ; salida01 = arrayVideosLASv02[3] ;

if ( tipoVideoLASv02 == 4 ) arrayVideosLASv02 = arrayAllVideosLASv02.slice(16, 20) ; salida01 = arrayVideosLASv02[3] ;

if ( tipoVideoLASv02 == 5 ) arrayVideosLASv02 = arrayAllVideosLASv02.slice(20, 24) ; salida01 = arrayVideosLASv02[3] ;

if ( tipoVideoLASv02 == 6 ) arrayVideosLASv02 = arrayAllVideosLASv02.slice(24, 28) ; salida01 = arrayVideosLASv02[3] ;

document.getElementById("zonaVideoDiscoLASv02").innerHTML=salida01 ;

}


// ...............................................


// ... cambia los videos -al vuelo-


// ... IMPORTANTE !!!
// ...
// ... El cambio de video al tener que cargarse desde la pagina donde esté
// ... resultara siempre mas lento que el cambio de graficos.


function cambiaVideoDiscoLASv02( nTipoCambio ) {

tipoVideoLASv02 = 0;
asignaVideoDiscoLASv02(); // una pasada para "borrar" video activo.

tipoVideoLASv02 = nTipoCambio;
asignaVideoDiscoLASv02(); // y ahora el cambio real de video.

}


// ...............................................


// ... LANZA INICIALMENTE TODOS LOS PROCESOS ...


precargaImagenesDiscoLASv02();

dibujaBotonLaserDiscoLASv02();

dibujaBotonVideoDiscoLASv02();

asignaGraficoDiscoLASv02();

asignaVideoDiscoLASv02();

startDiscoLASv02();


// ]]>
</script>

****** BLOQUE 2 - Sección C ******


</textarea>

<!-- no hay error, solo tiene esa linea -->

TERCERO:

Copia y pega el código del "BLOQUE 3" a continuación y dentro de la misma entrada.

****** BLOQUE 3 ******


<br/>
<br/>
<br/>

<!-- ... ESTA ES LA CLAVE PARA LANZAR MI VENTANA REMOTA ... -->

<div style="text-align:center;"><span style="cursor: pointer; font-family: courier new; font-size: 200%;" onclick="chatarrasclubLaser01Popup( (document.getElementById('CODELASER01POPUP').value), 1024, 768 ); return false;" title="Lanza Ventana Laser Blogger"><b>[LANZA VENTANA LASER BLOG]</b></span></div><br/>

<!-- ... THE END ... LAS RECLAMACIONES AL MAESTRO ARMERO ... -->

<br/>
<br/>
<br/>

FIN:

Guarda y Publica la entrada.

Una vez comprobado su funcionamiento podrás Editar tu entrada y cambiar los datos del codigo fuente para hacer tus propios experimentos.

... edit by tommy for "chatarras club" ...