Fix small bugs:

Player playing upon first load regardless of playback state
Having width and height swapped on one of the buildPlayer calls
Autofocus on room input

chube.py

@@ -64,15 +64,16 @@ class Chueue:
             return self.as_song(song_id, code)
 
     def set_repeat_enabled(self, enable, playback_song):
-        self._repeat_enabled = enable
-        if enable:
-            if playback_song is not None:
-                self._played_queue = [playback_song["id"]]
-                self._codes[playback_song["id"]] = playback_song["code"]
+        with self:
+            self._repeat_enabled = enable
+            if enable:
+                if playback_song is not None:
+                    self._played_queue = [playback_song["id"]]
+                    self._codes[playback_song["id"]] = playback_song["code"]
+                else:
+                    self._played_queue = []
             else:
-                self._played_queue = []
-        else:
-            self._played_queue = None
+                self._played_queue = None
 
     def is_repeat_enabled(self):
         return self._repeat_enabled

static/index.html

@@ -32,7 +32,7 @@
             <form class="mx-auto" id="roomInputForm">
                 <div class="form-group">
                     <label class="sr-only" for="roomInput">Room Input</label>
-                    <input class="form-control" id="roomInput" placeholder="Room"/>
+                    <input class="form-control" id="roomInput" placeholder="Room" autofocus/>
                 </div>
             </form>
         </div>

static/js/main.js

@@ -41,6 +41,10 @@ function onPlayerReady(event) {
     event.target.seekTo(0);
     if (state === PlayerState.PLAYING) {
         event.target.playVideo();
+    } else if (state === PlayerState.PAUSED) {
+        event.target.pauseVideo();
+    } else if (state === PlayerState.LIST_END) {
+        event.target.stopVideo();
     }
 }
 
@@ -171,7 +175,7 @@ function loadVideo(vid) {
     }
 
     if (player === null) {
-        buildPlayer(PLAYER_WIDTH, PLAYER_HEIGHT, vid.code);
+        buildPlayer(PLAYER_HEIGHT, PLAYER_WIDTH, vid.code);
     } else {
         player.cueVideoById(vid.code, 0);
     }
@@ -481,6 +485,9 @@ function mediaActionProcessor(ws, data) {
             } else {
                 videoPlaying = null;
                 state = PlayerState.LIST_END;
+                if (player) {
+                    player.stopVideo();
+                }
             }
         }
     } else if (action === MediaAction.REPEAT) {