Add keybind to modals view

Author: Exauthor

src/components/LoginComponent.vue

@@ -67,7 +67,7 @@ export default {
 .login-menu
   position absolute
   right 0
-  z-index 10
+  z-index 5
   width 30ch
   overflow visible
   height 100%

src/components/MainModal.vue

@@ -55,6 +55,7 @@ export default {
 
 <style lang="stylus">
 .modal-background
+  z-index 6
   position absolute
   left 0
   top 0

src/components/SystemButtons.vue

@@ -22,7 +22,6 @@ export default {
       if (button === 'settings') {
         this.openActiveBlock({ id: 'settings' })
       } else {
-        // setTimeout(lightdm[button], 500);
         this.SET_PAGE({ key: 'activeModal', value: button})
       }
     }

src/components/widgets/DEChoice.vue

@@ -39,6 +39,8 @@ export default {
         return 'ubuntu'
       } if (key.indexOf('dde') > -1 || key.indexOf('deepin') > -1) {
         return 'deepin'
+      } if (key.indexOf('kodi') > -1 || key.indexOf('kodi') > -1) {
+        return 'kodi'
       } if (key.indexOf('lxde') > -1 || key.indexOf('lxqt') > -1) {
         return 'lxde'
       } if (key.indexOf('openbox') > -1 || key.indexOf('openbox') > -1) {

src/views/Index.vue

@@ -59,6 +59,9 @@ export default {
     keyPress(event) {
       const ENTER_CODE = 13
       const isFocusPassword = document.querySelector('#password:focus')
+
+      console.log(event)
+
       if (event.which === ENTER_CODE) {
         if (this.activeModal) {
           this.SET_PAGE({ key: 'event', value: { code: 'Enter' } })
@@ -71,6 +74,14 @@ export default {
         }
       }
 
+      if (event.altKey && event.which === 80) { // 80 is 'r' symbol
+        this.SET_PAGE({ key: 'activeModal', value: 'shutdown'})
+      } else if (event.altKey && event.which === 83) { // 83 is 'r' symbol
+        this.SET_PAGE({ key: 'activeModal', value: 'suspend'})
+      } else if (event.altKey && event.which === 82) { // 82 is 'r' symbol
+        this.SET_PAGE({ key: 'activeModal', value: 'restart'})
+      }
+
       if (event.key === 'Escape') {
         if (this.activeModal) {
           this.SET_PAGE({ key: 'activeModal', value: false })