Demo page
wmartins opened this issue · 13 comments
Hey, what do you think about create a demo page! A github demo page would be great!
I'm actually putting together a series of example pages which I'll be making part of the GitHub Pages site, which should be going up tonight or tomorrow sometime. If you have anything in particular you'd like to see, let me know!
The new docs/examples site is up at https://bitwalker.github.com/keys.js
Check out the Examples page for code examples on how to do specific things with the Keys.js API, and the Docs page for more in-depth information about the way Keys.js works. I'm fleshing both of these sections out pretty much continuously, so if there is anything you feel is missing, just create an issue with your request.
Thank you! This project is awesome!
When I was talking about some demo I was talking about to make some section in gh-pages that shows the keys.js in action, enter in the page, press some keys and 'voila', the magic happens =D! This is what I'm missing!
Can I submit an issue for that?
Sure I can add some live demos! I actually have a more complex one planned for just that purpose, and had thrown together a few smaller ones to test and use as references, so that's certainly a good suggestion. I'll reopen this issue for tracking progress on those (and so you get notifications for changes related to it). Thanks!
Oh! Thanks!
I thought about a complex demo too, but I'll wait to see if we had the same ideas (or, if I got some time, I'll submit a pull request with that :P)
Waiting for the complex demo!
I updated the site with demos of the current set of example code. The more complex demo I had in mind consisted of a basic command-mode text editor that mimics Vim. If you have something you'd like to see though, I'd love to hear it!
Man, the demos are awesome!
The Vim demo would be great, it's a very nice idea, also, it's very cool because you can show multiple bindings in just one example!
My idea is to have a virtual keyboard (or something like that) and let the user click (or just press) on the keys to make the bindings, and associate that binding with some predefined event (an alert, toggle background, etc.).
It would be nice because with the virtual keyboard you can set the combos without editing the code :)
I really like your idea of a visual keyboard when configuring key bindings in an application. Especially because you could then grey out keys that would result in invalid combinations as the user is inputting a combination (for instance, the user has CTRL+ALT held down, so DEL would be greyed out, and unavailable for binding).
I've actually implemented something like what you are describing (sans the visual keyboard element) in a Chrome extension I built for an internal web application at my company. It allows a non-programmer to configure keybindings for certain actions in the UI from the extension's options screen. I could certainly copy that over to a demo page, and maybe look into the visual keyboard element as a cool extra.
After some additional thought around what a comprehensive demo might look like, I've decided to shy away from my previous text editor idea. Instead I'm going to build a demo of a keyboard driven web mail application (not actually fully functional, but enough to make it's point), with user configurable keybindings like I've done before, but this time I'm going to see if I can integrate your visual keyboard idea into the equation. I've started building that this evening, and it's looking good so far, so I'll keep you posted on it's progress.
Overall I think the text editor scenario is significantly more rare than the keyboard driven web app scenario, which is why I'm changing my mind on the demo. I liked the idea of showing how to make it user friendly to manage keybindings for a non-programmer, and your suggestion gave me the missing link on that piece I think. We'll see how it turns out.
It's a nice idea, this demo will be awesome!
Waiting for that, if you need some help to make that, create a branch to that and if I get some time I can help you doing that :)
I finally wrapped up the demo app I was talking about. Sorry it took so long, but I have had limited time this week to work on it.
Man, this is one of the most awesome things I've ever seen!
It's really awesome, the settings, the keyboard, the bindings, the layout! Everything!
It's simple and powerful! Very good job!
Congratulations and thank you!
Thank you very much :), I'm glad you liked it! Your visual keyboard idea was fantastic, and I think it really makes the configuration of the bindings a lot more intuitive for users. It ended up turning out great, and helped me identify some issues in Keys.js that had slipped through my testing. Thanks again for the kind words!