Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

example with keybinding and log #4

Closed
dirkk0 opened this issue Dec 18, 2022 · 3 comments
Closed

example with keybinding and log #4

dirkk0 opened this issue Dec 18, 2022 · 3 comments
Assignees
@Winterreisender
Labels
documentation Improvements or additions to documentation

Comments

@dirkk0
Copy link
Contributor

dirkk0 commented Dec 18, 2022

Hi,

thanks for the nodejs bindings, much appreciated!

Because it wasn't completely obvious for me I created an example with keybindings (which are platform specific, this is for a Mac) and logging.

Maybe this is helpful for someone.

const { Webview } = require("webview-nodejs");

html = `
<body>
  <div id="d1"></div>
  <script>
    let counter = 0
    window.addEventListener("keypress", (event) => {
      if (event.metaKey && event.key === 'q') {
        doCmd("quit")
        event.preventDefault();
      }
    })

    setInterval(function () {
      document.querySelector("#d1").innerText = counter
      doLog("counter is " + counter)
      counter += 1
    }, 1000);
  </script>
</body>
`

let w = new Webview(true);

w.size(600, 600);
w.html(html);

w.bind("doLog", (w, t) => {
  console.log(t);
  w.title(t)
});

w.bind("doCmd", (w, cmd) => {
  console.log("cmd:", cmd);
  if (cmd == "quit") w.terminate();
});

w.show();
@Winterreisender
Copy link
Owner

Thanks! Currently I'm preparing for a quite important exam and I'll add this to the examples later.

@Winterreisender Winterreisender added documentation Improvements or additions to documentation todo labels Dec 18, 2022
@dirkk0
Copy link
Contributor Author

dirkk0 commented Dec 18, 2022

no hurries! good luck for your exam!

@Winterreisender
Copy link
Owner

Winterreisender commented Dec 26, 2022 •
edited

I have added it to examples with a little changes for better compatibility.

  1. keypress -> keydown: Because the keypress event is deprecated according to MDN, and doesn't work on Windows
  2. event.metaKey -> event.metaKey || event.altKey: In Windows, the "Windows Search" poped up if you press ⊞+q. This change would make it works on both Windows and Mac.

Winterreisender added a commit that referenced this issue Dec 26, 2022
@Winterreisender
add a keybinding example from #4
5663acb
@Winterreisender Winterreisender self-assigned this Dec 26, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@Winterreisender Winterreisender

Labels
documentation Improvements or additions to documentation
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@dirkk0 @Winterreisender