mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2024-11-27 17:45:40 -05:00
Also added campaign view jade and sass file clones.
This commit is contained in:
parent
23da22a559
commit
a742772b8f
3 changed files with 604 additions and 2 deletions
495
app/styles/play/campaign-view.sass
Normal file
495
app/styles/play/campaign-view.sass
Normal file
|
@ -0,0 +1,495 @@
|
|||
@import "app/styles/mixins"
|
||||
@import "app/styles/bootstrap/variables"
|
||||
|
||||
$mapHeight: 1536
|
||||
$forestMapWidth: 2500
|
||||
$dungeonMapWidth: 2350
|
||||
$desertMapWidth: 2350
|
||||
$desertMapSeaBackground: rgba(113, 186, 208, 1)
|
||||
$desertMapSeaBackgroundTransparent: rgba(113, 186, 208, 0)
|
||||
$forestMapSeaBackground: rgba(113, 186, 208, 1)
|
||||
$forestMapSeaBackgroundTransparent: rgba(113, 186, 208, 0)
|
||||
$dungeonMapCaveBackground: rgba(68, 54, 45, 1)
|
||||
$dungeonMapCaveBackgroundTransparent: rgba(68, 54, 45, 0)
|
||||
$levelDotWidth: 2%
|
||||
$levelDotHeight: $levelDotWidth * $forestMapWidth / $mapHeight
|
||||
$levelDotZ: $levelDotHeight * 0.25
|
||||
$levelDotHoverZ: $levelDotZ * 2
|
||||
$levelDotShadowWidth: 0.8 * $levelDotWidth
|
||||
$levelDotShadowHeight: 0.8 * $levelDotHeight
|
||||
$levelClickRadius: 40px
|
||||
$gameControlSize: 80px
|
||||
$gameControlMargin: 30px
|
||||
|
||||
+keyframes(levelStartedPulse)
|
||||
from
|
||||
@include box-shadow(0px 0px 4px #333)
|
||||
margin-bottom: -$levelDotHeight / 3 + $levelDotZ
|
||||
50%
|
||||
@include box-shadow(0px 0px 22px skyblue)
|
||||
margin-bottom: -$levelDotHeight / 3 + ($levelDotHoverZ + $levelDotZ) / 2
|
||||
to
|
||||
@include box-shadow(0px 0px 4px #333)
|
||||
margin-bottom: -$levelDotHeight / 3 + $levelDotZ
|
||||
|
||||
#campaign-view
|
||||
width: 100%
|
||||
height: 100%
|
||||
position: absolute
|
||||
|
||||
.gradient
|
||||
position: absolute
|
||||
z-index: 0
|
||||
|
||||
&.horizontal-gradient
|
||||
left: 0
|
||||
right: 0
|
||||
height: 3%
|
||||
|
||||
&.vertical-gradient
|
||||
top: 0
|
||||
bottom: 0
|
||||
width: 3%
|
||||
|
||||
&.top-gradient
|
||||
top: 0
|
||||
|
||||
&.right-gradient
|
||||
right: 0
|
||||
|
||||
&.bottom-gradient
|
||||
bottom: 0
|
||||
|
||||
&.left-gradient
|
||||
left: 0
|
||||
|
||||
&.desert
|
||||
background-color: $desertMapSeaBackground
|
||||
|
||||
.top-gradient
|
||||
background: linear-gradient(to bottom, $desertMapSeaBackground 0%, $desertMapSeaBackgroundTransparent 100%)
|
||||
|
||||
.right-gradient
|
||||
background: linear-gradient(to left, $desertMapSeaBackground 0%, $desertMapSeaBackgroundTransparent 100%)
|
||||
|
||||
.bottom-gradient
|
||||
background: linear-gradient(to top, $desertMapSeaBackground 0%, $desertMapSeaBackgroundTransparent 100%)
|
||||
|
||||
.left-gradient
|
||||
background: linear-gradient(to right, $desertMapSeaBackground 0%, $desertMapSeaBackgroundTransparent 100%)
|
||||
|
||||
&.forest
|
||||
background-color: $forestMapSeaBackground
|
||||
|
||||
.top-gradient
|
||||
background: linear-gradient(to bottom, $forestMapSeaBackground 0%, $forestMapSeaBackgroundTransparent 100%)
|
||||
|
||||
.right-gradient
|
||||
background: linear-gradient(to left, $forestMapSeaBackground 0%, $forestMapSeaBackgroundTransparent 100%)
|
||||
|
||||
.bottom-gradient
|
||||
background: linear-gradient(to top, $forestMapSeaBackground 0%, $forestMapSeaBackgroundTransparent 100%)
|
||||
|
||||
.left-gradient
|
||||
background: linear-gradient(to right, $forestMapSeaBackground 0%, $forestMapSeaBackgroundTransparent 100%)
|
||||
|
||||
&.dungeon
|
||||
background-color: $dungeonMapCaveBackground
|
||||
|
||||
.top-gradient
|
||||
background: linear-gradient(to bottom, $dungeonMapCaveBackground 0%, $dungeonMapCaveBackgroundTransparent 100%)
|
||||
|
||||
.right-gradient
|
||||
background: linear-gradient(to left, $dungeonMapCaveBackground 0%, $dungeonMapCaveBackgroundTransparent 100%)
|
||||
|
||||
.bottom-gradient
|
||||
background: linear-gradient(to top, $dungeonMapCaveBackground 0%, $dungeonMapCaveBackgroundTransparent 100%)
|
||||
|
||||
.left-gradient
|
||||
background: linear-gradient(to right, $dungeonMapCaveBackground 0%, $dungeonMapCaveBackgroundTransparent 100%)
|
||||
|
||||
.map
|
||||
position: relative
|
||||
|
||||
.map-background
|
||||
width: 100%
|
||||
height: 100%
|
||||
background-size: 100%
|
||||
@include user-select(none)
|
||||
|
||||
&.map-dungeon
|
||||
background-image: url('/images/pages/play/map_dungeon_1920.jpg')
|
||||
@media screen and ( max-width: 1366px )
|
||||
background-image: url('/images/pages/play/map_dungeon_1366.jpg')
|
||||
|
||||
&.map-forest
|
||||
background-image: url('/images/pages/play/map_forest_1920.jpg')
|
||||
@media screen and ( max-width: 1366px )
|
||||
background-image: url('/images/pages/play/map_forest_1366.jpg')
|
||||
|
||||
&.map-desert
|
||||
background-image: url('/images/pages/play/map_desert_1920.jpg')
|
||||
@media screen and ( max-width: 1366px )
|
||||
background-image: url('/images/pages/play/map_desert_1366.jpg')
|
||||
|
||||
.level, .level-shadow
|
||||
position: absolute
|
||||
border-radius: 100%
|
||||
-webkit-transform: scaleY(0.75)
|
||||
transform: scaleY(0.75)
|
||||
|
||||
.level
|
||||
z-index: 2
|
||||
width: $levelDotWidth
|
||||
height: $levelDotHeight
|
||||
margin-left: -0.5 * $levelDotWidth
|
||||
margin-bottom: -$levelDotHeight / 3 + $levelDotZ
|
||||
border: 2px groove white
|
||||
@include transition(margin-bottom 0.5s ease)
|
||||
|
||||
&.disabled, &.locked
|
||||
background-image: url(/images/pages/game-menu/lock.png)
|
||||
background-size: 75%
|
||||
background-repeat: no-repeat
|
||||
background-position: 50% 50%
|
||||
opacity: 0.7
|
||||
|
||||
a
|
||||
cursor: default
|
||||
|
||||
&.next
|
||||
width: 2 * $levelDotWidth
|
||||
height: 2 * $levelDotHeight
|
||||
margin-left: -0.5 * 2 * $levelDotWidth
|
||||
margin-bottom: -2 * $levelDotHeight / 3 + 2 * $levelDotZ
|
||||
|
||||
&.started, &.next
|
||||
border: 3px solid lightgreen
|
||||
@include box-shadow(0px 0px 35px skyblue)
|
||||
|
||||
// Would be cool, but kills performance, since we have to re-render all the time.
|
||||
//&:not(:hover)
|
||||
// -webkit-animation-name: levelStartedPulse
|
||||
// -webkit-animation-duration: 3s
|
||||
// -webkit-animation-iteration-count: infinite
|
||||
|
||||
&.complete
|
||||
border: 3px solid gold
|
||||
@include box-shadow(0px 0px 35px skyblue)
|
||||
|
||||
img.banner
|
||||
position: absolute
|
||||
bottom: 38%
|
||||
left: -50%
|
||||
width: 200%
|
||||
pointer-events: none
|
||||
|
||||
img.star
|
||||
width: 100%
|
||||
bottom: 7%
|
||||
position: absolute
|
||||
pointer-events: none
|
||||
|
||||
.glyphicon-star
|
||||
position: absolute
|
||||
color: lightblue
|
||||
font-size: 21px
|
||||
left: 1.5px
|
||||
|
||||
&.started .glyphicon-star
|
||||
left: 0.5px
|
||||
|
||||
img.hero-portrait
|
||||
width: 120%
|
||||
position: absolute
|
||||
bottom: 75%
|
||||
left: 75%
|
||||
border: 1px solid black
|
||||
border-radius: 100%
|
||||
background: white
|
||||
|
||||
|
||||
.level-shadow
|
||||
z-index: 1
|
||||
width: $levelDotShadowWidth
|
||||
height: $levelDotShadowHeight
|
||||
margin-left: -0.5 * $levelDotShadowWidth
|
||||
margin-bottom: -$levelDotShadowHeight / 3
|
||||
background-color: black
|
||||
@include box-shadow(0px 0px 10px black)
|
||||
@include opacity(0.75)
|
||||
|
||||
&.next
|
||||
width: 2 * $levelDotShadowWidth
|
||||
height: 2 * $levelDotShadowHeight
|
||||
margin-left: -0.5 * 2 * $levelDotShadowWidth
|
||||
margin-bottom: -2 * $levelDotShadowHeight / 3
|
||||
|
||||
.level:hover
|
||||
// TODO: This rotate stops Firefox from flickering, but also disables the scaleY(0.75)
|
||||
// TODO: The dot looks like it's jumping.
|
||||
// TODO: -moz-transform: scaleY(0.75) didn't do anything
|
||||
// TODO: Does not break Chrome's oval.
|
||||
-moz-transform: rotate(0)
|
||||
margin-bottom: -$levelDotHeight / 3 + $levelDotHoverZ
|
||||
@include box-shadow(0px 0px 35px skyblue)
|
||||
|
||||
&.next
|
||||
margin-bottom: -2 * $levelDotHeight / 3 + 2 * $levelDotHoverZ
|
||||
|
||||
.level
|
||||
a
|
||||
display: block
|
||||
padding: $levelClickRadius
|
||||
margin-left: -0.5 * $levelClickRadius
|
||||
margin-top: -0.5 * $levelClickRadius
|
||||
border-radius: $levelClickRadius
|
||||
|
||||
&.next a
|
||||
padding: 2 * $levelClickRadius
|
||||
margin-left: 2 * -0.5 * $levelClickRadius
|
||||
margin-top: 2 * -0.5 * $levelClickRadius
|
||||
border-radius: 2 * $levelClickRadius
|
||||
|
||||
.tooltip
|
||||
z-index: 2
|
||||
|
||||
.level-info-container
|
||||
display: none
|
||||
position: absolute
|
||||
z-index: 3
|
||||
padding: 10px
|
||||
border-width: 16px 12px
|
||||
// Using modernizr-mixin for compat detection
|
||||
@include yep(borderimage)
|
||||
border-style: solid
|
||||
border-image: url(/images/level/popover_border_background.png) 16 12 fill round
|
||||
@include nope(borderimage)
|
||||
background-color: rgb(247, 242, 218)
|
||||
|
||||
.level-info.complete h3:after
|
||||
content: " - Complete!"
|
||||
color: green
|
||||
|
||||
.level-info.started h3:after
|
||||
content: " - Started"
|
||||
color: desaturate(green, 50%)
|
||||
|
||||
.level-info
|
||||
h3
|
||||
margin-top: 0
|
||||
margin-bottom: 0px
|
||||
|
||||
.level-description
|
||||
color: black
|
||||
text-shadow: 0 1px 0 white
|
||||
|
||||
.campaign-label
|
||||
text-shadow: 0 1px 0 white
|
||||
|
||||
.start-level
|
||||
display: block
|
||||
margin: 10px auto 0 auto
|
||||
width: 200px
|
||||
|
||||
.campaign-switch
|
||||
color: purple
|
||||
position: absolute
|
||||
z-index: 1
|
||||
font-size: 2vw
|
||||
text-shadow: 0 0 0.3vw white, 0 0 0.3vw white
|
||||
|
||||
&:hover
|
||||
text-decoration: none
|
||||
|
||||
&#desert-link
|
||||
left: 90%
|
||||
top: 18.5%
|
||||
transform: scaleY(-1.5) scaleX(1.5)
|
||||
|
||||
&#forest-back-link
|
||||
left: 2%
|
||||
top: 70.5%
|
||||
transform: rotate(216deg)
|
||||
|
||||
&#forest-link
|
||||
left: 94.5%
|
||||
top: 7%
|
||||
transform: rotate(-35deg)
|
||||
|
||||
&#dungeon-link
|
||||
left: 9%
|
||||
top: 54.5%
|
||||
transform: rotate(180deg)
|
||||
color: fuchsia
|
||||
|
||||
.game-controls
|
||||
position: absolute
|
||||
right: 1%
|
||||
bottom: 1%
|
||||
z-index: 3
|
||||
|
||||
.btn
|
||||
&:not(:first-child)
|
||||
margin-left: $gameControlMargin
|
||||
width: $gameControlSize
|
||||
height: $gameControlSize
|
||||
|
||||
background: url(/images/pages/play/menu_icons.png) no-repeat
|
||||
|
||||
position: relative
|
||||
img
|
||||
position: absolute
|
||||
left: 0
|
||||
top: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
|
||||
background-size: cover
|
||||
@include transition(0.5s ease)
|
||||
@include box-shadow(2px 2px 4px black)
|
||||
border: 0
|
||||
border-radius: 12px
|
||||
// IE9 shows a blank white button with this MS gradient filter in place
|
||||
filter: none
|
||||
|
||||
&:hover
|
||||
@include box-shadow(0 0 12px #bbf)
|
||||
|
||||
&:active
|
||||
@include box-shadow(0 0 20px white)
|
||||
|
||||
&.heroes
|
||||
background-position: (-1 * $gameControlSize) 0px
|
||||
&.achievements
|
||||
background-position: (-2 * $gameControlSize) 0px
|
||||
&.account
|
||||
background-position: (-3 * $gameControlSize) 0px
|
||||
&.settings
|
||||
background-position: (-4 * $gameControlSize) 0px
|
||||
&.gems
|
||||
background-position: (-5 * $gameControlSize) 0px
|
||||
|
||||
.tooltip
|
||||
font-size: 24px
|
||||
|
||||
.tooltip-arrow
|
||||
display: none
|
||||
|
||||
.user-status
|
||||
position: absolute
|
||||
bottom: 16px
|
||||
left: 8px
|
||||
text-align: center
|
||||
font-size: 24px
|
||||
color: white
|
||||
text-shadow: 0px 2px 1px black, 0px -2px 1px black, -2px 0px 1px black, 2px 0px 1px black
|
||||
height: 32px
|
||||
line-height: 32px
|
||||
|
||||
.user-status-line
|
||||
position: relative
|
||||
|
||||
button.btn.btn-illustrated
|
||||
margin-left: 10px
|
||||
min-width: 90px
|
||||
height: 32px
|
||||
color: white
|
||||
|
||||
.gem, .player-level-icon, .player-hero-icon
|
||||
position: absolute
|
||||
top: 1px
|
||||
|
||||
#gems-count
|
||||
margin-left: 40px
|
||||
|
||||
.player-level
|
||||
margin-left: 34px
|
||||
|
||||
.player-name
|
||||
margin-left: 45px
|
||||
|
||||
$spriteSheetSize: 30px
|
||||
|
||||
.player-level-icon, .player-hero-icon
|
||||
background: transparent url(/images/pages/play/play-spritesheet.png)
|
||||
background-size: cover
|
||||
background-position: (-2 * $spriteSheetSize) 0
|
||||
display: inline-block
|
||||
width: 30px
|
||||
height: 30px
|
||||
margin: 0px 2px
|
||||
|
||||
.player-hero-icon
|
||||
margin-left: 10px
|
||||
background-position: (-4 * $spriteSheetSize) 0
|
||||
|
||||
&.knight
|
||||
background-position: (-5 * $spriteSheetSize) 0
|
||||
&.librarian
|
||||
background-position: (-6 * $spriteSheetSize) 0
|
||||
&.ninja
|
||||
background-position: (-7 * $spriteSheetSize) 0
|
||||
&.potion-master
|
||||
background-position: (-8 * $spriteSheetSize) 0
|
||||
&.samurai
|
||||
background-position: (-9 * $spriteSheetSize) 0
|
||||
&.trapper
|
||||
background-position: (-10 * $spriteSheetSize) 0
|
||||
&.forest-archer
|
||||
background-position: (-11 * $spriteSheetSize) 0
|
||||
&.sorcerer
|
||||
background-position: (-12 * $spriteSheetSize) 0
|
||||
|
||||
|
||||
#volume-button
|
||||
position: absolute
|
||||
left: 1%
|
||||
top: 1%
|
||||
padding: 3px 8px
|
||||
@include opacity(0.75)
|
||||
|
||||
&:hover
|
||||
@include opacity(1.0)
|
||||
|
||||
.glyphicon
|
||||
display: none
|
||||
font-size: 32px
|
||||
|
||||
&.vol-up .glyphicon.glyphicon-volume-up
|
||||
display: inline-block
|
||||
|
||||
&.vol-off .glyphicon.glyphicon-volume-off
|
||||
display: inline-block
|
||||
@include opacity(0.50)
|
||||
&:hover
|
||||
@include opacity(0.75)
|
||||
|
||||
&.vol-down .glyphicon.glyphicon-volume-down
|
||||
display: inline-block
|
||||
|
||||
#campaign-status
|
||||
position: absolute
|
||||
left: 0
|
||||
top: 15px
|
||||
width: 100%
|
||||
margin: 0
|
||||
text-align: center
|
||||
color: rgb(254,188,68)
|
||||
font-size: 30px
|
||||
text-shadow: black 2px 2px 0, black -2px -2px 0, black 2px -2px 0, black -2px 2px 0, black 2px 0px 0, black 0px -2px 0, black -2px 0px 0, black 0px 2px 0
|
||||
|
||||
|
||||
body:not(.ipad) #campaign-view
|
||||
.level-info-container
|
||||
pointer-events: none
|
||||
|
||||
|
||||
|
||||
body.ipad #campaign-view
|
||||
// iPad only supports up to Kithgard Gates for now.
|
||||
.campaign-switch
|
||||
display: none
|
||||
|
||||
.old-levels
|
||||
display: none
|
106
app/templates/play/campaign-view.jade
Normal file
106
app/templates/play/campaign-view.jade
Normal file
|
@ -0,0 +1,106 @@
|
|||
.map
|
||||
.gradient.horizontal-gradient.top-gradient
|
||||
.gradient.vertical-gradient.right-gradient
|
||||
.gradient.horizontal-gradient.bottom-gradient
|
||||
.gradient.vertical-gradient.left-gradient
|
||||
.map-background(class="map-"+mapType alt="", draggable="false")
|
||||
|
||||
- var seenNext = nextLevel;
|
||||
each level in campaign.levels
|
||||
if !level.hidden
|
||||
- var next = level.id == nextLevel || (!seenNext && levelStatusMap[level.id] != "complete" && !level.locked && !level.disabled && !editorMode);
|
||||
- seenNext = seenNext || next;
|
||||
div(style="left: #{level.x}%; bottom: #{level.y}%; background-color: #{level.color}", class="level" + (next ? " next" : "") + (level.disabled ? " disabled" : "") + (level.locked ? " locked" : "") + " " + levelStatusMap[level.id] || "", data-level-id=level.id, title=level.name + (level.disabled ? ' (Coming Soon to Adventurers)' : ''))
|
||||
if level.unlocksHero && !level.unlockedHero
|
||||
img.hero-portrait(src=level.unlocksHero.img)
|
||||
a(href=level.type == 'hero' ? '#' : level.disabled ? "/play" : "/play/#{level.levelPath || 'level'}/#{level.id}", disabled=level.disabled, data-level-id=level.id, data-level-path=level.levelPath || 'level', data-level-name=level.name)
|
||||
if level.requiresSubscription
|
||||
img.star(src="/images/pages/play/star.png")
|
||||
if levelStatusMap[level.id] === 'complete'
|
||||
img.banner(src="/images/pages/play/level-banner-complete.png")
|
||||
if levelStatusMap[level.id] === 'started'
|
||||
img.banner(src="/images/pages/play/level-banner-started.png")
|
||||
div(style="left: #{level.x}%; bottom: #{level.y}%", class="level-shadow" + (next ? " next" : "") + " " + levelStatusMap[level.id] || "")
|
||||
.level-info-container(data-level-id=level.id, data-level-path=level.levelPath || 'level', data-level-name=level.name)
|
||||
div(class="level-info " + (levelStatusMap[level.id] || ""))
|
||||
h3= level.name + (level.disabled ? " (Coming soon!)" : (level.locked ? " (Locked)" : ""))
|
||||
.level-description= level.description
|
||||
if level.disabled
|
||||
p
|
||||
span.spr(data-i18n="play.awaiting_levels_adventurer_prefix") We release five levels per week.
|
||||
a.spr(href="/contribute/adventurer")
|
||||
strong(data-i18n="play.awaiting_levels_adventurer") Sign up as an Adventurer
|
||||
span.spl(data-i18n="play.awaiting_levels_adventurer_suffix") to be the first to play new levels.
|
||||
|
||||
- var playCount = levelPlayCountMap[level.id]
|
||||
if playCount && playCount.sessions > 20
|
||||
div
|
||||
span.spr #{playCount.sessions}
|
||||
span(data-i18n="play.players") players
|
||||
span.spr , #{Math.round(playCount.playtime / 3600)}
|
||||
span(data-i18n="play.hours_played") hours played
|
||||
.campaign-label(style="color: #{campaign.color}")= campaign.name
|
||||
if isIPadApp && !level.disabled && !level.locked
|
||||
button.btn.btn-success.btn-lg.start-level(data-i18n="common.play") Play
|
||||
if mapType === 'dungeon' && forestIsAvailable
|
||||
a#forest-link.glyphicon.glyphicon-share-alt.campaign-switch(href="/play/forest", data-i18n="[title]play.campaign_forest")
|
||||
if mapType === 'forest'
|
||||
a#dungeon-link.glyphicon.glyphicon-share-alt.campaign-switch(href="/play/dungeon", data-i18n="[title]play.campaign_dungeon")
|
||||
if desertIsAvailable
|
||||
a#desert-link.glyphicon.glyphicon-share-alt.campaign-switch(href="/play/desert", data-i18n="[title]play.campaign_desert")
|
||||
if mapType === 'desert'
|
||||
a#forest-back-link.glyphicon.glyphicon-share-alt.campaign-switch(href="/play/forest", data-i18n="[title]play.campaign_forest")
|
||||
|
||||
|
||||
.game-controls.header-font
|
||||
button.btn.items(data-toggle='coco-modal', data-target='play/modal/PlayItemsModal', data-i18n="[title]play.items")
|
||||
button.btn.heroes(data-toggle='coco-modal', data-target='play/modal/PlayHeroesModal', data-i18n="[title]play.heroes")
|
||||
button.btn.achievements(data-toggle='coco-modal', data-target='play/modal/PlayAchievementsModal', data-i18n="[title]play.achievements")
|
||||
if me.get('anonymous') === false || me.get('iosIdentifierForVendor') || isIPadApp
|
||||
button.btn.gems(data-toggle='coco-modal', data-target='play/modal/BuyGemsModal', data-i18n="[title]play.buy_gems")
|
||||
if me.isAdmin()
|
||||
button.btn.account(data-toggle='coco-modal', data-target='play/modal/PlayAccountModal', data-i18n="[title]play.account")
|
||||
button.btn.settings(data-toggle='coco-modal', data-target='play/modal/PlaySettingsModal', data-i18n="[title]play.settings")
|
||||
else if me.get('anonymous', true)
|
||||
button.btn.settings(data-toggle='coco-modal', data-target='core/AuthModal', data-i18n="[title]play.settings")
|
||||
// Don't show these things, they are bad and take us out of the game. Just wait until the new ones work.
|
||||
//else
|
||||
// a.btn.achievements(href="/user/#{me.getSlugOrID()}/stats", data-i18n="[title]play.achievements")
|
||||
// a.btn.account(href="/user/#{me.getSlugOrID()}", data-i18n="[title]play.account")
|
||||
// a.btn.settings(href='/account', data-i18n="[title]play.settings")
|
||||
|
||||
.user-status.header-font
|
||||
.user-status-line
|
||||
span.gem.gem-30
|
||||
span#gems-count.spr= me.gems()
|
||||
span.player-level-icon
|
||||
span.player-level.spr= me.level()
|
||||
span.player-hero-icon
|
||||
if me.get('anonymous')
|
||||
span.player-name.spr(data-i18n="play.anonymous") Anonymous Player
|
||||
button.btn.btn-illustrated.login-button.btn-warning(data-i18n="login.log_in")
|
||||
button.btn.btn-illustrated.signup-button.btn-danger(data-i18n="signup.sign_up")
|
||||
else
|
||||
span.player-name.spr= me.get('name')
|
||||
button#logout-button.btn.btn-illustrated.btn-warning(data-i18n="login.log_out") Log Out
|
||||
if me.isPremium()
|
||||
button.btn.btn-illustrated.btn-primary(data-i18n="nav.contact", data-toggle="coco-modal", data-target="core/ContactModal") Contact
|
||||
|
||||
|
||||
button.btn.btn-lg.btn-inverse#volume-button(title="Adjust volume")
|
||||
.glyphicon.glyphicon-volume-off
|
||||
.glyphicon.glyphicon-volume-down
|
||||
.glyphicon.glyphicon-volume-up
|
||||
|
||||
//h1#campaign-status
|
||||
// if mapType == 'dungeon'
|
||||
// span.spr(data-i18n="play.campaign_dungeon")
|
||||
// else if mapType == 'forest'
|
||||
// span.spr(data-i18n="play.campaign_forest")
|
||||
// | -
|
||||
// if requiresSubscription
|
||||
// span.spl(data-i18n="play.subscription_required")
|
||||
// else if mapType == 'dungeon'
|
||||
// span.spl(data-i18n="play.free")
|
||||
// else
|
||||
// span.spl(data-i18n="play.subscribed")
|
|
@ -1,5 +1,5 @@
|
|||
RootView = require 'views/core/RootView'
|
||||
template = require 'templates/play/world-map-view'
|
||||
template = require 'templates/play/campaign-view'
|
||||
LevelSession = require 'models/LevelSession'
|
||||
EarnedAchievement = require 'models/EarnedAchievement'
|
||||
CocoCollection = require 'collections/CocoCollection'
|
||||
|
@ -23,7 +23,7 @@ class LevelSessionsCollection extends CocoCollection
|
|||
@url = "/db/user/#{me.id}/level.sessions?project=state.complete,levelID"
|
||||
|
||||
module.exports = class WorldMapView extends RootView
|
||||
id: 'world-map-view'
|
||||
id: 'campaign-view'
|
||||
template: template
|
||||
|
||||
subscriptions:
|
||||
|
@ -103,6 +103,7 @@ module.exports = class WorldMapView extends RootView
|
|||
super()
|
||||
|
||||
getLevelPlayCounts: ->
|
||||
return # TODO: Either use the campaign object instead of hardcoded data or get the data some other way
|
||||
return unless me.isAdmin()
|
||||
success = (levelPlayCounts) =>
|
||||
return if @destroyed
|
||||
|
|
Loading…
Reference in a new issue