Apply MediaHubButtons to VideoPlayer

Change-Id: Icad1b7c9ba8ada2eb62ae703bd83445ea25bcb65

diff --git a/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml b/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml
index ad1b733..cbac6a4 100644 (file)
--- a/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml
+++ b/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml
@@ -13,4 +13,12 @@
          HorizontalOptions="Center"
          Aspect="AspectFit"
          Opacity="0" />
-</Grid>
\ No newline at end of file
+  <Image x:Name="BtnIcon"
+       Grid.Row="0" Grid.Column="0"
+       VerticalOptions="Center"
+       HorizontalOptions="Center"
+       Aspect="AspectFit" />
+  <Button x:Name="Btn"
+       Grid.Row="0" Grid.Column="0"
+       Opacity="0" />
+ </Grid>

diff --git a/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml.cs
index 0723f7d..7e8df5b 100644 (file)
--- a/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Controls/MediaHubButton.xaml.cs
@@ -22,16 +22,28 @@ namespace TVMediaHub.Tizen.Controls
     public partial class MediaHubButton : Grid
     {
         public event EventHandler Clicked;
-        public Image Icon = null;
-        public Button btn = null;
         int effectDuration = 250;
 
         private static bool isButtonRunning = false;
 
-        public string Param
+        public string MediaHubButtonIcon
         {
-            get;
-            set;
+            get
+            {
+                return (BtnIcon.Source as FileImageSource).File;
+            }
+            set
+            {
+                BtnIcon.Source = value;
+            }
+        }
+
+        public Button MediaHubButtonBtn
+        {
+            get
+            {
+                return Btn;
+            }
         }
 
         public string NormalImage
@@ -50,20 +62,13 @@ namespace TVMediaHub.Tizen.Controls
         {
             InitializeComponent();
 
-            initializeIcon();
             initializeButton();
             initializeFocuseBG();
         }
 
         private void initializeButton()
         {
-            btn = new Button()
-            {
-                Opacity = 0,
-            };
-            Children.Add(btn, 0, 0);
-
-            btn.Clicked += async (s, e) =>
+            Btn.Clicked += async (s, e) =>
             {
                 if (isButtonRunning)
                 {
@@ -72,42 +77,31 @@ namespace TVMediaHub.Tizen.Controls
 
                 isButtonRunning = true;
 
-                Clicked?.Invoke(this, EventArgs.Empty);
-
 #pragma warning disable CS4014
-                Icon.Source = PressedImage;
+                BtnIcon.Source = PressedImage;
                 BG.ScaleTo(0.1, Convert.ToUInt32(effectDuration));
                 await BG.FadeTo(0, Convert.ToUInt32(effectDuration));
 
-                Icon.Source = NormalImage;
+                BtnIcon.Source = NormalImage;
                 BG.ScaleTo(1, Convert.ToUInt32(effectDuration));
                 await BG.FadeTo(1, Convert.ToUInt32(effectDuration));
 #pragma warning restore CS4014
 
-                isButtonRunning = false;
-            };
-        }
+                Clicked?.Invoke(this, EventArgs.Empty);
 
-        private void initializeIcon()
-        {
-            Icon = new Image()
-            {
-                VerticalOptions = LayoutOptions.Center,
-                HorizontalOptions = LayoutOptions.Center,
-                Aspect = Aspect.AspectFit,
+                isButtonRunning = false;
             };
-            Children.Add(Icon, 0, 0);
         }
 
         private void initializeFocuseBG()
         {
-            btn.Focused += (s, e) =>
+            Btn.Focused += (s, e) =>
             {
                 BG.ScaleTo(1, Convert.ToUInt32(effectDuration));
                 BG.FadeTo(1, Convert.ToUInt32(effectDuration));
             };
 
-            btn.Unfocused += (s, e) =>
+            Btn.Unfocused += (s, e) =>
             {
                 BG.ScaleTo(0.1, Convert.ToUInt32(effectDuration));
                 BG.FadeTo(0, Convert.ToUInt32(effectDuration));
@@ -116,7 +110,7 @@ namespace TVMediaHub.Tizen.Controls
 
         public void OnButtonPressed()
         {
-            Icon.Source = PressedImage;
+            BtnIcon.Source = PressedImage;
 
             BG.ScaleTo(0.1, Convert.ToUInt32(effectDuration));
             BG.FadeTo(0, Convert.ToUInt32(effectDuration));
@@ -124,7 +118,7 @@ namespace TVMediaHub.Tizen.Controls
 
         public void OnButtonReleased()
         {
-            Icon.Source = NormalImage;
+            BtnIcon.Source = NormalImage;
 
             BG.ScaleTo(1, Convert.ToUInt32(effectDuration));
             BG.FadeTo(1, Convert.ToUInt32(effectDuration));

diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/ImageViewer.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/ImageViewer.xaml.cs
index b7a2773..ea8baaa 100755 (executable)
--- a/TVMediaHub/TVMediaHub.Tizen/Views/ImageViewer.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/ImageViewer.xaml.cs
@@ -256,7 +256,7 @@ namespace TVMediaHub.Tizen.Views
             {
                 buttons[i].NormalImage = iconPath.Replace("rotate", icons[i]);
                 buttons[i].PressedImage = buttons[i].NormalImage.Replace("normal", "pressed");
-                buttons[i].Icon.Source = buttons[i].NormalImage;
+                buttons[i].MediaHubButtonIcon = buttons[i].NormalImage;
             }
         }
 
@@ -497,23 +497,23 @@ namespace TVMediaHub.Tizen.Views
         {
             base.OnAppearing();
 
-            RotateBtn.btn.On<Tizen>().SetNextFocusLeftView(RotateBtn.btn);
-            RotateBtn.btn.On<Tizen>().SetNextFocusRightView(ZoomBtn.btn);
+            RotateBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(RotateBtn.MediaHubButtonBtn);
+            RotateBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(ZoomBtn.MediaHubButtonBtn);
 
-            ZoomBtn.btn.On<Tizen>().SetNextFocusLeftView(RotateBtn.btn);
-            ZoomBtn.btn.On<Tizen>().SetNextFocusRightView(LeftBtn.btn);
+            ZoomBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(RotateBtn.MediaHubButtonBtn);
+            ZoomBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(LeftBtn.MediaHubButtonBtn);
 
-            LeftBtn.btn.On<Tizen>().SetNextFocusLeftView(ZoomBtn.btn);
-            LeftBtn.btn.On<Tizen>().SetNextFocusRightView(RightBtn.btn);
+            LeftBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(ZoomBtn.MediaHubButtonBtn);
+            LeftBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(RightBtn.MediaHubButtonBtn);
 
-            RightBtn.btn.On<Tizen>().SetNextFocusLeftView(LeftBtn.btn);
-            RightBtn.btn.On<Tizen>().SetNextFocusRightView(SlideShowBtn.btn);
+            RightBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(LeftBtn.MediaHubButtonBtn);
+            RightBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(SlideShowBtn.MediaHubButtonBtn);
 
-            SlideShowBtn.btn.On<Tizen>().SetNextFocusLeftView(RightBtn.btn);
-            SlideShowBtn.btn.On<Tizen>().SetNextFocusRightView(OptionBtn.btn);
+            SlideShowBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(RightBtn.MediaHubButtonBtn);
+            SlideShowBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(OptionBtn.MediaHubButtonBtn);
 
-            OptionBtn.btn.On<Tizen>().SetNextFocusLeftView(SlideShowBtn.btn);
-            OptionBtn.btn.On<Tizen>().SetNextFocusRightView(OptionBtn.btn);
+            OptionBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(SlideShowBtn.MediaHubButtonBtn);
+            OptionBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(OptionBtn.MediaHubButtonBtn);
         }
 
         protected override bool OnBackButtonPressed()

diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/SimpleImageViewer.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/SimpleImageViewer.xaml.cs
index e2f73fa..9b1baed 100644 (file)
--- a/TVMediaHub/TVMediaHub.Tizen/Views/SimpleImageViewer.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/SimpleImageViewer.xaml.cs
@@ -15,7 +15,6 @@
  */
 
 using System;
-using System.Collections.Generic;
 using System.Windows.Input;
 using Tizen.Xamarin.Forms.Extension;
 using TVMediaHub.Tizen.Controls;
@@ -28,6 +27,7 @@ using Xamarin.Forms.PlatformConfiguration.TizenSpecific;
 namespace TVMediaHub.Tizen.Views
 {
     using Tizen = Xamarin.Forms.PlatformConfiguration.Tizen;
+
     public partial class SimpleImageViewer : ContentPageEx
     {
         private bool isRotationRunning;
@@ -155,7 +155,7 @@ namespace TVMediaHub.Tizen.Views
             {
                 buttons[i].NormalImage = iconPath.Replace("rotate", icons[i]);
                 buttons[i].PressedImage = buttons[i].NormalImage.Replace("normal", "pressed");
-                buttons[i].Icon.Source = buttons[i].NormalImage;
+                buttons[i].MediaHubButtonIcon = buttons[i].NormalImage;
             }
         }
 
@@ -377,34 +377,29 @@ namespace TVMediaHub.Tizen.Views
             GradientDim.WidthRequest = width;
         }
 
-        protected override void OnAppearing()
+        protected override void InitializePage()
         {
-            base.OnAppearing();
-
-            RotateBtn.btn.On<Tizen>().SetNextFocusLeftView(RotateBtn.btn);
-            RotateBtn.btn.On<Tizen>().SetNextFocusRightView(ZoomBtn.btn);
+            DbgPort.D("Initialize Page");
 
-            ZoomBtn.btn.On<Tizen>().SetNextFocusLeftView(RotateBtn.btn);
-            ZoomBtn.btn.On<Tizen>().SetNextFocusRightView(LeftBtn.btn);
+            RotateBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(RotateBtn.MediaHubButtonBtn);
+            RotateBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(ZoomBtn.MediaHubButtonBtn);
 
-            LeftBtn.btn.On<Tizen>().SetNextFocusLeftView(ZoomBtn.btn);
-            LeftBtn.btn.On<Tizen>().SetNextFocusRightView(RightBtn.btn);
+            ZoomBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(RotateBtn.MediaHubButtonBtn);
+            ZoomBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(LeftBtn.MediaHubButtonBtn);
 
-            RightBtn.btn.On<Tizen>().SetNextFocusLeftView(LeftBtn.btn);
-            RightBtn.btn.On<Tizen>().SetNextFocusRightView(SlideShowBtn.btn);
+            LeftBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(ZoomBtn.MediaHubButtonBtn);
+            LeftBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(RightBtn.MediaHubButtonBtn);
 
-            SlideShowBtn.btn.On<Tizen>().SetNextFocusLeftView(RightBtn.btn);
-            SlideShowBtn.btn.On<Tizen>().SetNextFocusRightView(OptionBtn.btn);
+            RightBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(LeftBtn.MediaHubButtonBtn);
+            RightBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(SlideShowBtn.MediaHubButtonBtn);
 
-            OptionBtn.btn.On<Tizen>().SetNextFocusLeftView(SlideShowBtn.btn);
-            OptionBtn.btn.On<Tizen>().SetNextFocusRightView(OptionBtn.btn);
-        }
+            SlideShowBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(RightBtn.MediaHubButtonBtn);
+            SlideShowBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(OptionBtn.MediaHubButtonBtn);
 
-        protected override void InitializePage()
-        {
-            DbgPort.D("Initialize Page");
+            OptionBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(SlideShowBtn.MediaHubButtonBtn);
+            OptionBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(OptionBtn.MediaHubButtonBtn);
 
-            RotateBtn.btn.Focus();
+            RotateBtn.MediaHubButtonBtn.Focus();
         }
 
         protected override void FinalizePage()

diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml b/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml
index 4c6f5ce..408aa95 100755 (executable)
--- a/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml
@@ -1,265 +1,224 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <mh:ContentPageEx xmlns="http://xamarin.com/schemas/2014/forms"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="TVMediaHub.Tizen.Views.VideoPlayer"
-             xmlns:mh="clr-namespace:TVMediaHub.Tizen.Controls"
-             xmlns:Utils="clr-namespace:TVMediaHub.Tizen.Utils"
-             xmlns:ViewModels="clr-namespace:TVMediaHub.Tizen.ViewModels"
-             xmlns:Controls="clr-namespace:TVMediaHub.Tizen.Controls"
-             CurrentVideo="{Binding CurrentVideo}">
+                  xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+                  x:Class="TVMediaHub.Tizen.Views.VideoPlayer"
+                  xmlns:mh="clr-namespace:TVMediaHub.Tizen.Controls"
+                  xmlns:Utils="clr-namespace:TVMediaHub.Tizen.Utils"
+                  xmlns:ViewModels="clr-namespace:TVMediaHub.Tizen.ViewModels"
+                  xmlns:Controls="clr-namespace:TVMediaHub.Tizen.Controls"
+                  CurrentVideo="{Binding CurrentVideo}">
   <RelativeLayout>
     <!--TODO : It should be changed to MediaView -->
     <Image x:Name="Thumbnail"
-              RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
-              RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-              RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
-              RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
-              Source="{Binding CurrentVideo.ThumbnailPath}"
-              Aspect="AspectFill"/>
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
+           Source="{Binding CurrentVideo.ThumbnailPath}"
+           Aspect="AspectFill"/>
     <Utils:NinePatch x:Name="GradientDim"
-              VerticalOptions="Center"
-              HorizontalOptions="Center"
-              Aspect="Fill"
-              BorderLeft="20"
-              BorderTop="20"
-              BorderRight="20"
-              BorderBottom="20"
-              Source="img_gradient_topbottom.9.png" />
-    <Grid x:Name="MainGrid"
-              RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
-              RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-              RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
-              RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}" >
-      <Grid.RowDefinitions>
-        <RowDefinition Height="062960*" />
-        <RowDefinition Height="046300*" />
-        <RowDefinition Height="753704*" />
-        <RowDefinition Height="003704*" />
-        <RowDefinition Height="044444*" />
-        <RowDefinition Height="044444*" />
-        <RowDefinition Height="044444*" />
-      </Grid.RowDefinitions>
-      <Grid.RowSpacing>0</Grid.RowSpacing>
-      <Grid.ColumnDefinitions>
-        <ColumnDefinition Width="050000*" />
-        <ColumnDefinition Width="127083*" />
-        <ColumnDefinition Width="164583*" />
-        <ColumnDefinition Width="315625*" />
-        <ColumnDefinition Width="270833*" />
-        <ColumnDefinition Width="021875*" />
-        <ColumnDefinition Width="050000*" />
-      </Grid.ColumnDefinitions>
-      <Grid.ColumnSpacing>0</Grid.ColumnSpacing>
-      <Label Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="5" x:Name="TitleLabel"
-             Text="{Binding CurrentVideo.Title}" FontFamily="BreezeSans" TextColor="White" HorizontalTextAlignment="Start"/>
-
-      <Utils:NinePatch x:Name="Track" Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="5"
-              VerticalOptions="Center"
-              HorizontalOptions="Center"
-              Aspect="Fill"
-              BorderLeft="1"
-              BorderTop="1"
-              BorderRight="1"
-              BorderBottom="1"
-              Source="img_viewer_progress.9.png" />
-      <Utils:NinePatch x:Name="ProgressBarTemp" Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="5"
-              VerticalOptions="Center"
-              HorizontalOptions="Start"
-              Aspect="Fill"
-              BorderLeft="1"
-              BorderTop="1"
-              BorderRight="1"
-              BorderBottom="1"
-              Source="img_viewer_progress.9.png" />
-
-      <Grid Grid.Row="5" Grid.Column="1" x:Name="RunningTimeGrid" >
-        <Grid.RowDefinitions>
-          <RowDefinition Height="*" />
-        </Grid.RowDefinitions>
-        <Grid.ColumnDefinitions>
-          <ColumnDefinition Width="442623*" />
-          <ColumnDefinition Width="114754*" />
-          <ColumnDefinition Width="442623*" />
-        </Grid.ColumnDefinitions>
-        <Grid.ColumnSpacing>0</Grid.ColumnSpacing>
-
-        <Grid Grid.Row="0" Grid.Column="0" x:Name="PlayTime">
-          <Grid.RowDefinitions>
-            <RowDefinition Height="*" />
-          </Grid.RowDefinitions>
-          <Grid.ColumnDefinitions>
-            <ColumnDefinition Width="296296*" />
-            <ColumnDefinition Width="055556*" />
-            <ColumnDefinition Width="296296*" />
-            <ColumnDefinition Width="055556*" />
-            <ColumnDefinition Width="296296*" />
-          </Grid.ColumnDefinitions>
-          <Grid.ColumnSpacing>0</Grid.ColumnSpacing>
-
-          <Label Grid.Row="0" Grid.Column="0" x:Name="PlayTimeHr" Text="00" FontFamily="Breeze Sans Regular" TextColor="#0081c6"/>
-          <Label Grid.Row="0" Grid.Column="1" x:Name="PlayTimeColon" Text=":" FontFamily="Breeze Sans Regular" TextColor="#0081c6"/>
-          <Label Grid.Row="0" Grid.Column="2" x:Name="PlayTimeMin" Text="28" FontFamily="Breeze Sans Regular" TextColor="#0081c6"/>
-          <Label Grid.Row="0" Grid.Column="3" x:Name="PlayTimeColon2" Text=":" FontFamily="Breeze Sans Regular" TextColor="#0081c6"/>
-          <Label Grid.Row="0" Grid.Column="4" x:Name="PlayTimeSec" Text="30" FontFamily="Breeze Sans Regular" TextColor="#0081c6"/>
-        </Grid>
-
-        <Grid Grid.Row="0" Grid.Column="2" x:Name="RemainTime" >
-          <Grid.RowDefinitions>
-            <RowDefinition Height="*" />
-          </Grid.RowDefinitions>
-          <Grid.ColumnDefinitions>
-            <ColumnDefinition Width="296296*" />
-            <ColumnDefinition Width="055556*" />
-            <ColumnDefinition Width="296296*" />
-            <ColumnDefinition Width="055556*" />
-            <ColumnDefinition Width="296296*" />
-          </Grid.ColumnDefinitions>
-          <Grid.ColumnSpacing>0</Grid.ColumnSpacing>
-
-          <Label Grid.Row="0" Grid.Column="0" x:Name="RemainTimeHr" Text="01" FontFamily="Breeze Sans Light" TextColor="#A5A5A5"/>
-          <Label Grid.Row="0" Grid.Column="1" x:Name="RemainTimeColon" Text=":" FontFamily="Breeze Sans Light" TextColor="#A5A5A5"/>
-          <Label Grid.Row="0" Grid.Column="2" x:Name="RemainTimeMin" Text="30" FontFamily="Breeze Sans Light" TextColor="#A5A5A5"/>
-          <Label Grid.Row="0" Grid.Column="3" x:Name="RemainTimeColon2" Text=":" FontFamily="Breeze Sans Light" TextColor="#A5A5A5"/>
-          <Label Grid.Row="0" Grid.Column="4" x:Name="RemainTimeSec" Text="17" FontFamily="Breeze Sans Light" TextColor="#A5A5A5"/>
-        </Grid>
-      </Grid>
-
-      <Grid Grid.Row="4" Grid.RowSpan="3" Grid.Column="3" x:Name="ButtonIconGrid">
-        <Grid.RowDefinitions>
-          <RowDefinition Height="*" />
-        </Grid.RowDefinitions>
-        <Grid.RowSpacing>0</Grid.RowSpacing>
-        <Grid.ColumnDefinitions>
-          <ColumnDefinition Width="0198019*" />
-          <ColumnDefinition Width="0792079*" />
-          <ColumnDefinition Width="0824742*" />
-          <ColumnDefinition Width="0792079*" />
-          <ColumnDefinition Width="0824743*" />
-          <ColumnDefinition Width="0792079*" />
-          <ColumnDefinition Width="0824742*" />
-          <ColumnDefinition Width="0792079*" />
-          <ColumnDefinition Width="0824743*" />
-          <ColumnDefinition Width="0792079*" />
-          <ColumnDefinition Width="0198019*" />
-        </Grid.ColumnDefinitions>
-        <Grid.ColumnSpacing>0</Grid.ColumnSpacing>
-
-        <Image Grid.Row="0" Grid.Column="1" x:Name="Previous" Source="btn_viewer_control_focused.png" Opacity="0"/>
-        <Button Grid.Row="0" Grid.Column="1" x:Name="PreviousBtn" Opacity="0"/>
-        <Controls:CustomImageButton x:Name="PreviousImage"
-                                    Type="Viewer" SubType="Previous"
-                                    Grid.Row="0" Grid.Column="1"
-                                    Source="btn_viewer_control_previous_normal.png" />
-
-        <Image Grid.Row="0" Grid.Column="3" x:Name="Rewind" Source="btn_viewer_control_focused.png" Opacity="0"/>
-        <Button Grid.Row="0" Grid.Column="3" x:Name="RewindBtn" Opacity="0"/>
-        <Controls:CustomImageButton x:Name="RewindImage"
-                                    Type="Viewer" SubType="Rewind"
-                                    Grid.Row="0" Grid.Column="3"
-                                    Source="btn_viewer_control_rewind_normal.png" />
-
-        <Image Grid.Row="0" Grid.Column="5" x:Name="PausePlay" Source="btn_viewer_control_focused.png" Opacity="0"/>
-        <Button Grid.Row="0" Grid.Column="5" x:Name="PausePlayBtn" Opacity="0"/>
-        <Controls:CustomImageButton x:Name="PausePlayImage"
-                                    Type="Viewer" SubType="Pause"
-                                    Grid.Row="0" Grid.Column="5"
-                                    Source="btn_viewer_control_pause_normal.png" />
-
-        <Image Grid.Row="0" Grid.Column="7" x:Name="Forward" Source="btn_viewer_control_focused.png" Opacity="0"/>
-        <Button Grid.Row="0" Grid.Column="7" x:Name="ForwardBtn" Opacity="0"/>
-        <Controls:CustomImageButton x:Name="ForwardImage"
-                                    Type="Viewer" SubType="Forward"
-                                    Grid.Row="0" Grid.Column="7"
-                                    Source="btn_viewer_control_forward_normal.png" />
-
-        <Image Grid.Row="0" Grid.Column="9" x:Name="Next" Source="btn_viewer_control_focused.png" Opacity="0"/>
-        <Button Grid.Row="0" Grid.Column="9" x:Name="NextBtn" Opacity="0"/>
-        <Controls:CustomImageButton x:Name="NextImage"
-                                    Type="Viewer" SubType="Next"
-                                    Grid.Row="0" Grid.Column="9"
-                                    Source="btn_viewer_control_next_normal.png" />
-
-      </Grid>
-
-      <Image Grid.Row="4" Grid.RowSpan="3" Grid.Column="5" x:Name="OptionBg" Source="btn_viewer_control_focused.png" Opacity="0"/>
-      <Button Grid.Row="4" Grid.RowSpan="3" Grid.Column="5" x:Name="OptionBtn" Opacity="0"/>
-      <Controls:CustomImageButton x:Name="OptionIcon"
-                                    Type="Viewer" SubType="Option"
-                                    Grid.Row="4" Grid.RowSpan="3" Grid.Column="5"
-                                    Source="btn_viewer_control_option_normal.png" />
-    </Grid>
-
-    <StackLayout x:Name="OptionMenu" IsVisible="False" Orientation="Vertical"
-              RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.133333}"
-              RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.15625}"
-              RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.696296}"
-              RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.79375}"
-              Spacing="0,0,0,0">
-      <Button x:Name="ScreenRateBtn"
-              Clicked="OnScreenRateBtnClicked"
-              Text="SCREEN RATE"
-              FontFamily="BreezeSans"/>
-
-      <Button x:Name="SoundEffectBtn"
-              Clicked="OnSoundEffectBtnClicked"
-              Text="SOUND EFFECT"
-              FontFamily="BreezeSans"/>
-    </StackLayout>
-
-    <StackLayout x:Name="ScreenRateOption" IsVisible="False" Orientation="Vertical"
-              RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.266667}"
-              RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.15625}"
-              RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.562963}"
-              RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.79375}"
-              Spacing="0,0,0,0">
-      <Button x:Name="ScreenRateTitle"
-              IsEnabled="false"
-              Text="SCREEN RATE"
-              TextColor="#0081c6"
-              FontFamily="BreezeSans"/>
-
-      <Button x:Name="ScreenRateOriginal"
-              Text="ORIGINAL"
-              FontFamily="BreezeSans"/>
-
-      <Button x:Name="ScreenRate169"
-              Text="16:9"
-              FontFamily="BreezeSans"/>
-
-      <Button x:Name="ScreenRate64"
-              Text="6:4"
-              FontFamily="BreezeSans"/>
-    </StackLayout>
+                     VerticalOptions="Center"
+                     HorizontalOptions="Center"
+                     Aspect="Fill"
+                     BorderLeft="20"
+                     BorderTop="20"
+                     BorderRight="20"
+                     BorderBottom="20"
+                     Source="img_gradient_topbottom.9.png" />
+
+    <Label x:Name="TitleLabel"
+           Text="{Binding CurrentVideo.Title}"
+           FontFamily="BreezeSans"
+           TextColor="White"
+           HorizontalTextAlignment="Start"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.0463}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.9}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.063}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.05}" />
+
+    <Utils:NinePatch x:Name="Track"
+                     VerticalOptions="Center"
+                     HorizontalOptions="Center"
+                     Aspect="Fill"
+                     BorderLeft="1"
+                     BorderTop="1"
+                     BorderRight="1"
+                     BorderBottom="1"
+                     Source="img_viewer_progress.9.png"
+                     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.0037}"
+                     RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.9}"
+                     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8630}"
+                     RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.05}" />
+    <Utils:NinePatch x:Name="ProgressBarTemp"
+                     VerticalOptions="Center"
+                     HorizontalOptions="Start"
+                     Aspect="Fill"
+                     BorderLeft="1"
+                     BorderTop="1"
+                     BorderRight="1"
+                     BorderBottom="1"
+                     Source="img_viewer_progress.9.png"
+                     RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.0037}"
+                     RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.9}"
+                     RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8630}"
+                     RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.05}" />
+
+
+    <Label x:Name="PlayTimeHr"
+           Text="00"
+           FontFamily="Breeze Sans Regular"
+           TextColor="#0081c6"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.05}" />
+    <Label x:Name="PlayTimeColon"
+           Text=":"
+           FontFamily="Breeze Sans Regular"
+           TextColor="#0081c6"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0666}" />
+    <Label x:Name="PlayTimeMin"
+           Text="28"
+           FontFamily="Breeze Sans Regular"
+           TextColor="#0081c6"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0698}" />
+    <Label x:Name="PlayTimeColon2"
+           Text=":"
+           FontFamily="Breeze Sans Regular"
+           TextColor="#0081c6"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0864}" />
+    <Label x:Name="PlayTimeSec"
+           Text="30"
+           FontFamily="Breeze Sans Regular"
+           TextColor="#0081c6"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0906}" />
+
+    <Label x:Name="RemainTimeHr"
+           Text="01"
+           FontFamily="Breeze Sans Light"
+           TextColor="#A5A5A5"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1218}" />
+    <Label x:Name="RemainTimeColon"
+           Text=":"
+           FontFamily="Breeze Sans Light"
+           TextColor="#A5A5A5"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1385}" />
+    <Label x:Name="RemainTimeMin"
+           Text="30"
+           FontFamily="Breeze Sans Light"
+           TextColor="#A5A5A5"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1416}" />
+    <Label x:Name="RemainTimeColon2"
+           Text=":"
+           FontFamily="Breeze Sans Light"
+           TextColor="#A5A5A5"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1583}" />
+    <Label x:Name="RemainTimeSec"
+           Text="17"
+           FontFamily="Breeze Sans Light"
+           TextColor="#A5A5A5"
+           RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.02962}"
+           RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0166}"
+           RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.9203}"
+           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.1614}" />
+
+    <Controls:MediaHubButton x:Name="PreviousBtn"
+                             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.1333}"
+                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.075}"
+                             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8667}"
+                             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.3292}" />
+
+    <Controls:MediaHubButton x:Name="RewindBtn"
+                             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.1333}"
+                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.075}"
+                             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8667}"
+                             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.3989}" />
+
+    <Controls:MediaHubButton x:Name="PausePlayBtn"
+                             Clicked="PausePlayBtnClicked"
+                             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.1333}"
+                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.075}"
+                             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8667}"
+                             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.4625}" />
+
+    <Controls:MediaHubButton x:Name="ForwardBtn"
+                             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.1333}"
+                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.075}"
+                             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8667}"
+                             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.5260}" />
+
+    <Controls:MediaHubButton x:Name="NextBtn"
+                             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.1333}"
+                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.075}"
+                             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8667}"
+                             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.5958}" />
+
+    <Controls:MediaHubButton x:Name="OptionBtn"
+                             Clicked="OptionsBtnClicked"
+                             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.1333}"
+                             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.075}"
+                             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.8667}"
+                             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.9015}" />
 
     <RelativeLayout x:Name="SpeedInfo" IsVisible="false"
-              RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.111111}"
-              RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0625}"
-              RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.725926}"
-              RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.46875}">
+                    RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.111111}"
+                    RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.0625}"
+                    RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.725926}"
+                    RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.46875}">
       <Image x:Name="SpeedInfoIcon"
-                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
-                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
-                RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
-                RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
-                Source="ic_play_speed_info.png" />
+             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}"
+             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
+             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0}"
+             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0}"
+             Source="ic_play_speed_info.png" />
       <Label x:Name="XText"
-                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.383333}"
-                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.2}"
-                RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.333333}"
-                RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.283333}"
-                Text="X"
-                FontFamily="BreezeSans"
-                TextColor="White"
-                HorizontalTextAlignment="Start"/>
+             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.383333}"
+             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.2}"
+             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.333333}"
+             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.283333}"
+             Text="X"
+             FontFamily="BreezeSans"
+             TextColor="White"
+             HorizontalTextAlignment="Start"/>
       <Label x:Name="NumText"
-                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.416667}"
-                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.2}"
-                RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.316667}"
-                RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.55}"
-                Text="2"
-                FontFamily="BreezeSans"
-                TextColor="White"
-                HorizontalTextAlignment="Start"/>
+             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.416667}"
+             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.2}"
+             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.316667}"
+             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.55}"
+             Text="2"
+             FontFamily="BreezeSans"
+             TextColor="White"
+             HorizontalTextAlignment="Start"/>
     </RelativeLayout>
+    <BoxView x:Name="PopupAnchor"
+             Opacity="0"
+             RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.1333}"
+             RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.177}"
+             RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.6963}"
+             RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.7729}" />
   </RelativeLayout>
 </mh:ContentPageEx>
\ No newline at end of file

diff --git a/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml.cs b/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml.cs
index 4b49f7d..f219f8f 100755 (executable)
--- a/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml.cs
+++ b/TVMediaHub/TVMediaHub.Tizen/Views/VideoPlayer.xaml.cs
@@ -23,21 +23,28 @@ using TVMediaHub.Tizen.ViewModels;
 using Elm = ElmSharp;
 using Xamarin.Forms.PlatformConfiguration.TizenSpecific;
 using TVMediaHub.Tizen.Controls;
-using System.Collections.Generic;
 
 namespace TVMediaHub.Tizen.Views
 {
+    using global::Tizen.Xamarin.Forms.Extension;
+    using Tizen = Xamarin.Forms.PlatformConfiguration.Tizen;
+
     public partial class VideoPlayer : ContentPageEx
     {
         private bool isPlaying;
+        private bool isOptionPopupShowing;
+        private bool isScreenRatePopupShowing;
+        private bool isSoundEffectPopupShowing;
         private Player playerInstance;
         private Elm.Window fullScreenWindow;
         private PlayerDisplay playerDisplayInstance;
         private MediaUriSource videoMediaSource;
-        private static string ReturnKeyName = "Return";
-        private object focusedButton;
         private double height72 = SizeUtils.GetHeightSize(72);
 
+        private ContextPopup optionPopup;
+        private ContextPopup screenRateOptionPopup;
+        private ContextPopup soundEffectOptionPopup;
+
         public static readonly BindableProperty CurrentVideoProperty = BindableProperty.Create("CurrentVideo", typeof(MediaInformation), typeof(VideoPlayer), null);
         public MediaInformation CurrentVideo
         {
@@ -53,14 +60,30 @@ namespace TVMediaHub.Tizen.Views
             TitleLabel.On<Xamarin.Forms.PlatformConfiguration.Tizen>().SetFontWeight(FontWeight.Bold);
             TitleLabel.FontSize = SizeUtils.GetFontSize(44);
 
-            PausePlayBtn.Clicked += PausePlayBtnClicked;
-            OptionBtn.Clicked += OptionBtnClicked;
-            InitializeButtonFocusImage();
+            InitializeButtons();
         }
 
         protected override void InitializePage()
         {
-            PausePlayBtn.Focus();
+            PreviousBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(PreviousBtn.MediaHubButtonBtn);
+            PreviousBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(RewindBtn.MediaHubButtonBtn);
+
+            RewindBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(PreviousBtn.MediaHubButtonBtn);
+            RewindBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(PausePlayBtn.MediaHubButtonBtn);
+
+            PausePlayBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(RewindBtn.MediaHubButtonBtn);
+            PausePlayBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(ForwardBtn.MediaHubButtonBtn);
+
+            ForwardBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(PausePlayBtn.MediaHubButtonBtn);
+            ForwardBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(NextBtn.MediaHubButtonBtn);
+
+            NextBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(ForwardBtn.MediaHubButtonBtn);
+            NextBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(OptionBtn.MediaHubButtonBtn);
+
+            OptionBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusLeftView(NextBtn.MediaHubButtonBtn);
+            OptionBtn.MediaHubButtonBtn.On<Tizen>().SetNextFocusRightView(OptionBtn.MediaHubButtonBtn);
+
+            PausePlayBtn.MediaHubButtonBtn.Focus();
 
             PausePlayBtnClicked(this, null);
         }
@@ -70,11 +93,6 @@ namespace TVMediaHub.Tizen.Views
 
         }
 
-        private void OptionBtnClicked(object sender, EventArgs e)
-        {
-            ShowOptionMenu();
-        }
-
         private async void PlayVideo()
         {
             // Create Player Display and Window
@@ -168,216 +186,209 @@ namespace TVMediaHub.Tizen.Views
         protected override void OnAppearing()
         {
             base.OnAppearing();
-
-            grabKeys();
         }
 
         protected override void OnDisappearing()
         {
             base.OnDisappearing();
-
-            ungrabKeys();
         }
 
-        private void grabKeys()
+        private void InitializeButtons()
         {
-            App.MainWindow.KeyGrab(ReturnKeyName, false);
+            MediaHubButton[] buttons = new MediaHubButton[6] { PreviousBtn, RewindBtn, PausePlayBtn, ForwardBtn, NextBtn, OptionBtn };
+            string[] icons = new string[6] { "previous", "rewind", "pause", "forward", "next", "option" };
+            string iconPath = "btn_viewer_control_previous_normal.png";
 
-            App.MainWindow.KeyUp += ReturnKeyUpListener;
-            App.MainWindow.KeyDown += ReturnKeyDownListener;
+            for (int i = 0; i < buttons.Length; i++)
+            {
+                buttons[i].NormalImage = iconPath.Replace("previous", icons[i]);
+                buttons[i].PressedImage = buttons[i].NormalImage.Replace("normal", "pressed");
+                buttons[i].MediaHubButtonIcon = buttons[i].NormalImage;
+            }
         }
 
-        private void ungrabKeys()
+        private void OptionsBtnClicked(object sender, EventArgs e)
         {
-            App.MainWindow.KeyUp -= ReturnKeyUpListener;
-            App.MainWindow.KeyDown -= ReturnKeyDownListener;
-
-            App.MainWindow.KeyUngrab(ReturnKeyName);
+            createOptionPopup();
         }
 
-        private void ReturnKeyUpListener(object sender, ElmSharp.EvasKeyEventArgs e)
+        private void createScreenRateOptionPopup()
         {
-            DbgPort.D("[VideoViewer] key up : " + e.KeyName);
-
-            if (!e.KeyName.Equals(ReturnKeyName))
+            if (isScreenRatePopupShowing)
             {
                 return;
             }
 
-            Xamarin.Forms.Image focusedBtnBG = null;
-            CustomImageButton focusedCustomImageBtn = null;
+            screenRateOptionPopup = new ContextPopup
+            {
+                IsAutoHidingEnabled = true,
+                Orientation = ContextPopupOrientation.Vertical,
+                DirectionPriorities = new ContextPopupDirectionPriorities(ContextPopupDirection.Up, ContextPopupDirection.Right, ContextPopupDirection.Left, ContextPopupDirection.Down),
+            };
 
-            findFocusedItems(out focusedBtnBG, out focusedCustomImageBtn);
+            screenRateOptionPopup.Items.Add(new ContextPopupItem("             ORIGINAL            "));
+            screenRateOptionPopup.Items.Add(new ContextPopupItem("              16:9              "));
+            screenRateOptionPopup.Items.Add(new ContextPopupItem("              4:3              "));
 
-            if (focusedBtnBG == null || focusedCustomImageBtn == null)
-            {
-                return;
-            }
 
-            if (focusedBtnBG.Equals(OptionBg))
+            screenRateOptionPopup.SelectedIndexChanged += (s, e) =>
             {
-                focusedBtnBG.ScaleTo(3, 250);
-            }
-            else
+                var ctxPopup = s as ContextPopup;
+
+                DbgPort.D("[SlideShowSpeed] Selected Item : " + (ctxPopup.SelectedItem as ContextPopupItem).Label + "(" + ctxPopup.SelectedIndex + ")");
+
+                switch (ctxPopup.SelectedIndex)
+                {
+                    case 0:
+                        /// ORIGINAL
+                        break;
+                    case 1:
+                        /// 16:9
+                        break;
+                    case 2:
+                        /// 4:3
+                        break;
+                    default:
+                        break;
+                }
+
+                screenRateOptionPopup.Dismiss();
+                screenRateOptionPopup = null;
+            };
+
+            screenRateOptionPopup.Dismissed += (s, args) =>
             {
-                focusedBtnBG.ScaleTo(2, 250);
-            }
-            focusedBtnBG.FadeTo(1, 250);
+                isScreenRatePopupShowing = false;
 
-            focusedCustomImageBtn.OnButtonReleased();
-        }
+                createOptionPopup();
+            };
 
-        private void ReturnKeyDownListener(object sender, ElmSharp.EvasKeyEventArgs e)
+            screenRateOptionPopup.Show(PopupAnchor, (PopupAnchor.Width / 2), PopupAnchor.Height);
+            isScreenRatePopupShowing = true;
+        }
+        private void createSoundEffectOptionPopup()
         {
-            DbgPort.D("[VideoViewer] key Down : " + e.KeyName);
-
-            if (!e.KeyName.Equals(ReturnKeyName))
+            if (isSoundEffectPopupShowing)
             {
                 return;
             }
 
-            Xamarin.Forms.Image focusedBtnBG = null;
-            CustomImageButton focusedCustomImageBtn = null;
+            soundEffectOptionPopup = new ContextPopup
+            {
+                IsAutoHidingEnabled = true,
+                Orientation = ContextPopupOrientation.Vertical,
+                DirectionPriorities = new ContextPopupDirectionPriorities(ContextPopupDirection.Up, ContextPopupDirection.Right, ContextPopupDirection.Left, ContextPopupDirection.Down),
+            };
 
-            findFocusedItems(out focusedBtnBG, out focusedCustomImageBtn);
+            soundEffectOptionPopup.Items.Add(new ContextPopupItem("            STANDARD            "));
+            soundEffectOptionPopup.Items.Add(new ContextPopupItem("             CINEMA             "));
+            soundEffectOptionPopup.Items.Add(new ContextPopupItem("             SPORT              "));
 
-            if (focusedBtnBG == null || focusedCustomImageBtn == null)
+            soundEffectOptionPopup.SelectedIndexChanged += (s, e) =>
             {
-                return;
-            }
+                var ctxPopup = s as ContextPopup;
 
-            focusedBtnBG.ScaleTo(1, 250);
-            focusedBtnBG.FadeTo(0, 250);
+                DbgPort.D("[SlideShowEffect] Selected Item : " + (ctxPopup.SelectedItem as ContextPopupItem).Label + "(" + ctxPopup.SelectedIndex + ")");
 
-            focusedCustomImageBtn.OnButtonPressed();
-        }
+                switch (ctxPopup.SelectedIndex)
+                {
+                    case 0:
+                        /// STANDARD
+                        break;
+                    case 1:
+                        /// CINEMA
+                        break;
+                    case 2:
+                        /// SPORT
+                        break;
+                    default:
+                        break;
+                }
 
-        private void findFocusedItems(out Xamarin.Forms.Image focusedBtnBG, out CustomImageButton focusedCustomImageBtn)
-        {
-            List<Button> buttons = new List<Button> { PreviousBtn, RewindBtn, PausePlayBtn, ForwardBtn, NextBtn, OptionBtn };
-            Xamarin.Forms.Image[] imageBGs = new Xamarin.Forms.Image[6] { Previous, Rewind, PausePlay, Forward, Next, OptionBg };
-            CustomImageButton[] customImageButtons = new CustomImageButton[6] { PreviousImage, RewindImage, PausePlayImage, ForwardImage, NextImage, OptionIcon };
+                soundEffectOptionPopup.Dismiss();
+                soundEffectOptionPopup = null;
+            };
 
-            int index = buttons.FindIndex(x => x.Equals(focusedButton));
-            if (index < 0)
+            soundEffectOptionPopup.Dismissed += (s, args) =>
             {
-                focusedBtnBG = null;
-                focusedCustomImageBtn = null;
-                return;
-            }
+                isSoundEffectPopupShowing = false;
 
-            focusedBtnBG = imageBGs[index];
-            focusedCustomImageBtn = customImageButtons[index];
+                createOptionPopup();
+
+            };
+
+            soundEffectOptionPopup.Show(PopupAnchor, (PopupAnchor.Width / 2), PopupAnchor.Height);
+            isSoundEffectPopupShowing = true;
         }
 
-        private void InitializeButtonFocusImage()
+        private void createOptionPopup()
         {
-            PreviousBtn.Focused += (s, e) =>
-            {
-                focusedButton = s;
-                Previous.TranslationX = -3;
-                Previous.ScaleTo(2, 250);
-                Previous.FadeTo(1, 250);
-            };
-            RewindBtn.Focused += (s, e) =>
-            {
-                focusedButton = s;
-                Rewind.TranslationX = 3;
-                Rewind.ScaleTo(2, 250);
-                Rewind.FadeTo(1, 250);
-            };
-            PausePlayBtn.Focused += (s, e) =>
-            {
-                focusedButton = s;
-                PausePlay.ScaleTo(2, 250);
-                PausePlay.FadeTo(1, 250);
-            };
-            ForwardBtn.Focused += (s, e) =>
+            if (isOptionPopupShowing)
             {
-                focusedButton = s;
-                Forward.TranslationX = -3;
-                Forward.ScaleTo(2, 250);
-                Forward.FadeTo(1, 250);
-            };
-            NextBtn.Focused += (s, e) =>
-            {
-                focusedButton = s;
-                Next.TranslationX = 3;
-                Next.ScaleTo(2, 250);
-                Next.FadeTo(1, 250);
-            };
-            OptionBtn.Focused += (s, e) =>
-            {
-                focusedButton = s;
-                OptionBg.ScaleTo(3, 250);
-                OptionBg.FadeTo(1, 250);
-            };
+                return;
+            }
 
-            PreviousBtn.Unfocused += (s, e) =>
-            {
-                Previous.ScaleTo(1, 250);
-                Previous.FadeTo(0, 250);
-            };
-            RewindBtn.Unfocused += (s, e) =>
+            optionPopup = new ContextPopup
             {
-                Rewind.ScaleTo(1, 250);
-                Rewind.FadeTo(0, 250);
+                IsAutoHidingEnabled = true,
+                Orientation = ContextPopupOrientation.Vertical,
+                DirectionPriorities = new ContextPopupDirectionPriorities(ContextPopupDirection.Up, ContextPopupDirection.Right, ContextPopupDirection.Left, ContextPopupDirection.Down),
             };
-            PausePlayBtn.Unfocused += (s, e) =>
-            {
-                PausePlay.ScaleTo(1, 250);
-                PausePlay.FadeTo(0, 250);
-            };
-            ForwardBtn.Unfocused += (s, e) =>
-            {
-                Forward.ScaleTo(1, 250);
-                Forward.FadeTo(0, 250);
-            };
-            NextBtn.Unfocused += (s, e) =>
+
+            optionPopup.Items.Add(new ContextPopupItem("     SCREEN RATE     "));
+            optionPopup.Items.Add(new ContextPopupItem("     SOUND EFFECT    "));
+
+            optionPopup.SelectedIndexChanged += (s, args) =>
             {
-                Next.ScaleTo(1, 250);
-                Next.FadeTo(0, 250);
+                var ctxPopup = s as ContextPopup;
+
+                DbgPort.D("[VideoPlayer] Selected Item : " + (ctxPopup.SelectedItem as ContextPopupItem).Label + " (" + ctxPopup.SelectedIndex + ")");
+                switch (ctxPopup.SelectedIndex)
+                {
+                    case 0:
+                        /// Screen Rate
+                        createScreenRateOptionPopup();
+                        break;
+                    case 1:
+                        /// Sound Effect
+                        createSoundEffectOptionPopup();
+                        break;
+                    default:
+                        break;
+                }
+
+                optionPopup.Dismiss();
+                optionPopup = null;
             };
-            OptionBtn.Unfocused += (s, e) =>
+
+            optionPopup.Dismissed += (s, args) =>
             {
-                focusedButton = s;
-                OptionBg.ScaleTo(1, 250);
-                OptionBg.FadeTo(0, 250);
+                isOptionPopupShowing = false;
             };
-        }
-
-        private void ShowOptionMenu()
-        {
-            ScreenRateBtn.Focus();
-            OptionMenu.IsVisible = true;
 
-            ScreenRateBtn.HeightRequest = height72;
-            SoundEffectBtn.HeightRequest = height72;
+            optionPopup.Show(PopupAnchor, (PopupAnchor.Width / 2), PopupAnchor.Height);
+            isOptionPopupShowing = true;
         }
-
-        private void OnScreenRateBtnClicked(object sender, EventArgs e)
+        protected override bool OnBackButtonPressed()
         {
-            OptionMenu.IsVisible = false;
-            ScreenRateOption.IsVisible = true;
-
-            ScreenRateTitle.HeightRequest = height72;
-            ScreenRateOriginal.HeightRequest = height72;
-            ScreenRate169.HeightRequest = height72;
-            ScreenRate64.HeightRequest = height72;
+            if (isOptionPopupShowing)
+            {
+                optionPopup.Dismiss();
+                return true;
+            }
 
-            ScreenRateOriginal.Focus();
-        }
+            if (isScreenRatePopupShowing)
+            {
+                screenRateOptionPopup.Dismiss();
+                return true;
+            }
 
-        private void OnSoundEffectBtnClicked(object sender, EventArgs e)
-        {
-            SpeedInfo.IsVisible = true;
-            XText.FontSize = SizeUtils.GetFontSize(44);
-            NumText.FontSize = SizeUtils.GetFontSize(40);
-            OptionMenu.IsVisible = false;
-        }
+            if (isSoundEffectPopupShowing)
+            {
+                soundEffectOptionPopup.Dismiss();
+                return true;
+            }
 
-        protected override bool OnBackButtonPressed()
-        {
             Program.TransitionToMain(0);
             return true;
         }