From 6343d239a42cb90d53d49cd84b8c67f29b28f229 Mon Sep 17 00:00:00 2001
From: Kenneth van Ewijk <kennyboy@live.nl>
Date: Tue, 1 Dec 2015 23:14:37 +0100
Subject: [PATCH] Added themes, refined layout, bugfixes

---
 HueUWP/APIHandler.cs          |  2 +-
 HueUWP/AboutView.xaml         | 26 ++++++++++++++++++++
 HueUWP/AboutView.xaml.cs      | 30 +++++++++++++++++++++++
 HueUWP/App.xaml               | 11 ++++++++-
 HueUWP/DetailView.xaml        | 46 +++++++++++++++++++++++++++++------
 HueUWP/DetailView.xaml.cs     |  9 ++++---
 HueUWP/HueUWP.csproj          | 17 +++++++++++++
 HueUWP/Light.cs               | 35 +++++++++++++++++++++++---
 HueUWP/MainPage.xaml          |  6 ++---
 HueUWP/MainPage.xaml.cs       |  6 +++++
 HueUWP/SettingsView.xaml      |  8 +++---
 HueUWP/SettingsView.xaml.cs   |  4 +--
 HueUWP/Themes/DarkTheme.xaml  |  9 +++++++
 HueUWP/Themes/LightTheme.xaml |  5 ++++
 14 files changed, 189 insertions(+), 25 deletions(-)
 create mode 100644 HueUWP/AboutView.xaml
 create mode 100644 HueUWP/AboutView.xaml.cs
 create mode 100644 HueUWP/Themes/DarkTheme.xaml
 create mode 100644 HueUWP/Themes/LightTheme.xaml

diff --git a/HueUWP/APIHandler.cs b/HueUWP/APIHandler.cs
index 1d35662..8cb2a98 100755
--- a/HueUWP/APIHandler.cs
+++ b/HueUWP/APIHandler.cs
@@ -20,7 +20,7 @@ namespace HueUWP
             this.nwh = nwh;
         }
 
-        public async void Register()
+        public async Task Register()
         {
             try {
                 var json = await nwh.RegisterName("Hue", "Kenneth&Yorick");
diff --git a/HueUWP/AboutView.xaml b/HueUWP/AboutView.xaml
new file mode 100644
index 0000000..4cba0ac
--- /dev/null
+++ b/HueUWP/AboutView.xaml
@@ -0,0 +1,26 @@
+<Page
+    x:Class="HueUWP.AboutView"
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:HueUWP"
+    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d">
+
+    <Grid>
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition Height="*" />
+        </Grid.RowDefinitions>
+
+        <RelativePanel Grid.Row="0">
+            <TextBlock RelativePanel.AlignLeftWithPanel="True" FontSize="24" Margin="20,10,0,0">About</TextBlock>
+        </RelativePanel>
+
+        <StackPanel Grid.Row="1">
+            <TextBlock Margin="20,10,20,0">Made by Kenneth and Yorick.</TextBlock>
+            <HyperlinkButton Margin="20,10,20,0" Content="Yorick Rommers" NavigateUri="http://imegumii.space"/>
+            <HyperlinkButton Margin="20,10,20,0" Content="Kenneth van Ewijk" NavigateUri="http://kvanewijk.nl/"/>
+        </StackPanel>
+    </Grid>
+</Page>
diff --git a/HueUWP/AboutView.xaml.cs b/HueUWP/AboutView.xaml.cs
new file mode 100644
index 0000000..3889eeb
--- /dev/null
+++ b/HueUWP/AboutView.xaml.cs
@@ -0,0 +1,30 @@
+using System;
+using System.Collections.Generic;
+using System.IO;
+using System.Linq;
+using System.Runtime.InteropServices.WindowsRuntime;
+using Windows.Foundation;
+using Windows.Foundation.Collections;
+using Windows.UI.Xaml;
+using Windows.UI.Xaml.Controls;
+using Windows.UI.Xaml.Controls.Primitives;
+using Windows.UI.Xaml.Data;
+using Windows.UI.Xaml.Input;
+using Windows.UI.Xaml.Media;
+using Windows.UI.Xaml.Navigation;
+
+// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238
+
+namespace HueUWP
+{
+    /// <summary>
+    /// An empty page that can be used on its own or navigated to within a Frame.
+    /// </summary>
+    public sealed partial class AboutView : Page
+    {
+        public AboutView()
+        {
+            this.InitializeComponent();
+        }
+    }
+}
diff --git a/HueUWP/App.xaml b/HueUWP/App.xaml
index da19261..d7941d2 100644
--- a/HueUWP/App.xaml
+++ b/HueUWP/App.xaml
@@ -3,6 +3,15 @@
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:local="using:HueUWP"
-    RequestedTheme="Light">
+    RequestedTheme="Dark">
+
+    <Application.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.ThemeDictionaries>
+                <ResourceDictionary x:Key="Dark" Source="Themes/DarkTheme.xaml"/>
+                <ResourceDictionary x:Key="Light" Source="Themes/LightTheme.xaml"/>
+            </ResourceDictionary.ThemeDictionaries>
+        </ResourceDictionary>
+    </Application.Resources>
 
 </Application>
diff --git a/HueUWP/DetailView.xaml b/HueUWP/DetailView.xaml
index d8cb6ef..04f0b36 100644
--- a/HueUWP/DetailView.xaml
+++ b/HueUWP/DetailView.xaml
@@ -3,13 +3,21 @@
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:local="using:HueUWP"
+    xmlns:convert="using:HueUWP.Converters"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    xmlns:ctrl="using:Windows.UI.Xaml.Controls.Control"
     mc:Ignorable="d">
 
-    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
-        <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    <Page.Resources>
+        <convert:NullableBooleanConverter x:Key="BoolConverter"/>
+    </Page.Resources>
+
+        <Grid>
             <Grid.RowDefinitions>
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
+                <RowDefinition Height="Auto" />
                 <RowDefinition Height="Auto" />
                 <RowDefinition Height="*" />
             </Grid.RowDefinitions>
@@ -17,12 +25,36 @@
             <RelativePanel Grid.Row="0">
                 <TextBlock RelativePanel.AlignLeftWithPanel="True" FontSize="24" Margin="20,10,0,0" Text="{Binding Name}"/>
             </RelativePanel>
+            <RelativePanel Grid.Row="1">
+                <TextBlock RelativePanel.AlignLeftWithPanel="True" FontSize="14" Margin="20,10,0,0" Text="{Binding Type}"/>
+            </RelativePanel>
+            <RelativePanel Grid.Row="2">
+                <Rectangle Fill="{Binding Color}" RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True" Height="20" Margin="0,10,0,10" />
+            </RelativePanel>
+
+            <StackPanel Grid.Row="3">
+                <ToggleSwitch Margin="20,10,0,10" Toggled="ToggleSwitch_Toggled" IsOn="{Binding IsOn, Converter={StaticResource BoolConverter}}">
+                    <ToggleSwitch.OffContent>Off</ToggleSwitch.OffContent>
+                    <ToggleSwitch.OnContent>On</ToggleSwitch.OnContent>
+                </ToggleSwitch>
+            </StackPanel>
+
+            <StackPanel Grid.Row="4">
+                <StackPanel Margin="20,10,20,0">
+                    <TextBlock FontSize="18">Hue</TextBlock>
+                    <Slider Maximum="65535" Value="{Binding Hue, Mode=TwoWay}" ValueChanged="Slider_ValueChanged" PointerCaptureLost="Slider_Released"/>
+                </StackPanel>
+
+                <StackPanel Margin="20,10,20,0">
+                    <TextBlock FontSize="14">Saturation</TextBlock>
+                    <Slider Maximum="254" Value="{Binding Saturation, Mode=TwoWay}" ValueChanged="Slider_ValueChanged" PointerCaptureLost="Slider_Released" />
+                </StackPanel>
+
+                <StackPanel Margin="20,10,20,0">
+                    <TextBlock FontSize="14">Brightness</TextBlock>
+                    <Slider Maximum="254" Value="{Binding Brightness, Mode=TwoWay}" ValueChanged="Slider_ValueChanged" PointerCaptureLost="Slider_Released"/>
+                </StackPanel>
 
-            <StackPanel Grid.Row="1">
-                <Slider Maximum="65535" Value="{Binding Hue, Mode=TwoWay}" ValueChanged="Slider_ValueChanged" PointerCaptureLost="Slider_PointerCaptureLost"/>
-                <Slider Maximum="254" Value="{Binding Saturation, Mode=TwoWay}" ValueChanged="Slider_ValueChanged" PointerCaptureLost="Slider_PointerCaptureLost" />
-                <Slider Maximum="254" Value="{Binding Brightness, Mode=TwoWay}" ValueChanged="Slider_ValueChanged" PointerCaptureLost="Slider_PointerCaptureLost"/>
             </StackPanel>
         </Grid>
-    </Grid>
 </Page>
diff --git a/HueUWP/DetailView.xaml.cs b/HueUWP/DetailView.xaml.cs
index 061a1d6..2134b8c 100644
--- a/HueUWP/DetailView.xaml.cs
+++ b/HueUWP/DetailView.xaml.cs
@@ -42,14 +42,17 @@ namespace HueUWP
             //l.UpdateColor();
         }
 
-        private void Slider_DragLeave(object sender, DragEventArgs e)
+        private void Slider_Released(object sender, PointerRoutedEventArgs e)
         {
             l.UpdateColor();
         }
 
-        private void Slider_PointerCaptureLost(object sender, PointerRoutedEventArgs e)
+        private void ToggleSwitch_Toggled(object sender, RoutedEventArgs e)
         {
-            l.UpdateColor();
+            ToggleSwitch button = ((ToggleSwitch)sender);
+            Light light = (Light)button.DataContext;
+            if (light != null)
+                light.UpdateState(button.IsOn);
         }
     }
 }
diff --git a/HueUWP/HueUWP.csproj b/HueUWP/HueUWP.csproj
index 8d7e882..a556db7 100644
--- a/HueUWP/HueUWP.csproj
+++ b/HueUWP/HueUWP.csproj
@@ -93,6 +93,9 @@
     <None Include="project.json" />
   </ItemGroup>
   <ItemGroup>
+    <Compile Include="AboutView.xaml.cs">
+      <DependentUpon>AboutView.xaml</DependentUpon>
+    </Compile>
     <Compile Include="APIHandler.cs" />
     <Compile Include="App.xaml.cs">
       <DependentUpon>App.xaml</DependentUpon>
@@ -134,6 +137,10 @@
       <Generator>MSBuild:Compile</Generator>
       <SubType>Designer</SubType>
     </ApplicationDefinition>
+    <Page Include="AboutView.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+    </Page>
     <Page Include="DetailView.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
@@ -146,6 +153,16 @@
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
     </Page>
+    <Page Include="Themes\DarkTheme.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+    </Page>
+    <Page Include="Themes\LightTheme.xaml">
+      <SubType>Designer</SubType>
+      <Generator>MSBuild:Compile</Generator>
+      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+    </Page>
   </ItemGroup>
   <PropertyGroup Condition=" '$(VisualStudioVersion)' == '' or '$(VisualStudioVersion)' &lt; '14.0' ">
     <VisualStudioVersion>14.0</VisualStudioVersion>
diff --git a/HueUWP/Light.cs b/HueUWP/Light.cs
index 0a17e2e..8f3f4bc 100644
--- a/HueUWP/Light.cs
+++ b/HueUWP/Light.cs
@@ -17,10 +17,37 @@ namespace HueUWP
         public string Name { get; set; }
         public string Type { get; set; }
 
-        public bool IsOn { get;  set; }
-        public double Brightness{ get; set; }
-        public double Hue { get; set; }
-        public double Saturation { get; set; }
+        private bool _isOn;
+
+        public bool IsOn
+        {
+            get { return _isOn; }
+            set { _isOn = value; NotifyPropertyChanged(nameof(IsOn)); }
+        }
+
+        //Hue
+        private double _hue;
+        public double Hue
+        {
+            get { return _hue; }
+            set { _hue = value; NotifyPropertyChanged(nameof(Hue)); NotifyPropertyChanged(nameof(Color)); }
+        }
+
+        //Brightness
+        private double _brightness;
+        public double Brightness
+        {
+            get { return _brightness; }
+            set { _brightness = value; NotifyPropertyChanged(nameof(Brightness)); NotifyPropertyChanged(nameof(Color)); }
+        }
+
+        //Saturation
+        private double _saturation;
+        public double Saturation
+        {
+            get { return _saturation; }
+            set { _saturation = value; NotifyPropertyChanged(nameof(Saturation)); NotifyPropertyChanged(nameof(Color)); }
+        }
 
         public APIHandler api { get; set; }
 
diff --git a/HueUWP/MainPage.xaml b/HueUWP/MainPage.xaml
index 8a7dde0..342b7e7 100644
--- a/HueUWP/MainPage.xaml
+++ b/HueUWP/MainPage.xaml
@@ -24,12 +24,12 @@
             <TextBlock RelativePanel.AlignLeftWithPanel="True" FontSize="24" Margin="20,10,0,0">Hue Lights</TextBlock>
         </RelativePanel>
 
-        <StackPanel Grid.Row="1" Margin="0,40,0,40">
+        <StackPanel Grid.Row="1" Margin="0,10,0,0">
             <ListView x:Name="myListView" ItemsSource="{Binding}" IsItemClickEnabled="True" ItemClick="myListView_ItemClick">
                 <ListView.ItemTemplate>
                     <DataTemplate x:Name="dataTemplate">
                         <StackPanel Orientation="Horizontal">
-                            <Rectangle Width="30" Height="30" Fill="{Binding Color}" Margin="10,0,0,0" />
+                            <Rectangle Width="30" Height="30" Fill="{Binding Color}" Margin="20,0,0,0" />
 
                             <StackPanel Orientation="Vertical" Width="140" Margin="10,0,0,0">
                                 <TextBlock Text="{Binding Name}" FontSize="24" />
@@ -58,7 +58,7 @@
             <AppBarSeparator/>
 
             <CommandBar.SecondaryCommands>
-                <AppBarButton Label="About" />
+                <AppBarButton Label="About" Click="AboutButton_Click"/>
             </CommandBar.SecondaryCommands>
         </CommandBar>
     </Page.BottomAppBar>
diff --git a/HueUWP/MainPage.xaml.cs b/HueUWP/MainPage.xaml.cs
index a519942..d991124 100644
--- a/HueUWP/MainPage.xaml.cs
+++ b/HueUWP/MainPage.xaml.cs
@@ -87,5 +87,11 @@ namespace HueUWP
             if (l != null)
                 rootframe.Navigate(typeof(DetailView), l);
         }
+
+        private void AboutButton_Click(object sender, RoutedEventArgs e)
+        {
+            Frame rootframe = Window.Current.Content as Frame;
+            rootframe.Navigate(typeof(AboutView));
+        }
     }
 }
diff --git a/HueUWP/SettingsView.xaml b/HueUWP/SettingsView.xaml
index 0fef193..8016fe6 100644
--- a/HueUWP/SettingsView.xaml
+++ b/HueUWP/SettingsView.xaml
@@ -8,7 +8,7 @@
     mc:Ignorable="d">
     <!--DataContext="{Binding SettingsViewModel, RelativeSource={RelativeSource Self}}"-->
 
-    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
+    <Grid>
         <Grid.RowDefinitions>
             <RowDefinition Height="Auto" />
             <RowDefinition Height="*" />
@@ -19,15 +19,15 @@
         </RelativePanel>
 
         <StackPanel Grid.Row="1">
-            <StackPanel Margin="10">
+            <StackPanel Margin="20">
                 <TextBlock FontSize="16">Server IP</TextBlock>
                 <TextBox Margin="0,10,0,10" Text="{x:Bind SettingsViewModel.IP, Mode=TwoWay}" />
             </StackPanel>
-            <StackPanel Margin="10">
+            <StackPanel Margin="20">
                 <TextBlock FontSize="16">Server Port</TextBlock>
                 <TextBox Margin="0,10,0,10" Text="{x:Bind SettingsViewModel.PORT, Mode=TwoWay}" />
             </StackPanel>
-            <StackPanel Margin="10">
+            <StackPanel Margin="20">
                 <TextBlock FontSize="16">User ID</TextBlock>
                 <TextBox Margin="0,10,0,10" Text="{x:Bind SettingsViewModel.ID, Mode=OneWay}"  IsEnabled="False"/>
                 <Button Margin="0,10,0,10" Name="UpdateID" Click="UpdateID_Click">
diff --git a/HueUWP/SettingsView.xaml.cs b/HueUWP/SettingsView.xaml.cs
index 98bfff1..a8f7ac7 100644
--- a/HueUWP/SettingsView.xaml.cs
+++ b/HueUWP/SettingsView.xaml.cs
@@ -32,9 +32,9 @@ namespace HueUWP
             //SettingsViewModel = new SettingsViewModel();
         }
 
-        private void UpdateID_Click(object sender, RoutedEventArgs e)
+        private async void UpdateID_Click(object sender, RoutedEventArgs e)
         {
-           api.Register();
+           await api.Register();
            SettingsViewModel.Update();   
         }
 
diff --git a/HueUWP/Themes/DarkTheme.xaml b/HueUWP/Themes/DarkTheme.xaml
new file mode 100644
index 0000000..fc388b5
--- /dev/null
+++ b/HueUWP/Themes/DarkTheme.xaml
@@ -0,0 +1,9 @@
+<ResourceDictionary
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:HueUWP.Themes">
+
+    <Style TargetType="TextBlock">
+        <Setter Property="Foreground" Value="White" />
+    </Style>
+</ResourceDictionary>
diff --git a/HueUWP/Themes/LightTheme.xaml b/HueUWP/Themes/LightTheme.xaml
new file mode 100644
index 0000000..43c05d3
--- /dev/null
+++ b/HueUWP/Themes/LightTheme.xaml
@@ -0,0 +1,5 @@
+<ResourceDictionary
+    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
+    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:local="using:HueUWP.Themes">
+</ResourceDictionary>