Sí, ya se, hay que estar muy aburrido para ponerse a realizar el juego de pong en javascript y más aun en una noche de 1:30 am a 4 am, pero cuando le tienes que demostrar a tus alumnos que javascript no solo sirve para "algunas tonterías" creo que es una buena opción.

Anoche me dediqué a realizar el jueguito de Pong en JavaScript con un peso final de solo 6Kb, validando tanto el HTML, el CSS y el JS, que peca de sencillo? bueno es la versión 0.1 y solo quería mostrarle las posibilidades a los chicos, se puede mejorar y en el código he colocado varios comentarios en los lugares donde se puedan hacer mejoras, niveles, puntajes, equipos, efectos "especiales" (como agrandar o empequeñecer la barra del jugador o de la pc) entre otros.

Hoy me trataron de "Loco", "Que te fumas", "Cual es tu CI" y cosas por el estilo. Mi CI debe ser de 10 por tanto café que tomo y lo poco que duermo, pero bueno.

Entrando al tema les explico, el "juego" lo componen 5 archivos:

- pong_conf.php: Archivo de configuración, acá se escriben todos los parámetros del juego: tamaño del cajón, tamaño de las barras, pelota, colores, velocidades, cantidad de "idiotez" del computador etc.

- pong_css.php: Este archivo es un CSS donde se especifican las propiedades, que por qué es un .php? Pues para tener toda la configuración centralizada, este archivo se crea dependiendo de las variables modificadas en el pong_conf.php

-pong.php: Acá es donde se definen los DIV's, se define el DOCTYPE y se cargan tanto el CSS como el JS utilizado, es la pura y real maquetación del juego.

-pong_js.js: El Alma del juego: Lista de funciones que se encargan de manejar toda la idea del juego, desde el movimiento de la pelota, pasando por el control de choque de la pelota con las barras y paredes hasta el control de la "inteligencia" (o estupidez) de la barra que controla la pc (un porcentaje de probabilidades) y control con el teclado de la barra del jugador.

-happy.png: Es la carita que define la "pelota" y creo que la mascota del juego. (Licencia LGPL http://www.everaldo.com/)

Primero una captura del juego, es realmente SENCILLO y muy SOBRIO.

Acá le vemos, tiene una barra controlada por el usuario (verde a la Izquierda), una barra controlada por la pc (roja a la derecha) y una pelota happy que se la pasa rebotando de un lado a otro.

La ciencia del juego no es más que mover la barra para evitar que la pelota pase hacia el borde izquierdo y perdamos.

Como? sencillo: mientras se esté en el documento utilizando las teclas "Flecha arriba" y "Flecha abajo" movemos la barra del jugador.

Desean probarlo? Acá: http://works.lbcoders.com/pong/pong.php

En el código que coloco para descarga a continuación viene la documentación básica de cada archivo. cualquier duda, comentario o aporte que deseen pueden revisar mi ficha en este blog http://blog.lbcoders.com/user/LCoronelP

Saludos! y que Pong los acompañe... Ehmmm la fuerza de la programación los acompañe siempre xD ya sea en PHP, C, C++, C#, Javascript, Python o Ruby. (no soy muy amante de Java pero bueno... está bien... quejones, también en Java)

DESCARGA: http://works.lbcoders.com/pong/pong.zip

LICENCIA: CreativeCommons 2.0 No Comercial-Reconocimiento-Sin obras derivadas