From 4b9d3b66feb0f55adeaf666f0d93e040aa405ab9 Mon Sep 17 00:00:00 2001 From: jdmedlock Date: Tue, 9 Apr 2019 17:35:39 -0500 Subject: [PATCH] Feature: Add calculator app specification Add calculator app specification Resolves: N/a See also: N/a --- .DS_Store | Bin 0 -> 6148 bytes Projects/Calculator-App.md | 57 +++++++++++++++++++++++++++++++++++++ README.md | 1 + 3 files changed, 58 insertions(+) create mode 100644 .DS_Store create mode 100644 Projects/Calculator-App.md diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..bca7eea7a56d9f00aea82ef56539a1d3fd7b50cf GIT binary patch literal 6148 zcmeHKyG{c!5S)b+C()#&^e^xSRuuY3`2j>igCd;1(3{??ajL@0s)|36Qdk+;pO-- ck}|LPocq0SN(?&VK_}{Gz;%&Hfom)93qA)GhyVZp literal 0 HcmV?d00001 diff --git a/Projects/Calculator-App.md b/Projects/Calculator-App.md new file mode 100644 index 00000000..b6494bb9 --- /dev/null +++ b/Projects/Calculator-App.md @@ -0,0 +1,57 @@ +# Calculator + +**Tier:** 1-Beginner + +Calculators are not only one of the most useful tools available, but they are +also a great way to understand UI and event processing in an application. In +this problem you will create a calculator that supports basic arithmetic +calculations on integers. + +The styling is up to you so use your imagination and get creative! You might +also find it worth your time to experiment with the calculator app on your +mobile device to better understand basic functionality and edge cases. + +### Constraints + +- You may not use the `eval()` function to execute calculations + +## User Stories + +- [ ] User can see a display showing the current number entered or the +result of the last operation. +- [ ] User can see an entry pad containing buttons for the digits 0-9, +operations - '+', '-', '/', and '=', a 'C' button (for clear), and an 'AC' +button (for clear all). +- [ ] User can enter numbers as sequences up to 8 digits long by clicking on +digits in the entry pad. Entry of any digits more than 8 will be ignored. +- [ ] User can click on an operation button to display the result of that +operation on: + * the result of the preceeding operation and the last number entered OR + * the last two numbers entered OR + * the last number entered +- [ ] User can click the 'C' button to clear the last number or the last +operation. If the users last entry was an operation the display will be +updated to the value that preceded it. +- [ ] User can click the 'AC' button to clear all internal work areas and +to set the display to 0. +- [ ] User can see 'ERR' displayed if any operation would exceed the +8 digit maximum. + +## Bonus features + +- [ ] User can click a '+/-' button to change the sign of the number that is +currently displayed. +- [ ] User can see a decimal point ('.') button on the entry pad to that +allows floating point numbers up to 3 places to be entered and operations to +be carried out to the maximum number of decimal places entered for any one +number. + +## Useful links and resources + +- [Calculator (Wikipedia)](https://en.wikipedia.org/wiki/Calculator) +- [MDN](https://developer.mozilla.org/en-US/) + +## Example projects + +- [Javascript Calculator](https://codepen.io/giana/pen/GJMBEv) +- [React Calculator](https://codepen.io/mjijackson/pen/xOzyGX) diff --git a/README.md b/README.md index 8c016d11..ca1b3acf 100644 --- a/README.md +++ b/README.md @@ -41,6 +41,7 @@ required to complete them. | ---------------------------------------------------------------------- | --------------------------------------------------------- | ---------- | | [Bin2Dec](./Projects/Bin2Dec-App.md) | Binary-to-Decimal number converter | 1-Beginner | | [Border Radius Previewer](./Projects/Border-Radius-Previewer.md) | Preview how CSS3 border-radius values affect an element | 1-Beginner | +| [🌟Calculator](./Projects/Calculator-App.md) | Calculator | 1-Beginner | | [Christmas Lights](./Projects/Christmas-Lights-App.md) | Simulate a string of Christmas lights | 1-Beginner | | [Cause Effect App](./Projects/Cause-Effect-App.md) | Click list item to display item details | 1-Beginner | | [Color Cycle](./Projects/Color-Cycle-App.md) | Cycle a color value through incremental changes | 1-Beginner |