Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ParisJS Nov. 2017 - - Coffee.js - How I hacked my coffee machine using JavaScript

ParisJS Nov. 2017 - - Coffee.js - How I hacked my coffee machine using JavaScript

Talk given at ParisJS Meetup in November 2017 about how I hacked my coffee machine using JavaScript. More information at http://bit.ly/coffee-js

Dominik Kundel

November 29, 2017
Tweet

More Decks by Dominik Kundel

Other Decks in Programming

Transcript

  1. ☕.js
    How I hacked my Coffee Machine
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  2. HI!
    ! I'm Dominik! !
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  3. About me
    Developer Evangelist at
    Get in touch with me!
    ! @dkundel
    " [email protected]
    # github/dkundel
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  4. How I hacked my ☕ Machine
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  5. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  6. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  7. Why?
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  8. 1. It's interes,ng
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  9. 2. "Alexa, make me a coffee"
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  10. 3. APIs for everything!
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  11. Why JS?
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  12. Why JS?
    1. The last +me I wrote C++ was in university
    2. I know JavaScript well which makes coding faster
    3. Wri+ng a web server is easy
    4. It's more challenging
    5. Hardware === eventDriven && JS === eventDriven
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  13. Op#ons?
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  14. Op#on 1: Espruino
    www.espruino.com
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  15. Op#on 1: Espruino
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  16. Op#on 2: Tessel
    tessel.io
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  17. Op#on 2: Tessel
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  18. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  19. Op#on 3: Johnny-Five
    johnny-five.io
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  20. Op#on 3: Johnny-Five
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  21. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  22. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  23. How?
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  24. Disclaimer
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  25. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  26. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  27. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  28. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  29. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  30. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  31. What We Knew
    • 8 cables/pins
    • 6 switches
    • 7 LEDs
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  32. Assump&ons
    1. One cable is ⚡
    2. We need at least 3 pins + power
    controlling the "
    3. We need at least 3 pins + power
    controlling the #
    4. What is the 8th cable for?
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  33. The Naive Approach
    const five = require('johnny-five');
    const Tessel = require('tessel-io');
    const board = new five.Board({
    io: new Tessel()
    });
    board.on('ready', () => {
    const p1 = new five.Pin({
    pin: 'b0',
    mode: 2
    });
    // ...
    const p8 = new five.Pin({
    pin: 'b7',
    mode: 2
    });
    const pins = [p1, /* ... */, p8];
    board.repl.inject({ pins: pins });
    });
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  34. The Naive Approach II
    const five = require('johnny-five');
    const Tessel = require('tessel-io');
    const board = new five.Board({
    io: new Tessel()
    });
    board.on('ready', () => {
    const p2 = new five.Pin({
    pin: 'b1' /*,
    mode: 2 */
    });
    // ...
    const p8 = new five.Pin({
    pin: 'b7' /*,
    mode: 2 */
    });
    const pins = [p2, /* ... */, p8];
    board.repl.inject({ pins: pins });
    });
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  35. Bu#ons? How About Bu#ons!
    board.on('ready', () => {
    // PIN declaration ...
    const b2 = new five.Button('b1');
    const b3 = new five.Button('b2');
    const b7 = new five.Button('b6');
    const b8 = new five.Button('b7');
    const buttons = [b2, b3, b7, b8];
    buttons.forEach(btn => {
    btn.on('press', () => console.log('Pressed button no.%d', btn.pin));
    btn.on('release', () => console.log('Released button no.%d', btn.pin));
    });
    });
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  36. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  37. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  38. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  39. We Are On To Something !
    • Pin 1 is ⚡ (turns on LED4, LED5, LED7)
    • Pin 4-6 can turn off " LED4, " LED5,
    " LED7
    • Pin 7-8 react on #
    • Pin 2 can manipulate # S3 && # S4
    • Pin 3 can manipulate # S1 && # S2
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  40. Back To The Drawing Board
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  41. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  42. To The Rescue!
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  43. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  44. ! Progress! !
    Pin 1-3 === ⚡
    Pin 4-6 === !
    Pin 7-8 === !???
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  45. Diodes!
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  46. It All Makes Sense!
    ! S1 = P3 ➡ P7
    ! S2 = P3 ➡ P8
    ! S3 = P2 ➡ P7
    ! S4 = P2 ➡ P8
    ! S5 = P1 ➡ P7
    ! S6 = P1 ➡ P8
    " LED7 (Power) = P1 ➡ P6
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  47. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  48. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  49. const espresso = new five.Relay({
    pin: 'a4',
    type: 'NO'
    });
    const grande = new five.Relay({
    pin: 'a5',
    type: 'NO'
    });
    const power = new five.Relay({
    pin: 'a6',
    type: 'NO'
    });
    espresso.close();
    grande.close();
    power.close();
    board.repl.inject({ espresso, grande, power });
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  50. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  51. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  52. IoT Coffee Machine?
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  53. 418 - I'm a teapot
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  54. IETF RFC 2324
    HTCPCP
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  55. Hyper Text Coffee Pot Control Protocol
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  56. Hyper Text Coffee Pot Control Protocol
    • Built on top of HTTP
    • Adds BREW method
    • Safe and Accept-Additions Headers
    • HTTP code 418
    • coffee: // URI scheme
    • many more things
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  57. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  58. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  59. ! It's Alive!! !
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  60. !
    Show me Code!
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  61. !
    github.com/dkundel/htcpcp-delonghi
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  62. What I learned:
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  63. !
    Reverse-engineering is a lot of fun
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  64. !
    Reverse-engineering is frustra/ng
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  65. JS ❤ Hardware
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  66. !
    Tessel 2 is great!
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  67. !
    Johnny-Five is super useful!
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  68. What's Next? !
    • Programma(cally determine state
    • Add more relays
    • Sugges(ons???
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  69. !
    bit.ly/coffee-js
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  70. !
    bit.ly/parisjs-coffee
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  71. Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide

  72. Any Ques)ons?
    Get in touch with me!
    ! Dominik Kundel
    " @dkundel
    # [email protected]
    $ github/dkundel
    Dominik Kundel | @dkundel | #coffeejs #htcpcp #parisjs

    View full-size slide