Work on /multiplayer modal.

app/locale/en.coffee

@@ -15,6 +15,7 @@ module.exports = nativeDescription: "English", englishDescription: "English", tr
   modal:
     close: "Close"
     okay: "Okay"
+    so_ready: "I Am So Ready for This"
 
   not_found:
     page_not_found: "Page not found"

app/styles/bootstrap/_variables.scss

@@ -472,7 +472,7 @@ $modal-content-bg:                             none !default;
 $modal-content-border-color:                   transparent !default;
 $modal-content-fallback-border-color:          transparent !default;
 
-$modal-backdrop-bg:           transparent !default;
+$modal-backdrop-bg:           black !default;
 $modal-header-border-color:   transparent !default;
 $modal-footer-border-color:   $modal-header-border-color !default;
 

app/styles/home.sass

@@ -51,4 +51,16 @@
     &:hover img
       filter: brightness(1.1)
       -webkit-filter: brightness(1.1)
-  
+  
+#multiplayer-launch-modal
+  .modal-dialog
+    width: 700px
+
+  .modal-header
+    text-align: center
+
+  .modal-body
+    padding-bottom: 0px
+ 
+  .modal-footer
+    padding-top: 0px

app/templates/multiplayer_launch_modal.jade

@@ -1,13 +1,27 @@
 extends /templates/modal/modal_base
 
 block modal-header-content
-  h4 March 17th, 2014: Dungeon Arena
-  strong The new way to compete with code
+  h1 Introducing Dungeon Arena
+  em March 17, 2014: The new way to compete with code.
 
-block modal-body-content  
-  ul
-    li Code a hero to support your troops and destroy the enemy base. 
-      | Think DotA but with JavaScript.
-    li Rank your code against everyone else's, and climb the ladder as far as you can
-    li Rework and finetune your code to handle every strategy opponents will throw your way.
-    li Roll your own levels and heroes and see how they fare
+block modal-body-content
+
+  <iframe width="640" height="360" src="//www.youtube.com/embed/1zjaA13k-dA?rel=0&controls=0&modestbranding=1&showinfo=0&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>
+
+  h3 To Battle, Developers!
+
+  p You know how to code? That's badass. You're a modern-day sorcerer! Isn't about time that you used your magic coding powers to command your minions in epic combat? And we're not talking robots here.
+
+  p
+    strong CodeCombat head-to-head multiplayer arenas are here.
+    |  Choose your heroes, enchant your human or ogre armies, and climb your way over defeated fellow Wizards to reach the top of the ladders–then challenge your friends in our glorious, asynchronous multiplayer coding arenas. If you're feeling creative, you can even 
+    a(href="/editor/level/dungeon-arena") fork our arenas
+    |  and create your own worlds.
+
+  p
+    | JavaScript a bit rusty? Don't worry; there's a 
+    a(href="/play/level/dungeon-arena-tutorial") tutorial
+    | . New to programming? Hit our beginner campaign to skill up.
+
+block modal-footer-content
+  button.btn.btn-large.btn-success(type="button", data-dismiss="modal", aria-hidden="true", data-i18n="modal.so_ready") I Am So Ready for This

app/templates/play/ladder.jade

@@ -25,8 +25,11 @@ block content
             span= team.name
       div.column.col-md-2
     
-    hr
+    a(href="/play/spectate/#{level.get('slug')}").play-button.btn.btn-primary.center
+      span(data-i18n="play.spectate") Spectate
       
+    hr
+
     ul.nav.nav-pills
       li.active
         a(href="#ladder", data-toggle="tab", data-i18n="general.ladder") Ladder

app/views/multiplayer_view.coffee

@@ -6,6 +6,7 @@ module.exports = class MultiplayerLaunchView extends HomeView
   afterInsert: ->
     super()
     @openModalView(new MultiplayerLaunchModal())
-    
+
 class MultiplayerLaunchModal extends ModalView
-  template: modalTemplate
+  template: modalTemplate
+  id: "multiplayer-launch-modal"

app/views/play/level/level_loading_view.coffee

@@ -6,6 +6,12 @@ tips = [
   "Tip: you can shift+click a position on the map to insert it into the spell editor."
   "You can toggle play/paused with ctrl+p."
   "Pressing ctrl+[ and ctrl+] rewinds and fast-forwards."
+  "CodeCombat is 100% open source!"
+  "In the future, even babies will be Archmages."
+  "Loading will continue until morale improves."
+  "CodeCombat launched its beta in October, 2013."
+  "JavaScript is just the beginning."
+  "We believe in equal opportunities to learn programming for all species."
 ]
 
 module.exports = class LevelLoadingView extends View

app/views/play/spectate_view.coffee

@@ -77,7 +77,7 @@ module.exports = class SpectateLevelView extends View
     if options.spectateSessions
       @sessionOne = options.spectateSessions.sessionOne
       @sessionTwo = options.spectateSessions.sessionTwo
-      
+
     if not @sessionOne or not @sessionTwo
       @fetchRandomSessionPair (err, data) =>
         if err? then return console.log "There was an error fetching the random session pair: #{data}"
@@ -377,7 +377,9 @@ module.exports = class SpectateLevelView extends View
     worldBounds = @world.getBounds()
     bounds = [{x:worldBounds.left, y:worldBounds.top}, {x:worldBounds.right, y:worldBounds.bottom}]
     @surface.camera.setBounds(bounds)
-    @surface.camera.zoomTo({x:0, y:0}, 0.1, 0)
+    zoom = =>
+      @surface.camera.zoomTo({x: (worldBounds.right - worldBounds.left) / 2, y: (worldBounds.top - worldBounds.bottom) / 2}, 0.1, 0)
+    _.delay zoom, 4000  # call it later for some reason (TODO: figure this out)
 
   initGoalManager: ->
     @goalManager = new GoalManager(@world, @level.get('goals'))