• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

MMM-Keyboard (a virtual touch keyboard)

Scheduled Pinned Locked Moved System
10 Posts 7 Posters 2.6k Views 8 Watching
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.
  • L Offline
    lally james @lavolp3
    last edited by lally james Aug 31, 2022, 7:11 AM Aug 31, 2022, 7:09 AM

    @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:

    [card:lavolp3/MMM-Keyboard]

    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
    • D Offline
      Dankodan
      last edited by Mar 11, 2024, 1:30 PM

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

      this.sendNotification(“KEYBOARD_INPUT”, {
      key: “uniqueKey”,
      message: “test”
      });
      sorry, which file should these parameters be inserted in, I can’t see the keyboard
      thanks

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

      S 1 Reply Last reply Mar 11, 2024, 1:58 PM Reply Quote 0
      • S Away
        sdetweil @Dankodan
        last edited by sdetweil Mar 11, 2024, 2:01 PM Mar 11, 2024, 1:58 PM

        @Dankodan that is how to send the notification via javascript code in some other module.

        there are many modules that can send notifications for you and allow you to configure them in config.js

        'KEYBOARD_INPUT”  is the notification id
        

        and

        {
        key: “uniqueKey”,
        message: “test”
        }
        

        is called the payload, or notification content/value

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        R 1 Reply Last reply Nov 25, 2024, 6:03 PM Reply Quote 0
        • R Offline
          reverendz @sdetweil
          last edited by Nov 25, 2024, 6:03 PM

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

          {
          key: “uniqueKey”,
          message: “test”
          }

          I’m having the same issue as the previous poster.

          I can’t figure out how to put this into the config.js and get it to work. When I put the example as listed, my config won’t build.

          Can you provide an example?

          Explicitly: the module (doesn’t matter which, ideally one of the defaults) and how it looks when you implement this.

          S 1 Reply Last reply Nov 25, 2024, 6:49 PM Reply Quote 0
          • S Away
            sdetweil @reverendz
            last edited by sdetweil Nov 25, 2024, 6:50 PM Nov 25, 2024, 6:49 PM

            @reverendz this is NOT a config.js set of code.

            from the module readme

            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",
                data: {},
            });
            

            and in the parms

            swype	boolean	false	Activate swipe mode (experimental!) (not implemented yet)
            alwaysShow	boolean	false	Always show keyboard. (not implemented yet)
            

            note, NOT IMPLEMENTED YET

            so, you SOME other module to invoke the notification
            maybe command to notification ( so you could do it from a terminal window/ssh session)

            see the third party list (linked in the header above) and put notification in the search field
            there are a lot to choose from

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            1 Reply Last reply Reply Quote 0
            • R reverendz referenced this topic on Nov 29, 2024, 9:06 PM
            • S sdetweil referenced this topic on Jan 18, 2025, 6:57 PM
            • 1 / 1
            • First post
              Last post
            Enjoying MagicMirror? Please consider a donation!
            MagicMirror created by Michael Teeuw.
            Forum managed by Sam, technical setup by Karsten.
            This forum is using NodeBB as its core | Contributors
            Contact | Privacy Policy