codeninjasllc/codecombat
1
0
Fork 0
mirror of https://github.com/codeninjasllc/codecombat.git synced 2025-03-28 13:50:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixes for spectate layout in new WebGL dual-stage mode.

Browse source
This commit is contained in:
Nick Winter 2014-10-17 08:47:53 -07:00
parent a922c9c6ef
commit 7bc50ade30
4 changed files with 17 additions and 7 deletions
app
lib/surface
Surface.coffee
styles/play
spectate.sass
templates/play
spectate.jade
views/play
SpectateView.coffee

6
app/lib/surface/Surface.coffee
View file

@ -522,7 +522,7 @@ module.exports = Surface = class Surface extends CocoClass
newWidth = 0.55 * pageWidth
newHeight = newWidth / aspectRatio
return unless newWidth > 0 and newHeight > 0
return if newWidth is oldWidth and newHeight is oldHeight
return if newWidth is oldWidth and newHeight is oldHeight and not @options.spectateGame
#scaleFactor = if application.isIPadApp then 2 else 1 # Retina
scaleFactor = 1
@normalCanvas.add(@webGLCanvas).attr width: newWidth * scaleFactor, height: newHeight * scaleFactor
@ -533,7 +533,9 @@ module.exports = Surface = class Surface extends CocoClass
@normalStage.scaleX *= newWidth / oldWidth
@normalStage.scaleY *= newHeight / oldHeight
@camera.onResize newWidth, newHeight
if @options.spectateGame
# Since normalCanvas is absolutely positioned, it needs help aligning with webGLCanvas. But not further than +149px (1920px screen).
@normalCanvas.css 'left', Math.min 149, @webGLCanvas.offset().left
#- Camera focus on hero
focusOnHero: ->

10
app/styles/play/spectate.sass
View file

@ -42,12 +42,18 @@
position: relative
margin: 0 auto
canvas#surface
background-color: #333
canvas#webgl-surface, canvas#normal-surface
display: block
z-index: 1
margin: 0 auto
canvas#webgl-surface
background-color: #333
canvas#normal-surface
position: absolute
top: 0
pointer-events: none
min-width: 1024px
position: relative

3
app/templates/play/spectate.jade
View file

@ -3,7 +3,8 @@
.level-content
#control-bar-view
#canvas-wrapper
canvas(width=924, height=589)#surface
canvas(width=924, height=589)#webgl-surface
canvas(width=924, height=589)#normal-surface
#canvas-left-gradient.gradient
#canvas-top-gradient.gradient
#gold-view.secret.expanded

5
app/views/play/SpectateView.coffee
View file

@ -205,8 +205,9 @@ module.exports = class SpectateLevelView extends RootView
# initialization
initSurface: ->
surfaceCanvas = $('canvas#surface', @$el)
@surface = new Surface(@world, surfaceCanvas, thangTypes: @supermodel.getModels(ThangType), playJingle: not @isEditorPreview, spectateGame: true, wizards: @level.get('type', true) isnt 'hero')
webGLSurface = $('canvas#webgl-surface', @$el)
normalSurface = $('canvas#normal-surface', @$el)
@surface = new Surface(@world, normalSurface, webGLSurface, thangTypes: @supermodel.getModels(ThangType), playJingle: not @isEditorPreview, spectateGame: true, wizards: @level.get('type', true) isnt 'hero')
worldBounds = @world.getBounds()
bounds = [{x:worldBounds.left, y:worldBounds.top}, {x:worldBounds.right, y:worldBounds.bottom}]
@surface.camera.setBounds(bounds)