diff --git a/resources/image/character/alien/cockpit.png b/resources/image/character/alien/cockpit.png new file mode 100644 index 0000000..96ce3e9 Binary files /dev/null and b/resources/image/character/alien/cockpit.png differ diff --git a/resources/image/character/alien/jet.png b/resources/image/character/alien/jet.png new file mode 100644 index 0000000..fc8bd2b Binary files /dev/null and b/resources/image/character/alien/jet.png differ diff --git a/resources/image/character/alien/ship.png b/resources/image/character/alien/ship.png new file mode 100644 index 0000000..960bd65 Binary files /dev/null and b/resources/image/character/alien/ship.png differ diff --git a/src/game/typing/word_flyingsaucer/flyingsaucer.js b/src/game/typing/word_flyingsaucer/flyingsaucer.js index 68d8003..3227a14 100644 --- a/src/game/typing/word_flyingsaucer/flyingsaucer.js +++ b/src/game/typing/word_flyingsaucer/flyingsaucer.js @@ -4,8 +4,8 @@ FlyingSaucer.constructor = FlyingSaucer; function FlyingSaucer(lineIndex) { this.lineIndex = lineIndex; - this.isActivated = false; - this.speed = FlyingSaucer.DEFAULT_SPEED; + this.initVariables(); + Phaser.Sprite.call(this, game, game.world.centerX, game.world.centerY, 'alien_normal'); game.add.existing(this); @@ -15,18 +15,75 @@ function FlyingSaucer(lineIndex) { this.anchor.set(0.5); this.halfWidth = this.width / 2; + var COCKPIT_OFFSET_Y = -5; + var BODY_OFFSET_Y = 28; + var JET_OFFSET_Y = 52; + + var cockpit = this.makeCockpit(0, COCKPIT_OFFSET_Y); + this.addChild(cockpit); + + this.jetLeft = this.makeJet(-50, JET_OFFSET_Y); + this.addChild(this.jetLeft); + + this.jetCenter = this.makeJet(0, JET_OFFSET_Y); + this.addChild(this.jetCenter); + + this.jetRight = this.makeJet(50, JET_OFFSET_Y); + this.addChild(this.jetRight); + + var shipBody = this.makeShipBody(0, BODY_OFFSET_Y); + this.addChild(shipBody); + + + var style = { font: "20px Arial", fill: FlyingSaucer.TEXT_COLOR_NORMAL}; + this.wordText = game.add.text(0, 0, "text", style); + this.wordText.anchor.set(0.5); + this.moveInitialPos(); // this.setActive(true); } +FlyingSaucer.prototype.initVariables = function() { + this.isActivated = false; + this.speed = FlyingSaucer.DEFAULT_SPEED; + this.timerEvent = null; +} + +FlyingSaucer.prototype.makeCockpit = function(posX, posY) { + var cockpit = game.make.sprite(posX, posY, 'ship_cockpit'); + cockpit.anchor.set(0.5); + cockpit.alpha = 0.6; + cockpit.tint = 0xff00ff; + + return cockpit; +} + +FlyingSaucer.prototype.makeJet = function(posX, posY) { + var jet = game.make.sprite(posX, posY, 'ship_jet'); + jet.anchor.set(0.5); + jet.tint = 0xffff00; + + return jet; +} + +FlyingSaucer.prototype.makeShipBody = function(posX, posY) { + var body = game.make.sprite(posX, posY, 'ship_body'); + body.anchor.set(0.5); + + return body; +} + + FlyingSaucer.prototype.update = function() { if(this.isActivated) { var deltaTime = game.time.elapsed / 1000; this.y += this.speed * deltaTime; + this.wordText.y = this.y + FlyingSaucer.WORD_TEXT_OFFSET_Y; + if(this.y > GAME_SCREEN_SIZE.y - 200) this.moveInitialPos(); } else { @@ -48,11 +105,92 @@ FlyingSaucer.prototype.stop = function() { FlyingSaucer.prototype.setActive = function(isActivated) { this.isActivated = isActivated; + + if(this.isActivated) { + this.alpha = 1; + } else { + this.alpha = 0; + this.wordText.text = ""; + } } FlyingSaucer.prototype.moveInitialPos = function() { - this.x = 50 + this.lineIndex * 100; + console.log("moveInitialPos"); + this.x = 100 + this.lineIndex * 200; this.y = 100; + + this.wordText.x = this.x; + this.wordText.y = this.y + FlyingSaucer.WORD_TEXT_OFFSET_Y; + + this.explodeEmitter = game.add.emitter( + this.x, + this.y, + 10 + ); + this.explodeEmitter.makeParticles('star'); + this.explodeEmitter.minParticleScale = 1; + this.explodeEmitter.maxParticleScale = 3; + this.explodeEmitter.forEach( + function(particle) { + particle.tint = 0xadff2f; + } + ); + this.explodeEmitter.gravity = 0; +} + +FlyingSaucer.prototype.reset = function() { + this.moveInitialPos(); + this.wordText.text = "text"; + this.setActive(true); +} + +FlyingSaucer.prototype.checkInputText = function(inputText) { + // console.log("inputText : " + inputText); + // console.log("this.wordText : " + this.wordText); + + this.wordText.clearColors(); + this.wordText.addColor(FlyingSaucer.TEXT_COLOR_NORMAL, 0); + + if(inputText == null || inputText.length == 0) + return; + + var word = this.wordText.text; + var inputTextLength = inputText.length; + var index = 0; + for(; index < inputTextLength; index++) { + // console.log("i : " + index); + // console.log("inputTextLength : " + inputTextLength); + // console.log("inputText.charAt(i) : " + inputText.charAt(index)); + // console.log("this.wordText.text.charAt(i) : " + this.wordText.text.charAt(index)); + + if(index == 0 && word.charAt(index) == inputText.charAt(index)) { + this.wordText.addColor(FlyingSaucer.TEXT_COLOR_CORRECT, index); + } else if(word.charAt(index) != inputText.charAt(index)) { + this.wordText.addColor(FlyingSaucer.TEXT_COLOR_NORMAL, index); + return; + } + } + this.wordText.addColor(FlyingSaucer.TEXT_COLOR_NORMAL, index); +} + +FlyingSaucer.prototype.attack = function(inputText) { + // console.log("inputText : " + inputText); + // console.log("this.wordText : " + this.wordText); + + var word = this.wordText.text; + + if(word == inputText) { + this.explode(); + return; + } +} + +FlyingSaucer.prototype.explode = function(inputText) { + this.setActive(false); + + this.explodeEmitter.start(true, 1000, null, 100); + + this.timerEvent = game.time.events.add(Phaser.Timer.SECOND, this.reset, this); } @@ -60,9 +198,22 @@ FlyingSaucer.prototype.moveInitialPos = function() { FlyingSaucer.loadResource = function() { if(!game.cache.checkImageKey('alien_normal')) game.load.image('alien_normal', '../../../resources/image/character/alien/green_alien.png'); + + if(!game.cache.checkImageKey('ship_cockpit')) + game.load.image('ship_cockpit', '../../../resources/image/character/alien/cockpit.png'); + + if(!game.cache.checkImageKey('ship_body')) + game.load.image('ship_body', '../../../resources/image/character/alien/ship.png'); + + if(!game.cache.checkImageKey('ship_jet')) + game.load.image('ship_jet', '../../../resources/image/character/alien/jet.png'); } FlyingSaucer.DEFAULT_SPEED = 10; // dot per sec +FlyingSaucer.WORD_TEXT_OFFSET_Y = 30; // px + +FlyingSaucer.TEXT_COLOR_NORMAL = "#000000"; +FlyingSaucer.TEXT_COLOR_CORRECT = "#ffff4d"; \ No newline at end of file diff --git a/src/game/typing/word_flyingsaucer/game.js b/src/game/typing/word_flyingsaucer/game.js index e24d9f1..45bfe5d 100644 --- a/src/game/typing/word_flyingsaucer/game.js +++ b/src/game/typing/word_flyingsaucer/game.js @@ -11,7 +11,26 @@ var WordFlyingSaucer = { (function() { this.timeOver(); }).bind(this) ); - game.stage.backgroundColor = '#4d4d4d'; + this.initVariables(); + + + + // game stage + this.game.stage.backgroundColor = "#000000"; // '#4d4d4d'; + var stars = game.add.group(); + for (var i = 0; i < 128; i++) { + var randomY = game.rnd.integerInRange(60, GAME_SCREEN_SIZE.y - 80); + stars.create(game.world.randomX, randomY, 'star'); + } + + this.flyingsaucers = []; + for(var i = 0; i < 2; i++) { + this.flyingsaucers[i] = new FlyingSaucer(i); + this.flyingsaucers[i].setup(this.wordLevel, this.speedLevel); + this.flyingsaucers[i].setActive(true); + } + + // top ui var screenTopUI = new ScreenTopUI(); @@ -44,14 +63,6 @@ var WordFlyingSaucer = { heartGauge.start(); - this.initVariables(); - - for(var i = 0; i < 10; i++) { - var flyingsaucer = new FlyingSaucer(i); - flyingsaucer.setup(this.wordLevel, this.speedLevel); - flyingsaucer.setActive(true); - } - // input text @@ -124,32 +135,18 @@ var WordFlyingSaucer = { checkTypingContents: function(event) { + var count = this.flyingsaucers.length; if(event.keyCode == Phaser.Keyboard.ENTER) { - // console.log("### enter ###"); - var inputContent = this.inputText.canvasInput.value(); - /* - var typingContent = this.typingRandomContents[this.typingIndex]; - - if(inputContent === typingContent) { - this.calculateTypingRecord(typingContent); - this.playNextContent(); - - if(this.typingIndex == this.typingContentLength) - this.gameOver(); - // this.goResult(); - // this.state.start('TypingTestResult'); - } - */ - } - else { - /* - if(this.isTyping == false) { - // console.log(event); - this.setTimeTypingStart(); + for(var i = 0; i < count; i++) { + this.flyingsaucers[i].attack(this.inputText.canvasInput.value()); } - this.showTypingContentHighlight(); - */ + this.inputText.canvasInput.value(""); + } else { + + for(var i = 0; i < count; i++) { + this.flyingsaucers[i].checkInputText(this.inputText.canvasInput.value()); + } } }, diff --git a/src/game/typing/word_flyingsaucer/loading.js b/src/game/typing/word_flyingsaucer/loading.js index 76a46ad..4c47c52 100644 --- a/src/game/typing/word_flyingsaucer/loading.js +++ b/src/game/typing/word_flyingsaucer/loading.js @@ -29,7 +29,7 @@ var Loading = { startLoading: function() { game.load.image('icon_fullscreen', '../../../resources/image/icon/fullscreen_white.png'); - game.load.image('star', '../../../resources/image/ui/star_particle.png'); + game.load.image('star', '../../../resources/image/background/star_7x7.png'); HeartGauge.loadResources(); FlyingSaucer.loadResource();