From 7d077d543b76c14172a4cba4f946a850348a9ea2 Mon Sep 17 00:00:00 2001
From: Sam Potts <me@sampotts.me>
Date: Mon, 11 Jan 2016 00:07:13 +1100
Subject: Fullscreen fixes

---
 src/js/plyr.js     |  8 ++++++--
 src/less/plyr.less | 47 ++++++++++++++++++++++++-----------------------
 2 files changed, 30 insertions(+), 25 deletions(-)

(limited to 'src')

diff --git a/src/js/plyr.js b/src/js/plyr.js
index 6bcf38c5..daee06e6 100644
--- a/src/js/plyr.js
+++ b/src/js/plyr.js
@@ -1431,12 +1431,16 @@
 
         // Play media
         function _play() {
-            plyr.media.play();
+            if('play' in plyr.media) {
+                plyr.media.play();
+            }
         }
 
         // Pause media
         function _pause() {
-            plyr.media.pause();
+            if('pause' in plyr.media) {
+                plyr.media.pause();
+            }
         }
 
         // Toggle playback
diff --git a/src/less/plyr.less b/src/less/plyr.less
index f0222e67..1cadd0ab 100644
--- a/src/less/plyr.less
+++ b/src/less/plyr.less
@@ -624,41 +624,42 @@
         video {
             height: 100%;
         }
-        .plyr-video-wrapper {
+        .plyr__video-wrapper {
             height: 100%;
             width: 100%;
         }
-        .plyr-controls {
+        .plyr__controls {
             position: absolute;
             bottom: 0;
             left: 0;
             right: 0;
         }
+    }
 
-        // Hide controls when playing in full screen
-        &--fullscreen--hide-controls.plyr--playing {
-            .plyr__controls {
-                transform: translateY(100%) translateY(@control-spacing / 2);
-                transition: transform .3s .2s ease;
-            }
-            &.plyr--hover .plyr__controls {
-                transform: translateY(0);
-            }
-            .plyr__captions {
-                bottom: (@control-spacing / 2);
-                transition: bottom .3s .2s ease;
-            }
+    // Hide controls when playing in full screen
+    &--fullscreen--hide-controls.plyr--playing {
+        .plyr__controls {
+            transform: translateY(100%) translateY(@control-spacing / 2);
+            transition: transform .3s .2s ease;
+        }
+        &.plyr--hover .plyr__controls {
+            transform: translateY(0);
+        }
+        .plyr__captions {
+            bottom: (@control-spacing / 2);
+            transition: bottom .3s .2s ease;
         }
+    }
 
-        // Captions
-        .plyr__captions,
-        &--fullscreen--hide-controls.plyr--playing.plyr--hover .plyr__captions {
-            top: auto;
-            bottom: 90px;
+    // Captions
+    &--fullscreen .plyr__captions,
+    &--fullscreen-active .plyr__captions,
+    &--fullscreen--hide-controls.plyr--playing.plyr--hover .plyr__captions {
+        top: auto;
+        bottom: 90px;
 
-            @media (min-width: @bp-control-split) {
-                bottom: 60px;
-            }
+        @media (min-width: @bp-control-split) {
+            bottom: 60px;
         }
     }
 
-- 
cgit v1.2.3