This post is part of a series. If you wish to support my work you can purchase the PDF book on gumroad.
This project uses Elm version 0.19
- Part 1 - Introduction
- Part 2 - Project Setup
- Part 3 - Add CSS
- Part 4 - Basic Operations
- Part 5 - Adding Decimal Support
- Part 6 - Supporting Negative Numbers
- Part 7 - Add Dirty State
- Part 8 - Support Keypad Input
- Part 9 - Combination Key Input (this post)
- Part 10 - Testing
- Part 11 - Netlify Deployment
- browse: https://gitlab.com/pianomanfrazier/elm-calculator/-/tree/v0.9
- diff: https://gitlab.com/pianomanfrazier/elm-calculator/-/compare/v0.9...v0.10
- ellie: https://ellie-app.com/72nYc5Zj9Hma1
Users can press backspace to delete a single digit. How would we allow the user to clear the whole input area? Or clear the whole stack?
We'll provide a keyboard combination to support this. So we can allow users to press CTRL + BACKSPACE and it would clear the input box and CTRL + SHIFT + BACKSPACE would clear the whole stack.
We have already done the hard work in the previous chapter. We need to tweak our update function to check for CTRL + SHIFT or just CTRL before we check the other keys.
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
...
HandleKeyboardEvent event ->
if event.ctrlKey && event.shiftKey then
case event.keyCode of
KK.Backspace ->
update ClearAll model
_ ->
( model, Cmd.none )
else if event.ctrlKey then
case event.keyCode of
KK.Backspace ->
update Clear model
_ ->
( model, Cmd.none )
else
case event.keyCode of
KK.Multiply ->
...
And that's it. We now have key combos.
The next chapter will cover testing. We will write a test using elm-test and elm-program-test to verify our calculator.