Add keyboard UI (#855)

src/Calculator/Calculator.vcxproj

@@ -295,6 +295,9 @@
     <ClInclude Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml.h">
       <DependentUpon>Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml</DependentUpon>
     </ClInclude>
+    <ClInclude Include="Views\GraphingCalculator\GraphingNumPad.xaml.h">
+      <DependentUpon>Views\GraphingCalculator\GraphingNumPad.xaml</DependentUpon>
+    </ClInclude>
     <ClInclude Include="Views\HistoryList.xaml.h">
       <DependentUpon>Views\HistoryList.xaml</DependentUpon>
     </ClInclude>
@@ -357,6 +360,7 @@
     <Page Include="Views\GraphingCalculator\EquationInputArea.xaml" />
     <Page Include="Views\GraphingCalculator\GraphingCalculator.xaml" />
     <Page Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml" />
+    <Page Include="Views\GraphingCalculator\GraphingNumPad.xaml"/>
     <Page Include="Views\HistoryList.xaml" />
     <Page Include="Views\MainPage.xaml" />
     <Page Include="Views\Memory.xaml" />
@@ -454,6 +458,9 @@
     <ClCompile Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml.cpp">
       <DependentUpon>Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml</DependentUpon>
     </ClCompile>
+    <ClCompile Include="Views\GraphingCalculator\GraphingNumPad.xaml.cpp">
+      <DependentUpon>Views\GraphingCalculator\GraphingNumPad.xaml</DependentUpon>
+    </ClCompile>
     <ClCompile Include="Views\HistoryList.xaml.cpp">
       <DependentUpon>Views\HistoryList.xaml</DependentUpon>
     </ClCompile>

src/Calculator/Calculator.vcxproj.filters

@@ -317,8 +317,8 @@
       <Filter>Controls</Filter>
     </ClCompile>
     <ClCompile Include="Controls\MathRichEditBox.cpp" />
-    <ClCompile Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml.cpp" >
+    <ClCompile Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml.cpp">
-          <Filter>Views\GraphingCalculator</Filter>
+      <Filter>Views\GraphingCalculator</Filter>
     </ClCompile>
     <ClCompile Include="TemplateSelectors\KeyGraphFeaturesTemplateSelector.cpp" />
   </ItemGroup>
@@ -417,7 +417,7 @@
       <Filter>Controls</Filter>
     </ClInclude>
     <ClInclude Include="Controls\MathRichEditBox.h" />
-    <ClInclude Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml.h" >
+    <ClInclude Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml.h">
       <Filter>Views\GraphingCalculator</Filter>
     </ClInclude>
     <ClInclude Include="TemplateSelectors\KeyGraphFeaturesTemplateSelector.h" />
@@ -497,8 +497,11 @@
     <Page Include="Views\TitleBar.xaml">
       <Filter>Views</Filter>
     </Page>
-    <Page Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml" >
+    <Page Include="Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml">
-          <Filter>Views\GraphingCalculator</Filter>
+      <Filter>Views\GraphingCalculator</Filter>
+    </Page>
+    <Page Include="Views\GraphingCalculator\GraphingNumPad.xaml">
+      <Filter>Views\GraphingCalculator</Filter>
     </Page>
   </ItemGroup>
   <ItemGroup>
@@ -1548,5 +1551,7 @@
   <ItemGroup>
     <CopyFileToFolders Include="$(GraphingImplDll)" />
     <CopyFileToFolders Include="$(GraphingEngineDll)" />
+    <CopyFileToFolders Include="$(GraphingImplDll)" />
+    <CopyFileToFolders Include="$(GraphingEngineDll)" />
   </ItemGroup>
 </Project>

src/Calculator/Resources/en-US/Resources.resw

@@ -3535,6 +3535,10 @@
     <value>Function</value>
     <comment>Displayed on the button that contains a flyout for the general functions in scientific mode.</comment>
   </data>
+  <data name="inequalityButton.Text" xml:space="preserve">
+    <value>Inequalities</value>
+    <comment>Displayed on the button that contains a flyout for the inequality functions.</comment>
+  </data>
   <data name="bitwiseButton.Text" xml:space="preserve">
     <value>Bitwise</value>
     <comment>Displayed on the button that contains a flyout for the bitwise functions in programmer mode.</comment>

src/Calculator/Views/GraphingCalculator/GraphingCalculator.xaml

@@ -314,15 +314,6 @@
                 </Setter>
             </Style>
 
-            <Style x:Key="AccentCalcButtonStyle"
-                   BasedOn="{StaticResource SymbolOperatorButtonStyle}"
-                   TargetType="controls:CalculatorButton">
-                <Setter Property="HoverBackground" Value="{ThemeResource AppControlHighlightAccentRevealBackgroundBrush}"/>
-                <Setter Property="HoverForeground" Value="{ThemeResource SystemControlHighlightAltAltHighBrush}"/>
-                <Setter Property="PressBackground" Value="{ThemeResource AppControlBackgroundListAccentHighRevealBackgroundBrush}"/>
-                <Setter Property="PressForeground" Value="{ThemeResource SystemControlHighlightAltAltHighBrush}"/>
-            </Style>
-
             <converters:BooleanToVisibilityConverter x:Name="BooleanToVisibilityConverter"/>
             <converters:BooleanToVisibilityNegationConverter x:Name="BooleanToVisibilityNegationConverter"/>
             <ResourceDictionary.ThemeDictionaries>
@@ -687,8 +678,8 @@
                         <TranslateTransform x:Name="TraceValuePopupTransform"/>
                     </Border.RenderTransform>
                     <TextBlock x:Name="TraceValue"
-                               AutomationProperties.LiveSetting="Polite"
                                Foreground="{ThemeResource ToolTipForeground}"
+                               AutomationProperties.LiveSetting="Polite"
                                Text="x=0,y=0"/>
                 </Border>
             </Grid>
@@ -702,8 +693,8 @@
               Grid.Column="1"
               Visibility="{x:Bind local:GraphingCalculator.ShouldDisplayPanel(IsSmallState, SwitchModeToggleButton.IsChecked.Value, x:False), Mode=OneWay}">
             <Grid.RowDefinitions>
-                <RowDefinition Height="5*"/>
+                <RowDefinition Height="*"/>
-                <RowDefinition Height="3*"/>
+                <RowDefinition Height="1.8*"/>
             </Grid.RowDefinitions>
 
             <!-- Ideally the KeyGraphFeaturesPanel should be a frame so that navigation to and from the panel could be handled nicely -->
@@ -721,190 +712,10 @@
                                      KeyGraphFeaturesRequested="OnEquationKeyGraphFeaturesRequested"
                                      Visibility="{x:Bind IsKeyGraphFeaturesVisible, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"/>
 
-            <Grid x:Name="ButtonContainerGrid"
+            <local:GraphingNumPad Grid.Row="1"
-                  Grid.Row="1"
+                                  Margin="2,0,2,2"
-                  Margin="2,0,2,2"
+                                  Visibility="{x:Bind IsKeyGraphFeaturesVisible, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}"/>
-                  UseLayoutRounding="False"
-                  Visibility="{x:Bind IsKeyGraphFeaturesVisible, Converter={StaticResource BooleanToVisibilityNegationConverter}, Mode=OneWay}">
-                <Grid.RowDefinitions>
-                    <RowDefinition/>
-                    <RowDefinition/>
-                    <RowDefinition/>
-                    <RowDefinition/>
-                    <RowDefinition/>
-                    <RowDefinition/>
-                </Grid.RowDefinitions>
-                <Grid.ColumnDefinitions>
-                    <ColumnDefinition/>
-                    <ColumnDefinition/>
-                    <ColumnDefinition/>
-                    <ColumnDefinition/>
-                    <ColumnDefinition/>
-                </Grid.ColumnDefinitions>
 
-                <controls:CalculatorButton x:Name="XButton"
-                                           x:Uid="xButton"
-                                           Grid.Row="0"
-                                           Grid.Column="0"
-                                           Style="{StaticResource OperatorButtonStyle}"
-                                           FontSize="16"
-                                           ButtonId="X"
-                                           Content="𝑥"
-                                           FlowDirection="LeftToRight"/>
-                <controls:CalculatorButton x:Name="YButton"
-                                           x:Uid="yButton"
-                                           Grid.Row="0"
-                                           Grid.Column="1"
-                                           Style="{StaticResource OperatorButtonStyle}"
-                                           FontSize="16"
-                                           ButtonId="Y"
-                                           Content="𝑦"
-                                           FlowDirection="LeftToRight"/>
-                <controls:CalculatorButton x:Name="PowerButton"
-                                           x:Uid="graphingPowerButton"
-                                           Grid.Row="0"
-                                           Grid.Column="2"
-                                           Style="{StaticResource OperatorButtonStyle}"
-                                           ButtonId="XPowerY"
-                                           Content="^"/>
-                <controls:CalculatorButton x:Name="squareRootButton"
-                                           x:Uid="squareRootButton"
-                                           Grid.Row="0"
-                                           Grid.Column="3"
-                                           Style="{StaticResource SymbolOperatorButtonStyle}"
-                                           FontFamily="{StaticResource SymbolThemeFontFamily}"
-                                           ButtonId="Sqrt"
-                                           Content="&#xE94B;"/>
-
-                <!-- Display controls -->
-                <controls:CalculatorButton x:Name="ClearButton"
-                                           x:Uid="clearButton"
-                                           Grid.Row="1"
-                                           Grid.Column="2"
-                                           Style="{StaticResource OperatorButtonStyle}"
-                                           FontSize="16"
-                                           ButtonId="Clear"
-                                           Content="C"/>
-                <controls:CalculatorButton x:Name="BackSpaceButton"
-                                           x:Uid="backSpaceButton"
-                                           Grid.Row="1"
-                                           Grid.Column="3"
-                                           Style="{StaticResource SymbolOperatorButtonStyle}"
-                                           FontSize="16"
-                                           ButtonId="Backspace"
-                                           Content="&#xE94F;"/>
-
-                <!-- Basic operators -->
-                <controls:CalculatorButton x:Name="EqualButton"
-                                           x:Uid="graphingEqualButton"
-                                           Grid.Row="0"
-                                           Grid.Column="4"
-                                           Style="{StaticResource AccentCalcButtonStyle}"
-                                           ButtonId="Equals"
-                                           Content="&#xE94E;"/>
-                <controls:CalculatorButton x:Name="DivideButton"
-                                           x:Uid="divideButton"
-                                           Grid.Row="1"
-                                           Grid.Column="4"
-                                           Style="{StaticResource AccentCalcButtonStyle}"
-                                           ButtonId="Divide"
-                                           Content="&#xE94A;"/>
-                <controls:CalculatorButton x:Name="MultiplyButton"
-                                           x:Uid="multiplyButton"
-                                           Grid.Row="2"
-                                           Grid.Column="4"
-                                           Style="{StaticResource AccentCalcButtonStyle}"
-                                           ButtonId="Multiply"
-                                           Content="&#xE947;"/>
-                <controls:CalculatorButton x:Name="MinusButton"
-                                           x:Uid="minusButton"
-                                           Grid.Row="3"
-                                           Grid.Column="4"
-                                           Style="{StaticResource AccentCalcButtonStyle}"
-                                           ButtonId="Subtract"
-                                           Content="&#xE949;"/>
-                <controls:CalculatorButton x:Name="PlusButton"
-                                           x:Uid="plusButton"
-                                           Grid.Row="4"
-                                           Grid.Column="4"
-                                           Style="{StaticResource AccentCalcButtonStyle}"
-                                           ButtonId="Add"
-                                           Content="&#xE948;"/>
-
-
-                <controls:CalculatorButton x:Name="logBase10Button"
-                                           x:Uid="logBase10Button"
-                                           Grid.Row="1"
-                                           Grid.Column="0"
-                                           Style="{StaticResource OperatorButtonStyle}"
-                                           ButtonId="LogBase10"
-                                           Content="log"/>
-                <controls:CalculatorButton x:Name="logBaseEButton"
-                                           x:Uid="logBaseEButton"
-                                           Grid.Row="1"
-                                           Grid.Column="1"
-                                           Style="{StaticResource OperatorButtonStyle}"
-                                           ButtonId="LogBaseE"
-                                           Content="ln"/>
-                <controls:CalculatorButton x:Name="powerOf10Button"
-                                           x:Uid="powerOf10Button"
-                                           Grid.Row="2"
-                                           Grid.Column="0"
-                                           Style="{StaticResource SymbolOperatorButtonStyle}"
-                                           AutomationProperties.AutomationId="powerOf10Button"
-                                           ButtonId="TenPowerX"
-                                           Content="&#xF7CC;"/>
-                <controls:CalculatorButton x:Name="powerOfEButton"
-                                           x:Uid="powerOfEButton"
-                                           Grid.Row="3"
-                                           Grid.Column="0"
-                                           Style="{StaticResource SymbolOperatorButtonStyle}"
-                                           ButtonId="EPowerX"
-                                           Content="&#xf7ce;"/>
-                <controls:CalculatorButton x:Name="piButton"
-                                           x:Uid="piButton"
-                                           Grid.Row="4"
-                                           Grid.Column="0"
-                                           Style="{StaticResource SymbolOperatorButtonStyle}"
-                                           FontSize="14"
-                                           ButtonId="Pi"
-                                           Content="&#xf7cf;"/>
-
-                <controls:CalculatorButton x:Name="openParenthesisButton"
-                                           x:Uid="openParenthesisButton"
-                                           Grid.Row="5"
-                                           Grid.Column="0"
-                                           Style="{StaticResource ParenthesisCalcButtonStyle}"
-                                           FontSize="19"
-                                           ButtonId="OpenParenthesis"
-                                           Content="("/>
-                <controls:CalculatorButton x:Name="closeParenthesisButton"
-                                           x:Uid="closeParenthesisButton"
-                                           Grid.Row="5"
-                                           Grid.Column="1"
-                                           Style="{StaticResource OperatorButtonStyle}"
-                                           FontSize="19"
-                                           ButtonId="CloseParenthesis"
-                                           Content=")"/>
-
-                <!-- The Numberpad -->
-                <local:NumberPad x:Name="NumberPad"
-                                 x:Uid="NumberPad"
-                                 Grid.Row="2"
-                                 Grid.RowSpan="4"
-                                 Grid.Column="1"
-                                 Grid.ColumnSpan="3"
-                                 ButtonStyle="{StaticResource NumericButtonStyle24}"/>
-
-                <controls:CalculatorButton x:Name="PlotButton"
-                                           x:Uid="plotButton"
-                                           Grid.Row="5"
-                                           Grid.Column="4"
-                                           Style="{StaticResource AccentCalcButtonStyle}"
-                                           FontFamily="{StaticResource SymbolThemeFontFamily}"
-                                           ButtonId="Plot"
-                                           Content="&#xE72A;"/>
-            </Grid>
         </Grid>
     </Grid>
 </UserControl>

src/Calculator/Views/GraphingCalculator/GraphingCalculator.xaml.h

@@ -7,6 +7,7 @@
 #include "CalcViewModel\GraphingCalculator\GraphingCalculatorViewModel.h"
 #include "Views\NumberPad.xaml.h"
 #include "Views\GraphingCalculator\KeyGraphFeaturesPanel.xaml.h"
+#include "Views\GraphingCalculator\GraphingNumPad.xaml.h"
 
 namespace CalculatorApp
 {

src/Calculator/Views/GraphingCalculator/GraphingNumPad.xaml.cpp

@@ -0,0 +1,106 @@
+// Copyright (c) Microsoft Corporation. All rights reserved.
+// Licensed under the MIT License.
+
+#include "pch.h"
+#include "GraphingNumPad.xaml.h"
+#include "Views/NumberPad.xaml.h"
+
+using namespace CalculatorApp;
+
+using namespace Platform;
+using namespace Windows::Foundation;
+using namespace Windows::Foundation::Collections;
+using namespace Windows::UI::Xaml;
+using namespace Windows::UI::Xaml::Controls;
+using namespace Windows::UI::Xaml::Controls::Primitives;
+using namespace Windows::UI::Xaml::Data;
+using namespace Windows::UI::Xaml::Input;
+using namespace Windows::UI::Xaml::Media;
+using namespace Windows::UI::Xaml::Navigation;
+
+GraphingNumPad::GraphingNumPad()
+{
+    InitializeComponent();
+}
+
+void GraphingNumPad::ShiftButton_Check(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    SetOperatorRowVisibility();
+}
+
+void GraphingNumPad::ShiftButton_Uncheck(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    ShiftButton->IsChecked = false;
+    SetOperatorRowVisibility();
+    ShiftButton->Focus(::FocusState::Programmatic);
+}
+
+void GraphingNumPad::TrigFlyoutShift_Toggle(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    SetTrigRowVisibility();
+}
+
+void GraphingNumPad::TrigFlyoutHyp_Toggle(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    SetTrigRowVisibility();
+}
+
+void GraphingNumPad::FlyoutButton_Clicked(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::RoutedEventArgs ^ /*e*/)
+{
+    this->HypButton->IsChecked = false;
+    this->TrigShiftButton->IsChecked = false;
+    this->Trigflyout->Hide();
+    this->FuncFlyout->Hide();
+    this->InequalityFlyout->Hide();
+}
+
+void GraphingNumPad::ShiftButton_IsEnabledChanged(_In_ Platform::Object ^ /*sender*/, _In_ Windows::UI::Xaml::DependencyPropertyChangedEventArgs ^ /*e*/)
+{
+    SetOperatorRowVisibility();
+}
+
+void GraphingNumPad::SetTrigRowVisibility()
+{
+    bool isShiftChecked = TrigShiftButton->IsChecked->Value;
+    bool isHypeChecked = HypButton->IsChecked->Value;
+
+    InverseHyperbolicTrigFunctions->Visibility = ::Visibility::Collapsed;
+    InverseTrigFunctions->Visibility = ::Visibility::Collapsed;
+    HyperbolicTrigFunctions->Visibility = ::Visibility::Collapsed;
+    TrigFunctions->Visibility = ::Visibility::Collapsed;
+
+    if (isShiftChecked && isHypeChecked)
+    {
+        InverseHyperbolicTrigFunctions->Visibility = ::Visibility::Visible;
+    }
+    else if (isShiftChecked && !isHypeChecked)
+    {
+        InverseTrigFunctions->Visibility = ::Visibility::Visible;
+    }
+    else if (!isShiftChecked && isHypeChecked)
+    {
+        HyperbolicTrigFunctions->Visibility = ::Visibility::Visible;
+    }
+    else
+    {
+        TrigFunctions->Visibility = ::Visibility::Visible;
+    }
+}
+
+void GraphingNumPad::SetOperatorRowVisibility()
+{
+    ::Visibility rowVis, invRowVis;
+    if (ShiftButton->IsChecked->Value)
+    {
+        rowVis = ::Visibility::Collapsed;
+        invRowVis = ::Visibility::Visible;
+    }
+    else
+    {
+        rowVis = ::Visibility::Visible;
+        invRowVis = ::Visibility::Collapsed;
+    }
+
+    Row1->Visibility = rowVis;
+    InvRow1->Visibility = invRowVis;
+}

src/Calculator/Views/GraphingCalculator/GraphingNumPad.xaml.h

@@ -0,0 +1,27 @@
+// Copyright (c) Microsoft Corporation. All rights reserved.
+// Licensed under the MIT License.
+
+#pragma once
+
+#include "Views\GraphingCalculator\GraphingNumPad.g.h"
+#include "CalcViewModel/GraphingCalculator/GraphingCalculatorViewModel.h"
+
+namespace CalculatorApp
+{
+	[Windows::Foundation::Metadata::WebHostHidden]
+	public ref class GraphingNumPad sealed 
+	{
+	public:
+		GraphingNumPad();
+
+    private:
+        void ShiftButton_Check(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void ShiftButton_Uncheck(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void TrigFlyoutShift_Toggle(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void TrigFlyoutHyp_Toggle(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void FlyoutButton_Clicked(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::RoutedEventArgs ^ e);
+        void ShiftButton_IsEnabledChanged(_In_ Platform::Object ^ sender, _In_ Windows::UI::Xaml::DependencyPropertyChangedEventArgs ^ e);
+        void SetOperatorRowVisibility();
+        void SetTrigRowVisibility();
+	};
+}