Skip to content

A fun vintage-designed calculator app possessing sound effects on events, sound toggle feature, power on/off toggle, error checking and handling, screen clearing, character deletion and micro button-click animations all done with HTML, CSS and Javascript.

Notifications You must be signed in to change notification settings

johnnysedh3lllo/vintage-calculator-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

22 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Basic Calculator App

Introduction

A calculator app that can perform basic arithmetic operations and a few extra features for the fun of it.

Usage

To use the calculator app, click on the URL, then first turn on the calculator by clicking the power button to enable button usage. Begin entering numbers and operations. The app will display the result of each calculation as you go.

  • You can turn off the sound if you prefer the sound off, this can be achieved by clicking the sound button or pressing "M" on your keyboard.
  • You can also delete a character by pressing "D" on your keyboard and clear the screen by pressing "C" as well as clicking the buttons on the screen.
  • Calculating the square of a number can be done by pressing the multiplication key twice eg: "5^2" can be written as "5**".

Screenshots

Mobile View

Calculator Application

Tablet View

Calculator Application

Desktop View

Calculator Application

Features

  • Screen display of up to 12 characters (anything beyond that is a bug, not a feature lol).
  • Basic arithmetic operations
  • Neubrutalism Design
  • Responsive design
  • Screen clearing
  • Character deletion
  • Micro button-click interactions
  • Sound effects and sound toggle
  • Power on/off toggle
  • Error checking and handling
  • Keyboard usage

Unfinished features & Slight bugs

Due to my current skill set, I could not implement the following features for the app, so I would love to collaborate with you to complete the Implementation of them.

  • inactive state color for input screens and buttons
  • Percentage calculation
  • Keypress event for the power button
  • Input and Output history display
  • Thousands separation with comma
  • Line break on the display screen to display more than 12 characters.

Feedback

I'm always excited at the opportunity to learn practical, efficient, and overall effective ways of implementation. so if you have any feedback in regards to how the app works, how my code was structured, and any way I could've better written it. Please feel free to reach me at h3llloworld on Twitter. I'm looking forward to hearing from you.

Credits

Thanks to everyone that helped me build this.

About

A fun vintage-designed calculator app possessing sound effects on events, sound toggle feature, power on/off toggle, error checking and handling, screen clearing, character deletion and micro button-click animations all done with HTML, CSS and Javascript.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published