Patriarch K

Member
  • Content count

    70
  • Joined

  • Last visited

Community Reputation

212 Neutral

About Patriarch K

  • Rank
    Member
  1. At the moment I use booleans in the menu called level1 = false and so on. I wrap these booleans around the loop-function in every game file and it works. If I use the google debugging it doesn't cost too much. Is this a good method or is it awkward? It works fine at the moment at least.   Is there a way to run a function only once and then quit it afterwards in my main script without touching the game.js? For example, if I do like this:   KEY PRESS ENTER{ switch(level) case 1: level1(); break;   case 2: level2(); etc etc....   If I have it like that in the main function then it will of course run the level you pick. But when you've completed that level. Then that level has already started. The same if i put the switch statements in the loop. Then it will run multiple times (or only one time if I use a boolean on it). But I still can't quit it.   Is this something I have to do in the level-files?
  2. Hmm, I wrapped it all around, but I can not from the main.js just write GameOne(); when I press a key because it cannot reach it? Or how did you mean with that?   EDIT: Hmm, it worked better when I included the game.js in the index file...of course! Thanks!! I will try this method and see if it's "waterproof" for at least my game.
  3. Well, my way of changing the level would be as you can see here in my "game.js". You can just search for .js and you will find it. Even if it would work by changing the child as I try to do, I would gladly like to do like you guys adviced. How can I rewrite my code in the way you and HappyCoder mentioned? Now you have all my code. The main and the game1. The game2 is just a copy of game one. Just ignore all the code, I just need some kind of general clue of how to change this.   var canvasJet = document.getElementById('canvasJet'); var ctxJet = canvasJet.getContext('2d'); var canvasBg = document.getElementById('canvasBg'); var ctxBg = canvasBg.getContext('2d'); var canvasBullet = document.getElementById('canvasBullet'); var ctxBullet = canvasBullet.getContext('2d'); var jet1 = new Jet(); var boss1 = new Boss(); var word1 = new Word(); var word2 = new Word2(); var word3 = new Word3(); var star1x = 0; var star1y = 0; var star1dx = -2.4; var star1dy = 0; var star2x = 0; var star2y = 0; var star2dx = -1.4; var star2dy = 0; var star3x = 0; var star3y = 0; var star3dx = -.4; var star3dy = 0; var kills = 0; var pause = false; var pauseCounter = 0; //var bossLife = 40; var timerOn = true; var countdown = 15000; var earthX = 800; var earthY = 200; var pendingImages = 22; var difficulty = 100; var shootCounter = 0; var shootLimit = 34; var finishedGame = false; var earthDead = false; var gameStart = true; var newScript = window.document.createElement("script"); var endPress = false; var weaponSpeed = 0; var w1tim = 0; var ran1 = Math.floor((Math.random()*7500)+500); var ran2 = Math.floor((Math.random()*7500)+800); var ran3 = Math.floor((Math.random()*7500)+1000); var requestAnimFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame; var klaver = new Audio("images/klaver.mp3"); var hit = new Audio("images/hit.mp3"); var shoot = new Audio("images/laser.mp3"); var music = new Audio("images/rymd2.ogg"); var die = new Audio("images/die.ogg"); music.loop = true; music.play(); var background = new Image(); background.src = 'images/background.png'; background.addEventListener('load', imageLoaded, false); var bullet = new Image(); bullet.src = 'images/Bullet.gif'; bullet.addEventListener('load', imageLoaded, false); var star1 = new Image(); star1.src = 'images/background3c.png'; star1.addEventListener('load', imageLoaded, false); var star2 = new Image(); star2.src = 'images/background3b.png'; star2.addEventListener('load', imageLoaded, false); var star3 = new Image(); star3.src = 'images/background3a.png'; star3.addEventListener('load', imageLoaded, false); var star1b = new Image(); star1b.src = 'images/background4c.png'; star1b.addEventListener('load', imageLoaded, false); var star2b = new Image(); star2b.src = 'images/background4b.png'; star2b.addEventListener('load', imageLoaded, false); var star3b = new Image(); star3b.src = 'images/background4a.png'; star3b.addEventListener('load', imageLoaded, false); var enemySprite = new Image(); enemySprite.src = 'images/enemySprite.png'; enemySprite.addEventListener('load', imageLoaded, false); var boss = new Image(); boss.src = 'images/bossSprite.png'; boss.addEventListener('load', imageLoaded, false); var sprite = new Image(); sprite.src = 'images/planeSprite.png'; sprite.addEventListener('load', imageLoaded, false); var startmeny = new Image(); startmeny.src = 'images/startmeny.png'; startmeny.addEventListener('load', imageLoaded, false); var earth = new Image(); earth.src = 'images/earth.png'; earth.addEventListener('load', imageLoaded, false); var ed = new Image(); ed.src = 'images/earthdead.png'; ed.addEventListener('load', imageLoaded, false); var finish = new Image(); finish.src = 'images/finish.png'; finish.addEventListener('load', imageLoaded, false); var fail = new Image(); fail.src = 'images/fail.png'; fail.addEventListener('load', imageLoaded, false); var w1 = new Image(); w1.src = 'images/f.gif'; w1.addEventListener('load', imageLoaded, false); var w2 = new Image(); w2.src = 'images/i.gif'; w2.addEventListener('load', imageLoaded, false); var w3 = new Image(); w3.src = 'images/r.gif'; w3.addEventListener('load', imageLoaded, false); var b1 = new Image(); b1.src = 'images/missile.gif'; b1.addEventListener('load', imageLoaded, false); var b2 = new Image(); b2.src = 'images/spike.gif'; b2.addEventListener('load', imageLoaded, false); var b3 = new Image(); b3.src = 'images/speed.gif'; b3.addEventListener('load', imageLoaded, false); // main functions function init() { loop(); document.addEventListener('keydown', checkKeyDown, false); document.addEventListener('keyup', checkKeyUp, false); } function loop() { if(pause == false){ updateGame(); } if(timerOn == true){ requestAnimFrame(loop); } } function imageLoaded() { --pendingImages; if (pendingImages == 0) { init(); } } var spriteX = 0; var spriteY = 0; var enemySpriteX = 0; var bossSpriteX = 0; var spriteXstor = 100; var spriteYstor = 55; var enemySpriteXstor = 50; var enemySpriteYstor = 50; var bossSpriteXstor = 100; var bossSpriteYstor = 100; var changer = 1; var lol = false; var timerAnim = 0; var bossDead = false; function redrawTest() { if(jet1.direction == 1){ ctxBg.drawImage(sprite, spriteX, 0, spriteXstor, spriteYstor, jet1.drawX, jet1.drawY, spriteXstor, spriteYstor); } else if(jet1.direction == -1){ ctxBg.drawImage(sprite, spriteX, 55, spriteXstor, spriteYstor, jet1.drawX, jet1.drawY, spriteXstor, spriteYstor); } } function updateSprite(){ redrawTest(); if(lol == false){ spriteX += 100; enemySpriteX += 50; bossSpriteX += 100; if(spriteX >= 500 ){ spriteX = 0; } if(enemySpriteX >= 150 ){ enemySpriteX = 0; } if(bossSpriteX >= 700 ){ bossSpriteX = 0; } lol = true; } } function updateGame(){ if(gameStart == false){ ctxBg.drawImage(startmeny, 0, 0); } if(gameStart == true){ ctxBg.drawImage(background, 0, 0); timerAnim++; shootCounter++; w1tim++; if(timerAnim == 5){ lol = false; timerAnim = 0; } if(countdown > 0){ countdown--; } if(countdown <= 5000){ if(earthDead == false){ ctxBg.drawImage(earth, earthX, earthY); } if(earthDead == true){ ctxBg.drawImage(ed, earthX, earthY); } if(countdown > 0){ earthX -= 0.1; } } jet1.draw(); if(finishedGame == false && bossDead == false){ jet1.spawnEnemy(); jet1.collision(); } drawStars(); redrawTest(); diffSet(); if(countdown > 0){ jet1.move(); moveStar1(); moveStar2(); moveStar3(); boss1.moveBoss(); boss1.draw(); boss1.collision(); if(w1tim >= 1000+ran1){ word1.draw(); word1.moveWord(); word1.collision(); } if(w1tim >= 1000+ran2){ word2.draw(); word2.moveWord(); word2.collision(); } if(w1tim >= 1000+ran3){ word3.draw(); word3.moveWord(); word3.collision(); } updateSprite(); if(countdown <= 1 && finishedGame == false){ earthDead = true; finishedGame = true; } else if(earthDead == true){ ctxBg.drawImage(fail, 0, 0); } else if(boss1.bossLife <= 0 && finishedGame == false){ die.play(); bossDead = true; finishedGame = true; } else if(finishedGame == true){ ctxBg.drawImage(finish, 0, 0); endPress = true; } } drawText(); } } function diffSet(){ if(jet1.weapon == 0){ weaponSpeed = 0; // standard } else if(jet1.weapon == 1){ weaponSpeed = 10; //missile } else if(jet1.weapon == 2){ weaponSpeed = 20; // rock } else if(jet1.weapon == 3){ weaponSpeed = -20; // speed } if(kills < 5){ difficulty = 100; shootLimit = 34+weaponSpeed; } else if(kills >= 5 && kills < 10){ difficulty = 95; shootLimit = 30+weaponSpeed; } else if(kills >= 10 && kills < 20){ difficulty = 90; shootLimit = 25+weaponSpeed; } else if(kills >= 20 && kills < 30){ difficulty = 80; shootLimit = 23+weaponSpeed; } else if(kills >= 30 && kills < 40){ difficulty = 65; shootLimit = 21+weaponSpeed; } else if(kills >= 40 && kills < 50){ difficulty = 55; shootLimit = 19+weaponSpeed; } else if(kills >= 50 && kills < 60){ difficulty = 40; shootLimit = 17+weaponSpeed; } else if(kills >= 60 && kills < 70){ difficulty = 30; shootLimit = 12+weaponSpeed; } else if(kills >= 70 && kills < 80){ difficulty = 20; shootLimit = 7+weaponSpeed; } else if(kills >= 80 && kills < 90){ difficulty = 10; shootLimit = 3+weaponSpeed; } else if(kills >= 90 && kills < 100){ difficulty = 8; shootLimit = 1+weaponSpeed; } } function drawStars(){ if(countdown > 7500){ // Först stjärnorna if(star1x > -1000){ ctxBg.drawImage(star1, star1x, star1y); } if(star1x < 0){ ctxBg.drawImage(star1, star1x+800, star1y); if(star1x + 800 < 0){ ctxBg.drawImage(star1, star1x+1600, star1y); star1x = 0; } } ////// // Andra stjärnorna if(star2x > -1000){ ctxBg.drawImage(star2, star2x, star2y); } if(star2x < 0){ ctxBg.drawImage(star2, star2x+800, star2y); if(star2x + 800 < 0){ ctxBg.drawImage(star2, star2x+1600, star2y); star2x = 0; } } ////// // Tredje stjärnorna if(star3x > -1000){ ctxBg.drawImage(star3, star3x, star3y); } if(star3x < 0){ ctxBg.drawImage(star3, star3x+800, star3y); if(star3x + 800 < 0){ ctxBg.drawImage(star3, star3x+1600, star3y); star3x = 0; } } ////// } else if(countdown <= 7500){ // Först stjärnorna if(star1x > -1000){ ctxBg.drawImage(star1b, star1x, star1y); } if(star1x < 0){ ctxBg.drawImage(star1b, star1x+800, star1y); if(star1x + 800 < 0){ ctxBg.drawImage(star1b, star1x+1600, star1y); star1x = 0; } } ////// // Andra stjärnorna if(star2x > -1000){ ctxBg.drawImage(star2b, star2x, star2y); } if(star2x < 0){ ctxBg.drawImage(star2b, star2x+800, star2y); if(star2x + 800 < 0){ ctxBg.drawImage(star2b, star2x+1600, star2y); star2x = 0; } } ////// // Tredje stjärnorna if(star3x > -1000){ ctxBg.drawImage(star3b, star3x, star3y); } if(star3x < 0){ ctxBg.drawImage(star3b, star3x+800, star3y); if(star3x + 800 < 0){ ctxBg.drawImage(star3b, star3x+1600, star3y); star3x = 0; } } ////// } } function moveStar1(){ star1x += star1dx; } function moveStar2(){ star2x += star2dx; } function moveStar3(){ star3x += star3dx; } function drawText(){ ctxBg.lineWidth=1; ctxBg.fillStyle="#FFFFFF"; ctxBg.lineStyle="#ffff00"; ctxBg.font="18px sans-serif"; ctxBg.fillText("Power: " + kills, 20, 20); ctxBg.fillText(countdown + " km to Earth", 650, 20); } function clearCtxBg() { ctxBg.clearRect(0, 0, 800, 600); } // end of main functions // jet functions function Jet() { this.drawX = 100; this.drawY = 200; this.dx = 0; this.dy = 0; this.direction = 1; this.fire = false; this.isShooting = false; this.bullets = []; this.currentBullet = 0; this.counter = 0; this.enemyRand; this.enemyRand2; //this.bossLife = 40; this.collisiontest = false; this.weapon = 0; this.enemies = []; this.currentEnemy = 0; for (var y = 0; y < 800; y++) { this.bullets[this.bullets.length] = new Bullet(); } for (var u = 0; u < 300; u++) { this.enemies[this.enemies.length] = new Enemy(); } } Jet.prototype.move = function(){ this.drawX += this.dx; this.drawY += this.dy; } Jet.prototype.draw = function() { clearCtxJet(); this.fireBullet(); this.drawAllBullets(); this.drawAllEnemies(); } Jet.prototype.drawAllBullets = function() { for (var ii = 0; ii < this.bullets.length; ii++) { if (this.bullets[ii].drawX >= 0 && this.bullets[ii].bulletLifea > 0) { this.bullets[ii].draw(); this.bullets[ii].move(); } } } Jet.prototype.collision = function() { for (var i = 0; i < this.bullets.length; i++) { for (var j = 0; j < this.enemies.length; j++) { // Minuspoäng när fiender är utanför skärmen if(this.enemies[j].drawX > -10 && this.enemies[j].drawX < 0 && this.enemies[j].outScreen == false){ kills--; this.enemies[j].outScreen = true; klaver.play(); } // Om en bullet krockar med en fiende if(this.bullets[i].drawX > this.enemies[j].drawX && this.bullets[i].drawX < this.enemies[j].drawX+50 && this.bullets[i].drawY+30 > this.enemies[j].drawY && this.bullets[i].drawY < this.enemies[j].drawY+25 && this.bullets[i].bulletLifea > 0 && this.enemies[j].life > 0 ){ if(jet1.weapon == 0){ this.enemies[j].life-=2; } else if(jet1.weapon == 1){ this.enemies[j].life-=6; } else if(jet1.weapon == 2){ this.enemies[j].life-=3; } else if(jet1.weapon == 3){ this.enemies[j].life--; } if(this.enemies[j].life < 1){ kills++; hit.play(); } this.bullets[i].bulletLifea--; } } } } Jet.prototype.drawAllEnemies = function() { for (var ij = 0; ij < this.enemies.length; ij++) { if (this.enemies[ij].drawX >= 0) { if(this.enemies[ij].life > 0){ this.enemies[ij].draw(); this.enemies[ij].move(); } } } } Jet.prototype.fireBullet = function() { if (this.fire == true && this.isShooting == false) { this.isShooting = true; if(this.bullets[this.currentBullet].bulletLifea > 0){ if(this.direction == 1){ this.bullets[this.currentBullet].fire(this.drawX+95, this.drawY); } if(this.direction == -1){ this.bullets[this.currentBullet].fire(this.drawX, this.drawY); } shoot.play(); this.bullets[this.currentBullet].isShot = true; } if(this.direction == 1){ this.bullets[this.currentBullet].dxa = 8; } if(this.direction == -1){ this.bullets[this.currentBullet].dxa = -8; } this.currentBullet++; if (this.currentBullet >= this.bullets.length) this.currentBullet = 0; } else if (this.fire == false) { this.isShooting = false; } } Jet.prototype.spawnEnemy = function(){ this.counter++; this.enemyRand = Math.floor((Math.random()*500)+difficulty); this.enemyRand2 = Math.floor((Math.random()*550)+1); if (this.counter >= this.enemyRand) { this.enemies[this.currentEnemy].fire(800, this.enemyRand2); this.currentEnemy++; if (this.currentEnemy >= this.enemies.length) { this.currentEnemy = 0; } this.counter = 0; } } function clearCtxJet() { ctxJet.clearRect(0, 0, 800, 600); ctxBullet.clearRect(0, 0, 800, 600); } // end of jet functions // bullet functions function Bullet() { this.drawX = -20; this.drawY = 0; this.dxa = 3; this.dya = 1; this.isShot = false; this.bulletLifea = 1; this.gravity = 10; this.dt = .2; } Bullet.prototype.move = function(){ if(jet1.weapon == 0){ this.drawX += this.dxa; } else if(jet1.weapon == 1){ //if(this.drawX + this.dx > 780){ // this.dx = -this.dx; // } // if(this.drawX + this.dx < 0){ // this.dx = -this.dx; // } // else{ // this.drawX += this.dx; // } this.dxa = 0; this.dya += this.gravity * this.dt; this.drawY += this.dya*this.dt + .2*this.gravity*this.dt*this.dt; } else if(jet1.weapon == 2){ this.drawX += this.dxa; this.dya += this.gravity * this.dt; this.drawY += this.dya*this.dt + .2*this.gravity*this.dt*this.dt; } else if(jet1.weapon == 3){ this.drawX += this.dxa; } } Bullet.prototype.draw = function() { if( this.bulletLifea > 0){ if(jet1.weapon == 0){ ctxBullet.drawImage(bullet, this.drawX, this.drawY+25); } else if(jet1.weapon == 1){ ctxBullet.drawImage(b1, this.drawX, this.drawY+25); } else if(jet1.weapon == 2){ ctxBullet.drawImage(b2, this.drawX, this.drawY+25); } else if(jet1.weapon == 3){ ctxBullet.drawImage(b3, this.drawX, this.drawY+25); } } } Bullet.prototype.fire = function(startX, startY) { this.drawX = startX; this.drawY = startY; } // end of bullet functions // boss functions function Boss() { this.bossX = 200; this.bossY = 200; this.bossDX = 3; this.bossDY = 3; this.bossLife = 20; } Boss.prototype.moveBoss = function(){ this.bossX += this.bossDX; this.bossY += this.bossDY; if(this.bossX <= 0 || this.bossX >= 750){ this.bossDX *= -1; } if(this.bossY <= 0 || this.bossY >= 550){ this.bossDY *= -1; } } Boss.prototype.collision = function(){ for (var i = 0; i < jet1.bullets.length; i++) { // Skjuta på bossen if(kills >= 50){ if(jet1.bullets[i].drawX > this.bossX && jet1.bullets[i].drawX < this.bossX+100 && jet1.bullets[i].drawY > this.bossY && jet1.bullets[i].drawY < this.bossY+90 && jet1.bullets[i].bulletLifea > 0 && this.bossLife > 0){ jet1.bullets[i].bulletLifea--; if(jet1.weapon == 0){ this.bossLife-=2; } else if(jet1.weapon == 1){ this.bossLife-=6; } else if(jet1.weapon == 2){ this.bossLife-=3; } else if(jet1.weapon == 3){ this.bossLife--; } } } } } Boss.prototype.draw = function() { if(kills >= 50 && this.bossLife > 0){ ctxBg.drawImage(boss, bossSpriteX, 0, bossSpriteXstor, bossSpriteYstor, this.bossX, this.bossY, bossSpriteXstor, bossSpriteYstor); } } // end of boss functions // word functions function Word() { this.wordX = 800; this.wordY = 200; this.wordDX = -3; this.wordDY = 3; this.wordLife = 1; } Word.prototype.moveWord = function(){ this.wordX += this.wordDX; } Word.prototype.collision = function(){ if(jet1.drawX+80 >= this.wordX && jet1.drawY+25 >= this.wordY && jet1.drawY+25 <= this.wordY+20 && jet1.drawX <= this.wordX+15 ){ this.wordLife--; jet1.weapon = 1; } } Word.prototype.draw = function() { if(this.wordLife > 0){ ctxBg.drawImage(w1, this.wordX, this.wordY); } } // end of word functions // word2 functions function Word2() { this.wordX = 800; this.wordY = 100; this.wordDX = -3; this.wordDY = 3; this.wordLife = 1; } Word2.prototype.moveWord = function(){ this.wordX += this.wordDX; } Word2.prototype.collision = function(){ if(jet1.drawX+80 >= this.wordX && jet1.drawY+25 >= this.wordY && jet1.drawY+25 <= this.wordY+20 && jet1.drawX <= this.wordX+15 ){ this.wordLife--; jet1.weapon = 2; } } Word2.prototype.draw = function() { if(this.wordLife > 0){ ctxBg.drawImage(w2, this.wordX, this.wordY); } } // end of word2 functions // word3 functions function Word3() { this.wordX = 800; this.wordY = 300; this.wordDX = -3; this.wordDY = 3; this.wordLife = 1; } Word3.prototype.moveWord = function(){ this.wordX += this.wordDX; } Word3.prototype.collision = function(){ if(jet1.drawX+80 >= this.wordX && jet1.drawY+25 >= this.wordY && jet1.drawY+25 <= this.wordY+20 && jet1.drawX <= this.wordX+15 ){ this.wordLife--; jet1.weapon = 3; } } Word3.prototype.draw = function() { if(this.wordLife > 0){ ctxBg.drawImage(w3, this.wordX, this.wordY); } } // end of word3 functions // enemy functions function Enemy() { this.drawX = -20; this.drawY = 0; this.dx; this.isShot = false; this.life = 6; this.outScreen = false; } Enemy.prototype.move = function(){ if(this.life == 6){ this.dx = 2.5; } if(this.life == 4){ this.dx = 4.1; } if(this.life == 2){ this.dx = 6; } this.drawX -= this.dx; } Enemy.prototype.draw = function() { if(this.life > 4){ ctxBullet.drawImage(enemySprite, enemySpriteX, 0, enemySpriteXstor, enemySpriteYstor, this.drawX, this.drawY, enemySpriteXstor, enemySpriteYstor); } if(this.life > 2 && this.life <= 4){ ctxBullet.drawImage(enemySprite, enemySpriteX, 50, enemySpriteXstor, enemySpriteYstor, this.drawX, this.drawY, enemySpriteXstor, enemySpriteYstor); } if(this.life > 0 && this.life <= 2){ ctxBullet.drawImage(enemySprite, enemySpriteX, 100, enemySpriteXstor, enemySpriteYstor, this.drawX, this.drawY, enemySpriteXstor, enemySpriteYstor); } } Enemy.prototype.fire = function(startX, startY) { this.drawX = startX; this.drawY = startY; } // end of enemy functions // event functions function checkKeyDown(e) { var keyID = e.keyCode || e.which; if(timerOn == true){ if (keyID === 38 ) { //up arrow e.preventDefault(); jet1.dy = -3; } if (keyID === 39 ) { //right arrow jet1.direction = 1; e.preventDefault(); jet1.dx = 3; } if (keyID === 40 ) { //down arrow e.preventDefault(); jet1.dy = 3; } if (keyID === 37 ) { //left arrow e.preventDefault(); jet1.dx = -3; jet1.direction = -1; } if (keyID === 80 ) { // P if(pauseCounter == 0){ pause = true; pauseCounter++; } else if(pauseCounter == 1){ pause = false; pauseCounter = 0; } } if (keyID === 13 ) { //enter e.preventDefault(); //alert(iiuu); gameStart = true; if(endPress == true && bossDead == true){ timerOn = false; newScript.src = "game2.js"; window.document.body.appendChild(newScript); music.pause(); } } if (keyID === 69 ) { //e e.preventDefault(); //if (canvasBg.parentNode) { // canvasBg.parentNode.removeChild(canvasBg); // canvasJet.parentNode.removeChild(canvasJet); // canvasBullet.parentNode.removeChild(canvasBullet); //} gameStart = true; timerOn = false; newScript.src = "game2.js"; window.document.body.appendChild(newScript); music.pause(); } if (keyID === 32) { // space e.preventDefault(); if(shootCounter >= shootLimit){ jet1.fire = true; shootCounter = 0; if(jet1.weapon == 0){ shoot.play(); } } } } } function checkKeyUp(e) { var keyID = e.keyCode || e.which; if(timerOn == true){ if (keyID === 38 ) { //up arrow jet1.dy = 0; } if (keyID === 39 ) { //right arrow jet1.dx = 0; } if (keyID === 40 ) { //down arrow jet1.dy = 0; } if (keyID === 37 ) { //left arrow jet1.dx = 0; } if (keyID === 32) { // space jet1.fire = false; } } } // end of event functions
  4. Hmm, that sound kind of complicated. I don't really get how to do even though I get the idea. It actually works well using booleans on the becomeActive/resignActive (like the animator and the key inputs), but there are a lot of variable collisions I've seen so maybe if I just rename all of the variables from the previous level to something else? Hmm, that's kind of ugly coding though. Isn't there an easier way doing this?!   Could it be an idea putting all of the variables in a separate document and then use other .js modifying them? Or can I somehow make the variables from one document NOT to be reachable by another .js?
  5. I have a menu and from the meny I append a child called game.js which will start the game. When I complete the first stage, I want to remove the child game.js and append game2.js, but that doesn't work for me. How shall I solve this? I will show you the menu code only, where I append the child and that works fine. But later on, when I am in the game.js and press a key just for testing, then I want the current child (game.js) to be removed and I want to start the game2.js at the same time so that there will be a level change when I press a button from level 1.   var canvasJet = document.getElementById('canvasJet'); var ctxJet = canvasJet.getContext('2d'); var canvasBg = document.getElementById('canvasBg'); var ctxBg = canvasBg.getContext('2d'); var canvasBullet = document.getElementById('canvasBullet'); var ctxBullet = canvasBullet.getContext('2d'); var pendingImages = 1; var menuStart = false; var newScript = window.document.createElement("script"); var requestAnimFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame; var music = new Audio("images/rymd2.ogg"); music.loop = true; music.play(); var startmeny = new Image(); startmeny.src = 'images/startmeny.png'; startmeny.addEventListener('load', imageLoaded, false); // main functions function init() { loop(); document.addEventListener('keydown', checkKeyDown, false); } function loop() { if(menuStart == false){ updateGame(); requestAnimFrame(loop); } } function imageLoaded() { --pendingImages; if (pendingImages == 0) { init(); } } function updateGame(){ ctxBg.drawImage(startmeny, 0, 0); } function clearCtxBg() { ctxBg.clearRect(0, 0, 800, 600); } // end of main functions // event functions function checkKeyDown(e) { var keyID = e.keyCode || e.which; if (keyID === 13 ) { //enter e.preventDefault(); newScript.src = "game.js"; window.document.body.appendChild(newScript); music.pause(); menuStart = true; } } // end of event functions    
  6. Creating a new level with Javascript?

    Well, that kind of worked! Thanks! But how do I get rid of the old one then? By booleans or can you clear the screen in an easier way?
  7. I'm stuck with the idea of how to create a new level when I've completed the first one. Of course I could use a boolean which will just change the game to level2, but it's so messy to have all the levels in the same code. My html-file looks like below and my wish is that I could connect a variable in my game.js that tells if the level is complete. Then use an if-statement in my html code like:   if(game.js.levelComplete == false){ <script src="game.js"></script> }   else if(game.js.levelComplete == true){ <script src="level2.js"></script> }   I know that it doesn't work that way, but do you have any idea of a very easy and suitable method in this case for making a new level?   <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Lost</title> <link rel="stylesheet" href="game.css"> </head> <body> <section> <canvas id="canvasBg" width="800" height="600"></canvas> <canvas id="canvasJet" width="800" height="600"></canvas> <canvas id="canvasBullet" width="800" height="600"></canvas> <script src="game.js"></script> </section> </body> </html>    
  8. My first JS/HTML5 game (yet another space shooter)

    Thanks for noticing that and liking my song :) It this the correct way to implement the preventDefault?   function checkKeyDown(e) { var keyID = e.keyCode || e.which; e.preventDefault(); if (keyID === 38 ) { //up arrow jet1.dy = -3; } if (keyID === 39 ) { //right arrow jet1.direction = 1; jet1.dx = 3; } if (keyID === 40 ) { //down arrow jet1.dy = 3; } if (keyID === 37 ) { //left arrow jet1.dx = -3; jet1.direction = -1; } }
  9. My first JS/HTML5 game (yet another space shooter)

    The bullets will get faster the more you kill Thanks for information about the .ogg. I will change to that and then I hope the music will work properly in at least both chrome and firefox since those are the most important browsers!   EDIT: I've converted the music to .ogg now. It should work! Please tell me if it doesn't.
  10. My first JS/HTML5 game (yet another space shooter)

    Hmm, I've made the game slower at the beginning. Every 10:th power you get your bullets will be faster. It's supposed to go slow the first 5, then it becomes a little bit faster. Then every 10:th as I said. But it's not supposed to go THAT slow. Hmm, that's strange. Do you have an idea to solve the sound problem by the way?
  11. My first JS/HTML5 game (yet another space shooter)

    Thanks! Hmm what browser and what OS? Why is it that the music/sound effects only kind of works with Chrome and sometimes Firefox (but mostly not)? I use this method:     var music = new Audio("images/rymd2.mp3"); music.loop = true; music.play();
  12. My first JS/HTML5 game (yet another space shooter)

    Sound/music worked as well?
  13. I've been making games with Java for quite a while now but when I got the idead of putting stuff up on the web I got a lot of problems. I tried the applet thing, but that's just old and doesn't really work on any browser anymore so I had to learn a new language. Now I've been remaking one of my first Java games in JavaScript/HTML5 and it works pretty well, at least for me. Maybe you could try and see if you get any issues or something? What browser are you using in that case? MAC/PC?   Shoot with space, pause with P and steer with key arrows. When you have 50 in power the boss appears and you need to kill him before you reach earth. http://www.yffisch.com/space/  
  14. Help me understanding the MVC model

    Thanks a lot for the information in this thread. Though I still don't really get it because I need some kind of code example I think. One proper example that will work which I could fiddle around with and play and try and understand :)
  15. Help me understanding the MVC model

    That was a quick answer! Thank you! Could you maybe give a very simple code example of your idea about the ProductList? :)