Yet Another Calculator

In this post, I will introduce my simple web-based calculator Hasap and I will briefly talk about why I built it.

People are using/building calculators for a long time. Abacus is one of the very early calculators.

According to Wikipedia, it is as old as 5000 years. Now we have advanced calculators that could solve mathematical expressions and equations.

When I need to perform some math calculations on a computer, most of the time I use google or duckduckgo. I won’t do advanced things. I just need to make simple calculations. I expect them to be useful and user-friendly but I get angry when they couldn’t do what I wanted properly.

For example, let’s calculate `sin(30-sin(90))` by using the degree as angle units.

You can see that even if I click on `Deg` button, the calculations do not change. It should result in something close to 0.5. It is annoying that it can’t perform such a simple thing. Isn’t it?

I also tried duckduckgo.

As you can see, it does not give any output. That’s even worse.

I also tried the default calculator app in windows 10 operating system. It is awesome. It is open-source. It looks neat and it has a sleek user interface. It has many functionalities. It is very rich in terms of functionality.

But let say I’m calculating this long-expression.

sin(30)+cos(45-tan(23)) + e² + 1

Firstly, I should type `30` and then I should press to `sin`. This is simply not intuitive. I want to calculate `sin(30)`. I feel like I should type `sin` first.

Secondly, I don’t even know how could I enter a nested expression in one line. Here I want to enter `cos(45-tan(23))` but I should calculate the result of `tan(23)` first and then remove it from`45` and then I should call `cos` function. What happens if I should have typed `24` instead of `23`. I should make all these calculations again. That sucks.

Thirdly, I would like to copy and paste things and get results. I can copy the results with right-click and copy. That’s good but not enough for me.

So as an angry developer and user I said “let’s build a calculator for myself” That’s why I built Hasap. I believe a calculator which exists for more than 5000 years should be user-friendly, intuitive, and handy.

Firstly, Hasap is web-based you can simply use it from any web browser.

Hasap is a PWA You can download it use it without the Internet connection.

Hasap does not have `=` button. Why I should press a button to see the results of my simple math expressions. I have a processor that can make 10⁹ calculations every second (I know you all have). Its clock speed is around Gigahertz, it can calculate expressions as soon as I press a button. I think that’s necessary. I think people deserve to utilize their powerful processors like this ;)

Hasap uses math.js for calculating expressions. So it has all the functions defined in math.js such as isPrime, ceil, cube, etc… I find math.js very useful and generous effort.

In Hasap, you can copy-paste expressions or results of the expressions.

It has four modes: “standard”, “extended”, “programmer”, and “date & time”. “date & time” mode provides facilities to calculate things related to date and time. Firstly, in this mode results are shown in 2 different formats. There will be a result in the format of a date and another result in the form of a human-readable time unit. Here you can calculate things like that is the date after 11 days from now. Or you can see the time difference between 2 dates.

One of the use cases might be this. Let’s say my visa is valid for 90 days, and I’m planning to buy round-trip flight tickets. If the date of my first ticket is 10 November 2020, when should I buy my return ticket? That’s an important question because if you take your ticket 1 day late, you might get a little trouble. (trust me I did;)

As you see from the above image, I should buy the ticket for the 8th of February at the latest. Since how they count the days and hours might change, it is best to buy the ticket for the 7th of February.

Another use case that I use is to estimate the execution time for a program. Let’s say I coded a program that takes 135 milliseconds to complete. If I need to run this program 1000 times, how much time should I wait?

As you can see from the image above, it takes 2 minutes and 15 seconds.

“standard” mode and “extended” mode are very similar. Only the virtual keyboard changes. In “programmer” mode, you can make calculations in 4 different bases and see the results in 4 different bases. I inspired this from windows 10 calculator. I think they did a good job there.

Challenging things

• math.js does not support changing the angle unit in trigonometric functions. It always accepts radians. (I generated an issue for this) So I have to manually change all the values inside trigonometric expressions. This might look easy but expressions might be nested. So, for this reason, I have to use topological sorting and after that, I have to change values in the topological order.
• In the “date & time” mode, I wanted to show chips and standard input together. I wanted to use chips for dates. Dates are represented as unix time. I wanted to hide their actual values and show human-readable strings. This might be particularly useful for hiding real values and showing human-readable strings. I did ask a question on StackOverflow. It seems like I should build my own angular component for this.
• I wanted to EXACTLY sync pressing of a real key and pressed effect of a virtual button. I see that there is a small glitch in windows 10 app. I see that I should make a debounce time for pressing buttons greater than 500 ms. (I know almost no one will recognize this, but I spent lots of time on this and it is there ;)

Hasap is open-source. It built with angular and material theme. I always find material theme pretty nice and intuitive to use. I think angular is advanced and organized to make maintainable and stable projects. That’s why I used them. I hope Hasap will be useful for humans. At least, I used it from time to time ;)