Review my simple calculator

Hello, I just created a simple calculator to test my dom manipulation skill. Please someone review it:smiley:
https://codepen.io/ankit-ghosh/pen/gOYmaPV

3 Likes

Yep not pro in java but seems good to me

1 Like

The UI is good. But could be better (Color choice and all).
Oh and Yeah it has some issues.
One issue was the appending the new user input/calculation on previous/recent calculation. As in when I finish one calculation and start another, my new input is put directly next to my previous result, To avoid this, a user has to clear the screen whenever they are to make a new calculation which is hectic. New input should automatically lead to clearing of old results from the screen.
The calculator would also be more awesome if it had two lines of display. one for the input(smaller font) and one for the result(bigger/bolder font). This helps a user to see their input and the result.

P.S.
I was only looking for issues. Other than that your calculator is pretty awesome​:ok_hand::wink:. Like; all my calculations were correct :100: had no operand hierarchy issues.

1 Like

@MosDamerad Thanks for letting me know the issue. I just fix the issue. Please check it again. Thanks for your reply:smiley:

https://codepen.io/ankit-ghosh/pen/gOYmaPV

1 Like

Yeah works well now. Although It remained in the history part. When I navigate through my recent calculations and try to start a new one by from a recent calculation. The new calculation is prepended again. Instead of getting the value from that calculation and appending it to THE new calculation.

here is what I mean:

calculation 1: 3+3 which is 6
calculation 2: 2+2 which is 4
calculation 3: 3+2 which is 5

I navigate backwards and stop on calculation 2 which has a value of 4 as the answer from the given calculation. Now What I want to do is access that value:4 and add it to a new value probably 8 by just pressing ‘+8’. Thus adding the value 4 before the ‘+8’ input

Do you get me?:neutral_face:

@MosDamerad yes, I clearly I understand what you are saying is you want to edit previous problem. Ok, thanks for your reply I will try to fix it

@Ankit006. I want to get the value of the previous calculation: Calculation 2(which is 4 in my example) and add it to my new calculation. by pressing an operand button,

that is to say;

when i navigate to calculation 2 and press ‘+ 8’ button, my screen should start a new calculation that reads 4 + 8

which is 4(grabbed from the value from the recent calculations: calculation 2)
and the new ‘+ 8’ that i have pressed

1 Like

@MosDamerad hey thanks for your reply. I fix the code. now you can grab result of any previous problems. Please check it and if there is any other issue and any thing that need to add, please let me know and thanks again
https://codepen.io/ankit-ghosh/pen/gOYmaPV

@Ankit006 yea FIxed, Congrats!!. Can you do the 2 display lines issue. Where the calculations are on one line and the answer on another. Its not an issue in your code. Its just… Necessary.
After that we’ll talk about your U.I. If that’s OK with you.
The rest of the calculator is Awesome. I get correct answers from complex calculations. I’ll keep trying to task it with time.

1 Like

@MosDamerad thanks… I will try to add it so problem and answer will be in single display :grinning:

@MosDamerad I fix the issue. Now problem and answer will be show in same screen. Please check it out and if is there any other thing that I need to improve please let me know:smiley::smiley:
https://codepen.io/ankit-ghosh/pen/gOYmaPV

Actually I meant like in the image I attached.
calc.

Also make the contents right aligned.

BTW I have found another issue. :no_mouth:
Do you remember the bug you just fixed of accessing the value from previous calculations. Well we forgot to cater for when a user is navigating through the recent transactions, then when they stop on a calculation and start typing it appends again. :grimacing: This case a user is not typing an operand to access the value but just going through the recent calculations and then deciding to create a new calculation. In this instance the screen is not cleared to start off a new calculation but the new values are appended on the old calculation.:cold_face:

@MosDamerad Well…that actually a tricky one to solve. Because we don’t know if a user want to just edit history and start a new one when he is in history page. Even in google calculator when you are in history page and type any number or operator it’s always gonna appened this to that problem, it’s not going to clear the screen. well if user really want to start a whole new calculation then I can add button which will just clear the the screen and not gonna delete history. So, I don’t if there is any other to to do that:neutral_face::neutral_face:

@MosDamerad Well, I add a dedicated button AC. now just C is for clear the screen and AC for clear screen and also history. However, It will be hard to change screen view style now:sweat_smile::sweat_smile:. Because I use regex expression to add features which will match display text content and If I change screen view style now there will be many errrors. But I will try to change it:smiley::smiley:

@Ankit006 It looks beautiful.

  • I think the total calculation should replace the numbers you used to calculate the equation.
  • You can replace most of the ‘let’ with ‘const’ in the Javascript. Use const most of the time and ‘let’ when you know that the variable’s value will change.
  • Add babel to your project since you are using ES6 Javascript.
  • Remove the head section in Codepen because you do not need it. (Just add the Google font. Click on the cog icon in Codepen.)

@brandon_wallace Thanks for your reply. Well I thought thought that it will be great if user see their problem and solution in same screen. that Why the calculator show result and problem in same screen. Well I just recently learn js and DOM manipulation :sweat_smile: . So, I think this is the best I can do right now. But I will improve it when I know lot more about js and different type of framework. Thanks again for reviewing my calculator

@Ankit006 Okay, you can have the equation numbers shrink and move upwards to reveal the sum in larger number below. Your welcome bro.

@brandon_wallace Thanks I will try to do it:smiley::smiley: