MagicMirror Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • Donate
    • Discord
    MagicMirror² v2.25.0 is available! For more information about this release, check out this topic.

    MMM-Keyboard (a virtual touch keyboard)

    System
    4
    6
    993
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • lavolp3
      lavolp3 Module Developer last edited by lavolp3

      Naaaa nanana Nana Nana
      You can touch this!

      As part of a bigger project to build a touch kitchen dashboard, I programmed a virtual touch keyboard based on the npm module simple-keyboard.
      This module can basically interact with every other module using the MM notification system!

      Download:

      https://github.com/lavolp3/MMM-Keyboard

      Screenshots:

      example screenshot

      Features:

      • working with MM’s notification system (see below), can interact with every other module you can think of! (the notification function needs to be programmed into the module)
      • supports en and de locales, more on request
      • standard and numeric keyboard supported

      Working with the Keyboard

      Opening the keyboard

      The keyboard works with MagicMirror’s notification system. You can broadcast notifications from another module using the following parameters

      this.sendNotification("KEYBOARD", {
          key: "uniqueKey",
          style: "default"
      });
      

      The payload of the notification must be an object containing two parameters:
      key: You can use any unique key, it is advised to use the module name. MMM-Keyboard will take the key and send it back for the module to understand it.
      style: Use “default” or “numbers” here

      Receiving data

      As soon as you hit the “SEND!”-Button the keyboard sends back the written content using the format

      this.sendNotification("KEYBOARD_INPUT", {
          key: "uniqueKey",
          message: "test"
      });
      

      You can fetch this message by checking for the key component. Here an example:

      notificationReceived : function (notification, payload) {
          if (notification == "KEYBOARD_INPUT" && payload.key === "uniqueKey") {
              console.log(payload.message);
          }
      },
      

      Implemented modules

      • MMM-Bring (PR prepared, not implemented into master yet)

      Planned:

      • MMM-Todo
      • an own Timer / Alarm module

      For further implementations, contact me or send it as an issue here!

      Thanks

      Thanks to @jheyman for alpha testing and Francisco Hodges for the beautiful simple-keyboard npm module!

      How to troubleshoot modules
      MMM-soccer v2, MMM-AVStock

      J L 2 Replies Last reply Reply Quote 1
      • J
        jheyman @lavolp3 last edited by

        @lavolp3
        I can’t thank you enough for building this, I have now completed my touchscreen dashboard using this, and it was an integral part in making it useful, to add things to my shopping list directly on the screen 👍

        temp.png

        lavolp3 1 Reply Last reply Reply Quote 1
        • lavolp3
          lavolp3 Module Developer @jheyman last edited by

          @jheyman Thanks for the nice words and happy it works! Looks great!

          How to troubleshoot modules
          MMM-soccer v2, MMM-AVStock

          lavolp3 1 Reply Last reply Reply Quote 0
          • lavolp3
            lavolp3 Module Developer @lavolp3 last edited by

            This module is now integrated into MMM-Bring.

            Currently working an adaption Microsoft ToDo with keyboard support .

            How to troubleshoot modules
            MMM-soccer v2, MMM-AVStock

            1 Reply Last reply Reply Quote 0
            • A
              ashleydaniel last edited by

              Looks really good, I did that on my last year project, but I forget that type of keyboard, because now I am using X-Bows Coupons curve keywords, and it helps me while typing my code.
              keyboard.jpg

              1 Reply Last reply Reply Quote 0
              • L
                lally james @lavolp3 last edited by lally james

                @lavolp3 said in MMM-Keyboard (a virtual touch keyboard):

                Naaaa nanana Nana Nana
                You can touch this!

                As part of a bigger project to build a touch kitchen dashboard, I programmed a virtual touch keyboard based on the npm module simple-keyboard.
                This module can basically interact with every other module using the MM notification system!

                Download:

                https://github.com/lavolp3/MMM- Keyboard

                Screenshots:

                example screenshot

                Features:

                • working with MM’s notification system (see below), can interact with every other module you can think of! (the notification function needs to be programmed into the module)
                • supports en and de locales, more on request
                • standard and numeric keyboard supported

                Working with the Keyboard

                Opening the keyboard

                The keyboard works with MagicMirror’s notification system. You can broadcast notifications from another module using the following parameters

                this.sendNotification("KEYBOARD", {
                    key: "uniqueKey",
                    style: "default"
                });
                

                The payload of the notification must be an object containing two parameters:
                key: You can use any unique key, it is advised to use the module name. MMM-Keyboard will take the key and send it back for the module to understand it.
                style: Use “default” or “numbers” here

                Receiving data

                As soon as you hit the “SEND!”-Button the keyboard sends back the written content using the format

                this.sendNotification("KEYBOARD_INPUT", {
                    key: "uniqueKey",
                    message: "test"
                });
                

                You can fetch this message by checking for the key component. Here an example:

                notificationReceived : function (notification, payload) {
                    if (notification == "KEYBOARD_INPUT" && payload.key === "uniqueKey") {
                        console.log(payload.message);
                    }
                },
                

                Implemented modules

                • MMM-Bring (PR prepared, not implemented into master yet)

                Planned:

                • MMM-Todo
                • an own Timer / Alarm module

                For further implementations, contact me or send it as an issue here!

                Thanks

                Thanks to @jheyman for alpha testing and Francisco Hodges for the beautiful simple-keyboard npm module!

                that is very detailed information i was looking for man thanks for sharing, love this sort of detailed information

                1 Reply Last reply Reply Quote 0
                • 1 / 1
                • First post
                  Last post
                Enjoying MagicMirror? Please consider a donation!
                MagicMirror created by Michael Teeuw.
                Forum managed by Paul-Vincent Roll and Rodrigo Ramírez Norambuena.
                This forum is using NodeBB as its core | Contributors
                Contact | Privacy Policy