Div Games en Html5 y Canvas

[AmakaSt]

Hola Amaka....
1.Gracias de antemano...pero el ejemplo que has puesto por mas que guarde la puntuacion tocando s y luego la intento cargar pulsando L siempre me da 0.no recupero el valor.......

2.Quiero guardar una tabla[] con x valores.....

3.Respecto lo de php...podrias ser mas preciso...mas extenso en la explicacion,pues me siento perdido....lo tengo que hacer de forma externa?¿?fuera de divgo?¿?.como?¿?

4.No seria mas practico poder crear una nueva funcion y con instrucciones de divgo poder insertar un nuevo mapa directamente al fpg...ejemplo de la nueva funcion...insert_map_fpg(fichero,numero del png donde queremos poner  o posicionar el nuevo png en el fpg).....De esta manera de forma simple puedo utilizar un mapa de un pixel de alto y x de ancho y luego solo debo leer pixel a pixel la posicion...luego seria cuestion rellenar la tabla con este contenido y no seria tan rebuscado.....ES decir previamente creo un new_map de un tamaño cualquiera,luego lo pinto,luego lo inserto al fpg  y de esa manera ya tengo un mapa creado que lo utilizo como informacion..

Hola oskarg,

1. No te va a guardar porque te lo he puesto para que puedas probarlo en tu local, en divgo.net no está el archivo guardar_datos_archivo.php. Prueba ese código copiando el código php en tu local.
2. En vez de una variable como puntos, pásale el nombre de la tabla, te guardará todo su contenido.
3. En la carpeta de ejemplos, existe un archivo php (guardar_datos_bbdd.php) para el ejemplo (ejemplo_external_data.prg). Prueba en copiar el código php que te he puesto en la misma carpeta con el nombre guardar_datos_archivo.php o como quieras llamarlo luego desde las funciones save_external_data() y load_external_data().
4. No se puede, para eso requiere un lenguaje en entorno servidor, Javascript por seguridad no puede manipular archivos locales, estarías manipulando archivos del ordenador del usuario desde una página web, desde el navegador, eso sería altamente inseguro.

Un saludo.

[oskarg]

Hola Amaka,
Mil gracias ya se como funciona a la hora de guardar  valores,con variables o por tablas,disculpa sin tu ayuda no hubiera sido capaz de solventarlo......pues ni idea de php.
Un saludo

[AmakaSt]

Me alegra que te haya funcionado. :)

En realidad no es difícil y el código PHP que he puesto es muy sencillo haciendo uso de las funciones fopen, fwrite y fread, y esto creo recordar que también estaba en Div 2.

Un saludo.

[oskarg]

Buenos días Amaka,
Hace tiempo que no veo actividad ,me imagino que estás bien ocupado con tu trabajo ,aún así  "pa cuando" una nueva versión???.
Por mi parte cuando termine lo que estoy haciendo te lo paso para que lo publiques y así ampliamos el abanico de juegos y tutoriales para divgo.
Un saludo.

[AmakaSt]

Hola oskarg,

Tenía pensado sacar versión a principios de Marzo, pero... Para la próxima versión estoy haciendo muchos cambios y mejoras (optimizando la librería, compilador e IDE), ahora tengo el IDE inestable por cambios en el sistema de pestañas, es con lo que estoy ahora y con esto se corregirá también el problema al pulsar Ctrl+z. :)

Habrá muchas mejoras internas, y con el cambio del sistema de scroll también estoy probando con otra novedad que tengo que testear un poco más.

Aprovechare semana santa para darle las ultimas pinceladas, espero sacar versión para antes de Mayo.

Por mi parte cuando termine lo que estoy haciendo te lo paso para que lo publiques y así ampliamos el abanico de juegos y tutoriales para divgo.

Perfecto! :)

Un saludo.

[oskarg]

Hola Amaka,
1.Son buenas noticias ,gracias por  poco a poco ir mejorando tu engine,pues  motiva bastante ver como  va evolucionado y puliendo aspectos.

2.Una cuestion,el put_pixel es muy lento,lo se..me imagino  que es por la mecanica de como se comporta Divgo ...Ni idea yo de javascript ,pero aqui hay un ejemplo de put_pixel y va bastante rapido.............https://stackoverflow.com/questions/4899799/whats-the-best-way-to-set-a-single-pixel-in-an-html5-canvas

3.Una sugerencia echo de menos una forma sencilla de hacer recorridos ,paths....de una nave etc,con curvas..En processing existe  CurvePoint(a,b,c,d,t) https://processing.org/reference/curvePoint_.html o bien tener una funcion que haga una curva bezierPoint....entonces obtengo los puntos ...luego seria cuestion de hacer un interpolado para hacer el recorrido de estos y de esta forma tengo una forma simple de mover las cosas o mejor aun añadir el CreateJS  tweens...aunque  desconozco si esto es factible por causas de rendimiento,ni idea.....aunque tambien puedo tener guardados esos puntos de forma previa y hacer tal recorrido.... :P

Un saludo.

[AmakaSt]

2.Una cuestion,el put_pixel es muy lento,lo se..me imagino  que es por la mecanica de como se comporta Divgo ...Ni idea yo de javascript ,pero aqui hay un ejemplo de put_pixel y va bastante rapido.............https://stackoverflow.com/questions/4899799/whats-the-best-way-to-set-a-single-pixel-in-an-html5-canvas

3.Una sugerencia echo de menos una forma sencilla de hacer recorridos ,paths....de una nave etc,con curvas..En processing existe  CurvePoint(a,b,c,d,t) https://processing.org/reference/curvePoint_.html o bien tener una funcion que haga una curva bezierPoint....entonces obtengo los puntos ...luego seria cuestion de hacer un interpolado para hacer el recorrido de estos y de esta forma tengo una forma simple de mover las cosas o mejor aun añadir el CreateJS  tweens...aunque  desconozco si esto es factible por causas de rendimiento,ni idea.....aunque tambien puedo tener guardados esos puntos de forma previa y hacer tal recorrido.... :P

Esto es lo que tiene basicamente put_pixel() de DivGO:

Code Select Expand

    var put_pixel = function (x, y, color) {
        var screen = DivGO.contextoScreen;
        if (typeof color === 'number') color = DivGO.functions.rgb(color, color, color);

        screen.fillStyle = color;
        screen.globalAlpha = 1;
        screen.fillRect(x, y, 1, 1);
    }
Hago uso de fillRect(), aquí tienes una comparativa de performance con otras opciones: https://jsperf.com/setting-canvas-pixel/46

Si pruebas en distintos navegadores, fillRect() en Firefox no es la opción más rápida pero tampoco es la peor y en cambien en Chrome es la más rápida. :)

Para el recorrido de una nave se puede ir guardando los puntos en un array o struct con las coordenadas x e y. En este ejemplo se usa puntos de control: https://www.divgo.net/c-df6b4c63

Un saludo.

[hokuto40]

Te ha quedado muy chulo el movimiento amaka.

Pero creo que deberias introducir una funcion interna para esto,por ejemplo:
-advancePoint(x,y,velocidad,tipo)
El parametro tipo seria para que el movimiento sea recto o curvo.

Llevo un tiempo utilizando los lenguajes divlikes y aunque los divlikes son muy chulos y asequibles(sobre todo para crear juegos simples),cuando tratas de añadir cosas un poco mas complejas tienes que crearlo todo desde cero y se complica bastante el tema.

Por eso hecho en falta que tengan una buena coleccion de funciones que te ayuden en la mayoria de cosas que pueden venir en los juegos,de la misma forma que trae contruct 2 o gamemaker.

Esto es algo que no entiendo porque no se hace en ningun divlike,se supone que estos lenguajes estan diseñados para crear juegos pero no traen funciones para ayudarte en esa tarea,lo que si traen son funciones para hacer cositas con los graficos,sonidos,calculos etc...

Pero esto ya lo traen las librerias graficas,por lo que la unica diferencia que le veo con una libreria grafica son los procesos.

No te lo tomes como una critica,esto solo es un pensamiento que tengo y que solo me  gustaria que estos lenguajes fueran una ayuda real para hacer juegos.Yo pienso que estos lenguajes estan mas que finalizados y si se le añadieran esas funciones que llevo comentando hace tiempo en otro foro serian mas atractivos.

[AmakaSt]

Te ha quedado muy chulo el movimiento amaka.

Pero creo que deberias introducir una funcion interna para esto,por ejemplo:
-advancePoint(x,y,velocidad,tipo)
El parametro tipo seria para que el movimiento sea recto o curvo.

Llevo un tiempo utilizando los lenguajes divlikes y aunque los divlikes son muy chulos y asequibles(sobre todo para crear juegos simples),cuando tratas de añadir cosas un poco mas complejas tienes que crearlo todo desde cero y se complica bastante el tema.

Por eso hecho en falta que tengan una buena coleccion de funciones que te ayuden en la mayoria de cosas que pueden venir en los juegos,de la misma forma que trae contruct 2 o gamemaker.

Esto es algo que no entiendo porque no se hace en ningun divlike,se supone que estos lenguajes estan diseñados para crear juegos pero no traen funciones para ayudarte en esa tarea,lo que si traen son funciones para hacer cositas con los graficos,sonidos,calculos etc...

Pero esto ya lo traen las librerias graficas,por lo que la unica diferencia que le veo con una libreria grafica son los procesos.

No te lo tomes como una critica,esto solo es un pensamiento que tengo y que solo me  gustaria que estos lenguajes fueran una ayuda real para hacer juegos.Yo pienso que estos lenguajes estan mas que finalizados y si se le añadieran esas funciones que llevo comentando hace tiempo en otro foro serian mas atractivos.

Hola hokuto,

Me apunto tu consejo de función, aunque me suena que ya hay algo muy similar. Siempre son bienvenidas las propuestas, indicando como funcionaria y tal. Como has hecho.
Te recomiendo que crees un post en Div GO proponiendo funciones y que usos tendría, como se aplicaría en el juego, lo que se te vaya ocurriendo. Y yo por mi parte me las iré mirando y si veo que las puedo incluir, estarán disponibles. :)

También me tiro muchos días (o semanas), intentando añadir cosas nuevas, funcionalidades o mejoras que luego por cualquier razón no consigo que acaben de funcionar como quiero y acabo apartándolas para más adelante y puede dar la sensación de dejadez. Ahora mismo me está pasando con las pestañas del IDE, me tienen frito y acabará en un stash para más adelante. :P

Tranquilo, no me lo tomo como una crítica, yo también tengo el culo pelado de probar otras herramientas de desarrollo de juegos y siempre acabo en un Divlike por comodidad, lo último que he estado tocando es Pico8 y Phaser.

Un saludo.

[hokuto40]

Hola amakast,esa funcion que te he sugerido se me ha ocurrido en el momento,no lo he pensado mucho la verdad,pero para esto tienes una solucion.

Yo mismo le hice la sugeriencia hace tiempo a erkosone sobre los path y comentandole algunos retoques,hasta que quedo algo muy chulo y super facil de usar.Lo mejor que puedes haces es descargarte la gamelibzero version javascripts de erkosone y copiar la clase de path y adaptarla a divgo.Esto esta ya hecho y funciona perfecto y te aprovechas del trabajo de otro.

Otra cosa,acabas de decir que quieres que te haga sugerencias,sabes que soy muy pesado y un dolor en el culo.Esto es como abrir la caja de pandora,¡estas seguro de lo que acabas de decir!.

Hablando en serio,creo que lo mejor es empezar por la interfaz de divgo antes de darte alguna sugerencia de funciones,yo no he podido programar nada todavia por culpa de la interfaz.Ya sabes que te dije que se come un trozo de la interfaz mi ordenador y no puedo trabajar con comodidad.

Abro otro hilo sobre sugerencias y te comento por alli,lo del path de gamelibzero,si quieres te pongo como es la clase de los path,aunque es mejor que lo veas tu mismo.

Por cierto,pico8 no lo he probado y phaser si.Phaser tiene algunas ayuditas pero cuanto mas profundizas en el mas te das cuenta lo mal que esta planteado,funciones con nombres muy largos,utilizar los puntos para acceder a los metodos(yo.el.tu.tarari() estos estan locos con tantos puntos) y todo esta muy mal planteado,no se lo que la gente le vera a este engine.

Si quieres coger buenas ideas.lo mejor es que pruebes gamemaker y contruct2.

[AmakaSt]

Otra cosa,acabas de decir que quieres que te haga sugerencias,sabes que soy muy pesado y un dolor en el culo.Esto es como abrir la caja de pandora,¡estas seguro de lo que acabas de decir!.

Por mi parte nunca he dicho que no se pueda sugerir cosas para DivGO, cuantas más sugerencias mejor. Otra cosa es que pueda aplicarlas. :P

Por cierto,pico8 no lo he probado y phaser si.Phaser tiene algunas ayuditas pero cuanto mas profundizas en el mas te das cuenta lo mal que esta planteado,funciones con nombres muy largos,utilizar los puntos para acceder a los metodos(yo.el.tu.tarari() estos estan locos con tantos puntos) y todo esta muy mal planteado,no se lo que la gente le vera a este engine.

Si quieres coger buenas ideas.lo mejor es que pruebes gamemaker y contruct2.

A mí lo de los puntos no me desagrada, es como funciona Javascript:

document.getElementById("id").parentNode.nodeName;
document.getElementsByTagName("div")[0].getAttribute("class");

Y los hay de más largos. xD

[hokuto40]

He probado el ejemplo de colision y no funciona,los que estan mas abajo no me salen por el problema que ya te he comentado con la pantalla.

Me da este error.

Code Select Expand


28 scroll[0].alpha0 = 20; scroll[0].alpha1 = 10; -- VARIABLE NO DEFINIDA!
29 scroll[1].alpha0 = 80; scroll[1].alpha1 = 40; -- VARIABLE NO DEFINIDA!
45 scroll[0].y0 += 0.5; scroll[0].y1 += 0.25; -- VARIABLE NO DEFINIDA!
46 scroll[1].y0 += 2; scroll[1].y1 += 1; -- VARIABLE NO DEFINIDA!
76 scroll.x0 += 0.5; scroll.x1 += 0.25; -- VARIABLE NO DEFINIDA!
77 scroll[1].x0 += 2; scroll[1].x1 += 1; -- VARIABLE NO DEFINIDA!
82 scroll.x0 -= 0.5; scroll.x1 -= 0.25; -- VARIABLE NO DEFINIDA!
83 scroll[1].x0 -= 2; scroll[1].x1 -= 1; -- VARIABLE NO DEFINIDA!


[AmakaSt]

Lo de las variables de scroll cambió en la versión 1.80 por una nueva estructura más limpia y con más variables, y para añadir más planos en un futuro.

Por lo que ahora: scroll[0].x0 paso a ser scroll[0].front.x y scroll[0].x1 por scroll[0].back.x.

Y así ahora cada plano soporta de manera independiente variables como: tone, blur, grayscale, alpha... Como los procesos.

Un saludo.

[hokuto40]

He descargado algun ejemplo de tu pagina,pero solo trae el archivo prg.Como se puede descargar los graficos.

[AmakaSt]

Todos los ejemplos de la web funciona con los gráficos de la carpeta "./graficos/".