2014-01-03 13:32:13 -05:00
|
|
|
CocoClass = require 'lib/CocoClass'
|
|
|
|
path = require './path'
|
|
|
|
Dropper = require './Dropper'
|
|
|
|
AudioPlayer = require 'lib/AudioPlayer'
|
|
|
|
{me} = require 'lib/auth'
|
|
|
|
Camera = require './Camera'
|
|
|
|
CameraBorder = require './CameraBorder'
|
|
|
|
Layer = require './Layer'
|
|
|
|
Letterbox = require './Letterbox'
|
|
|
|
Dimmer = require './Dimmer'
|
2014-02-25 20:14:39 -05:00
|
|
|
PlaybackOverScreen = require './PlaybackOverScreen'
|
2014-01-03 13:32:13 -05:00
|
|
|
DebugDisplay = require './DebugDisplay'
|
|
|
|
CoordinateDisplay = require './CoordinateDisplay'
|
|
|
|
SpriteBoss = require './SpriteBoss'
|
|
|
|
PointChooser = require './PointChooser'
|
|
|
|
RegionChooser = require './RegionChooser'
|
|
|
|
MusicPlayer = require './MusicPlayer'
|
|
|
|
|
|
|
|
module.exports = Surface = class Surface extends CocoClass
|
|
|
|
stage: null
|
|
|
|
|
|
|
|
layers: null
|
|
|
|
surfaceLayer: null
|
|
|
|
surfaceTextLayer: null
|
|
|
|
screenLayer: null
|
|
|
|
gridLayer: null # TODO: maybe
|
|
|
|
|
|
|
|
spriteBoss: null
|
|
|
|
|
|
|
|
debugDisplay: null
|
|
|
|
currentFrame: 0
|
|
|
|
lastFrame: null
|
|
|
|
totalFramesDrawn: 0
|
|
|
|
playing: true # play vs. pause
|
|
|
|
dead: false # if we kill it for some reason
|
|
|
|
imagesLoaded: false
|
|
|
|
worldLoaded: false
|
|
|
|
scrubbing: false
|
|
|
|
debug: false
|
|
|
|
|
|
|
|
defaults:
|
|
|
|
wizards: true
|
|
|
|
paths: true
|
|
|
|
grid: false
|
|
|
|
navigateToSelection: true
|
|
|
|
choosing: false # 'point', 'region', 'ratio-region'
|
|
|
|
coords: true
|
|
|
|
playJingle: false
|
|
|
|
showInvisible: false
|
2014-04-28 19:41:18 -04:00
|
|
|
frameRate: 30 # Best as a divisor of 60, like 15, 30, 60, with RAF_SYNCHED timing.
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
subscriptions:
|
|
|
|
'level-disable-controls': 'onDisableControls'
|
|
|
|
'level-enable-controls': 'onEnableControls'
|
|
|
|
'level-set-playing': 'onSetPlaying'
|
|
|
|
'level-set-debug': 'onSetDebug'
|
|
|
|
'level-toggle-debug': 'onToggleDebug'
|
|
|
|
'level-set-grid': 'onSetGrid'
|
|
|
|
'level-toggle-grid': 'onToggleGrid'
|
2014-01-31 19:32:46 -05:00
|
|
|
'level-toggle-pathfinding': 'onTogglePathFinding'
|
2014-01-03 13:32:13 -05:00
|
|
|
'level-set-time': 'onSetTime'
|
|
|
|
'level-set-surface-camera': 'onSetCamera'
|
|
|
|
'level:restarted': 'onLevelRestarted'
|
|
|
|
'god:new-world-created': 'onNewWorld'
|
2014-08-21 19:27:52 -04:00
|
|
|
'god:streaming-world-updated': 'onNewWorld'
|
2014-01-03 13:32:13 -05:00
|
|
|
'tome:cast-spells': 'onCastSpells'
|
|
|
|
'level-set-letterbox': 'onSetLetterbox'
|
2014-05-09 18:07:30 -04:00
|
|
|
'application:idle-changed': 'onIdleChanged'
|
2014-05-12 18:54:07 -04:00
|
|
|
'camera:zoom-updated': 'onZoomUpdated'
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
shortcuts:
|
2014-01-31 19:32:46 -05:00
|
|
|
'ctrl+\\, ⌘+\\': 'onToggleDebug'
|
|
|
|
'ctrl+g, ⌘+g': 'onToggleGrid'
|
|
|
|
'ctrl+o, ⌘+o': 'onTogglePathFinding'
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
# external functions
|
|
|
|
|
|
|
|
constructor: (@world, @canvas, givenOptions) ->
|
|
|
|
super()
|
|
|
|
@layers = []
|
|
|
|
@options = _.clone(@defaults)
|
|
|
|
@options = _.extend(@options, givenOptions) if givenOptions
|
|
|
|
@initEasel()
|
|
|
|
@initAudio()
|
2014-05-12 16:28:46 -04:00
|
|
|
@onResize = _.debounce @onResize, 500
|
|
|
|
$(window).on 'resize', @onResize
|
2014-05-14 13:35:16 -04:00
|
|
|
if @world.ended
|
|
|
|
_.defer => @setWorld @world
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
destroy: ->
|
|
|
|
@dead = true
|
2014-02-11 17:58:45 -05:00
|
|
|
@camera?.destroy()
|
2014-06-30 22:16:26 -04:00
|
|
|
createjs.Ticker.removeEventListener('tick', @tick)
|
2014-01-03 13:32:13 -05:00
|
|
|
createjs.Sound.stop()
|
|
|
|
layer.destroy() for layer in @layers
|
|
|
|
@spriteBoss.destroy()
|
|
|
|
@chooser?.destroy()
|
|
|
|
@dimmer?.destroy()
|
2014-02-25 20:14:39 -05:00
|
|
|
@playbackOverScreen?.destroy()
|
2014-01-03 13:32:13 -05:00
|
|
|
@stage.clear()
|
|
|
|
@musicPlayer?.destroy()
|
2014-02-12 15:41:41 -05:00
|
|
|
@stage.removeAllChildren()
|
2014-02-11 15:32:12 -05:00
|
|
|
@stage.removeEventListener 'stagemousemove', @onMouseMove
|
|
|
|
@stage.removeEventListener 'stagemousedown', @onMouseDown
|
2014-05-20 19:20:24 -04:00
|
|
|
@stage.removeEventListener 'stagemouseup', @onMouseUp
|
2014-02-11 15:32:12 -05:00
|
|
|
@stage.removeAllEventListeners()
|
2014-02-12 15:41:41 -05:00
|
|
|
@stage.enableDOMEvents false
|
|
|
|
@stage.enableMouseOver 0
|
|
|
|
@canvas.off 'mousewheel', @onMouseWheel
|
2014-05-12 16:28:46 -04:00
|
|
|
$(window).off 'resize', @onResize
|
2014-05-12 18:54:07 -04:00
|
|
|
clearTimeout @surfacePauseTimeout if @surfacePauseTimeout
|
|
|
|
clearTimeout @surfaceZoomPauseTimeout if @surfaceZoomPauseTimeout
|
2014-02-14 13:57:47 -05:00
|
|
|
super()
|
2014-02-12 15:41:41 -05:00
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
setWorld: (@world) ->
|
|
|
|
@worldLoaded = true
|
2014-08-22 20:11:40 -04:00
|
|
|
lastFrame = Math.min(@getCurrentFrame(), @world.frames.length - 1)
|
2014-07-17 18:50:29 -04:00
|
|
|
@world.getFrame(lastFrame).restoreState() unless @options.choosing
|
2014-01-03 13:32:13 -05:00
|
|
|
@spriteBoss.world = @world
|
|
|
|
|
|
|
|
@showLevel()
|
|
|
|
@updateState true if @loaded
|
|
|
|
# TODO: synchronize both ways of choosing whether to show coords (@world via UI System or @options via World Select modal)
|
|
|
|
if @world.showCoordinates and @options.coords
|
2014-03-12 22:38:34 -04:00
|
|
|
@coordinateDisplay = new CoordinateDisplay camera: @camera
|
|
|
|
@surfaceTextLayer.addChild @coordinateDisplay
|
2014-01-03 13:32:13 -05:00
|
|
|
@onFrameChanged()
|
|
|
|
Backbone.Mediator.publish 'surface:world-set-up'
|
|
|
|
|
2014-01-31 19:32:46 -05:00
|
|
|
onTogglePathFinding: (e) ->
|
|
|
|
e?.preventDefault?()
|
2014-01-20 15:57:45 -05:00
|
|
|
@hidePathFinding()
|
|
|
|
@showingPathFinding = not @showingPathFinding
|
|
|
|
if @showingPathFinding then @showPathFinding() else @hidePathFinding()
|
2014-01-31 13:21:32 -05:00
|
|
|
|
2014-01-20 15:57:45 -05:00
|
|
|
hidePathFinding: ->
|
|
|
|
@surfaceLayer.removeChild @navRectangles if @navRectangles
|
|
|
|
@surfaceLayer.removeChild @navPaths if @navPaths
|
|
|
|
@navRectangles = @navPaths = null
|
2014-01-31 13:21:32 -05:00
|
|
|
|
2014-01-20 15:57:45 -05:00
|
|
|
showPathFinding: ->
|
|
|
|
@hidePathFinding()
|
2014-01-31 13:21:32 -05:00
|
|
|
|
2014-01-20 15:57:45 -05:00
|
|
|
mesh = _.values(@world.navMeshes or {})[0]
|
|
|
|
return unless mesh
|
|
|
|
@navRectangles = new createjs.Container()
|
|
|
|
@navRectangles.layerPriority = -1
|
|
|
|
@addMeshRectanglesToContainer mesh, @navRectangles
|
|
|
|
@surfaceLayer.addChild @navRectangles
|
|
|
|
@surfaceLayer.updateLayerOrder()
|
2014-01-31 13:21:32 -05:00
|
|
|
|
2014-01-20 19:50:53 -05:00
|
|
|
graph = _.values(@world.graphs or {})[0]
|
|
|
|
return @surfaceLayer.updateLayerOrder() unless graph
|
2014-01-20 15:57:45 -05:00
|
|
|
@navPaths = new createjs.Container()
|
|
|
|
@navPaths.layerPriority = -1
|
2014-01-20 19:50:53 -05:00
|
|
|
@addNavPathsToContainer graph, @navPaths
|
2014-01-20 15:57:45 -05:00
|
|
|
@surfaceLayer.addChild @navPaths
|
|
|
|
@surfaceLayer.updateLayerOrder()
|
2014-01-31 13:21:32 -05:00
|
|
|
|
2014-01-20 15:57:45 -05:00
|
|
|
addMeshRectanglesToContainer: (mesh, container) ->
|
|
|
|
for rect in mesh
|
|
|
|
shape = new createjs.Shape()
|
2014-06-30 22:16:26 -04:00
|
|
|
pos = @camera.worldToSurface {x: rect.x, y: rect.y}
|
|
|
|
dim = @camera.worldToSurface {x: rect.width, y: rect.height}
|
2014-01-20 15:57:45 -05:00
|
|
|
shape.graphics
|
|
|
|
.setStrokeStyle(3)
|
2014-06-30 22:16:26 -04:00
|
|
|
.beginFill('rgba(0,0,128,0.3)')
|
|
|
|
.beginStroke('rgba(0,0,128,0.7)')
|
2014-01-20 15:57:45 -05:00
|
|
|
.drawRect(pos.x - dim.x/2, pos.y - dim.y/2, dim.x, dim.y)
|
|
|
|
container.addChild shape
|
|
|
|
|
|
|
|
addNavPathsToContainer: (graph, container) ->
|
|
|
|
for node in _.values graph
|
|
|
|
for edgeVertex in node.edges
|
|
|
|
@drawLine node.vertex, edgeVertex, container
|
|
|
|
|
|
|
|
drawLine: (v1, v2, container) ->
|
|
|
|
shape = new createjs.Shape()
|
|
|
|
v1 = @camera.worldToSurface v1
|
|
|
|
v2 = @camera.worldToSurface v2
|
|
|
|
shape.graphics
|
|
|
|
.setStrokeStyle(1)
|
|
|
|
.moveTo(v1.x, v1.y)
|
2014-06-30 22:16:26 -04:00
|
|
|
.beginStroke('rgba(128,0,0,0.4)')
|
2014-01-20 15:57:45 -05:00
|
|
|
.lineTo(v2.x, v2.y)
|
|
|
|
.endStroke()
|
|
|
|
container.addChild shape
|
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
setProgress: (progress, scrubDuration=500) ->
|
2014-02-25 20:14:39 -05:00
|
|
|
progress = Math.max(Math.min(progress, 1), 0.0)
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
@scrubbing = true
|
|
|
|
onTweenEnd = =>
|
|
|
|
@scrubbingTo = null
|
|
|
|
@scrubbing = false
|
|
|
|
@scrubbingPlaybackSpeed = null
|
|
|
|
@fastForwarding = false
|
|
|
|
|
|
|
|
if @scrubbingTo?
|
|
|
|
# cut to the chase for existing tween
|
|
|
|
createjs.Tween.removeTweens(@)
|
|
|
|
@currentFrame = @scrubbingTo
|
|
|
|
|
2014-08-22 20:11:40 -04:00
|
|
|
@scrubbingTo = Math.min(Math.round(progress * @world.frames.length), @world.frames.length)
|
2014-01-03 13:32:13 -05:00
|
|
|
@scrubbingPlaybackSpeed = Math.sqrt(Math.abs(@scrubbingTo - @currentFrame) * @world.dt / (scrubDuration or 0.5))
|
2014-08-22 00:23:45 -04:00
|
|
|
ease = if @fastForwarding then createjs.Ease.linear else createjs.Ease.sineInOut
|
2014-01-03 13:32:13 -05:00
|
|
|
if scrubDuration
|
|
|
|
t = createjs.Tween
|
|
|
|
.get(@)
|
2014-08-22 00:23:45 -04:00
|
|
|
.to({currentFrame: @scrubbingTo}, scrubDuration, ease)
|
2014-01-03 13:32:13 -05:00
|
|
|
.call(onTweenEnd)
|
2014-02-28 14:27:32 -05:00
|
|
|
t.addEventListener('change', @onFramesScrubbed)
|
2014-01-03 13:32:13 -05:00
|
|
|
else
|
|
|
|
@currentFrame = @scrubbingTo
|
2014-02-28 14:27:32 -05:00
|
|
|
@onFramesScrubbed() # For performance, don't play these for instant transitions.
|
2014-01-03 13:32:13 -05:00
|
|
|
onTweenEnd()
|
|
|
|
|
2014-03-12 12:10:36 -04:00
|
|
|
return unless @loaded
|
2014-01-03 13:32:13 -05:00
|
|
|
@updateState true
|
|
|
|
@onFrameChanged()
|
|
|
|
|
2014-02-28 14:27:32 -05:00
|
|
|
onFramesScrubbed: (e) =>
|
2014-03-12 12:10:36 -04:00
|
|
|
return unless @loaded
|
2014-02-28 14:27:32 -05:00
|
|
|
if e
|
|
|
|
# Gotta play all the sounds when scrubbing (but not when doing an immediate transition).
|
|
|
|
rising = @currentFrame > @lastFrame
|
|
|
|
actualCurrentFrame = @currentFrame
|
|
|
|
tempFrame = if rising then Math.ceil(@lastFrame) else Math.floor(@lastFrame)
|
|
|
|
while true # temporary fix to stop cacophony
|
|
|
|
break if rising and tempFrame > actualCurrentFrame
|
|
|
|
break if (not rising) and tempFrame < actualCurrentFrame
|
|
|
|
@currentFrame = tempFrame
|
|
|
|
frame = @world.getFrame(@getCurrentFrame())
|
|
|
|
frame.restoreState()
|
2014-04-28 19:31:51 -04:00
|
|
|
volume = Math.max(0.05, Math.min(1, 1 / @scrubbingPlaybackSpeed))
|
|
|
|
sprite.playSounds false, volume for sprite in @spriteBoss.spriteArray
|
2014-02-28 14:27:32 -05:00
|
|
|
tempFrame += if rising then 1 else -1
|
|
|
|
@currentFrame = actualCurrentFrame
|
|
|
|
|
|
|
|
@restoreWorldState()
|
2014-02-24 20:01:36 -05:00
|
|
|
@spriteBoss.update true
|
2014-01-03 13:32:13 -05:00
|
|
|
@onFrameChanged()
|
|
|
|
|
|
|
|
getCurrentFrame: ->
|
2014-07-17 18:50:29 -04:00
|
|
|
return Math.max(0, Math.min(Math.floor(@currentFrame), @world.frames.length - 1))
|
2014-01-03 13:32:13 -05:00
|
|
|
|
2014-08-22 17:59:32 -04:00
|
|
|
getProgress: -> @currentFrame / @world.frames.length
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
onLevelRestarted: (e) ->
|
|
|
|
@setProgress 0, 0
|
|
|
|
|
|
|
|
onSetCamera: (e) ->
|
|
|
|
if e.thangID
|
2014-05-14 18:59:56 -04:00
|
|
|
return unless target = @spriteBoss.spriteFor(e.thangID)?.imageObject
|
2014-01-03 13:32:13 -05:00
|
|
|
else if e.pos
|
|
|
|
target = @camera.worldToSurface e.pos
|
|
|
|
else
|
|
|
|
target = null
|
|
|
|
@camera.setBounds e.bounds if e.bounds
|
|
|
|
@cameraBorder.updateBounds @camera.bounds
|
2014-02-19 15:43:25 -05:00
|
|
|
@camera.zoomTo target, e.zoom, e.duration # TODO: SurfaceScriptModule perhaps shouldn't assign e.zoom if not set
|
2014-01-03 13:32:13 -05:00
|
|
|
|
2014-05-12 18:54:07 -04:00
|
|
|
onZoomUpdated: (e) ->
|
|
|
|
if @ended
|
|
|
|
@setPaused false
|
|
|
|
@surfaceZoomPauseTimeout = _.delay (=> @setPaused true), 3000
|
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
setDisabled: (@disabled) ->
|
|
|
|
@spriteBoss.disabled = @disabled
|
|
|
|
|
|
|
|
onDisableControls: (e) ->
|
|
|
|
return if e.controls and not ('surface' in e.controls)
|
|
|
|
@setDisabled true
|
|
|
|
@dimmer ?= new Dimmer camera: @camera, layer: @screenLayer
|
|
|
|
@dimmer.setSprites @spriteBoss.sprites
|
|
|
|
|
|
|
|
onEnableControls: (e) ->
|
|
|
|
return if e.controls and not ('surface' in e.controls)
|
|
|
|
@setDisabled false
|
|
|
|
|
|
|
|
onSetLetterbox: (e) ->
|
|
|
|
@setDisabled e.on
|
|
|
|
|
2014-02-11 15:54:08 -05:00
|
|
|
onSetPlaying: (e) ->
|
2014-01-03 13:32:13 -05:00
|
|
|
@playing = (e ? {}).playing ? true
|
2014-05-20 15:21:43 -04:00
|
|
|
@setPlayingCalled = true
|
2014-01-03 13:32:13 -05:00
|
|
|
if @playing and @currentFrame >= (@world.totalFrames - 5)
|
|
|
|
@currentFrame = 0
|
|
|
|
if @fastForwarding and not @playing
|
2014-08-22 20:11:40 -04:00
|
|
|
@setProgress @currentFrame / @world.frames.length
|
2014-01-03 13:32:13 -05:00
|
|
|
|
2014-02-11 15:54:08 -05:00
|
|
|
onSetTime: (e) ->
|
2014-01-03 13:32:13 -05:00
|
|
|
toFrame = @currentFrame
|
|
|
|
if e.time?
|
2014-08-22 20:11:40 -04:00
|
|
|
@worldLifespan = @world.frames.length / @world.frameRate
|
2014-01-03 13:32:13 -05:00
|
|
|
e.ratio = e.time / @worldLifespan
|
|
|
|
if e.ratio?
|
2014-08-22 20:11:40 -04:00
|
|
|
toFrame = @world.frames.length * e.ratio
|
2014-01-03 13:32:13 -05:00
|
|
|
if e.frameOffset
|
|
|
|
toFrame += e.frameOffset
|
|
|
|
if e.ratioOffset
|
2014-08-22 20:11:40 -04:00
|
|
|
toFrame += @world.frames.length * e.ratioOffset
|
2014-01-03 13:32:13 -05:00
|
|
|
unless _.isNumber(toFrame) and not _.isNaN(toFrame)
|
|
|
|
return console.error('set-time event', e, 'produced invalid target frame', toFrame)
|
2014-08-22 20:11:40 -04:00
|
|
|
@setProgress(toFrame / @world.frames.length, e.scrubDuration)
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
onFrameChanged: (force) ->
|
2014-08-22 20:11:40 -04:00
|
|
|
@currentFrame = Math.min(@currentFrame, @world.frames.length)
|
2014-01-03 13:32:13 -05:00
|
|
|
@debugDisplay?.updateFrame @currentFrame
|
|
|
|
return if @currentFrame is @lastFrame and not force
|
|
|
|
progress = @getProgress()
|
|
|
|
Backbone.Mediator.publish('surface:frame-changed',
|
2014-06-30 22:16:26 -04:00
|
|
|
type: 'frame-changed'
|
2014-01-03 13:32:13 -05:00
|
|
|
selectedThang: @spriteBoss.selectedSprite?.thang
|
|
|
|
progress: progress
|
|
|
|
frame: @currentFrame
|
|
|
|
world: @world
|
|
|
|
)
|
2014-02-25 20:14:39 -05:00
|
|
|
|
2014-08-22 20:11:40 -04:00
|
|
|
if @lastFrame < @world.frames.length and @currentFrame >= @world.totalFrames - 1
|
2014-02-25 20:14:39 -05:00
|
|
|
@ended = true
|
2014-05-09 18:07:30 -04:00
|
|
|
@setPaused true
|
2014-02-25 20:14:39 -05:00
|
|
|
Backbone.Mediator.publish 'surface:playback-ended'
|
|
|
|
else if @currentFrame < @world.totalFrames and @ended
|
|
|
|
@ended = false
|
2014-05-09 18:07:30 -04:00
|
|
|
@setPaused false
|
2014-02-25 20:14:39 -05:00
|
|
|
Backbone.Mediator.publish 'surface:playback-restarted'
|
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
@lastFrame = @currentFrame
|
|
|
|
|
2014-05-09 18:07:30 -04:00
|
|
|
onIdleChanged: (e) ->
|
|
|
|
@setPaused e.idle unless @ended
|
|
|
|
|
2014-05-12 18:54:07 -04:00
|
|
|
setPaused: (paused) ->
|
2014-05-09 18:07:30 -04:00
|
|
|
# We want to be able to essentially stop rendering the surface if it doesn't need to animate anything.
|
|
|
|
# If pausing, though, we want to give it enough time to finish any tweens.
|
|
|
|
performToggle = =>
|
2014-05-12 18:54:07 -04:00
|
|
|
createjs.Ticker.setFPS if paused then 1 else @options.frameRate
|
|
|
|
@surfacePauseTimeout = null
|
|
|
|
clearTimeout @surfacePauseTimeout if @surfacePauseTimeout
|
|
|
|
clearTimeout @surfaceZoomPauseTimeout if @surfaceZoomPauseTimeout
|
|
|
|
@surfacePauseTimeout = @surfaceZoomPauseTimeout = null
|
|
|
|
if paused
|
|
|
|
@surfacePauseTimeout = _.delay performToggle, 2000
|
|
|
|
@spriteBoss.stop()
|
|
|
|
@playbackOverScreen.show()
|
2014-05-09 18:07:30 -04:00
|
|
|
else
|
|
|
|
performToggle()
|
2014-05-12 18:54:07 -04:00
|
|
|
@spriteBoss.play()
|
|
|
|
@playbackOverScreen.hide()
|
2014-05-09 18:07:30 -04:00
|
|
|
|
2014-05-11 20:42:32 -04:00
|
|
|
onCastSpells: (e) ->
|
|
|
|
return if e.preload
|
2014-05-12 18:54:07 -04:00
|
|
|
@setPaused false if @ended
|
2014-02-24 17:40:28 -05:00
|
|
|
@casting = true
|
2014-08-22 00:23:45 -04:00
|
|
|
@setPlayingCalled = false # Don't overwrite playing settings if they changed by, say, scripts.
|
|
|
|
@frameBeforeCast = @currentFrame
|
2014-08-22 18:32:23 -04:00
|
|
|
@setProgress 0
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
onNewWorld: (event) ->
|
|
|
|
return unless event.world.name is @world.name
|
2014-02-24 17:40:28 -05:00
|
|
|
@casting = false
|
2014-08-22 00:23:45 -04:00
|
|
|
@spriteBoss.play()
|
2014-02-28 14:27:32 -05:00
|
|
|
|
2014-02-25 13:50:12 -05:00
|
|
|
# This has a tendency to break scripts that are waiting for playback to change when the level is loaded
|
|
|
|
# so only run it after the first world is created.
|
2014-08-22 00:23:45 -04:00
|
|
|
Backbone.Mediator.publish 'level-set-playing', {playing: true} unless event.firstWorld or @setPlayingCalled
|
|
|
|
|
|
|
|
@setWorld event.world
|
|
|
|
@onFrameChanged(true)
|
|
|
|
if @playing and ffToFrame = Math.min event.firstChangedFrame, @frameBeforeCast, event.world.frames.length
|
2014-08-22 20:11:40 -04:00
|
|
|
ffToRatio = ffToFrame / @world.frames.length
|
2014-08-22 00:23:45 -04:00
|
|
|
ffToTime = ffToFrame * @world.dt
|
|
|
|
ffSpeed = Math.max 4, ffToTime / 3
|
|
|
|
ffInterval = 1000 * (ffToFrame - @currentFrame) / @options.frameRate
|
|
|
|
ffScrubDuration = 1000 * ffToTime / ffSpeed
|
|
|
|
ffScrubDuration = Math.min(ffScrubDuration, ffInterval)
|
|
|
|
ffFactor = ffInterval / ffScrubDuration
|
2014-08-22 15:39:29 -04:00
|
|
|
if ffFactor > 1.5
|
2014-08-22 00:23:45 -04:00
|
|
|
createjs.Tween.removeTweens(@)
|
|
|
|
@scrubbingTo = null
|
2014-01-03 13:32:13 -05:00
|
|
|
@fastForwarding = true
|
2014-08-22 00:23:45 -04:00
|
|
|
@setProgress ffToRatio, ffScrubDuration
|
|
|
|
else
|
|
|
|
createjs.Tween.removeTweens(@)
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
# initialization
|
|
|
|
|
|
|
|
initEasel: ->
|
|
|
|
# takes DOM objects, not jQuery objects
|
|
|
|
@stage = new createjs.Stage(@canvas[0])
|
2014-05-12 16:28:46 -04:00
|
|
|
canvasWidth = parseInt @canvas.attr('width'), 10
|
|
|
|
canvasHeight = parseInt @canvas.attr('height'), 10
|
2014-02-11 17:58:45 -05:00
|
|
|
@camera?.destroy()
|
2014-05-16 18:33:49 -04:00
|
|
|
@camera = new Camera @canvas
|
2014-03-05 22:39:14 -05:00
|
|
|
AudioPlayer.camera = @camera
|
2014-06-30 22:16:26 -04:00
|
|
|
@layers.push @surfaceLayer = new Layer name: 'Surface', layerPriority: 0, transform: Layer.TRANSFORM_SURFACE, camera: @camera
|
|
|
|
@layers.push @surfaceTextLayer = new Layer name: 'Surface Text', layerPriority: 1, transform: Layer.TRANSFORM_SURFACE_TEXT, camera: @camera
|
|
|
|
@layers.push @screenLayer = new Layer name: 'Screen', layerPriority: 2, transform: Layer.TRANSFORM_SCREEN, camera: @camera
|
2014-01-03 13:32:13 -05:00
|
|
|
@stage.addChild @layers...
|
|
|
|
@surfaceLayer.addChild @cameraBorder = new CameraBorder bounds: @camera.bounds
|
|
|
|
@screenLayer.addChild new Letterbox canvasWidth: canvasWidth, canvasHeight: canvasHeight
|
|
|
|
@spriteBoss = new SpriteBoss camera: @camera, surfaceLayer: @surfaceLayer, surfaceTextLayer: @surfaceTextLayer, world: @world, thangTypes: @options.thangTypes, choosing: @options.choosing, navigateToSelection: @options.navigateToSelection, showInvisible: @options.showInvisible
|
2014-02-25 20:14:39 -05:00
|
|
|
@playbackOverScreen ?= new PlaybackOverScreen camera: @camera, layer: @screenLayer
|
2014-01-03 13:32:13 -05:00
|
|
|
@stage.enableMouseOver(10)
|
|
|
|
@stage.addEventListener 'stagemousemove', @onMouseMove
|
|
|
|
@stage.addEventListener 'stagemousedown', @onMouseDown
|
2014-05-23 20:03:39 -04:00
|
|
|
@canvas[0].addEventListener 'mouseup', @onMouseUp
|
2014-02-12 15:41:41 -05:00
|
|
|
@canvas.on 'mousewheel', @onMouseWheel
|
2014-01-03 13:32:13 -05:00
|
|
|
@hookUpChooseControls() if @options.choosing
|
2014-03-01 00:29:14 -05:00
|
|
|
createjs.Ticker.timingMode = createjs.Ticker.RAF_SYNCHED
|
2014-02-28 20:12:23 -05:00
|
|
|
createjs.Ticker.setFPS @options.frameRate
|
2014-05-12 16:28:46 -04:00
|
|
|
@onResize()
|
|
|
|
|
|
|
|
onResize: (e) =>
|
|
|
|
oldWidth = parseInt @canvas.attr('width'), 10
|
|
|
|
oldHeight = parseInt @canvas.attr('height'), 10
|
|
|
|
newWidth = @canvas.width()
|
|
|
|
newHeight = @canvas.height()
|
2014-05-16 18:33:49 -04:00
|
|
|
return unless newWidth > 0 and newHeight > 0
|
2014-05-15 14:27:51 -04:00
|
|
|
#if InstallTrigger? # Firefox rendering performance goes down as canvas size goes up
|
|
|
|
# newWidth = Math.min 924, newWidth
|
|
|
|
# newHeight = Math.min 589, newHeight
|
2014-05-12 16:28:46 -04:00
|
|
|
@canvas.attr width: newWidth, height: newHeight
|
|
|
|
@stage.scaleX *= newWidth / oldWidth
|
|
|
|
@stage.scaleY *= newHeight / oldHeight
|
|
|
|
@camera.onResize newWidth, newHeight
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
showLevel: ->
|
|
|
|
return if @dead
|
|
|
|
return unless @worldLoaded
|
|
|
|
return if @loaded
|
|
|
|
@loaded = true
|
|
|
|
@spriteBoss.createMarks()
|
|
|
|
@spriteBoss.createIndieSprites @world.indieSprites, @options.wizards
|
|
|
|
Backbone.Mediator.publish 'registrar-echo-states'
|
|
|
|
@updateState true
|
|
|
|
@drawCurrentFrame()
|
|
|
|
@showGrid() if @options.grid # TODO: pay attention to world grid setting (which we only know when world simulates)
|
2014-06-30 22:16:26 -04:00
|
|
|
createjs.Ticker.addEventListener 'tick', @tick
|
2014-01-03 13:32:13 -05:00
|
|
|
Backbone.Mediator.publish 'level:started'
|
|
|
|
|
2014-02-22 15:01:05 -05:00
|
|
|
createOpponentWizard: (opponent) ->
|
|
|
|
@spriteBoss.createOpponentWizard opponent
|
|
|
|
|
2014-01-03 13:32:13 -05:00
|
|
|
initAudio: ->
|
|
|
|
@musicPlayer = new MusicPlayer()
|
|
|
|
|
|
|
|
# grid; should probably refactor into separate class
|
|
|
|
|
|
|
|
showGrid: ->
|
|
|
|
return if @gridShowing()
|
|
|
|
unless @gridLayer
|
|
|
|
@gridLayer = new createjs.Container()
|
|
|
|
@gridShape = new createjs.Shape()
|
|
|
|
@gridLayer.addChild @gridShape
|
|
|
|
@gridLayer.z = 90019001
|
|
|
|
@gridLayer.mouseEnabled = false
|
|
|
|
@gridShape.alpha = 0.125
|
2014-06-30 22:16:26 -04:00
|
|
|
@gridShape.graphics.beginStroke 'blue'
|
2014-01-03 13:32:13 -05:00
|
|
|
gridSize = Math.round(@world.size()[0] / 20)
|
2014-03-22 17:28:18 -04:00
|
|
|
unless gridSize > 0.1
|
2014-06-30 22:16:26 -04:00
|
|
|
return console.error 'Grid size is', gridSize, 'so we can\'t draw a grid.'
|
2014-01-03 13:32:13 -05:00
|
|
|
wopStart = x: 0, y: 0
|
|
|
|
wopEnd = x: @world.size()[0], y: @world.size()[1]
|
|
|
|
supStart = @camera.worldToSurface wopStart
|
|
|
|
supEnd = @camera.worldToSurface wopEnd
|
|
|
|
wop = x: wopStart.x, y: wopStart.y
|
|
|
|
while wop.x < wopEnd.x
|
|
|
|
sup = @camera.worldToSurface wop
|
|
|
|
@gridShape.graphics.mt(sup.x, supStart.y).lt(sup.x, supEnd.y)
|
2014-06-30 22:16:26 -04:00
|
|
|
t = new createjs.Text(wop.x.toFixed(0), '16px Arial', 'blue')
|
2014-01-03 13:32:13 -05:00
|
|
|
t.x = sup.x - t.getMeasuredWidth() / 2
|
|
|
|
t.y = supStart.y - 10 - t.getMeasuredHeight() / 2
|
|
|
|
t.alpha = 0.75
|
|
|
|
@gridLayer.addChild t
|
|
|
|
wop.x += gridSize
|
|
|
|
while wop.y < wopEnd.y
|
|
|
|
sup = @camera.worldToSurface wop
|
|
|
|
@gridShape.graphics.mt(supStart.x, sup.y).lt(supEnd.x, sup.y)
|
2014-06-30 22:16:26 -04:00
|
|
|
t = new createjs.Text(wop.y.toFixed(0), '16px Arial', 'blue')
|
2014-01-03 13:32:13 -05:00
|
|
|
t.x = 10 - t.getMeasuredWidth() / 2
|
|
|
|
t.y = sup.y - t.getMeasuredHeight() / 2
|
|
|
|
t.alpha = 0.75
|
|
|
|
@gridLayer.addChild t
|
|
|
|
wop.y += gridSize
|
|
|
|
@gridShape.graphics.endStroke()
|
|
|
|
bounds = @gridLayer.getBounds()
|
|
|
|
return unless bounds?.width and bounds.height
|
|
|
|
@gridLayer.cache bounds.x, bounds.y, bounds.width, bounds.height
|
|
|
|
@surfaceLayer.addChild @gridLayer
|
|
|
|
|
|
|
|
hideGrid: ->
|
|
|
|
return unless @gridShowing()
|
|
|
|
@gridLayer.parent.removeChild @gridLayer
|
|
|
|
|
|
|
|
gridShowing: ->
|
|
|
|
@gridLayer?.parent?
|
|
|
|
|
2014-01-31 19:32:46 -05:00
|
|
|
onToggleGrid: (e) ->
|
2014-03-13 13:27:32 -04:00
|
|
|
# TODO: figure out a better way of managing grid / debug so it's not split across PlaybackView and Surface
|
2014-01-31 19:32:46 -05:00
|
|
|
e?.preventDefault?()
|
2014-01-03 13:32:13 -05:00
|
|
|
if @gridShowing() then @hideGrid() else @showGrid()
|
2014-03-13 05:51:00 -04:00
|
|
|
flag = $('#grid-toggle i.icon-ok')
|
|
|
|
flag.toggleClass 'invisible', not @gridShowing()
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
onSetGrid: (e) ->
|
|
|
|
if e.grid then @showGrid() else @hideGrid()
|
|
|
|
|
|
|
|
onToggleDebug: (e) ->
|
2014-01-31 19:32:46 -05:00
|
|
|
e?.preventDefault?()
|
2014-01-03 13:32:13 -05:00
|
|
|
Backbone.Mediator.publish 'level-set-debug', {debug: not @debug}
|
|
|
|
|
|
|
|
onSetDebug: (e) ->
|
|
|
|
return if e.debug is @debug
|
|
|
|
@debug = e.debug
|
|
|
|
if @debug and not @debugDisplay
|
|
|
|
@screenLayer.addChild @debugDisplay = new DebugDisplay canvasWidth: @camera.canvasWidth, canvasHeight: @camera.canvasHeight
|
|
|
|
|
2014-05-14 18:29:55 -04:00
|
|
|
# Some mouse handling callbacks
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
onMouseMove: (e) =>
|
2014-05-14 18:29:55 -04:00
|
|
|
@mouseScreenPos = {x: e.stageX, y: e.stageY}
|
2014-01-03 13:32:13 -05:00
|
|
|
return if @disabled
|
|
|
|
Backbone.Mediator.publish 'surface:mouse-moved', x: e.stageX, y: e.stageY
|
|
|
|
|
|
|
|
onMouseDown: (e) =>
|
|
|
|
return if @disabled
|
|
|
|
onBackground = not @stage.hitTest e.stageX, e.stageY
|
|
|
|
Backbone.Mediator.publish 'surface:stage-mouse-down', onBackground: onBackground, x: e.stageX, y: e.stageY, originalEvent: e
|
|
|
|
|
2014-05-20 19:20:24 -04:00
|
|
|
onMouseUp: (e) =>
|
|
|
|
return if @disabled
|
|
|
|
onBackground = not @stage.hitTest e.stageX, e.stageY
|
|
|
|
Backbone.Mediator.publish 'surface:stage-mouse-up', onBackground: onBackground, x: e.stageX, y: e.stageY, originalEvent: e
|
|
|
|
|
2014-02-12 15:41:41 -05:00
|
|
|
onMouseWheel: (e) =>
|
|
|
|
# https://github.com/brandonaaron/jquery-mousewheel
|
|
|
|
e.preventDefault()
|
|
|
|
return if @disabled
|
2014-02-15 16:45:16 -05:00
|
|
|
event =
|
|
|
|
deltaX: e.deltaX
|
|
|
|
deltaY: e.deltaY
|
2014-05-14 18:29:55 -04:00
|
|
|
screenPos: @mouseScreenPos
|
2014-05-16 18:33:49 -04:00
|
|
|
canvas: @canvas
|
2014-02-15 16:45:16 -05:00
|
|
|
Backbone.Mediator.publish 'surface:mouse-scrolled', event unless @disabled
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
hookUpChooseControls: ->
|
|
|
|
chooserOptions = stage: @stage, surfaceLayer: @surfaceLayer, camera: @camera, restrictRatio: @options.choosing is 'ratio-region'
|
|
|
|
klass = if @options.choosing is 'point' then PointChooser else RegionChooser
|
|
|
|
@chooser = new klass chooserOptions
|
|
|
|
|
|
|
|
# Main Surface update loop
|
|
|
|
|
|
|
|
tick: (e) =>
|
|
|
|
# seems to be a bug where only one object can register with the Ticker...
|
|
|
|
oldFrame = @currentFrame
|
2014-02-28 14:27:32 -05:00
|
|
|
oldWorldFrame = Math.floor oldFrame
|
2014-08-22 20:11:40 -04:00
|
|
|
lastFrame = @world.frames.length - 1
|
2014-01-03 13:32:13 -05:00
|
|
|
while true
|
|
|
|
Dropper.tick()
|
|
|
|
@trailmaster.tick() if @trailmaster
|
|
|
|
# Skip some frame updates unless we're playing and not at end (or we haven't drawn much yet)
|
2014-03-10 11:45:36 -04:00
|
|
|
frameAdvanced = (@playing and @currentFrame < lastFrame) or @totalFramesDrawn < 2
|
|
|
|
if frameAdvanced and @playing
|
|
|
|
@currentFrame += @world.frameRate / @options.frameRate
|
|
|
|
@currentFrame = Math.min @currentFrame, lastFrame
|
2014-02-28 14:27:32 -05:00
|
|
|
newWorldFrame = Math.floor @currentFrame
|
|
|
|
worldFrameAdvanced = newWorldFrame isnt oldWorldFrame
|
|
|
|
if worldFrameAdvanced
|
|
|
|
# Only restore world state when it will correspond to an integer WorldFrame, not interpolated frame.
|
|
|
|
@restoreWorldState()
|
|
|
|
oldWorldFrame = newWorldFrame
|
2014-01-03 13:32:13 -05:00
|
|
|
break unless Dropper.drop()
|
2014-02-28 14:27:32 -05:00
|
|
|
if frameAdvanced and not worldFrameAdvanced
|
|
|
|
# We didn't end the above loop on an integer frame, so do the world state update.
|
|
|
|
@restoreWorldState()
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
# these are skipped for dropped frames
|
|
|
|
@updateState @currentFrame isnt oldFrame
|
2014-02-17 14:53:52 -05:00
|
|
|
@drawCurrentFrame e
|
2014-01-03 13:32:13 -05:00
|
|
|
@onFrameChanged()
|
2014-02-17 14:53:52 -05:00
|
|
|
@updatePaths() if (@totalFramesDrawn % 4) is 0 or createjs.Ticker.getMeasuredFPS() > createjs.Ticker.getFPS() - 5
|
2014-02-28 20:12:23 -05:00
|
|
|
Backbone.Mediator.publish('surface:ticked', {dt: 1 / @options.frameRate})
|
2014-01-03 13:32:13 -05:00
|
|
|
mib = @stage.mouseInBounds
|
|
|
|
if @mouseInBounds isnt mib
|
2014-06-30 22:16:26 -04:00
|
|
|
Backbone.Mediator.publish('surface:mouse-' + (if mib then 'over' else 'out'), {})
|
2014-01-03 13:32:13 -05:00
|
|
|
@mouseInBounds = mib
|
|
|
|
|
2014-02-28 14:27:32 -05:00
|
|
|
restoreWorldState: ->
|
2014-05-17 14:27:54 -04:00
|
|
|
frame = @world.getFrame(@getCurrentFrame())
|
|
|
|
frame.restoreState()
|
2014-08-22 20:11:40 -04:00
|
|
|
current = Math.max(0, Math.min(@currentFrame, @world.frames.length - 1))
|
|
|
|
if current - Math.floor(current) > 0.01 and Math.ceil(current) < @world.frames.length - 1
|
2014-02-17 14:53:52 -05:00
|
|
|
next = Math.ceil current
|
|
|
|
ratio = current % 1
|
|
|
|
@world.frames[next].restorePartialState ratio if next > 1
|
2014-05-17 14:27:54 -04:00
|
|
|
frame.clearEvents() if parseInt(@currentFrame) is parseInt(@lastFrame)
|
2014-07-13 14:13:26 -04:00
|
|
|
@spriteBoss.updateSounds() if parseInt(@currentFrame) isnt parseInt(@lastFrame)
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
updateState: (frameChanged) ->
|
2014-02-28 14:27:32 -05:00
|
|
|
# world state must have been restored in @restoreWorldState
|
2014-01-03 13:32:13 -05:00
|
|
|
@camera.updateZoom()
|
2014-08-22 00:23:45 -04:00
|
|
|
@spriteBoss.update frameChanged
|
2014-01-03 13:32:13 -05:00
|
|
|
@dimmer?.setSprites @spriteBoss.sprites
|
|
|
|
|
2014-02-17 14:53:52 -05:00
|
|
|
drawCurrentFrame: (e) ->
|
2014-01-03 13:32:13 -05:00
|
|
|
++@totalFramesDrawn
|
2014-02-17 14:53:52 -05:00
|
|
|
@stage.update e
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
# paths - TODO: move to SpriteBoss? but only update on frame drawing instead of on every frame update?
|
|
|
|
|
|
|
|
updatePaths: ->
|
|
|
|
return unless @options.paths
|
2014-02-24 17:40:28 -05:00
|
|
|
return if @casting
|
2014-01-03 13:32:13 -05:00
|
|
|
@hidePaths()
|
|
|
|
selectedThang = @spriteBoss.selectedSprite?.thang
|
|
|
|
return if @world.showPaths is 'never'
|
|
|
|
return if @world.showPaths is 'paused' and @playing
|
|
|
|
return if @world.showPaths is 'selected' and not selectedThang
|
|
|
|
@trailmaster ?= new path.Trailmaster @camera
|
2014-06-30 22:16:26 -04:00
|
|
|
selectedOnly = @playing and @world.showPaths is 'selected'
|
2014-01-03 13:32:13 -05:00
|
|
|
@paths = @trailmaster.generatePaths @world, @getCurrentFrame(), selectedThang, @spriteBoss.sprites, selectedOnly
|
|
|
|
@paths.name = 'paths'
|
2014-06-30 22:16:26 -04:00
|
|
|
@spriteBoss.spriteLayers['Path'].addChild @paths
|
2014-01-03 13:32:13 -05:00
|
|
|
|
|
|
|
hidePaths: ->
|
|
|
|
return if not @paths
|
|
|
|
@paths.parent.removeChild @paths
|
|
|
|
@paths = null
|
|
|
|
|
|
|
|
screenshot: (scale=0.25, format='image/jpeg', quality=0.8, zoom=2) ->
|
|
|
|
# Quality doesn't work with image/png, just image/jpeg and image/webp
|
|
|
|
[w, h] = [@camera.canvasWidth, @camera.canvasHeight]
|
|
|
|
margin = (1 - 1 / zoom) / 2
|
|
|
|
@stage.cache margin * w, margin * h, w / zoom, h / zoom, scale * zoom
|
|
|
|
imageData = @stage.cacheCanvas.toDataURL(format, quality)
|
2014-06-30 22:16:26 -04:00
|
|
|
#console.log 'Screenshot with scale', scale, 'format', format, 'quality', quality, 'was', Math.floor(imageData.length / 1024), 'kB'
|
|
|
|
screenshot = document.createElement('img')
|
2014-01-03 13:32:13 -05:00
|
|
|
screenshot.src = imageData
|
|
|
|
@stage.uncache()
|
|
|
|
imageData
|