Commit Graph
100 Commits
Author SHA1 Message Date
Arpad Csanyi 1f7e46bc8c Theme mouse action's active nav item to point on it's configuration. 2016-05-13 16:59:31 +02:00
Arpad Csanyi aca98e4760 Add basic interface for the scrolling action. 2016-05-13 10:25:36 +02:00
Arpad Csanyi 833964f054 Hide placeholder button. 2016-05-12 23:23:09 +02:00
Arpad Csanyi db5bfac0ac Add initial markup of the mouse cursor movement configuration. 2016-05-12 23:21:34 +02:00
Arpad Csanyi dae7972a00 Add initial layout of mouse speed interface. 2016-05-12 22:49:41 +02:00
Arpad Csanyi da44928169 Add compiled css related to the previous change. 2016-05-11 23:36:31 +02:00
Arpad Csanyi ba8c17f339 Initialize theming of the mouse edition interface. 2016-05-11 23:35:58 +02:00
Arpad Csanyi 128db4bf48 Call the new mouse event handler function.
Also apply some refactoring on the code for better readability.
2016-05-11 23:32:19 +02:00
Arpad Csanyi 5e2f10d72f Add event handler for switching between mouse actions. 2016-05-11 23:31:28 +02:00
Arpad Csanyi 319691efd1 Improve markup of the mouse action editor. 2016-05-11 23:30:28 +02:00
Arpad Csanyi d62167fd01 Change the basic layout of the mouse edition interface. 2016-05-11 23:29:22 +02:00
Arpad Csanyi 9d38fda72b Toggle the help text based on the selected option. Fixes #43 2016-05-10 00:22:14 +02:00
Arpad Csanyi 911e51b6d1 Update markup to display only the relevant help text. #43 2016-05-10 00:21:16 +02:00
Arpad Csanyi 9516de2f9f Fix classnames of select2 on the layer tab. 2016-05-10 00:07:17 +02:00
Arpad Csanyi 8dedbcc06e Remove select2's search from the layer tab. #43 2016-05-09 23:58:53 +02:00
Arpad Csanyi 9bb0145e71 Add possibility to remove search box from select2. #43 2016-05-09 23:56:54 +02:00
Arpad Csanyi 82ce5accab Resolving #41 by adding css related to the previous change. 2016-05-09 23:20:38 +02:00
Arpad Csanyi e64f162896 Add GitHub ribbon to the bottom right corner. #41
The css pulled in with cdnjs didn't look good, so it was easier to put
this into our css.
2016-05-09 23:18:35 +02:00
Arpad Csanyi 864941e5ae Update the help text on the "Long press action". #23 2016-05-08 23:25:27 +02:00
Arpad Csanyi 1f2c0a1787 Fix the alignment of the "Capture Keystroke" button. #23 2016-05-08 23:24:21 +02:00
Arpad Csanyi fe5ae29943 Remove help bubbles from the tab titles. 2016-05-08 23:15:46 +02:00
Arpad Csanyi 04d6ac6727 Remove unneeded styles related to the none action. 2016-05-08 23:09:58 +02:00
Arpad Csanyi 1d4c87ce06 Remove icon and change text of the none action. 2016-05-08 23:09:39 +02:00
Arpad Csanyi fa22e0f377 Remove edition related icons from the macro preview. 2016-05-08 22:58:49 +02:00
Arpad Csanyi 639637e60c Adjust the with of the select box on the keymap switching interface. 2016-05-08 22:54:30 +02:00
Arpad Csanyi 5e02c56d60 Change label on the keymap switching interface. 2016-05-08 22:51:45 +02:00
Arpad Csanyi f8069b81f1 Change label on the macro edition interface. 2016-05-08 22:50:43 +02:00
Arpad Csanyi 14f1a2775c Change the layer switcher editor's layout.
The end of the text varies based on the selected option:
- activate = holding
- toggle = pressing
2016-05-08 22:02:16 +02:00
Arpad Csanyi 71f1d16051 Show help bubble when a tab is selected. #22
This bubble can be set not to show anymore.
2016-05-07 20:47:54 +02:00
Arpad Csanyi 862a5fdf7d Add help text to the tabs of the keyeditor. #22 2016-05-07 20:47:20 +02:00
Arpad Csanyi 67127fbced Revert the title "Keycode" to "Keypress". #22. 2016-05-06 23:21:59 +02:00
Arpad Csanyi 0ed2816995 Add alternative icons for the scroll action. #27
Just found these arrows while looking for other mouse related graphics,
and wanted to try out.
2016-05-06 23:08:14 +02:00
Arpad Csanyi 49b64463eb Increase the with of the popover to fit in the new tab. #22 2016-05-05 23:18:12 +02:00
Arpad Csanyi 590bbab748 Remove old Layer action configuration. #22 2016-05-05 23:17:54 +02:00
Arpad Csanyi 45ca30784e Rename some tabs of the popover for better fit. #22
All the names consist of one word only.
The keypress has been changed to keycode, as actually all the other tabs
are configuring keypresses, just they are not sending a keycode.
2016-05-05 23:15:26 +02:00
Arpad Csanyi 2a08d1f19d Add Layer switcher tab to the key configuration popover. #22
The icons used in this commit are not final, as this is just a mockup,
and for this purpose it was easier to use fontawesome (as previously),
instead of adding the svgs.
2016-05-05 23:13:54 +02:00
Arpad Csanyi 93f7400f1d Delete the unneeded layer toggle key layout. 2016-05-04 00:31:16 +02:00
Arpad Csanyi e42d459f77 Add toggle icon. #27
This toggle icon can be used with the layer switcher keys.
2016-05-03 17:32:42 +02:00
Arpad Csanyi 9c9219e489 Add menu icon. It will more likely change in the future. #27 2016-05-03 17:29:49 +02:00
Arpad Csanyi 0b94f77257 Rename the modifier keys of the default layer.
This way we are following the naming convention of the other key icons.
2016-05-03 17:19:51 +02:00
Arpad Csanyi e02082e3d2 Add icon for the long press action. #27 2016-05-03 17:17:04 +02:00
Arpad Csanyi c84fe7a864 Fix typo in filenames. 2016-05-03 17:13:41 +02:00
Arpad Csanyi 0ed88d4792 Add modifier keys' icons. #27 2016-05-02 23:38:45 +02:00
Arpad Csanyi aa0c88e619 Fix typo in filenames. 2016-05-02 23:38:45 +02:00
Arpad Csanyi 70ea0318ac Add scroll and move directional icons. #27 2016-05-01 23:41:33 +02:00
Arpad Csanyi b2bce1c0d6 Modify layout of keys with two letters on it. #27 2016-04-30 15:10:17 +02:00
Arpad Csanyi 18ffc6f1c4 Key title layout when only multiple modifiers are selected. #27 2016-04-29 22:45:43 +02:00
Arpad Csanyi a926ce92c2 Add newly created mouse icon. #27 2016-04-28 22:41:33 +02:00
Arpad Csanyi 0cdc62755e Update the mouse icons on the layout with the new one. #27 2016-04-28 22:40:56 +02:00
Arpad Csanyi d17f10deda Add new mouse icons variants. #27 2016-04-27 23:13:59 +02:00
Arpad Csanyi 80862f16da Try a new icon for the mouse actions. #27 2016-04-26 01:53:03 +02:00
Arpad Csanyi 9374d55924 Add different layouts of the selected switch type. #27 2016-04-26 01:22:35 +02:00
Arpad Csanyi 2351975a49 Add Layer Switcher Action key title layouts. #27
These buttons are toggles, so you will be able to use your mouse layer
without having to hold the mouse "key" pressed. Acts like caps lock.
2016-04-26 00:48:38 +02:00
Arpad Csanyi 86d32dc6f8 Add new icon for the macros instead of the play icon. 2016-04-25 22:59:12 +02:00
Arpad Csanyi ade1408314 Create initial design of macro action key titles. #27 2016-04-24 23:34:20 +02:00
Arpad Csanyi 3123bb34b0 All program shortcuts are shown as the keys pressed simultaneously. #27
This is so, as a shortcut can be assigned in multiple programs without
interference, but on the key we can represent only one program(group)
for that shortcut defined on that key.
2016-04-24 22:50:17 +02:00
Arpad Csanyi 5a123d55c2 Add some more keys on the mod layer. #27 2016-04-23 21:32:00 +02:00
Arpad Csanyi 8ee071539c Create variant of layout layer switcher layout design: #27 2016-04-22 22:34:03 +02:00
Arpad Csanyi cbf42c760d Add missing keyboard icon. #27 2016-04-21 18:21:37 +02:00
Arpad Csanyi c651adbb21 Add Keymap Switching key title layout. #27 2016-04-20 23:25:38 +02:00
Arpad Csanyi 1cfbe35ae1 Add new icons used on the key titles. #27 2016-04-19 00:07:04 +02:00
Arpad Csanyi 44a93c329d Add new icons key title layouts to the fn layer. #27
This phase contains multiple ides:
- Lock, Search, Calculator: we have text and icon. Would just an icon
be enough?
- The browser related button on the second row are represented by their
shortcut. This can be set up on the keypress action interface.
- In the third line the first shortcut is for stepping back in the
  history. I wouldn't recognize it seeing it on a keyboard, but it's
  consistent with the shortcuts of the second row (which are more
  familiar for everybody)
- The other direction of the history navigation is "represented as the
  media buttons". This is more straightforward when looking at the
  keyboard than it's shortcut would be (cmd+]).
2016-04-18 23:28:12 +02:00
Arpad Csanyi 082103aa9e Fix permissions of example file. 2016-04-18 23:27:50 +02:00
Arpad Csanyi 9bbd5f39b1 Add icons for the fn layer. #27
The icon for the screen lock was created from two icons: display and
lock4.
2016-04-17 21:47:00 +02:00
Arpad Csanyi a2be0d4e25 Add first batch of icons for being able to work on the sprite. #27 2016-04-16 21:10:18 +02:00
Arpad Csanyi 387a4e12e8 Add mod layer designs with the menu key. #27 2016-04-16 15:41:21 +02:00
Arpad Csanyi 96c56c8081 Unify mouse icons + fix text size on some click action buttons. #27 2016-04-15 00:21:16 +02:00
Arpad Csanyi 1f26bd3034 Try mouse icon instead of mouse cursor icon on the given layer. #27 2016-04-14 23:50:02 +02:00
Arpad Csanyi 17ae4aab30 Add key title design for some media keys. #27 2016-04-14 02:20:21 +02:00
Arpad Csanyi e51b70eb66 Add key title designs for mouse clicks. #27 2016-04-14 00:15:25 +02:00
Arpad Csanyi 620f260c5b Add scroll key layouts. #27 2016-04-14 00:06:32 +02:00
Arpad Csanyi 8d572648c6 Add mouse movement key title designs. #27 2016-04-13 23:36:37 +02:00
Arpad Csanyi 9458509a8e Add file containing helper rects for alignments. #27
The magenta colored rects are the alignment helpers.
2016-04-13 21:54:17 +02:00
Arpad Csanyi 70c85c9a75 Update basic key title layouts. #27 2016-04-13 21:53:48 +02:00
Arpad Csanyi 9b040c6665 Modifier and layer switcher keys only have primary actions. #27
Possibly we can allow assigning multiple modifiers to a single key (e.g.
one keypress makes: ctrl+shift), so you wouldn't have to press two
modifiers. But that seems really and edge case.
2016-04-11 11:03:52 +02:00
Arpad Csanyi 6cc7fede82 Add some more layout ideas from keys: 1-3. #27. 2016-04-11 10:32:49 +02:00
Arpad Csanyi 41010cf220 Work on key layouts for the base layer. #27
The keys having a magenta background are the ones that are done. Changes
worth mentioning:
- key "4$" vs. "6^": see the difference of the two layout while having
  the same amount of information.
- key "9(" vs. "0)" (same as 7 vs. 8): the first key contains one
  text element and the spacing of between the top and bottom is based on
  line-height, while the second key is divided into 0.5-1-1-0.5
  portions, and the two text objects are aligned in the middle sections.
  This latter layout is more consistent with other parts of the keyboard
  as this same approach is used on the key "4$", and the benefit of this
  layout is that we don't have to deal with line-height, and can easier
  control the final layout.
2016-04-11 09:46:45 +02:00
Arpad Csanyi 7b1075c65f Create new design implementations of the keys. #27. 2016-04-06 23:37:30 +02:00
Arpad Csanyi 891d29ab2d Add design for the key titles. #27
On this picture there are good and bad examples as well. Check the
corresponding ticket for further information.
2016-04-01 10:34:11 +02:00
Arpad Csanyi 32b219a483 Remove red lines from keyboard designs. 2016-03-26 01:03:12 +01:00
Arpad Csanyi f844350782 Change the order of Scancode and Modifiers fixing #23.
I find the current spacing between the "Long press action" and the
"Modifiers" is enough, and not too much.
2016-03-26 00:54:25 +01:00
Arpad Csanyi 5099ea2f01 Close #21 by making the border of the popover's tip black. 2016-03-26 00:47:38 +01:00
Arpad Csanyi f5756a72bd Restructure scss file to make use of basic language features. 2016-03-26 00:45:56 +01:00
Arpad Csanyi 1c05abe9b9 Make scss file from old style.css and compile it as well. #21 2016-03-26 00:27:38 +01:00
Arpad Csanyi 60b11f9a69 Add css related to the previous change. #21 2016-03-26 00:26:59 +01:00
Arpad Csanyi 4c4717a982 Set currently selected key's color to the primary color. #21
This commit relates to #18 as well, as we will have to refactor the
color set here after finishing that issue.
2016-03-26 00:16:39 +01:00
Arpad Csanyi c62b8506e9 Close #19 by removing empty stars from the keymap menu items.
This way only the currently set default keymap will have an indicator in
the menu, and there won't be any interaction possible from there.
2016-03-26 00:00:06 +01:00
Arpad Csanyi 74cfe6d1af Close #20 by removing drag handles. 2016-03-25 23:32:52 +01:00
Arpad Csanyi 13e477d03c Recalculate .keyboard-slider height when changing imgs to svgs. #15.
If UI is loaded on a smaller screen, the svg will be cut in half as the
height of the image will be smaller then the height of the svg. There
could be other solutions for this, but this was the quickest, and it's
sufficient for the purpose of the mockup.
2016-03-17 16:08:36 +01:00
Arpad Csanyi 7ab20e4a6f Remove unneeded console.log(). 2016-03-17 16:08:18 +01:00
Arpad Csanyi af9a2416e2 Make the iframe 300px heigher so there will be space for dropdowns. #15 2016-03-17 16:04:48 +01:00
Arpad Csanyi d761c9c93f Fix typos. 2016-03-17 15:58:02 +01:00
Arpad Csanyi 0c8e9fe6f1 Quick mocking of the popover displaying functionality. #15
Its main purpose is to show colors and general layout. Precise
positioning is still missing.
2016-03-17 15:48:32 +01:00
Arpad Csanyi fd981fb79b Add basic theming to the keyedior popover (and iframe). #15 2016-03-17 15:47:47 +01:00
Arpad Csanyi c976cb056b Version of keyeditor popover designed to be displayed in popover. #15
This is needed as the other version has a small menu to switch between
the macro and the keyeditor mockups.
2016-03-17 15:45:56 +01:00
Arpad Csanyi 6585859346 Add iframe containing the keyeditor popover. #15 2016-03-17 15:44:52 +01:00
Arpad Csanyi c3d89d88d3 Fix keymap names. #15 2016-03-17 15:43:45 +01:00
Arpad Csanyi 7be4c27ce5 Change keyboard images SVG to inline SVG. Resolves #14. 2016-03-17 13:44:43 +01:00
Arpad Csanyi 589f2455ed Add missing (light) vertical bar for primary buttons. #6 2016-03-17 00:31:57 +01:00
Arpad Csanyi 32750c5121 Add basic sliding functionality. Resolves #6.
At least for the mockups I've chosen to use jQuery's animate function
for this functionality instead of css3 transitions. The reason is that I
have to compute widths with js, and the whole click event and class
addition/removal is handled there.
2016-03-17 00:29:35 +01:00