Adjustments to ghost textbox (#924)

* adjustments * delete extra visual states * Fix hover bug * Fix a few more bugs * Fix high contrast crash
2020-01-10 16:41:23 -08:00
parent ab2ad8cdee
commit 240792a775
6 changed files with 64 additions and 36 deletions
--- a/src/CalcViewModel/GraphingCalculator/EquationViewModel.h
+++ b/src/CalcViewModel/GraphingCalculator/EquationViewModel.h
@@ -45,7 +45,7 @@ public

        OBSERVABLE_OBJECT();
        OBSERVABLE_PROPERTY_R(GraphControl::Equation ^, GraphEquation);
-        OBSERVABLE_PROPERTY_R(int, FunctionLabelIndex);
+        OBSERVABLE_PROPERTY_RW(int, FunctionLabelIndex);
        OBSERVABLE_PROPERTY_RW(bool, IsLastItemInList);

        property Platform::String ^ Expression
--- a/src/Calculator/App.xaml
+++ b/src/Calculator/App.xaml
@@ -1743,7 +1743,7 @@
                                           Grid.Row="1"
                                           Grid.Column="0"
                                           Grid.ColumnSpan="4"
-                                           Margin="{TemplateBinding BorderThickness}"
+                                           Margin="0,-1,0,0"
                                           Padding="{TemplateBinding Padding}"
                                           VerticalAlignment="Center"
                                           Foreground="{ThemeResource TextControlPlaceholderForeground}"
--- a/src/Calculator/Controls/EquationTextBox.cpp
+++ b/src/Calculator/Controls/EquationTextBox.cpp
@@ -51,9 +51,9 @@ void EquationTextBox::OnApplyTemplate()
    {
        m_richEditBox->GotFocus += ref new RoutedEventHandler(this, &EquationTextBox::OnRichEditBoxGotFocus);
        m_richEditBox->LostFocus += ref new RoutedEventHandler(this, &EquationTextBox::OnRichEditBoxLostFocus);
+        m_richEditBox->TextChanged += ref new RoutedEventHandler(this, &EquationTextBox::OnRichEditTextChanged);
        m_richEditBox->SelectionFlyout = nullptr;
-        m_richEditBox->EquationSubmitted +=
-            ref new EventHandler<MathRichEditBoxSubmission ^>(this, &EquationTextBox::OnEquationSubmitted);
+        m_richEditBox->EquationSubmitted += ref new EventHandler<MathRichEditBoxSubmission ^>(this, &EquationTextBox::OnEquationSubmitted);
        m_richEditBox->FormatRequest += ref new EventHandler<MathRichEditBoxFormatRequest ^>(this, &EquationTextBox::OnEquationFormatRequested);
    }

@@ -160,6 +160,12 @@ void EquationTextBox::OnColorFlyoutClosed(Object ^ sender, Object ^ e)
    UpdateCommonVisualState();
 }

+void EquationTextBox::OnRichEditTextChanged(Object ^ sender, RoutedEventArgs ^ e)
+{
+    UpdateCommonVisualState();
+    UpdateButtonsVisualState();
+}
+
 void EquationTextBox::OnRichEditBoxGotFocus(Object ^ sender, RoutedEventArgs ^ e)
 {
    m_HasFocus = true;
@@ -182,7 +188,7 @@ void EquationTextBox::OnDeleteButtonClicked(Object ^ sender, RoutedEventArgs ^ e
 {
    if (m_richEditBox != nullptr)
    {
-        m_richEditBox->MathText = L"";
+        m_richEditBox->TextDocument->SetText(::TextSetOptions::None, "");
        if (m_functionButton)
        {
            m_functionButton->IsEnabled = false;
@@ -248,14 +254,14 @@ void EquationTextBox::UpdateButtonsVisualState()
 {
    String ^ state;

-    if (IsAddEquationMode)
-    {
-        state = "ButtonHideRemove";
-    }
-    else if (RichEditHasContent())
+    if (m_HasFocus && RichEditHasContent())
    {
        state = "ButtonVisible";
    }
+    else if (IsAddEquationMode)
+    {
+        state = "ButtonHideRemove";
+    }
    else
    {
        state = "ButtonCollapsed";
@@ -272,6 +278,10 @@ void EquationTextBox::UpdateCommonVisualState()
    {
        state = "FocusedError";
    }
+    else if (IsAddEquationMode && ((m_HasFocus || m_isPointerOver) && !RichEditHasContent()))
+    {
+        state = "AddEquation";
+    }
    else if (m_HasFocus)
    {
        state = "Focused";
@@ -338,21 +348,21 @@ bool EquationTextBox::RichEditHasContent()

    if (m_richEditBox != nullptr)
    {
-        text = m_richEditBox->MathText;
+        m_richEditBox->TextDocument->GetText(Windows::UI::Text::TextGetOptions::NoHidden, &text);
    }
-    return !text->IsEmpty() && m_HasFocus;
+    return !text->IsEmpty();
 }

 void EquationTextBox::OnRichEditMenuOpening(Object ^ /*sender*/, Object ^ /*args*/)
 {
    if (m_kgfEquationMenuItem != nullptr)
    {
-        m_kgfEquationMenuItem->IsEnabled = RichEditHasContent();
+        m_kgfEquationMenuItem->IsEnabled = m_HasFocus && RichEditHasContent();
    }

    if (m_colorChooserMenuItem != nullptr)
    {
-        m_colorChooserMenuItem->IsEnabled = !HasError;
+        m_colorChooserMenuItem->IsEnabled = !HasError && !IsAddEquationMode;
    }
 }

--- a/src/Calculator/Controls/EquationTextBox.h
+++ b/src/Calculator/Controls/EquationTextBox.h
@@ -52,6 +52,7 @@ namespace CalculatorApp

            void OnRichEditBoxGotFocus(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
            void OnRichEditBoxLostFocus(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);
+            void OnRichEditTextChanged(Platform::Object ^ sender, Windows::UI::Xaml::RoutedEventArgs ^ e);

            void OnDeleteButtonClicked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
            void OnEquationButtonClicked(Platform::Object^ sender, Windows::UI::Xaml::RoutedEventArgs^ e);
--- a/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml
+++ b/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml
@@ -244,6 +244,12 @@
                                                <SolidColorBrush x:Key="EquationBoxAddBackgroundBrush" Color="#9d000000"/>
                                                <SolidColorBrush x:Key="EquationBoxErrorBackgroundBrush" Color="#33EB5757"/>
                                                <SolidColorBrush x:Key="EquationBoxErrorBorderBrush" Color="#FFEB5757"/>
+                                                <SolidColorBrush x:Key="EquationButtonHideLineForegroundBrush"
+                                                                 Opacity="0.6"
+                                                                 Color="{StaticResource SystemChromeWhiteColor}"/>
+                                                <SolidColorBrush x:Key="EquationButtonHideLineBackgroundBrush"
+                                                                 Opacity="0.4"
+                                                                 Color="#FFFFFF"/>
                                                <Thickness x:Key="EquationTextBoxBorderThickness">0,1,1,1</Thickness>
                                            </ResourceDictionary>
                                            <ResourceDictionary x:Key="Light">
@@ -255,6 +261,10 @@
                                                <SolidColorBrush x:Key="EquationBoxAddBackgroundBrush" Color="#D0FFFFFF"/>
                                                <SolidColorBrush x:Key="EquationBoxErrorBackgroundBrush" Color="#33EB5757"/>
                                                <SolidColorBrush x:Key="EquationBoxErrorBorderBrush" Color="#FFEB5757"/>
+                                                <SolidColorBrush x:Key="EquationButtonHideLineForegroundBrush" Color="{StaticResource SystemChromeWhiteColor}"/>
+                                                <SolidColorBrush x:Key="EquationButtonHideLineBackgroundBrush"
+                                                                 Opacity="0.4"
+                                                                 Color="#000000"/>
                                                <Thickness x:Key="EquationTextBoxBorderThickness">0,1,1,1</Thickness>
                                            </ResourceDictionary>
                                            <ResourceDictionary x:Key="HighContrast">
@@ -267,6 +277,8 @@
                                                <SolidColorBrush x:Key="EquationBoxErrorBackgroundBrush" Color="{ThemeResource SystemColorButtonFaceColor}"/>
                                                <SolidColorBrush x:Key="EquationBoxErrorBorderBrush" Color="{ThemeResource SystemColorButtonTextColor}"/>
                                                <Thickness x:Key="EquationTextBoxBorderThickness">1</Thickness>
+                                                <SolidColorBrush x:Key="EquationButtonHideLineForegroundBrush" Color="{ThemeResource SystemColorButtonTextColor}"/>
+                                                <SolidColorBrush x:Key="EquationButtonHideLineBackgroundBrush" Color="{ThemeResource SystemColorGrayTextColor}"/>
                                            </ResourceDictionary>
                                        </ResourceDictionary.ThemeDictionaries>
                                    </ResourceDictionary>
@@ -289,7 +301,11 @@
                                        </VisualState>
                                        <VisualState x:Name="AddEquation">
                                            <VisualState.Setters>
-                                                <Setter Target="EquationBoxBorder.Background" Value="{ThemeResource EquationBoxAddBackgroundBrush}"/>
+                                                <Setter Target="FunctionNumberLabelTextBlock.Visibility" Value="Collapsed"/>
+                                                <Setter Target="EquationButton.Background" Value="{ThemeResource EquationButtonHideLineBackgroundBrush}"/>
+                                                <Setter Target="EquationButton.BorderBrush" Value="{ThemeResource EquationButtonHideLineBackgroundBrush}"/>
+                                                <Setter Target="EquationButton.Foreground" Value="{ThemeResource EquationButtonHideLineForegroundBrush}"/>
+                                                <Setter Target="EquationButton.IsEnabled" Value="false"/>
                                            </VisualState.Setters>
                                        </VisualState>
                                        <VisualState x:Name="Error">
@@ -377,7 +393,8 @@
                                                    FlowDirection="LeftToRight"
                                                    Orientation="Horizontal">
                                            <FontIcon FontFamily="{StaticResource CalculatorFontFamily}" Glyph="&#xF893;"/>
-                                            <TextBlock Margin="-5,19,0,0"
+                                            <TextBlock x:Name="FunctionNumberLabelTextBlock"
+                                                       Margin="-5,19,0,0"
                                                       FontSize="11"
                                                       Text="{TemplateBinding EquationButtonContentIndex}"/>
                                        </StackPanel>
@@ -398,12 +415,6 @@
                                                    <SolidColorBrush x:Key="ToggleButtonBackgroundPressed" Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=EquationColor.Color}"/>
                                                    <SolidColorBrush x:Key="ToggleButtonForegroundPressed" Color="{ThemeResource SystemChromeWhiteColor}"/>
                                                    <SolidColorBrush x:Key="ToggleButtonBorderBrushPressed" Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=EquationColor.Color}"/>
-                                                    <SolidColorBrush x:Key="EquationButtonHideLineForegroundBrush"
-                                                                     Opacity="0.6"
-                                                                     Color="{StaticResource SystemChromeWhiteColor}"/>
-                                                    <SolidColorBrush x:Key="EquationButtonHideLineBackgroundBrush"
-                                                                     Opacity="0.4"
-                                                                     Color="#FFFFFF"/>
                                                    <StaticResource x:Key="ToggleButtonBackgroundChecked" ResourceKey="EquationButtonHideLineBackgroundBrush"/>
                                                    <StaticResource x:Key="ToggleButtonBorderBrushChecked" ResourceKey="EquationButtonHideLineBackgroundBrush"/>
                                                    <StaticResource x:Key="ToggleButtonForegroundChecked" ResourceKey="EquationButtonHideLineForegroundBrush"/>
@@ -427,10 +438,6 @@
                                                    <SolidColorBrush x:Key="ToggleButtonBackgroundPressed" Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=EquationColor.Color}"/>
                                                    <SolidColorBrush x:Key="ToggleButtonForegroundPressed" Color="{ThemeResource SystemChromeWhiteColor}"/>
                                                    <SolidColorBrush x:Key="ToggleButtonBorderBrushPressed" Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=EquationColor.Color}"/>
-                                                    <SolidColorBrush x:Key="EquationButtonHideLineForegroundBrush" Color="{StaticResource SystemChromeWhiteColor}"/>
-                                                    <SolidColorBrush x:Key="EquationButtonHideLineBackgroundBrush"
-                                                                     Opacity="0.4"
-                                                                     Color="#000000"/>
                                                    <StaticResource x:Key="ToggleButtonBackgroundChecked" ResourceKey="EquationButtonHideLineBackgroundBrush"/>
                                                    <StaticResource x:Key="ToggleButtonBorderBrushChecked" ResourceKey="EquationButtonHideLineBackgroundBrush"/>
                                                    <StaticResource x:Key="ToggleButtonForegroundChecked" ResourceKey="EquationButtonHideLineForegroundBrush"/>
@@ -451,19 +458,19 @@
                                    </ToggleButton.Resources>
                                    <ToggleButton.Style>
                                        <Style TargetType="ToggleButton">
+                                            <Setter Property="Background" Value="{ThemeResource ToggleButtonBackground}"/>
+                                            <Setter Property="BorderBrush" Value="{ThemeResource ToggleButtonBorderBrush}"/>
                                            <Setter Property="Template">
                                                <Setter.Value>
                                                    <ControlTemplate TargetType="ToggleButton">
                                                        <Grid x:Name="RootGrid"
-                                                              Background="Transparent"
-                                                              BorderBrush="Transparent"
+                                                              Background="{TemplateBinding Background}"
+                                                              BorderBrush="{TemplateBinding BorderBrush}"
                                                              BorderThickness="1">
                                                            <VisualStateManager.VisualStateGroups>
                                                                <VisualStateGroup x:Name="CommonStates">
                                                                    <VisualState x:Name="Normal">
                                                                        <VisualState.Setters>
-                                                                            <Setter Target="RootGrid.Background" Value="{ThemeResource ToggleButtonBackground}"/>
-                                                                            <Setter Target="RootGrid.BorderBrush" Value="{ThemeResource ToggleButtonBorderBrush}"/>
                                                                            <Setter Target="Overlay.Opacity" Value="0.0"/>
                                                                            <Setter Target="ContentPresenter.Visibility" Value="Visible"/>
                                                                            <Setter Target="ShowHideIcon.Visibility" Value="Collapsed"/>
--- a/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp
+++ b/src/Calculator/Views/GraphingCalculator/EquationInputArea.xaml.cpp
@@ -179,18 +179,28 @@ void EquationInputArea::EquationTextBox_RemoveButtonClicked(Object ^ sender, Rou
    auto tb = static_cast<EquationTextBox ^>(sender);
    auto eq = static_cast<EquationViewModel ^>(tb->DataContext);
    unsigned int index;
+
    if (Equations->IndexOf(eq, &index))
    {
-        if (eq->FunctionLabelIndex == m_lastFunctionLabelIndex)
+        // Prevent removing the last equation
+        if (index == Equations->Size - 1)
        {
-            m_lastFunctionLabelIndex--;
+            return;
        }

-        if (index == Equations->Size - 1 && Equations->Size > 1)
-        {
-            Equations->GetAt(Equations->Size - 2)->IsLastItemInList = true;
-        }
        Equations->RemoveAt(index);
+        int lastIndex = Equations->Size - 1;
+
+        if (Equations->Size <= 1)
+        {
+            m_lastFunctionLabelIndex = 1;
+        }
+        else
+        {
+            m_lastFunctionLabelIndex = Equations->GetAt(lastIndex - 1)->FunctionLabelIndex + 1;
+        }
+
+        Equations->GetAt(lastIndex)->FunctionLabelIndex = m_lastFunctionLabelIndex;
    }
 }