Div Games en Html5 y Canvas

[oskarg]

Te respondo yo hokuto,es sencillo hacer eso programando...pero mas sencillo seria hacer lo siguiente.Tener un conjunto de herramientas completas que se integraran en el engine,tipo pico8 que es ridiculo su engine y su escasa resolucion grafica y para hacer esto se requiere de mucho tiempo de dedicacion.
Con lo cual si quieres agilizar las cosas,tendras que crear tu propio editor de tiles y editor grafico,te lo expreso por experiencia,pues lo mas dificil no es programar ,sino hacer los sprites ,tiles y fondos....

.....No entiendo donde tienes el problema de pasar el nivel o crear un nuevo escenario,cuando publique el juego mega simple quizas veas que sencillo es cambiar de nivel utilizando la logica,sin apenas utilizar funciones ya predefenidas.

....Vas a ver que son mega simples mis tutoriales ,pero con una buena base,se avanza,a mas que vi,un ejemplo tuyo,muy bueno,no entiendo como no asimilas ese concepto si comprendistes las explicaciones que te dio sobre OOP que es un tema avanzando...pues yo no entendí ni papa XD.

ahh y cuando puedas comprate un ordenador actual,no hace falta que te gastes un dineral,yo tenia un pentium 4,ahora tengo un amd a10 ,es modesto pero increiblemente divgo ya no noto retraso alguno y eso que me costo 150 euros XD ,con lo cual,uno mas potente debe ir de perlas ...pruebalo  y si no te convence lo cambias y te compras otro de segunda mano,merece la pena,segun que propositos tengas con el.

[hokuto40]

Hola oskarg.

Reconozco que estoy un poco liado con esto de los niveles,pero no es por pasar de nivel es mas bien por hacer que se pueda reiniciar el nivel en el que ha muerto mi personaje.

El problema es que lo que me recomendo cictec para aprender a crear una estructura de niveles era fijarme como estaba hecho la del doctor malvado y sinceramente te digo que estaba muy mal hecha en ese juego.

Acabe muy liado pero al final la introduci en mis tres juegos pero no me gusta esa forma de hacerlo y yo he creado mi propia forma de hacer esto pero necesito esto.

Signal_set_behaviour() y signal(all_process,s_kill),esto es para que al proceso principal no le afecte la destrucion de procesos y pueda hacerlo a mi manera.

Pero si te soy sincero,mi problema real es la falta de ejemplos sencillos para aprender por mi cuenta,ya lo he dicho muchas veces pero no hay manera de que se me entienda y si yo tuviera ejemplos sencillos para aprender la mayoria de las cosas no estaria tan liado como estoy hoy,ese es el verdadero problema y el porque estoy preguntando cien veces lo mismo.

Estoy deseando ver esos ejemplos tuyos oskarg  ,y tampoco vendrian mal algunos que explicasen como crear un editor de tiles y un editor grafico porque no he visto ningun ejemplo de esas cosas en ninguna parte.

Decirte que la programacion orientado a objetos es muy sencilla,yo te recomiendo python para aprender este concepto y puedes utilizar pilasengine para practicar,si es que no sabes usar la programacion orientada a objetos pero si sabes no he dicho nada.

Por cierto eso de 150 euros por un ordenador,dime donde esta eso que mañana mismo voy a comprarlo,pero reconozco ser muy cabezota y como no me gusta tirar el dinero pues soy capaz de llevarme con mi ordenador 100 años mientras no se estropee ,pero tendre que comprar algo este año que entra.

Resumiendo,mi unico problema es la falta de ejemplos sencillos que me expliquen la mayoria de cosas que necesito para aprender por mi cuenta.

Una ultima cosa,ya te digo que la gente que utiliza engines como gamemaker y contruct no van a aceptar nunca esa forma de hacer los niveles,aunque si les explica copmo hacerlo de una forma sencilla pues tal vez se les convenza.Chao

[AmakaSt]

Hola oskarg,

Para empezar y antes de nada te digo que no voy a dejar Div GO, sigo desarrollando cosas, por lo pronto correcciones y cambios internos de código. Ahora estoy preparando una nueva versión, la v1.16.7, que si tengo tiempo la pongo online ya. Esta versión arregla funciones como color_in_map(), paint_in_map(), blur_in_map()... Les pasaba lo mismo que a new_map(), con esto se arregla el problema que tienes para cambiar de color los gráficos incrustados en map_put() y map_xput(). Estos cambios también hacen que mejore un poco el rendimiento usando estas funciones.

Te incluiré un ejemplo haciendo uso de map_put() con color_in_map(). 

Una vez tengas esta versión disponible, podrás mejorar ese tutorial y hablamos por privado para echarte una mano, sobre la tabla de records mi juego Gamma Z tiene 2 tablas de records conectadas a una BBDD y las Apis de Facebook (para ver la puntuación de los amigos).

Un saludo.

[AmakaSt]

Pasemos a otro tema mas interesante,me gustaria darte una idea amakast aunque ya lo he intentado con dos personas pero no les convence,a ver si a ti te parece util.

La forma en la que tiene el lenguaje div de crear los niveles me parece un poco liosa y esto desmotiva a cualquiera que empieza,por eso creo que se deberia de crear algun proceso especial o introducir una clase especial que se encargue de manejar los niveles.

Seria como un contenedor donde meter los objetos/procesos y cuando pases de nivel esta clase/proceso se encargaria de eliminar los objetos automaticamente para que el siguiente nivel estuviera limpio para cargar los recursos del siguiente nivel.

Tambien estaria bien un par de funciones para manejar esto,una funcion para hacer lo de pasar de nivel y otra para reiniciar el nivel,algo como lo que tiene gamemaker y unity.

Creo que esto motivaria a gente a que usara divgo y les resultara mas facil empezar,por que creo que lo de los niveles puede desmotivar a cualquiera que empiece sin saber mucho de programacion.

Dime si seria posible introducir esto o es algo muy complicado o no te parece necesario.

Hola hokuto40,

Lo que comentas se puede hacer de muchas formas y tan fácil como desees, con un proceso o función e incluir todo lo que necesites para limpiar el nivel, luego haces la llamada con carga a otro nivel.

Para limpiar puedes hacer algo parecido a esto, por ejemplo:

Código: [Seleccionar]

process clear_stage(stage)
begin
   let_me_alone();  //se eliminan todos los procesos dejando este vivo
   delete_text(all_text);
   stop_scroll(0);
   //aqui puedes añadir tambien los recursos que ya no quieras utilizar en el siguiente nivel: audio, imagenes, fuentes

   if (vida > 0)
      stage ++;
      next_stage(stage);  //haces la carga del siguiente nivel con todos los recursos
   else
      game_over(); //muestra pantalla de game over
   end
end


El problema es que lo que me recomendo cictec para aprender a crear una estructura de niveles era fijarme como estaba hecho la del doctor malvado y sinceramente te digo que estaba muy mal hecha en ese juego.

Acabe muy liado pero al final la introduci en mis tres juegos pero no me gusta esa forma de hacerlo y yo he creado mi propia forma de hacer esto pero necesito esto.

Hombre decir que el código de Dr. Malvado está mal... es una forma de hacerlo, te puede gustar más o menos, en un lenguaje de programación como DIV se puede hacer de mil maneras.

Un saludo.

[hokuto40]

Hola amakast y gracias por el ejemplo.

Pero no entiendo muy bien que es lo que hace la funcion next_stage(),porque no se que es lo que lleva adentro y no se si es un proceso o una funcion,pero no quiero volver a cometer los mismos errores y empezar a hacer pesado ahora contigo.

Esperare el ejemplo de oskarg para estudiarlo,pero el problema que tengo no es el de pasar de nivel es el de reiniciar el nivel,porque no se como indicarle al programa en que nivel esta mi personaje para que cuando lo maten reinicie desde ese mismo nivel.

Lo mejor seria hacer un ejemplo que explique unicamente como pasar de un nivel a otro y el poder reiniciar cuando muera el personaje en el nivel en el que se encuentra.
Es basicamente lo que llevo diciendo desde hace mucho tiempo en otro foro,lo mejor es hacer ejemplos cortos y individuales que expliquen solo una cosa,porque si metes muchas cosas en el ejemplo una persona principiante se acaba perdiendo con tanto codigo y pierde las ganas de seguir.

Lo del doctor malvado no me he explicado bien o no me has entendido,yo no he dicho que el codigo del doctor malvado este mal hecho,lo que queria decir es que el codigo de la estructura de niveles es demasiado complicado para que lo entienda una persona que nunca ha hecho eso.Saludos

Por cierto,he mirado en la pagina de descarga de divgo y pone que la version actual es la v1.16.0,puede que no hayas subido la nueva actualizacion o que no hayas puesto los numeros correctos.

[oskarg]

Genial.....ya lo tengo jugable,solo falta añadir cosas como una tabla de records,añadir fades,pero como es muy basico quizas lo descarto,hacer un par de efectos cuando se pasa de fase dando un  bonus y cambiar un poco la mecanica del original,pues la primera vez que lo hice,fue un calco en graficos y jugabilidad al original ,pero jugando ,jugando me di cuenta que era demasiado simplote y desfasado  y tampoco quiero provocar con mi primer tuto una carcajada eterna   .
Otras cuestiones....

1.Cuando hago un let_me_alone ,pregunto desde mi desconocimiento....no deberia resetear todos los cambios que he realizado en los mapas de los procesos que he matado?¿?lo expreso porque no vuelve al grafico original con tal funcion ,desconozco si esto es correcto,pues me veo obligado hacer un clear_map_put de todo el mapa para dejarlo como lo habia cargado desde el inicio.

2.Me va ir de perlas esa nueva beta ....

3.Otra cuestion he visto tus juegos y el juego de los "peces" me  has dejado pasmado,los graficos los haces  vectoriales?¿?

4.Pues te iba a preguntar algo similar, como diablos puedo guardar informacion en un txt,en el disco duro y luego leerlos,porque no veo funciones para ello.

5.Estaria bien que el editor tuviera un save donde no me pregunte si quiero guardarlo....

6.Una sugerencia,cuando tengo mucho codigo,para compilarlo,debo ir hasta abajo de la ultima linea para encontrar el icono de compilar,Deberia estar siempre visible.Cuestion de comodidad ...vale rectifico,no se que hacia que no me salia el icono....

[AmakaSt]

Nueva versión 1.16.7 de Div GO ya disponible online (para testeos, descargable no disponible aún), las novedades:

bugs y mejoras:
   - [DEL] eliminado elemento que se replicaba en cada gráfico cargado por si se le aplicaba un efecto
   - [CHANGE] cambios en funciones: color_in_map(), paint_in_map(), blur_in_map(), pixelated_in_map()
   - [CHANGE] cambiado el funcionamiento de screen_copy()

Ejemplo de map_put() con color_in_map(): https://www.divgo.net/c-b1710c19

Un saludo.

[AmakaSt]

4.Pues te iba a preguntar algo similar, como diablos puedo guardar informacion en un txt,en el disco duro y luego leerlos,porque no veo funciones para ello.

5.Estaria bien que el editor tuviera un save donde no me pregunte si quiero guardarlo....

6.Una sugerencia,cuando tengo mucho codigo,para compilarlo,debo ir hasta abajo de la ultima linea para encontrar el icono de compilar,Deberia estar siempre visible.Cuestion de comodidad ...vale rectifico,no se que hacia que no me salia el icono....

4. Se puede enviar datos a php a traves de save_external_data() y recuperar con load_external_data(), con php puede guardar información en un txt y recuperarla sin problemas.

5. El código que programas se guarda automáticamente en tu navegador cada vez que compilas, lo mismo que con los cambios que hagas en imágenes desde el editor. Por seguridad, cada vez que hagas grandes cambios en tu código lo mejor es guardarlo en un prg.

6. Qué raro, no es necesario bajar todo el código para ver la opción de compilar, creo que no te he entendido... 

Un saludo.

[AmakaSt]

Ahora sí, al fin ya está disponible para descargar la versión 1.16.7 de Div GO: http://www.amakasoft.com/herramientas/div-go.html

[oskarg]

Hola Amaka ,
mil gracias ya puedo hacer lo que pretendia,pero no entiendo como le asigno los colores a traves del rgb...es decir
tabla[1]=rgb(255,0,0),rgb(255,55,0); pero no funciona ..¿?¿?como se define de esta manera?¿?

Despues observo que esto tampoco funciona ....por que??¿?

Código: [Seleccionar]

// Div GO : Games Online > Example
// Php + Html5 + Canvas + Javascript
// by J. Manuel Habas

program example_color_in_map;
begin
set_mode(480, 320);
//screen_color(cc_gray);
    screen_color(#0040FF);//FUNCIONA
   

set_fps(60, 0);

arrow(60, 120,#FFFF00); //no funciona...
    arrow(100, 120,rgb(255,0,0)); //no funciona...
    arrow(140, 120,cc_green); //Funciona...
   
   end

process arrow(x, y, c);
begin
graph = color_in_map(0, 3, c);
size  = 50;
angle = 90000;
   
loop
if (key(_left)) angle += 2000; end
if (key(_right)) angle -= 2000; end

if (key(_up)) advance(2); end
if (key(_down)) advance(-1); end

frame;
end
end



Solo funciona cuando utilizo cc_grey...cc_blue ...pero yo quiero tener mas versatilidad ..poniendo rgb o su valor hexadecimal....creo que hay un bug.....

[AmakaSt]

Hola oskarg,

Tanto paint_in_map(), color_in_map() y region_color() funcionan con constantes de color predefinido, en el listado de funciones se explica:

color_in_map(file, graph, variable de color);
    - variable de color: cc_red, cc_green, cc_blue, cc_yellow, ..., cc_gray, cc_white, cc_black

paint_in_map(file, graph, variable de color);
    - variable de color: cc_red, cc_green, cc_blue, cc_yellow, ..., cc_gray, cc_white, cc_black

region_color(región, variable de color);
    - región: número de región definida con define_region();
    - variable de color: cc_red, cc_green, cc_blue, cc_yellow, ..., cc_gray, cc_white, cc_black

Esto se debe a estas funciones se le define los colores con unos patrones, recorriendo cada pixel de la imagen y transformadolos, no es un blend donde cualquier tono es válido. Aún así tienes una buena cantidad de colores predefinidos:
cc_red, cc_green, cc_blue, cc_yellow, cc_cyan, cc_magenta, cc_orange, cc_lime, cc_violet, cc_brown, cc_pink, cc_purple, cc_aqua, cc_pistache, cc_turquoise, cc_maroon, cc_silver, cc_gray, cc_white, cc_black

Y colores especiales también compatibles:
rgb_to_bgr, rgb_to_grb, rgb_to_rbg, rgb_to_brg, rgb_to_gbr, rgb_to_invert, rgb_to_grayscale, rgb_to_bw, rgb_to_16c, rgb_to_128c, rgb_to_256c, rgb_to_gboy

Un saludo.

[oskarg]

Hola amaka....
Te comento de memoria,pues estoy fuera de casa....
1.La funcion tone ha dejado de funcionar,si puedes solventa el bug,pues resulta muy practica para crear procesos,enemigos ,con diferentes colores...
2.En el listado de funciones pone si no mal recuerdo hexadecimal y rgb,con lo cual ahi mi confunsion.........ya buscare donde esta tal informacion de los colores..pues a priori no lo vi.
3.Esta noche cuando llegue ...miro mas cosas y si veo algo que no me cuadra te comento.

Un saludo y gracias por la actualizacion.

[oskarg]

Hola Amaka ya tengo el tutorial realizado,cuando puedas me expresas como te lo envio.

Tengo dos versiones,una la de un calco a la de amstrad y otra mas moderna,te paso esta ultima...
Me gustaria que lo incluyeras en la carpeta de  tutoriales,pues pretendo hacer unos cuantos,es corto y creo que de eso se trata,que sea asequible y practico.No lo incluyas como juego ,pues ni de broma esta terminado,falta añadir musica,cambiar graficos,añadir efectos etc....etc...

ah!! sei  me olvidaba....un par de cuestiones el clear_map va de fabula aunque estaria bien que pudiera eligir el grado de opacidad ,alpha ,del borrado para hacer efectos y transiciones suaves.
1.Al final no he utilizado los cambios de color,pues con tone que ahora no va,lograba que los colores no se vieran tan apagados que con estas nuevas funciones.

[AmakaSt]

Hola oskarg,

Te acabo de enviar un mensaje privado.
Ponme un ejemplo en donde no te esté funcionando la variable tone. Salvo que estés utilizando IE10 u 11, que ahí no va fijo.

Un saludo.

[oskarg]

Hola amaka,
Ya he visto tu post,hago unos retoques y te expreso algo ...aunque he estado mirando las funciones de los string ,estaria bien que a poco a poco aquellas que no tenga ejemplo los incluyeras.....

te hago preguntas a tutiplen...

1.He bajado tu aplicacion de crear una aplicacion ejecutable,disculpa por mi ignorancia,pero bajo el paquete,lo copio en la carperta resource/app el juego.zip me expresa que sustituyendo el index.html sin borrar los archivos main  y packege..?¿? a que te refieres?¿?
...debo descomprimir el juego.zip y poner el index.html que incluye por el otro?¿?
...donde esta la casilla para crear el ejecutable..exe?¿?

2.Te muestro algunos errores que no detecta divgo y son la mar de divertidos:

Código: [Seleccionar]

  IF(SOUND_FIN==8 AND ) //NO DETECTA EL ERROR Y SE BLOQUEA AL COMPILARLO:
  write_int(0,10,10,0,offset (x/16));///ERROR....aunque lo entiendo pero deberia ser mas versatil....
  write_int(0,80,11,4,offset Puntos);,//SE QUEDA BLOQUEADO AL QUERER COMPILIAR POR PONER AL FINAL :, Y NO LO DETECTA!!!!
  ahora  soy incapaz de reproducirlo pero hay un error con los parentesis si pongo muchos parametros dentro de una condicion me dice variable no definida...cuando lo reproduzca te pongo   el   ejemplo
         

3.¿ Que version y navegador utilizas para ejecutar divgo?,disculpa por repetir la pregunta..te explico yo utilizo firefox v47..las demas versiones y las actuales que he bajado me dan bastantes problemas no me hace suavizado de letras o no se escucha el sonido y me va mucho mas lento.La primera vez que lo ejecuto en el navegador el juego va rapido,pero luego se va ralentizando cada vez que compilo y lo ejecuto...supongo que es normal..pero se nota y debo iniciar nueva sesion de windows....   
ES problema de mi tarjeta grafica?¿por mi sistema operativo?¿? tengo windows7..

4.Tengo una tabla de records,pero claro como no se como guardar los datos y leerlos desde una web... solo imprimo  valores de una tabla inventada y la puntuacion del consiguiente jugador que juega?¿? hay un ejemplo de como hacerlo?¿?....no pretendo que me hagas ese apartado,si me lo explicas yo lo programo encantado.No es problema de imprimir tablas..Pues tengo el fondo del ranking con sus numeritos....

5.Alguna forma sencilla o ejemplo de introducir por teclado las letras y que los guarde en una tabla() ?¿??.....

6.Como puedo simular que cada vez se oscurece la escena,fondo...lo haria con un simple fade,pero el fade afecta a todo,una pena.... y tengo que cargar otra imagen de fondo ya modificada con photoshop.....SI utilizo tone,pero pongo put_screen(file,grafiico) no modifica su tono....¿es lo mismo en rendimiento tener un fondo con put_screen que un grafico activo que actua de fondo?...
guau!!photoshop hacia siglos que no lo utilizaba y he tenido que utilizar una version antigua,pues la moderna no me enteraba de nada.       

7.Tengo dos bugs en mi programa.....a ver si los corrijo,pues se cuando se produce...mea culpa.

8.La siguiente beta quiero hacerlo aun mucho mas dinamico con scrolls,pero tengo un par de dudas que no se como afrontarlo te explico:
en el juego Dragon Spirit de la nes vas volando por encima de las montañas y se ve que hay un rio en continuo movimiento...este efecto como diablos se hace ?¿?me puedes explicar por encima como lo podria implementar?¿?

8.2..Tengo pensado en el futuro hacer scroll ya sea con este o con otro juego que monte.......que me recomiendas o que me dara mas velocidad......... el tamaño de la imagen de la escena seria 960x240....lo cargo directamente y lo hago ciclico o bien hago hago ciclico un mapa de (320+16)x240 y cada 16 pixeles que avanza le voy pegando tiras de 16*240....pues el juego base es de 320x240...

9.Te comente sobre el icono de save...pues bien como expresas hace un guardado automatico sin tocar nada a veces me ha pasado que me ha guardado el programa que estaba mal programado y he perdido el que compilaba bien,estaria bien que se pudiera omitir esta opcion y añadir la tecla save..
10.Otra cuestion le he puesto musica y efectos al final,pero he notado que poniendo la musiquita de fondo se ralentiza......tantos recursos consume?¿?alguna manera de evitarlo?¿?.

Gracias y disculpa por tantas cuestiones ..........
un saludo