Event overview stage - Adjusted video player implementation

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/overview/EventOverviewStage.java

@@ -41,10 +41,10 @@ public class EventOverviewStage extends Composite implements RefreshableWidget<E
         
         EventOverviewStageContentDTO data = stageData.getStageContent();
         if(data instanceof EventOverviewVideoStageDTO) {
-            if(!(lastContent instanceof Video)) {
+            if(!(lastContent instanceof Video) || ((Video) lastContent).shouldBeReplaced(((EventOverviewVideoStageDTO) data).getSource())) {
                 lastContent = new Video();
-            }
-            ((Video)lastContent).setData((EventOverviewVideoStageDTO) data);
+                ((Video)lastContent).setData((EventOverviewVideoStageDTO) data);
+            } 
         } else if (data instanceof EventOverviewTickerStageDTO) {
             if (!(lastContent instanceof Countdown)) {
                 lastContent = new Countdown(presenter);

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/partials/video/Video.java

@@ -1,6 +1,7 @@
 package com.sap.sailing.gwt.home.client.place.event.partials.video;
 
 import com.google.gwt.core.client.GWT;
+import com.google.gwt.dom.client.Style.Unit;
 import com.google.gwt.uibinder.client.UiBinder;
 import com.google.gwt.uibinder.client.UiField;
 import com.google.gwt.user.client.ui.Composite;
@@ -15,14 +16,26 @@ public class Video extends Composite {
     interface LivestreamUiBinder extends UiBinder<Widget, Video> {
     }
     
+    private String source;
     @UiField(provided = true) VideoJSPlayer videoPlayer = new VideoJSPlayer(false, false);
 
     public Video() {
         VideoResources.INSTANCE.css().ensureInjected();
         initWidget(uiBinder.createAndBindUi(this));
+        videoPlayer.getVideoElement().addClassName(VideoResources.INSTANCE.css().videoplaceholder_image());
+        videoPlayer.getVideoElement().getStyle().setPaddingTop(0, Unit.PX);
     }
 
     public void setData(EventOverviewVideoStageDTO data) {
-        videoPlayer.setSource(data.getSource(), data.getMimeType());
+        this.source = data.getSource();
+        videoPlayer.setSource(source, data.getMimeType());
+    }
+    
+    public boolean shouldBeReplaced(String newSource) {
+        return (videoPlayer == null || source == null || (!source.equals(newSource) && canCurrentVideoBeReplaced()));
+    }
+    
+    private boolean canCurrentVideoBeReplaced() {
+        return !videoPlayer.isFullscreen() || videoPlayer.paused();
     }
 }

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/partials/video/Video.ui.xml

@@ -5,17 +5,12 @@
     <ui:with field="i18n_ubi" type="com.sap.sailing.gwt.common.client.i18n.TextMessages"/>
 	<ui:with field="res" type="com.sap.sailing.gwt.common.client.SharedResources" />
   <ui:with field="local_res" type="com.sap.sailing.gwt.home.client.place.event.partials.video.VideoResources" />
-  <ui:style>
-  	.video-js-customsize {
-		padding-top: 0;
-	}
-  </ui:style>
   <g:HTMLPanel>
     <div class="{local_res.css.video}">
       <div class="{local_res.css.video_content}">
         <div class="{local_res.css.video_content_item} {local_res.css.videoitem}">
           <div class="{local_res.css.videoplaceholder} {res.mediaCss.small12}">
-          	<v:VideoJSPlayer addStyleNames="{local_res.css.videoplaceholder_image} {style.video-js-customsize}" ui:field="videoPlayer"/>
+          	<v:VideoJSPlayer addStyleNames="{local_res.css.videoplaceholder_image}" ui:field="videoPlayer"/>
           </div>
         </div>
       </div>

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/client/media/VideoJSPlayer.java

@@ -59,7 +59,11 @@ public class VideoJSPlayer extends Widget {
             videoElement.appendChild(se);
         }
     }
-
+    
+    public VideoElement getVideoElement() {
+        return videoElement;
+    }
+    
     @Override
     protected void onLoad() {
         _onLoad(autoplay);
@@ -91,7 +95,25 @@ public class VideoJSPlayer extends Widget {
     public native void setCurrentTime(int currentTime) /*-{
 	return this.@com.sap.sailing.gwt.ui.client.media.VideoJSPlayer::player.currentTime(currentTime);
     }-*/;
+    
+    /**
+     * Check whether or not the player is running in full screen mode
+     * 
+     * @return <code>true</code> if the player is running in full screen mode, <code>false</code> otherwise
+     */
+    public native boolean isFullscreen() /*-{
+	return this.@com.sap.sailing.gwt.ui.client.media.VideoJSPlayer::player.isFullscreen();
+    }-*/;
 
+    /**
+     * Check whether the player is currently paused or playing.
+     * 
+     * @return <code>true</code> if the player is paused, <code>false</code> if it is playing
+     */
+    public native boolean paused() /*-{
+	return this.@com.sap.sailing.gwt.ui.client.media.VideoJSPlayer::player.paused();
+    }-*/;
+    
     /**
      * JSNI wrapper that does setup the video player
      *
@@ -114,5 +136,10 @@ public class VideoJSPlayer extends Widget {
 	    });
 	this.@com.sap.sailing.gwt.ui.client.media.VideoJSPlayer::player = player;
     }-*/;
+    
+    native void _onUnload() /*-{
+       var player = this.@com.sap.sailing.gwt.ui.client.media.VideoJSPlayer::player;
+       player.dispose();     
+    }-*/;
 
 }

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/client/media/VideoJSPlayer.ui.xml

@@ -16,5 +16,7 @@
 			content: "" !important;
 		}
 	</ui:style>
-	<video class="video-js vjs-default-skin vjs-big-play-centered" ui:field="videoElement"></video>
+	<div>
+		<video class="video-js vjs-default-skin vjs-big-play-centered" ui:field="videoElement"></video>
+	</div>
 </ui:UiBinder>