From 5bdcd111512b90b9281425eb97ac102dfafc2506 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Koprowski?= Date: Tue, 19 Jun 2012 05:26:56 +0100 Subject: [PATCH] Timer and buildings cost --- Makefile | 2 +- dev/client/Negotiator.coffee | 37 +++++--- dev/client/renderer/RadialMenu.coffee | 3 - dev/client/renderer/Timer.coffee | 61 ++++++++++++ dev/client/templates/costinfo.handlebars | 16 ++++ dev/config.coffee | 79 ++++++++++++++-- dev/game.coffee | 56 +++++++++++ dev/server/views/board.hbs | 4 +- dev/server/views/lobby2.hbs | 25 ++++- dev/webroot/css/style.less | 115 ++++++++++++++++++++++- 10 files changed, 368 insertions(+), 30 deletions(-) create mode 100644 dev/client/renderer/Timer.coffee create mode 100644 dev/client/templates/costinfo.handlebars diff --git a/Makefile b/Makefile index e322ef2..668e9d9 100644 --- a/Makefile +++ b/Makefile @@ -1,6 +1,6 @@ # Order is EXTREMELY important here ENGINE = Namespace.js HeightMap.js GameObject.js ObjectState.js Field.js Signal.js Types.js Player.js Properties.js SignalFactory.js HQBehaviour.js ChannelBehaviour.js PlatformBehaviour.js ResourceBehaviour.js ObjectFactory.js Map.js GameManager.js -RENDERER = Loader.js Human.js People.js Board.js MenuDisplayHelper.js MapHelper.js RadialMenu.js UI.js Terrain.js +RENDERER = Timer.js Loader.js Human.js People.js Board.js MenuDisplayHelper.js MapHelper.js RadialMenu.js UI.js Terrain.js all: dir | js css cp dev/build/*.js dev/webroot/js diff --git a/dev/client/Negotiator.coffee b/dev/client/Negotiator.coffee index 7100ab5..c44ec0b 100644 --- a/dev/client/Negotiator.coffee +++ b/dev/client/Negotiator.coffee @@ -1,13 +1,19 @@ class Negotiator constructor: ( @communicator ) -> + self= @ + _.extend @, Backbone.Events @myPlayer = {} @game = {} @renderer = {} window.loader = @loader = new S.Loader() - @loader.start() + @timer = new S.Timer @ + @timer.setTime 1200 + + $.when( @loader.start() ).then -> + self.timer.start() @loading = new $.Deferred() @@ -42,7 +48,6 @@ class Negotiator @on 'resource:produce', (xy, amount, type) -> p = @ui.getPoint xy[0], xy[1] @ui.showTextBubble "-#{amount}", p.x+40, p.y+20 - #console.debug xy, amount, type @on 'resource:receive', (xy, amount, type) -> p = @ui.getPoint xy[0], xy[1] @@ -64,13 +69,17 @@ class Negotiator userHas[k] > v if canAfford - _.each cost, ( v, k ) -> - userHas[k] -= v + _.each cost, ( v, k ) => + @myPlayer.resources[k] -= v + @ui.showTextBubble "-#{v} #{ k }", p.x+40, p.y+20 - @buildPlatform x, y, type, owner - @communicator.trigger 'send:build:platform', x, y, type, owner + @buildPlatform x, y, type, @myPlayer + @communicator.trigger 'send:build:platform', x, y, type, @myPlayer + + @ui.showResources 0, 6 + @ui.showResources 0, 7 else - @ui.showTextBubble "Not enough resources", p.x+40, p.y+20, color: color: [159, 17, 27, 1] + @ui.showTextBubble "Not enough resources", p.x+40, p.y+20, color: [159, 17, 27, 1] @on 'build:channel', (x, y, k, owner) => p = @ui.getPoint x, y @@ -82,13 +91,17 @@ class Negotiator userHas[k] > v if canAfford - _.each cost, ( v, k ) -> - userHas[k] -= v + _.each cost, ( v, k ) => + @myPlayer.resources[k] -= v + @ui.showTextBubble "-#{v} #{ k }", p.x+40, p.y+20 - @buildChannel x, y, k, owner - @communicator.trigger 'send:build:channel', x, y, k, owner + @buildChannel x, y, k, @myPlayer + @communicator.trigger 'send:build:channel', x, y, k, @myPlayer + + @ui.showResources 0, 6 + @ui.showResources 0, 7 else - @ui.showTextBubble "Not enough resources", p.x+40, p.y+20, color: color: [159, 17, 27, 1] + @ui.showTextBubble "Not enough resources", p.x+40, p.y+20, color: [159, 17, 27, 1] @on 'routing', (obj, routing) => _.extend obj.platform.state.routing, routing diff --git a/dev/client/renderer/RadialMenu.coffee b/dev/client/renderer/RadialMenu.coffee index 193f5c3..e7bdfe3 100644 --- a/dev/client/renderer/RadialMenu.coffee +++ b/dev/client/renderer/RadialMenu.coffee @@ -163,9 +163,6 @@ class RadialMenu $.when( helperPromise ).done () -> @executeAction.apply @, arguments - - $.when( helperPromise ).fail () -> - null else @executeAction.call @, @event diff --git a/dev/client/renderer/Timer.coffee b/dev/client/renderer/Timer.coffee new file mode 100644 index 0000000..e71fa23 --- /dev/null +++ b/dev/client/renderer/Timer.coffee @@ -0,0 +1,61 @@ +class Timer + constructor: ( @events ) -> + @started = false + + setInterval @tick, 1000 + + @counter = new Text() + @counter.textBaseline = "middle" + @counter.textAlign = "center" + @counter.color = "#fff" + @counter.font = "bold 32px 'Cabin', Helvetica,Arial,sans-serif" + @counter.x = 200 + @counter.y = 50 + + canvas = document.getElementById 'timer' + @stage = new Stage canvas + @stage.addChild @counter + + setTime: ( time ) -> + @time = time + + start:() -> + @started = true + + stop:() -> + @started = false + + endOfTime: () -> + @events.trigger "time:out" + + draw: () -> + minutes = Math.floor(@time / 60) + seconds = @time % 60 + + if minutes < 10 + minutes = "0#{minutes}" + + if seconds < 10 + seconds = "0#{seconds}" + + if minutes > 0 + text = "#{ minutes }:#{ seconds }" + else + text = seconds + + @counter.text = text + + tick:() => + if @started + if @time <= 0 + @endOfTime() + else if @time <= 60 + @time-- + @draw() + else + @time-- + @draw() + + @stage.update() + +window.S.Timer = Timer diff --git a/dev/client/templates/costinfo.handlebars b/dev/client/templates/costinfo.handlebars new file mode 100644 index 0000000..d4e84f5 --- /dev/null +++ b/dev/client/templates/costinfo.handlebars @@ -0,0 +1,16 @@ +
+ +
diff --git a/dev/config.coffee b/dev/config.coffee index e23c5e7..3c81bac 100644 --- a/dev/config.coffee +++ b/dev/config.coffee @@ -42,16 +42,22 @@ module.exports = ( app, express ) -> app.Mongoose.model 'User', app.userSchema - app.historySchema = new Schema - players: [ + app.historySchema = new Schema( + { + players: [ type: Schema.ObjectId ref: 'User' - ] - winners: [ - type: Schema.ObjectId - ref: 'User' - ] - channel: String + ] + winners: [ + type: Schema.ObjectId + ref: 'User' + ] + channel: String + }, + { + collection: 'history' + } + ) app.Mongoose.model 'History', app.historySchema @@ -65,6 +71,63 @@ module.exports = ( app, express ) -> app.Mongoose.model 'Chat', app.chatSchema + app.getHistory = ( user ) -> + defer = new Promise.Deferred() + + console.log user + + handleHistory = ( err, history ) => + if err? + console.error "[Mongoose] Cannot fetch history" + console.log err + defer.reject err + else if history.length > 0 + console.log history + history = _.map history, ( v, k ) -> + userInWinners = _.any history.winners, ( v ) -> + v.id == user.id + + if userInWinners + v.win = true + else + v.win = false + + console.log history + defer.resolve history + else + defer.resolve [] + + historyModel = app.Mongoose.model 'History' + historyModel + .where( user._id ).in( 'players' ) + .populate( 'players winners' ) + .run handleHistory + + defer.promise + + app.getHighscores = -> + defer = new Promise.Deferred() + + handleHighscores = ( err, highscores ) => + if err? + console.error "[Mongoose] Cannot fetch highscores" + console.log err + defer.reject err + else if highscores.length > 0 + defer.resolve highscores + else + defer.resolve [] + + userModel = app.Mongoose.model 'User' + userModel + .find() + .desc( 'highscore' ) + .limit( 10 ) + .select( 'name highscore' ) + .run handleHighscores + + defer.promise + app.getUserImgSrc = ( user ) -> defer = new Promise.Deferred() diff --git a/dev/game.coffee b/dev/game.coffee index 8555148..ba2eef1 100644 --- a/dev/game.coffee +++ b/dev/game.coffee @@ -29,6 +29,9 @@ app.get '/lobby2', ( req, res ) -> if app.requireAuth and not req.loggedIn res.redirect '/' else + #history = app.getHistory req.user + #highscores = app.getHighscores() + games = JSON.parse app.gameServer.getGames() games = _.map games, ( o ) -> o.playersConnected = ( _.flatten o.players ).length @@ -42,6 +45,59 @@ app.get '/lobby2', ( req, res ) -> games: games title: 'Signals - lobby' bodyClass: 'lobby' + history:[ + {name: "Piotr Bar" + result: "Won"}, + {name: "Robert Kruszewski" + result: "Defeated"}, + {name: "Łukasz Koprowski" + result: "Won"} + ] + highscores:[ + { + position: 1 + name: "Łukasz Koprowski" + points: 1234 + }, + { + position: 2 + name: "Piotr Bar" + points: 1034 + }, + { + position:3 + name: "Robert Kruszewski" + points: 1002 + }, + { + name: "Piotr Bar" + points: 1034 + }, + { + name: "Robert Kruszewski" + points: 1002 + }, + { + name: "Piotr Bar" + points: 1034 + }, + { + name: "Robert Kruszewski" + points: 1002 + }, + { + name: "Piotr Bar" + points: 1034 + }, + { + name: "Robert Kruszewski" + points: 1002 + }, + { + name: "Robert Kruszewski" + points: 1002 + } + ] app.get '/game/join', ( req, res ) -> if app.requireAuth and req.loggedIn diff --git a/dev/server/views/board.hbs b/dev/server/views/board.hbs index 4035d5f..0aaba49 100644 --- a/dev/server/views/board.hbs +++ b/dev/server/views/board.hbs @@ -13,7 +13,9 @@ -
+
+
+
diff --git a/dev/server/views/lobby2.hbs b/dev/server/views/lobby2.hbs index 5a0e014..22fcf74 100644 --- a/dev/server/views/lobby2.hbs +++ b/dev/server/views/lobby2.hbs @@ -40,7 +40,7 @@
  • - +
    • @@ -48,10 +48,29 @@
    - + {{#each history}} + {{#with this}} +
    +
    vs {{name}}
    +
    {{result}}
    +
    + {{/with}} + {{/each}}
    - + {{#each highscores}} + {{#with this}} +
    +
    + {{#if position}} + {{position}}. + {{/if}} +
    +
    {{name}}
    +
    {{points}}
    +
    + {{/with}} + {{/each}}
    {{#each games}} diff --git a/dev/webroot/css/style.less b/dev/webroot/css/style.less index 6942e98..e2eed01 100644 --- a/dev/webroot/css/style.less +++ b/dev/webroot/css/style.less @@ -729,8 +729,6 @@ p { margin:0; li{ - margin-bottom:20px; - .img{ display: inline-block; margin-right: 10px; @@ -741,3 +739,116 @@ p { } } } + +#timer{ + z-index:9997; + position:absolute; + top:0; + left:50%; + margin-left:-200px +} + +#history{ + font-weight:bold; + line-height:36px; + font-size:24px; + + .name{ + + span{ + width:32px; + margin-right:10px; + font-size:16px; + text-align:center; + display:inline-block; + } + } + .status{ + padding-left:20px; + text-align:center; + + &.status-Won{ + color:#FA6900; + } + &.status-Defeated{ + color:#69D2E7; + } + } + & > div{ + border-bottom: 1px rgba(0, 0, 0, 0.15) solid; + margin-bottom: 8px; + padding-bottom:9px; + + &:last-child{ + margin-bottom:0; + border-bottom:none; + } + } +} + +#highscores{ + font-weight:bold; + line-height:36px; + font-size:24px; + + @step1colour: #FA6900; + @step2colour: #E97419; + @step3colour: #D98033; + @step4colour: #C98C4D; + @step5colour: #B99766; + @step6colour: #A9A380; + @step7colour: #99AF9A; + @step8colour: #89BAB3; + @step9colour: #79C6CD; + @step10colour: #69D2E7; + + & > div{ + border-bottom: 1px rgba(0, 0, 0, 0.15) solid; + margin-bottom: 8px; + padding-bottom:9px; + + &:last-child{ + margin-bottom:0; + border-bottom:none; + } + + &:nth-child(1){ + color:@step1colour; + } + &:nth-child(2){ + color:@step2colour; + } + &:nth-child(3){ + color:@step3colour; + } + &:nth-child(4){ + color:@step4colour; + } + &:nth-child(5){ + color:@step5colour; + } + &:nth-child(6){ + color:@step6colour; + } + &:nth-child(7){ + color:@step7colour; + } + &:nth-child(8){ + color:@step8colour; + } + &:nth-child(9){ + color:@step9colour; + } + &:nth-child(10){ + color:@step10colour; + } + } + + .status{ + padding-left:20px; + text-align:center; + } + .position{ + text-align:center; + } +}