mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2024-11-27 09:35:39 -05:00
Upgraded choose hero view for locked heroes. Went back to animated heroes instead of feature images. Removed some server logs.
This commit is contained in:
Nick Winter
parent
3c161268f0
commit
98f1eec10c
11 changed files with 171 additions and 47 deletions
|
|
@ -56,6 +56,7 @@
|
|||
confirm: "Confirm"
|
||||
owned: "Owned" # For items you own
|
||||
locked: "Locked"
|
||||
purchasable: "Purchasable" # For a hero you unlocked but haven't purchased
|
||||
available: "Available"
|
||||
skills_granted: "Skills Granted" # Property documentation details
|
||||
heroes: "Heroes" # Tooltip on hero shop button from /play
|
||||
|
|
@ -353,6 +354,8 @@
|
|||
range: "Range" # As in "attack or visual range"
|
||||
blocks: "Blocks" # As in "this shield blocks this much damage"
|
||||
skills: "Skills"
|
||||
available_for_purchase: "Available for Purchase"
|
||||
level_to_unlock: "Level to unlock:"
|
||||
|
||||
skill_docs:
|
||||
writable: "writable" # Hover over "attack" in Your Skills while playing a level to see most of this
|
||||
|
|
|
|||
|
|
@ -86,8 +86,8 @@ module.exports = class User extends CocoModel
|
|||
gemsEarned + gemsPurchased - gemsSpent
|
||||
|
||||
heroes: ->
|
||||
heroes = (me.get('earned')?.heroes ? []).concat(me.get('purchased')?.heroes ? []).concat([ThangType.heroes.captain, ThangType.heroes.knight])
|
||||
heroes = _.values ThangType.heroes if me.isAdmin()
|
||||
heroes = (me.get('purchased')?.heroes ? []).concat([ThangType.heroes.captain, ThangType.heroes.knight])
|
||||
#heroes = _.values ThangType.heroes if me.isAdmin()
|
||||
heroes
|
||||
items: -> (me.get('earned')?.items ? []).concat(me.get('purchased')?.items ? []).concat([ThangType.items['simple-boots']])
|
||||
levels: -> (me.get('earned')?.levels ? []).concat(me.get('purchased')?.levels ? [])
|
||||
|
|
|
|||
|
|
@ -149,8 +149,9 @@ _.extend ThangTypeSchema.properties,
|
|||
type: 'number'
|
||||
description: 'Snap to this many meters in the y-direction.'
|
||||
components: c.array {title: 'Components', description: 'Thangs are configured by changing the Components attached to them.', uniqueItems: true, format: 'thang-components-array'}, ThangComponentSchema # TODO: uniqueness should be based on 'original', not whole thing
|
||||
i18n: {type: 'object', format: 'i18n', props: ['name', 'description', 'extendedName'], description: 'Help translate this ThangType\'s name and description.'}
|
||||
i18n: {type: 'object', format: 'i18n', props: ['name', 'description', 'extendedName', 'unlockLevelName'], description: 'Help translate this ThangType\'s name and description.'}
|
||||
extendedName: {type: 'string', title: 'Extended Hero Name', description: 'The long form of the hero\'s name. Ex.: "Captain Anya Weston".'}
|
||||
unlockLevelName: {type: 'string', title: 'Unlock Level Name', description: 'The name of the level in which the hero is unlocked.'}
|
||||
|
||||
ThangTypeSchema.required = []
|
||||
|
||||
|
|
|
|||
|
|
@ -91,8 +91,9 @@ $heroCanvasHeight: 265px
|
|||
left: 21px
|
||||
top: 18px
|
||||
|
||||
&.locked
|
||||
&.locked:not(.purchasable)
|
||||
.hero-avatar
|
||||
background-color: goldenrod
|
||||
@include filter(contrast(50%) brightness(65%))
|
||||
|
||||
.lock-indicator
|
||||
|
|
@ -102,6 +103,10 @@ $heroCanvasHeight: 265px
|
|||
top: 30%
|
||||
@include filter(invert(90%))
|
||||
|
||||
&.purchasable
|
||||
.hero-avatar
|
||||
background-color: goldenrod
|
||||
|
||||
|
||||
//- Small transformations to jumble the hero icons a little
|
||||
|
||||
|
|
@ -142,7 +147,7 @@ $heroCanvasHeight: 265px
|
|||
#hero-carousel
|
||||
.hero-item
|
||||
|
||||
&.locked
|
||||
&.locked:not(.purchasable)
|
||||
@include opacity(0.6)
|
||||
|
||||
canvas, .hero-feature-image
|
||||
|
|
@ -236,6 +241,60 @@ $heroCanvasHeight: 265px
|
|||
.glyphicon
|
||||
@include scaleXY(-1, 1)
|
||||
|
||||
//- Different footer states
|
||||
|
||||
#purchasable-hero-explanation
|
||||
position: absolute
|
||||
left: 32px
|
||||
top: 532px
|
||||
width: 541px
|
||||
height: 97px
|
||||
padding: 10px 40px
|
||||
|
||||
h2
|
||||
color: #333
|
||||
text-align: center
|
||||
|
||||
#locked-hero-explanation
|
||||
position: absolute
|
||||
left: 32px
|
||||
top: 527px
|
||||
width: 541px
|
||||
height: 102px
|
||||
padding: 10px 40px
|
||||
text-align: center
|
||||
|
||||
h2
|
||||
color: #333
|
||||
margin-top: 12px
|
||||
margin-bottom: 5px
|
||||
|
||||
#purchase-hero-button
|
||||
width: 209px
|
||||
height: 110px
|
||||
position: absolute
|
||||
left: 588px
|
||||
top: 522px
|
||||
line-height: 100px
|
||||
text-align: center
|
||||
text-transform: uppercase
|
||||
font-size: 24.5px
|
||||
font-family: Open Sans Condensed
|
||||
color: white
|
||||
border: 3px solid rgb(7,65,83)
|
||||
background: rgb(0,119,168)
|
||||
border-radius: 0
|
||||
|
||||
&:disabled
|
||||
background: rgb(72, 106, 113)
|
||||
opacity: 1
|
||||
color: rgba(255,255,255, 0.4)
|
||||
|
||||
> *
|
||||
@include opacity(0.9)
|
||||
|
||||
&:hover > *
|
||||
@include opacity(1)
|
||||
|
||||
//- Programming select box
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
span.glyphicon.glyphicon-remove
|
||||
|
||||
#equipped
|
||||
if selectedHero
|
||||
if selectedHero && selectedHero.get('featureImage')
|
||||
img(src="/file/"+selectedHero.get('featureImage'))#hero-image
|
||||
|
||||
for slot in ['head', 'eyes', 'neck', 'torso', 'gloves', 'wrists', 'left-hand', 'right-hand', 'waist', 'feet', 'left-ring', 'right-ring', 'minion', 'flag', 'pet', 'programming-book', 'misc-0', 'misc-1']
|
||||
|
|
|
|||
|
|
@ -12,13 +12,13 @@
|
|||
.carousel-indicator-container
|
||||
ol.carousel-indicators
|
||||
for hero, index in heroes
|
||||
li(data-hero-id=hero.get('original'), title=hero.name, data-slide-to=index, data-target="#hero-carousel", class="hero-indicator hero-index-" + index + (hero.locked ? " locked" : ""))
|
||||
li(data-hero-id=hero.get('original'), title=hero.name, data-slide-to=index, data-target="#hero-carousel", class="hero-indicator hero-index-" + index + (hero.locked ? " locked" : "") + (hero.purchasable ? " purchasable" : ""))
|
||||
.hero-avatar
|
||||
if hero.locked
|
||||
if hero.locked && !hero.purchasable
|
||||
img.lock-indicator(src="/images/pages/game-menu/lock.png", draggable="false")
|
||||
.carousel-inner
|
||||
for hero in heroes
|
||||
div(class="item hero-item" + (hero.locked ? " locked" : ""), data-hero-id=hero.get('original'))
|
||||
div(class="item hero-item" + (hero.locked ? " locked" : "") + (hero.purchasable ? " purchasable" : ""), data-hero-id=hero.get('original'))
|
||||
canvas.hero-canvas
|
||||
.hero-feature-image
|
||||
img(draggable="false")
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
|
||||
.hero-stat-row
|
||||
.stat-label(data-i18n='choose_hero.status')
|
||||
.stat-value(data-i18n=hero.locked ? 'play.locked' : 'play.available')
|
||||
.stat-value(data-i18n=hero.purchasable ? 'play.purchasable' : (hero.locked ? 'play.locked' : 'play.available'))
|
||||
|
||||
.hero-stat-row
|
||||
.stat-label(data-i18n='choose_hero.weapons')
|
||||
|
|
@ -51,7 +51,26 @@
|
|||
a.right(role="button", data-slide="next", href="#hero-carousel")
|
||||
span.glyphicon.glyphicon-play
|
||||
|
||||
#hero-footer
|
||||
if visibleHero
|
||||
if visibleHero.purchasable
|
||||
#purchasable-hero-explanation
|
||||
h2(data-i18n="choose_hero.available_for_purchase") Available for Purchase
|
||||
button.btn.unlock-button#purchase-hero-button
|
||||
span.spr(data-i18n="play.unlock") Unlock
|
||||
span= visibleHero.get('gems')
|
||||
span.gem.gem-20
|
||||
|
||||
else if visibleHero.locked
|
||||
//#locked-hero-explanation= lockedExplanation
|
||||
#locked-hero-explanation
|
||||
h2
|
||||
span= visibleHero.name
|
||||
span.spl(data-i18n="play.locked") Locked
|
||||
span.spr(data-i18n="choose_hero.level_to_unlock") Level to unlock:
|
||||
strong= visibleHero.unlockLevelName || '???'
|
||||
|
||||
else if visibleHero.loaded
|
||||
.form
|
||||
.form-group.select-group
|
||||
span.help-block(data-i18n="choose_hero.programming_language_description") Which programming language do you want to use?
|
||||
|
|
|
|||
|
|
@ -14,3 +14,4 @@ module.exports = class ThangTypeI18NView extends I18NEditModelView
|
|||
@wrapRow('Name', ['name'], name, i18n[lang]?.name, [])
|
||||
@wrapRow('Description', ['description'], @model.get('description'), i18n[lang]?.description, [], 'markdown')
|
||||
@wrapRow('Extended Hero Name', ['extendedName'], @model.get('extendedName'), i18n[lang]?.extendedName, [])
|
||||
@wrapRow('Unlock Level Name', ['unlockLevelName'], @model.get('unlockLevelName'), i18n[lang]?.unlockLevelName, [])
|
||||
|
|
|
|||
|
|
@ -28,21 +28,26 @@ module.exports = class PlayHeroesModal extends ModalView
|
|||
@confirmButtonI18N = options.confirmButtonI18N ? "common.save"
|
||||
@heroes = new CocoCollection([], {model: ThangType})
|
||||
@heroes.url = '/db/thang.type?view=heroes'
|
||||
@heroes.setProjection ['original','name','slug','soundTriggers','featureImage','gems','heroClass','description','components','extendedName','i18n']
|
||||
@heroes.setProjection ['original','name','slug','soundTriggers','featureImage','gems','heroClass','description','components','extendedName','unlockLevelName','i18n']
|
||||
@heroes.comparator = 'gems'
|
||||
@listenToOnce @heroes, 'sync', @onHeroesLoaded
|
||||
@supermodel.loadCollection(@heroes, 'heroes')
|
||||
@stages = {}
|
||||
@session = options.session
|
||||
@initCodeLanguageList options.hadEverChosenHero
|
||||
@heroAnimationInterval = setInterval @animateHeroes, 2500
|
||||
|
||||
onHeroesLoaded: ->
|
||||
for hero in @heroes.models
|
||||
@formatHero hero for hero in @heroes.models
|
||||
|
||||
formatHero: (hero) ->
|
||||
hero.name = utils.i18n hero.attributes, 'extendedName' # or whatever the property name ends up being
|
||||
hero.name ?= utils.i18n hero.attributes, 'name'
|
||||
hero.description = utils.i18n hero.attributes, 'description'
|
||||
hero.unlockLevelName = utils.i18n hero.attributes, 'unlockLevelName'
|
||||
original = hero.get('original')
|
||||
hero.locked = original not in [ThangType.heroes.captain, ThangType.heroes.knight] and not me.ownsHero(original)
|
||||
hero.locked = not me.ownsHero(original)
|
||||
hero.purchasable = hero.locked and (original in (me.get('earned')?.heroes ? []))
|
||||
hero.class = (hero.get('heroClass') or 'warrior').toLowerCase()
|
||||
hero.stats = hero.getHeroStats()
|
||||
|
||||
|
|
@ -53,6 +58,7 @@ module.exports = class PlayHeroesModal extends ModalView
|
|||
context.codeLanguages = @codeLanguageList
|
||||
context.codeLanguage = @codeLanguage = @options?.session?.get('codeLanguage') ? me.get('aceConfig')?.language ? 'python'
|
||||
context.confirmButtonI18N = @confirmButtonI18N
|
||||
context.visibleHero = @visibleHero
|
||||
context
|
||||
|
||||
afterRender: ->
|
||||
|
|
@ -73,6 +79,11 @@ module.exports = class PlayHeroesModal extends ModalView
|
|||
@buildCodeLanguages()
|
||||
Backbone.Mediator.publish 'audio-player:play-sound', trigger: 'game-menu-open', volume: 1
|
||||
|
||||
rerenderFooter: ->
|
||||
@formatHero @visibleHero
|
||||
@renderSelectors '#hero-footer'
|
||||
@buildCodeLanguages()
|
||||
|
||||
initCodeLanguageList: (hadEverChosenHero) ->
|
||||
@codeLanguageList = [
|
||||
{id: 'python', name: "Python (#{$.i18n.t('choose_hero.default')})"}
|
||||
|
|
@ -93,7 +104,8 @@ module.exports = class PlayHeroesModal extends ModalView
|
|||
@preloadHero heroIndex + 1
|
||||
@preloadHero heroIndex - 1
|
||||
@selectedHero = hero unless hero.locked
|
||||
$('#choose-inventory-button').prop 'disabled', hero.locked
|
||||
@visibleHero = hero
|
||||
@rerenderFooter()
|
||||
@trigger 'hero-loaded', {hero: hero}
|
||||
|
||||
getFullHero: (original) ->
|
||||
|
|
@ -111,7 +123,8 @@ module.exports = class PlayHeroesModal extends ModalView
|
|||
|
||||
loadHero: (hero, heroIndex, preloading=false) ->
|
||||
createjs.Ticker.removeEventListener 'tick', stage for stage in _.values @stages
|
||||
if featureImage = hero.get 'featureImage'
|
||||
# TODO: make sure we are going to axe featureImage, then remove this
|
||||
if false and featureImage = hero.get 'featureImage'
|
||||
$(".hero-item[data-hero-id='#{hero.get('original')}'] canvas").hide()
|
||||
$(".hero-item[data-hero-id='#{hero.get('original')}'] .hero-feature-image").show().find('img').prop('src', '/file/' + featureImage)
|
||||
@playSelectionSound hero unless preloading
|
||||
|
|
@ -129,27 +142,53 @@ module.exports = class PlayHeroesModal extends ModalView
|
|||
builder = new SpriteBuilder(fullHero)
|
||||
movieClip = builder.buildMovieClip(fullHero.get('actions').attack?.animation ? fullHero.get('actions').idle.animation)
|
||||
movieClip.scaleX = movieClip.scaleY = canvas.prop('height') / 120 # Average hero height is ~110px tall at normal resolution
|
||||
if fullHero.get('name') in ['Knight', 'Robot Walker'] # These are too big, so shrink them.
|
||||
movieClip.scaleX *= 0.7
|
||||
movieClip.scaleY *= 0.7
|
||||
movieClip.regX = -fullHero.get('positions').registration.x
|
||||
movieClip.regY = -fullHero.get('positions').registration.y
|
||||
movieClip.x = canvas.prop('width') * 0.5
|
||||
movieClip.y = canvas.prop('height') * 0.925 # This is where the feet go.
|
||||
if fullHero.get('name') is 'Knight'
|
||||
movieClip.scaleX *= 0.7
|
||||
movieClip.scaleY *= 0.7
|
||||
if fullHero.get('name') is 'Potion Master'
|
||||
movieClip.scaleX *= 0.9
|
||||
movieClip.scaleY *= 0.9
|
||||
movieClip.regX *= 1.1
|
||||
movieClip.regY *= 1.4
|
||||
if fullHero.get('name') is 'Samurai'
|
||||
movieClip.scaleX *= 0.7
|
||||
movieClip.scaleY *= 0.7
|
||||
movieClip.regX *= 1.2
|
||||
movieClip.regY *= 1.35
|
||||
if fullHero.get('name') is 'Librarian'
|
||||
movieClip.regX *= 0.7
|
||||
movieClip.regY *= 1.2
|
||||
if fullHero.get('name') is 'Sorcerer'
|
||||
movieClip.scaleX *= 0.9
|
||||
movieClip.scaleY *= 0.9
|
||||
movieClip.regX *= 1.15
|
||||
movieClip.regY *= 1.3
|
||||
|
||||
stage = new createjs.Stage(canvas[0])
|
||||
@stages[heroIndex] = stage
|
||||
stage.addChild movieClip
|
||||
stage.update()
|
||||
movieClip.loop = false
|
||||
movieClip.gotoAndPlay 0
|
||||
unless preloading
|
||||
createjs.Ticker.addEventListener 'tick', stage
|
||||
@playSelectionSound hero
|
||||
@rerenderFooter()
|
||||
if fullHero.loaded
|
||||
_.defer onLoaded
|
||||
else
|
||||
@listenToOnce fullHero, 'sync', onLoaded
|
||||
fullHero
|
||||
|
||||
animateHeroes: =>
|
||||
return unless @visibleHero
|
||||
heroIndex = Math.max 0, _.findIndex(@heroes.models, ((hero) => hero.get('original') is @visibleHero.get('original')))
|
||||
@stages[heroIndex]?.children?[0]?.gotoAndPlay? 0
|
||||
|
||||
playSelectionSound: (hero) ->
|
||||
return if @$el.hasClass 'secret'
|
||||
@currentSoundInstance?.stop()
|
||||
|
|
@ -208,6 +247,7 @@ module.exports = class PlayHeroesModal extends ModalView
|
|||
Backbone.Mediator.publish 'audio-player:play-sound', trigger: 'game-menu-close', volume: 1
|
||||
|
||||
destroy: ->
|
||||
clearInterval @heroAnimationInterval
|
||||
for heroIndex, stage of @stages
|
||||
createjs.Ticker.removeEventListener "tick", stage
|
||||
stage.removeAllChildren()
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ ThangTypeHandler = class ThangTypeHandler extends Handler
|
|||
'heroClass'
|
||||
'tier'
|
||||
'extendedName'
|
||||
'unlockLevelName'
|
||||
]
|
||||
|
||||
hasAccess: (req) ->
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ connectToScoringQueue = ->
|
|||
queues.queueClient.registerQueue 'scoring', {}, (error, data) ->
|
||||
if error? then throw new Error "There was an error registering the scoring queue: #{error}"
|
||||
scoringTaskQueue = data
|
||||
log.info 'Connected to scoring task queue!'
|
||||
#log.info 'Connected to scoring task queue!'
|
||||
|
||||
module.exports.messagesInQueueCount = (req, res) ->
|
||||
scoringTaskQueue.totalMessagesInQueue (err, count) ->
|
||||
|
|
@ -189,10 +189,10 @@ module.exports.getTwoGames = (req, res) ->
|
|||
'creator': session.creator
|
||||
'totalScore': session.totalScore
|
||||
taskObject.sessions.push sessionInformation
|
||||
console.log 'Dispatching random game between', taskObject.sessions[0].creatorName, 'and', taskObject.sessions[1].creatorName
|
||||
#console.log 'Dispatching random game between', taskObject.sessions[0].creatorName, 'and', taskObject.sessions[1].creatorName
|
||||
sendResponseObject req, res, taskObject
|
||||
else
|
||||
console.log "Directly simulating #{humansGameID} vs. #{ogresGameID}."
|
||||
#console.log "Directly simulating #{humansGameID} vs. #{ogresGameID}."
|
||||
LevelSession.findOne(_id: humansGameID).select(selection).lean().exec (err, humanSession) =>
|
||||
if err? then return errors.serverError(res, 'Couldn\'t find the human game')
|
||||
LevelSession.findOne(_id: ogresGameID).select(selection).lean().exec (err, ogreSession) =>
|
||||
|
|
@ -217,7 +217,7 @@ module.exports.getTwoGames = (req, res) ->
|
|||
|
||||
module.exports.recordTwoGames = (req, res) ->
|
||||
sessions = req.body.sessions
|
||||
console.log 'Recording non-chained result of', sessions?[0]?.name, sessions[0]?.metrics?.rank, 'and', sessions?[1]?.name, sessions?[1]?.metrics?.rank
|
||||
#console.log 'Recording non-chained result of', sessions?[0]?.name, sessions[0]?.metrics?.rank, 'and', sessions?[1]?.name, sessions?[1]?.metrics?.rank
|
||||
|
||||
yetiGuru = clientResponseObject: req.body, isRandomMatch: true
|
||||
async.waterfall [
|
||||
|
|
@ -608,7 +608,7 @@ updateMatchesInSession = (matchObject, sessionID, callback) ->
|
|||
updateUserSimulationCounts = (reqUserID, callback) ->
|
||||
incrementUserSimulationCount reqUserID, 'simulatedBy', (err) =>
|
||||
if err? then return callback err
|
||||
console.log 'Incremented user simulation count!'
|
||||
#console.log 'Incremented user simulation count!'
|
||||
unless @isRandomMatch
|
||||
incrementUserSimulationCount @levelSession.creator, 'simulatedFor', callback
|
||||
else
|
||||
|
|
@ -648,7 +648,7 @@ determineIfSessionShouldContinueAndUpdateLog = (cb) ->
|
|||
ratio = (updatedSession.numberOfLosses) / (totalNumberOfGamesPlayed)
|
||||
if ratio > 0.33
|
||||
cb 'shouldn\'t continue'
|
||||
console.log "Ratio(#{ratio}) is bad, ending simulation"
|
||||
#console.log "Ratio(#{ratio}) is bad, ending simulation"
|
||||
else
|
||||
#console.log "Ratio(#{ratio}) is good, so continuing simulations"
|
||||
cb null
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ productionLogging = (tokens, req, res) ->
|
|||
else if status >= 300 then color = 36
|
||||
elapsed = (new Date()) - req._startTime
|
||||
elapsedColor = if elapsed < 500 then 90 else 31
|
||||
if (status isnt 200 and status isnt 204 and status isnt 304 and status isnt 302) or elapsed > 500
|
||||
if (status isnt 200 and status isnt 201 and status isnt 204 and status isnt 304 and status isnt 302) or elapsed > 500
|
||||
return "\x1b[90m#{req.method} #{req.originalUrl} \x1b[#{color}m#{res.statusCode} \x1b[#{elapsedColor}m#{elapsed}ms\x1b[0m"
|
||||
null
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue