Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React UI Improvements #7

Open
3 of 4 tasks
brio50 opened this issue Jul 24, 2023 · 1 comment
Open
3 of 4 tasks

React UI Improvements #7

brio50 opened this issue Jul 24, 2023 · 1 comment
Assignees
Labels
enhancement New feature or request

Comments

@brio50
Copy link
Owner

brio50 commented Jul 24, 2023

Input Fields

  • add input label to divisor drop-down, and use a default value of 1/16, this way we can remove input validation for this aspect of tool.
  • allow for numeric keyboard on mobile devices
  • allow mathematical expressions, triggered on = or just do the math provided
  • fix bug when "1." entered and "0" returned.
    • I believe input fields are "string" and feel that "1." may change type to "float." I need to enforce input option type specification/casting.
@brio50
Copy link
Owner Author

brio50 commented Aug 26, 2023

math.js is the way to perform calculations, it can parse the expression for validity and then evaluate it. There are problems though:

  1. on mobile keyboards for iphone, only a decimal is available in the numeric keypad.

  2. validateMeasurement will have to return a validity flag, along with the validated measurement value. The onChange*

    import { parse, evaluate } from 'mathjs';
    
    ...
    
    // TODO: mathematical expressions (only allow +, -, *, / symbols) keyed on = as input?
    function validateMeasurement(event) {
    
    var valid = true; // output 1
    var value = event.target.value; // output 2
    
    function parseValue(value) {
      
      ...
      
      // do math if string contains math operations
      if (value.match(/\d+\+$/)) {      // e.g.  2+
        valid = false;
        value = value;
        console.log("plus");
        return { valid, value };
      }
    
      try {
          parse(value);
          valid = true;
          value = evaluate(value);
          return { valid, value };
      }
      catch (ex) {
          console.log("Not a mathematical expression.");
      }
    
    const onChangeMM = (event) => {
    
    let {valid, value} = validateMeasurement(event)
    
    if (!valid) {
      setMM({
        ...millimeters,
        input: value,
        output: "",
        error: ""
      });
      return;
    }
    
  3. once we detect a mathematical expression is being input, we have to provide a calculate button to let the user tell us when they're done formatting the equation. A good example expression would be adding three measurements : 1 + 1.5 + 3+(5/8)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
Status: 🔖 Ready
Development

No branches or pull requests

1 participant