From 972da0ab50ae73b8d31853461d413fc3595b15f4 Mon Sep 17 00:00:00 2001
From: Ian Gulliver <ian@flamingcow.tv>
Date: Sat, 21 Nov 2015 10:45:15 -0800
Subject: [PATCH] Add another container around the player to move back toward
 multi-player support.

---
 static/clicks.css | 16 ++++++++++------
 static/clicks.js  |  4 +++-
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/static/clicks.css b/static/clicks.css
index 7e1e7bd..78bf1eb 100644
--- a/static/clicks.css
+++ b/static/clicks.css
@@ -277,7 +277,7 @@
   font-family: "source-code-pro";
 }
 
-.clicks-player-container {
+.clicks-players-container {
   position: absolute;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -286,14 +286,18 @@
   left: 0;
   right: 0;
   bottom: 0;
-#  TODO(flamingcow): How do we center this?
-#  display: flex;
-#  align-items: center;
-#  justify-content: center;
-  overflow: scroll;
   background-color: black;
 }
 
+.clicks-player-container {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: scroll;
+}
+
 .clicks-player-crop {
 }
 
diff --git a/static/clicks.js b/static/clicks.js
index c67b4f8..a987213 100644
--- a/static/clicks.js
+++ b/static/clicks.js
@@ -374,8 +374,10 @@ Clicks.prototype.buildUI_ = function() {
     }
   }
 
+  this.playersContainer_ = this.createElementAndAppend_(
+      'clicks-players-container', this.container_);
   var playerContainer = this.createElementAndAppend_(
-      'clicks-player-container', this.container_);
+      'clicks-player-container', this.playersContainer_);
   this.playerCrop_ = this.createElementAndAppend_(
       'clicks-player-crop', playerContainer);
   this.playerScale_ = this.createElementAndAppend_(