bousing

Members
  • Content Count

    15
  • Joined

  • Last visited

About bousing

  • Rank
    Member

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. bousing

    problems with responsive

    Hi my devfriends 😄 I make an experiment to try Phaser 3 and Angular 6. My game is about a tic tac toe online online, I finished the game play but the responsive doesn't work. I dont used resize function, I just modify the displayHeight and displayWidth attributes of sprites. The width and height in game config is the same width and height of user screen obtained with window.innerHeight and innerWidth. In my screen it see very well. But in other resolutions it see terrible. You can see the code here https://github.com/jlbousing/tictaconline/blob/master/src/app/app.component.ts After this I want make a server with socketIo and share with you :D
  2. Hi I wrote this because I have problems with polyfills and other phaser src. I want make a phaser game with Angular 6 but when I import the library in my component, created the config object and run the phaser's object the browser says global is not defined at Object../node_modules/phaser/src/polyfills/requestAnimationFrame.js I declare it (is not the best practice, I know) but other var in other script neither is it declared.. I think theese problems appears because I use Angular and transpile with a different way than babel...I dont know... can you help me ? Thanks for reading
  3. bousing

    my game is very slowly

    if I use canvas and not WebGL my performance is better ? Thank you for your answer
  4. bousing

    my game is very slowly

    Hello my dev friends. In this occasion, I post about a problem what I have... I make a game with this beautifull framework but is very slowly. When the game starts all is black for considerable time until loaded it because the browser is loading the game (client-side code, I know)... but I want know Why does it take too long? I want add a loadingbar for show it to the user while the browser load the code...but doesn't works I create my loading bar like this preload: function(){ this.load.image("loading","/assets/logo_eluniversalVE.jpg"); } //IN MY PRELOADER SCRIPT: create: function(){ var loadingbar = this.add.sprite(this.game.world.centerX,this.game.world.centerY,"loading"); } but doesn't work... If I apply minification to my client-side code, will be more fast ? I going to thanks every help from you, about the loading bar or about the performance Greetings and thank you for reading
  5. bousing

    I need help with Phaser + socket.io

    rgk, thank you so much for your answer. for example this: app.post("/log",function(req,res){ //CONNECTION WITH POSTGRES DB pg.connect(connect,function(err,client,done){ if(err){ console.log("Error de conexion",err); } //QUERY TO CHECK THE LOGIN client.query("SELECT COUNT(*) FROM usuarios WHERE username = $1 and password = $2",[req.body.username,req.body.password],function(err,result){ if(err){ console.log("No se encontro el usuario",err); } var NumRows = result.rows[0].count; console.log(NumRows); if(NumRows == 1){ res.render("index"); } else{ res.render("menu"); done(); } }); //QUERY FOR TAKE THE USERNAME AND DISPLAY IN THE GAME client.query("SELECT username FROM usuarios WHERE username = $1 and password = $2",[req.body.username,req.body.password],function(err,result){ if(err){ console.log("No se encontro el usuario"); } sendUsername(result.rows); done(); }); }); }); function sendUsername(data){ io.sockets.on("connection",function(socket){ console.log("CONECTANDO AL CLIENTE CON LA FUNCION sendUsername"); //socket.emit("usuario",data); juego.setNombreUser(data[0].username); console.log("Se ha enviado el usuario ",data[0].username); }); } That is something of my backend logic. I have my datebase in postgreSQL, and I use pg modules (a module for the use of postgres in nodejs). I did a query for take the username. That result is inside in a JSON (results.row), before, that result is my statement of the function sendUsername. The problem is I can't set the username or score with this way. I need something else but I don't know what.
  6. bousing

    I need help with Phaser + socket.io

    Hi Yora, thank you so much for your answer. I tried, but is doesn't work. I use in this example console.log for show you my results, but just I want set the Username or score, for example. OK. that solution is failure. How I can to solve my objetive ? I mean set a variables in the game with information recive from the server. I tried something like that https://github.com/robhawkes/mozilla-festival/blob/master/Player.js In that example, the Player class was exported and included in the server script. I tried that but when my browser executed the game, it get a error "exports is not defined. Greetings again
  7. I wrote a solution in my project var worlscale = 1; ZoomIn: function(){ worldscale += 0.05; worldscale = Phaser.Math.clamp(worldscale,0.5,2); //limits of zoom game.world.scale.set(worldscale); }, ZoomOut: function(){ worldscale -= 0.05; worldscale = Phaser.Math.clamp(worldscale,0.5,2); //limit of zoom game.world.scale.set(worldscale); }
  8. Hello my gamedevelopers friends I write this post because I have a issue, but I don't know how to solve it. I developing a multiplayer HTML5 game with Phaser. Well, is not entirely multiplayer because the players doesn't play among them but they interact with a datebase. The game consists in find riddles around a map with the mouse or touches. When the user find the riddle and write the correct answer the backend must be send to client a update of score. That I can't find because my solution doesn't work I work with socket.io and NodeJs because I need some connection between the client and the server. I tried the following: //SERVER socket.on("connection",function(socket){ socket.emit("websocket",dateJSON); //dateJSON is a date brought from the datebase, for example the username console.log("The server send a message to client"); }); //CLIENT var UserName; var socket = io.connect("http://localhost:8000"); socket.on("websocket",function(date){ UserName = date[0].username; //Like that because I need the username from the JSON }); console.log(UserName); If I execute the ultimate instrucction console.log(UserName), I will give get "Undefined"... I don't know why That was a example of what I want do. I need set a variables of client with date sent from the server. Before that, I will display that values in my game. The update of scores when the player win a riddle I want do the same way, but I need find the solutions. I have a week in this problem. If you know the solution or another way to solve it. Please help me :'( the game will be very fun and that is all I need to finish. Greetings!!!
  9. bousing

    I have a problem with the camera

    Good idea. I thought that too. But I define my game object in the index.html, how point it in this script ? I wrote it inside the function of the state because there I pass the game object. But does not work
  10. bousing

    I have a problem with the camera

    Thank you for your answer. I Know, and I do. but does not recognize the variable. BasicGame.Game.prototype = { create: function () { this.game.world.setBounds(0,0,1920,1080); this.add.sprite(0,0,"backdrop"); var canvas = window.document.getElementsByTagName('canvas')[0], prevX = 0, prevY = 0, mouseDown = false; canvas.addEventListener('touchstart',function(e){ prevX = e.changedTouches[0].screenX; prevY = e.changedTouches[0].screenY; }); canvas.addEventListener('mousedown',function(e){ mouseDown = true; prevX = e.screenX; prevY = e.screenY; }); canvas.addEventListener('touchmove',function(e){ e.preventDefault(); this.camera.x += prevX - e.changedTouches[0].screenX; prevX = e.changedTouches[0].screenX; this.camera.y+= prevY - e.changedTouches[0].screenY; prevY = e.changedTouches[0].screenY; }); canvas.addEventListener('mousemove',function(e){ if(mouseDown){ e.preventDefault(); this.camera.x+= prevX - e.screenX; prevX = e.screenX; this.camera.y+= prevY - e.screenY; prevY = e.screenY; } }); canvas.addEventListener('mouseup',function(e){ mouseDown = false; }); canvas.addEventListener('mouseleave',function(e){ mouseDown = false; }); } }; The browser console give me: Game.js:60 Uncaught TypeError: Cannot read property 'x' of undefined that is the attribute of camera. and instead of this.camera, I use this.game.camera.x for example and give me: Game.js:60 Uncaught TypeError: Cannot read property 'camera' of undefined. Is insane hahaha What I did wrong ?
  11. bousing

    I have a problem with the camera

    I try make this https://github.com/jlbousing/experimentoPhaser/blob/master/js/game.js in this version the experiment works very well, as you see there https://jlbousing.github.io/experimentoPhaser/ but now I restructured the experiment for learn work with Phaser states. I don't know why I don't find the solution. For example, I tried copy & paste the same code inside the create function and the browser console give "Cannot read property 'camera' of undefined" and just write the sentence like this this.game.camera.x = .... I dont have idea... and I use the Full Screen mobile Template.
  12. bousing

    I have a problem with the camera

    In the index.html, but I declare it in the statement like this //SCRIPT OF THE GAME STATE var TheGame = function(game){ //HERE THERE SOMETHING OF CODE OR GLOBAL VARS } and I call the game methods in the prototype of TheGame object like this: this.game.Method(). That is works in others state like boots or preload.
  13. bousing

    I have a problem with the camera

    Greetings my developers friends. In this ocation, I write because i have a strange problem with the camera. I work in a proyect wich basically is move the camera over an image with the mouse or touches. I did a little experiment before start the proyect. I keep trying make other test. Now, I restructure the experiment for understand the phaser states and I did it. But I have problem with the camera. My browser does not recognize the camera, I give this error: Phaser v2.6.1 | Pixi.js | WebGL | WebAudio http://phaser.io ♥♥♥ 15TheGame.js:37 Uncaught TypeError: Cannot read property 'camera' of undefined In the first test which I did, the code is work. I don't Know what happend now... I just use camera.x and camera.y to move the phaser camera. Like this: $(document).ready(function(){ $("canvas").mousemove(function(e){ game.camera.x = e.screenX; game.camera.y = e.screenY; }); }); The browser said Uncaught TypeError: Cannot read property 'camera' of undefined. But why ? camera is a phaser object defined in the framework or I read something like that. I use screenX and screenY because that give me the coordenates X,Y of the canvas and the camera moves to that position, you think this works ? If you know why i had this problem with the camera, I really really will be gratefull, because is strange. Before that is not happend. Thank you so much for reading. Greeting.
  14. bousing

    Help with a responsive game

    Thank you so much for your answer my friend, I gonna check it
  15. bousing

    Help with a responsive game

    Greetings devs friends I new in this forum and new in games development with Phaser. Really I new in games development with HTML5 because I work with Unity. I was assigned in a proyect consisting of a responsive game. The engine that I usually work has a WebGl builder but dont works well in smartphone, because is a something new in Unity5, accordingly dont help me I try Phaser, I learned a little and I did an experiment: http://pruebaphaser.esy.es/experimentoP2-master/# is very nice this framework, I like it so much I did the gameplay that I need: just drag the camera on an image and make click in specifc areas to trigger a modal (or any events). The problem is the game must be responsive. I mean must see very well and full screen in smartphone as PC, also with a responsive navbar (I use bootstrap for the navbar and modals). Also i need add a backend for a webservice, datebase...that is another topic... Really I need make it responsive. For this I did the following: var width = window.innerWidth; var height = window.innerHeight; var game = new Phaser.Game(width,height, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render}); I use window.innerWidth and windows.innerHeight of javascript to create the world game size. I thought that if take those dates of the screen then I would have a responsive view regardless of the platform used. But not works I will appreciate any help. Thank you for reading. I fall in love with Phaser, I will a pro HTML5 game developer for help you too. Greetings from Venezuela.