Create EquationTextBox control

[joseartrivera]

Description of the changes:

As part of #338, this PR creates the EquationBoxControl which contains some of the styling that will be used in the EquationArea. The control is still a little rough but I wanted to commit what I have so far so others can start building on top of it.

How changes were validated:

Manual testing, still a few bugs/kinks to work out which include:

• Existing bug that causes an equation to have a 0 inside of it
• Flickering of icons when entering analysis mode
• Still needs analysis mode visual states
• Still needs actual color picker, using stock color picker for now
• Need to figure out navigation for hover buttons

[mdtauk]

There may be room for some co-ordination with another control being made

NumberBox

And another proposal which was suggested. Similar to the Calender Date Picker - a control that when pressed would bring up a mini Calculator in a flyout.

[SavoySchuler]

@joseartrivera it would be a win for us if we could help calculator reduce the volume of code it has to maintain. Our requirements are still in the refining process at the proposal/spec link @mdtauk shared. Please let me know your thoughts!

Thanks for your eagle eyes across the Microsoft repos, @mdtauk!

[sanderl]

There's a perf issue when adding new functions. It looks like it is re-rendering the everything that was added except the first one each time you click the add button.

Since you mentioned this is an initial check-in, I don't think it should block this review, but I wanted to let you know about the issue.

[grochocki]

it would be a win for us if we could help calculator reduce the volume of code it has to maintain

Thanks, @mdtauk and @SavoySchuler for the suggestion! I've been monitoring the new NumberBox control, and it is really cool. In fact, we sent over a similar duplicate request we saw here in our repo (#453), since this felt like it would be better served my a platform control. I am glad to see it is progressing.

Unfortunately, I do not think NumberBox meets our needs for this feature. We are a little behind on publishing more details about this particular component of Graphing Calculator (spec), but we ultimately need much more customization of the entire equation input control as well as support for variables and math symbols.

Here are some renders:

[mdtauk]

it would be a win for us if we could help calculator reduce the volume of code it has to maintain

Thanks, @mdtauk and @SavoySchuler for the suggestion! I've been monitoring the new NumberBox control, and it is really cool. In fact, we sent over a similar duplicate request we saw here in our repo (#453), since this felt like it would be better served my a platform control. I am glad to see it is progressing.

Unfortunately, I do not think NumberBox meets our needs for this feature. We are a little behind on publishing more details about this particular component of Graphing Calculator (spec), but we ultimately need much more customization of the entire equation input control as well as support for variables and math symbols.

Here are some renders:
image removed

The Slider design is getting updated soon, so hopefully Calculator will just get that for free, unless you use a custom template.

Also the new controls are likely to use a 1 epx thick border, which that EquationBox seems to use, but it is missing the 2 epx CornerRadius.

I also proposed a formal Prefix and Suffix content property for the TextBox control, and this EquationBox looks like it is doing something similar. I am not sure if the proposal will be taken up, but it would be good to come up with a common design for it, which your EquationBox could define...

When making designs for the NumberBox - I tried to come up with a design which could sit alongside the TextField like controls which share a similar look right now.

[joseartrivera]

There's a perf issue when adding new functions. It looks like it is re-rendering the everything that was added except the first one each time you click the add button.

Since you mentioned this is an initial check-in, I don't think it should block this review, but I wanted to let you know about the issue.

Thanks for the buddy build! I noticed this too, I went ahead and added a fix to the perf issues but I think we should consider a different approach for how/when we update the graph. This should fix most of the perf issues for now though. I also merged with your work earlier this week and made the graph initialize without an equation.

[sanderl]

Updates look good.

[grochocki]

The Slider design is getting updated soon, so hopefully Calculator will just get that for free, unless you use a custom template.

Also the new controls are likely to use a 1 epx thick border, which that EquationBox seems to use, but it is missing the 2 epx CornerRadius.

Yep, we monitor design changes like this closely and will usually audit the entire app before bumping up MaxVersionTested to make sure we can account for these changes.