QuimB

Members
  • Content Count

    14
  • Joined

  • Last visited

About QuimB

  • Rank
    Member

Recent Profile Visitors

464 profile views
  1. Hi all, Finally got it working. I removed all the fluff for newbies to have an easier time to understand what's going on. The lines that do the magic: clicks = +localStorage.getItem('clicks') || 0; and... localStorage.setItem('clicks', clicks); Thanks for the help. Here's the full code. var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update }); var scoreText; function preload() { game.load.image('clickBox', 'assets/ClickMe.png'); game.stage.backgroundColor = '#182d3b'; game.stage.disableVisibilityChange = true; } function create() { clicks = +localStorage.getItem('clicks') || 0; button = game.add.button(game.width/2, game.height/2, 'clickBox', upScoreText); scoreText = game.add.text(30, 30, "CLICKS: " + clicks, {font: "20px Arial", fill: "#ffffff", align: "left"}); button.scale.x = 0.5; button.scale.y = 0.5; button.anchor.setTo(0.5); button.inputEnabled = true; } function update () { scoreText.setText("CLICKS: " + clicks); localStorage.setItem('clicks', clicks); } function upScoreText () { clicks++; }
  2. Thanks for taking your time to write that down. I used JSfiddle to see how the code worked. I had to do a bit of research to learn about parseInt, especially the importance of the radix parameter. Even though your example seems to be pure javascript, I understand the logic behind it. Now, I just need to grab that concept and translate it to Phaser. I decided to remove the "excess" code for now so I could focus on the basics. Not quite there yet, but it feels good to make progress. Thanks. [Redacted old and complicated code]
  3. Hi, drhayes. Thanks for the input. I wrote a long reply, but it was messy to read and was all over the place. My mind is sluggish today. I'll try to be succinct. At the end of the file I added the following function. I know it doesn't work but it's only to have something to work it, instead of just copy/pasting. function recordClicks() { var maxClicks = localStorage.getItem('clicks'); if (maxClicks === undefined) { clicks = 0; localStorage.setItem('clicks', JSON.stringify(clicks)); } else { clicks = JSON.parse(maxClicks, 10); } } I have "var clicks = 0;" at the beginning of the file. Without it, I would get an error message (main.js:42: Uncaught ReferenceError: clicks is not defined). Without the recordClicks function, when I refreshed the browser, the score text would display "Clicks: null" and then (after a second) "Clicks: 0". Also, couldn't I program something like: if currentClicks > clicks, record that number and store it as clicks? From what I read localStorage alone is enough for the job but I'm looking for alternatives. I have been stuck on this over a week. Stringify might be overkill for numbers, but I'll let it slide for now until I get a better grasp of the basics. Thanks again.
  4. Hi mattstyles, Thanks for the support. I just placed the localStorage inside of the the preload function. From other examples I studies, the code should be working, Unfortunately, every time I refresh the screen, the variable is always 0. var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update }); var scoreText; var worker1Amount = 0; var worker3Amount = 0; var workers = 0; var clicks = 0; var clicksPerSecond = 0; function preload() { localStorage.setItem('totalClicks', JSON.stringify(clicks)); var totalClicks = JSON.parse(localStorage.getItem('totalClicks')); game.load.image('clickBox', 'assets/ClickMe.png'); game.load.image('generator1', 'assets/Gen1.png'); game.load.image('generator3', 'assets/Gen3.png'); game.stage.backgroundColor = '#182d3b'; // If browser tab is displayed, game runs when out of focus. Needs fixing. game.stage.disableVisibilityChange = true; } function create() { clicks = 0; button = game.add.button(game.width/2, game.height/2, 'clickBox', upScoreText); btn_buyWorker = game.add.button(30,400, 'generator1', buyWorker); btn_buyWorker3 = game.add.button(160,400, 'generator3', buyWorker3); scoreText = game.add.text(30, 30, "CLICKS: " + clicks + " WORKERS: " + workers, { font: "20px Arial", fill: "#ffffff", align: "left" }); button.scale.x = 0.5; button.scale.y = 0.5; button.anchor.setTo(0.5); button.inputEnabled = true; btn_buyWorker.inputEnabled = true; timer = game.time.create(false); timer.loop(1000, updateCounter, this) timer.start(); function updateCounter () { clicks += clicksPerSecond; } var style = { font: "22px Courier", fill: "#00ff44" }; var buyWorkerText = game.add.text(0, 0, "Cost: 15", style); buyWorkerText.x = btn_buyWorker.x; buyWorkerText.y = btn_buyWorker.y+100; var buyWorker3Text = game.add.text(0,100, "Cost: 30",style); btn_buyWorker3.addChild(buyWorker3Text); } function update () { scoreText.setText("CLICKS: " + clicks + "\nCLICKS PER SEC: " + clicksPerSecond + "\n\+1 AMOUNT: " + worker1Amount + "\n\+3 AMOUNT: " + worker3Amount + "\nTOTAL WORKERS: " + workers); } function upScoreText () { clicks++; } //Need to find a way to disable button if player doesn't have enough clicks to buy it function buyWorker () { if (clicks >= 15) { workers++; worker1Amount += 1; clicks -= 15; clicksPerSecond += 1; } } function buyWorker3 () { if (clicks >= 30) { workers++; worker3Amount += 1; clicks -= 30; clicksPerSecond += 3; } }
  5. Thanks for the reply mattstyles, You're right, WombatTurkey mentioned it, but somehow I missed it. Programming when you're tired is not a good idea. If I'm understanding correctly, the code should look like this: localStorage.setItem('totalClicks', JSON.stringfy(clicks)); var totalClicks = JSON.parse(localStorage.getItem('totalClicks')); (Note: I deleted the storeGameClicks function from my previous post) By the way, where should those two lines of codes be placed? Anywhere? Inside of the create/update function(s)? Because those lines are at the end of the code. One more thing: I'm using Google Chrome (v49.0.2623.112 - 64-bit) with OS X 10.8.5. The files are installed locally (through MAMP). Could this setup cause issues? Sorry for so many questions, but the more I read and code, the more questions arise. Thanks for the help.
  6. Thanks for the replies. Still having difficulties after numerous iterations, but I'm getting there. With the help of this website I came up with this: function storeGameClicks () { localStorage.setItem('totalClicks', JSON.stringfy('clicks')); var totalClicks = JSON.parse(localStorage.getItem('totalClicks')); } According with the resource I posted above, this should do the trick. I probably don't even need a function for this. What are your thoughts? Thanks again.
  7. Thanks for the input. I kinda understand the logic behind the process but I'm not sure how to implement it. Let's say I want to use localStorage for the "clicks" variable. I'm trying to keep things really simple, so I'll just save one variable for now. I'm not sure if I need to create a function for this, but I did it anyway; named it "storeGameClicks". function storeGameClicks () { localStorage.setItem('totalClicks', JSON.stringify('clicks')); totalClicks = JSON.parse(localStorage.getItem('clicks')); } I don't get error messages on the console but I'm sure this isn't right. Thanks again.
  8. Hi all, I'm trying to find a way to save my game progress, and after some reading it seems LocalStorage is the way to go. I wish to save several variables between sessions, namely: var scoreText; var worker1Amount = 0; var worker3Amount = 0; var workers = 0; var clicks; var clicksPerSecond = 0; var workerCost = 15; (Note: I probably don't need to save the last variable since it's the only one whose value doesn't change.) How can I achieve this? With arrays? All the examples I checked only used one value for storing the game score. var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update }); var scoreText; var worker1Amount = 0; var worker3Amount = 0; var workers = 0; var clicks; var clicksPerSecond = 0; var workerCost = 15; function preload() { game.load.image('clickBox', 'assets/ClickMe.png'); game.load.image('generator1', 'assets/Gen1.png'); game.load.image('generator3', 'assets/Gen3.png'); game.stage.backgroundColor = '#182d3b'; // If browser tab is displayed, game runs when out of focus. Needs fixing. game.stage.disableVisibilityChange = true; } function create() { clicks = 0; button = game.add.button(game.width/2, game.height/2, 'clickBox', upScoreText); btn_buyWorker = game.add.button(30,400, 'generator1', buyWorker); btn_buyWorker3 = game.add.button(160,400, 'generator3', buyWorker3); scoreText = game.add.text(30, 30, "CLICKS: " + clicks + " WORKERS: " + workers, { font: "20px Arial", fill: "#ffffff", align: "left" }); button.scale.x = 0.5; button.scale.y = 0.5; button.anchor.setTo(0.5); button.inputEnabled = true; btn_buyWorker.inputEnabled = true; timer = game.time.create(false); timer.loop(1000, updateCounter, this) timer.start(); function updateCounter () { clicks += clicksPerSecond; } var style = { font: "22px Courier", fill: "#00ff44" }; var buyWorkerText = game.add.text(0, 0, "Cost: 15", style); buyWorkerText.x = btn_buyWorker.x; buyWorkerText.y = btn_buyWorker.y+100; var buyWorker3Text = game.add.text(0,100, "Cost: 30",style); btn_buyWorker3.addChild(buyWorker3Text); } function update () { //clicks += workers; scoreText.setText("CLICKS: " + clicks + "\nCLICKS PER SEC: " + clicksPerSecond + "\n\+1 AMOUNT: " + worker1Amount + "\n\+3 AMOUNT: " + worker3Amount + "\nTOTAL WORKERS: " + workers); } function upScoreText () { clicks++; } //Need to find a way to disable button if player doesn't have enough clicks to buy it function buyWorker () { if (clicks >= 15) { workers++; worker1Amount += 1; clicks -= 15; clicksPerSecond += 1; } } function buyWorker3 () { if (clicks >= 30) { workers++; worker3Amount += 1; clicks -= 30; clicksPerSecond += 3; } } Thanks in advance.
  9. QuimB

    Incremental Game - Creating Loop Function

    Thanks AzraelTycka, seems I got it working. At the moment, the Phaser documentation is a little too overwhelming with it's technical jargon, but I managed to solve the problem with a bit of copy/pasting from the examples you provided. I'll need to study this a bit further before advancing my project. Here's the updated code. Maybe it will be useful to other newbies. Thanks again. var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update }); var scoreText; var timer; var clicks; var clicksPerSecond = 0; var workers = 0; var workerCost = 15; var workerPerSec = 1; function preload() { game.load.image('clickBox', 'assets/ClickMe.png'); game.load.image('generator1', 'assets/Gen1.png'); game.stage.backgroundColor = '#182d3b'; // If browser tab is displayed, game runs when out of focus. Needs fixing. game.stage.disableVisibilityChange = true; } function create() { clicks = 0; button = game.add.button(game.width/2, game.height/2, 'clickBox', upScoreText); btn_buyWorker = game.add.button(30,400, 'generator1', buyWorker); scoreText = game.add.text(30, 30, "CLICKS: " + clicks + " WORKERS: " + workers, { font: "20px Arial", fill: "#ffffff", align: "left" }); button.scale.x = 0.5; button.scale.y = 0.5; button.anchor.setTo(0.5); button.inputEnabled = true; btn_buyWorker.inputEnabled = true; timer = game.time.create(false); timer.loop(1000, updateCounter, this) timer.start(); function updateCounter () { clicks += clicksPerSecond; } } function update () { //clicks += workers; scoreText.setText("CLICKS: " + clicks + "\nCLICKS PER SEC: " + clicksPerSecond + "\nWORKERS: " + workers); } function upScoreText () { clicks++; } //Need to find a way to disable button if player doesn't have enough clicks to buy it function buyWorker () { if (clicks >= 15) { workers++; clicks -= 15; clicksPerSecond += 1; } }
  10. Hello all, I'm trying to build a simple incremental game to learn Phaser and Javascript. I'm using MAMP with Phaser 2.4.8. The game has a button (aptly named buyWorker) which should add +1 clicks/per second. Tried using the update function but it didn't work. Since it runs 60 times per second, the numbers skyrocket really quickly. Spent some time googling but the search results were too complex, poorly written or obsolete. Can Phaser help with that or do I need to create a custom function? Thanks. Here's the code: var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update }); var scoreText; var clicks; var clicksPerSecond = 0; var workers = 0; var workerCost = 15; var workerPerSec = 1; function preload() { game.load.image('clickBox', 'assets/ClickMe.png'); game.load.image('generator1', 'assets/Gen1.png'); game.stage.backgroundColor = '#182d3b'; // If browser tab is displayed, game runs when out of focus. Needs fixing. game.stage.disableVisibilityChange = true; } function create() { clicks = 0; button = game.add.button(game.width/2, game.height/2, 'clickBox', upScoreText); btn_buyWorker = game.add.button(30,400, 'generator1', buyWorker); scoreText = game.add.text(30, 30, "CLICKS: " + clicks + " WORKERS: " + workers, { font: "20px Arial", fill: "#ffffff", align: "left" }); button.scale.x = 0.5; button.scale.y = 0.5; button.anchor.setTo(0.5); button.inputEnabled = true; btn_buyWorker.inputEnabled = true; } function update () { clicks += workers; scoreText.setText("CLICKS: " + clicks + "\nCLICKS PER SEC: " + clicksPerSecond + "\nWORKERS: " + workers); } function upScoreText () { clicks++; } //Need to find a way to disable button if player doesn't have enough clicks to buy it function buyWorker () { if (clicks >= 15) { workers++; clicks -= 15; } }
  11. QuimB

    Phaser 2.4.8 - Update Text

    That worked. Thanks for the help guys. Wasn't even aware of the button Phaser function. I'll keep your advice in mind.
  12. QuimB

    Phaser 2.4.8 - Update Text

    Thanks for the replies, but I'm still having issues.. This is what I have at the moment. var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create }); var scoreText; var clicks; function preload() { game.load.image('clickBox', 'assets/ClickMe.png'); game.stage.backgroundColor = '#182d3b'; } function create() { clicks = 0; var button = game.add.sprite(game.width/2, game.height/2, 'clickBox'); scoreText = game.add.text(30, 30, "CLICKS: " + clicks, { font: "20px Arial", fill: "#ffffff", align: "left" }); button.scale.x = 0.5; button.scale.y = 0.5; button.anchor.setTo(0.5); button.inputEnabled = true; } function update () { button.input.onDown.addOnce(upScoreText, this); } function upScoreText () { clicks++; scoreText.setText("CLICKS: " + clicks); } I've checked this tutorial and tried to replace this line: button.input.onDown.addOnce(upScoreText, this); with button.events.onInputDown.add(upScoreText, this) But still no results. Could the problem be somewhere else? I was watching the first line of the file var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, }); and noticed it doesn't have the update: update state(?). So I added it: var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update }); But when I refresh the page, it displays the following console error: main.js:34 Uncaught ReferenceError: button is not defined (main.js:34)
  13. QuimB

    Phaser 2.4.8 - Update Text

    Thanks for the help. I replaced button.input.onDown.addOnce(UpScoreText, this); with button.input.onDown.addOnce(upScoreText, this); But the problem still remains. Not sure if I'm still missing something.
  14. QuimB

    Phaser 2.4.8 - Update Text

    Hello, I'm brand new to programming and Phaser. My first project is a very simple incremental game. I'm using MAMP with Phaser 2.4.8. Every time I click on the button, the text score doesn't increment. I have the console opened. There aren't any error messages displayed. http://imgur.com/Kq3BzUF I'm stumped and don't want to add new features to the game until this issue is solved. Thanks for the help. index.html <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Jogo 1: Sem Título</title> <script type="text/javascript" src="js/phaser.min.js"></script> <script type="text/javascript" src="js/main.js"></script> </head> <body> <p>Meu 1º Jogo com Phaser</p> <div id="TheGame"></div> </body> </html> main.js ar game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create }); var scoreText; var clicks; function preload() { game.load.image('clickBox', 'assets/ClickMe.png'); game.stage.backgroundColor = '#182d3b'; } function create() { clicks = 0; var button = game.add.sprite(game.width/2, game.height/2, 'clickBox'); scoreText = game.add.text(30, 30, "CLICKS: " + clicks, { font: "20px Arial", fill: "#ffffff", align: "left" }); button.scale.x = 0.5; button.scale.y = 0.5; button.anchor.setTo(0.5); button.inputEnabled = true; function update () { button.input.onDown.addOnce(UpScoreText, this); } function upScoreText () { clicks++; scoreText.setText("CLICKS: " + clicks); } }