From 82b066a832d1876a48b7fd6ca884c62dcaa70020 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=87=E5=A4=A9?= Date: Wed, 18 Nov 2020 19:24:49 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E6=AD=8C=E6=9B=B2=E6=89=AB?= =?UTF-8?q?=E6=8F=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/css/app.css | 2 +- src/css/app.scss | 2 +- src/index.html | 24 ++++++++-------- src/js/app.js | 49 +++++++++++++++++++++++++++++++-- src/js/lib/keyboard/index.js | 14 +--------- src/js/lib/keyboard/key.dict.js | 1 + 6 files changed, 64 insertions(+), 28 deletions(-) create mode 100644 src/js/lib/keyboard/key.dict.js diff --git a/src/css/app.css b/src/css/app.css index 4001d2e..45d57c5 100644 --- a/src/css/app.css +++ b/src/css/app.css @@ -1 +1 @@ -.app{position:relative;display:flex;flex-direction:column;width:100%;height:100%;background:rgba(0,0,0,0.3)}.app .title-bar{position:relative;display:flex;align-items:center;z-index:9;height:26px}.app .title-bar .btn-box{display:inline-flex;width:auto;height:12px;padding:0 8px}.app .title-bar .btn-box .item{display:inline-flex;width:12px;height:12px;margin:0 3px;background:url(/images/btn-grey.svg) no-repeat;background-size:cover}.app .title-bar .btn-box.focus .quit{background-image:url(/images/btn-close.svg)}.app .title-bar .btn-box.focus .min{background-image:url(/images/btn-mini.svg)}.app .title-bar .btn-box:hover .quit{background-image:url(/images/btn-close_a.svg)}.app .title-bar .btn-box:hover .min{background-image:url(/images/btn-mini_a.svg)}.app .main-body{overflow:hidden;flex:1;display:flex;justify-content:space-between}.app .main-body .aside{width:180px;height:100%;padding:0 16px;line-height:2}.app .main-body .aside fieldset{border:0;color:#ebebeb;font-size:12px}.app .main-body .aside fieldset legend{font-size:18px;background:linear-gradient(to bottom, #58ffdf 50%, #459888);-webkit-background-clip:text;background-clip:text;color:transparent}.app .main-body .aside fieldset .item{padding-left:12px;line-height:1.75}.app .main-body .aside fieldset button{width:42px;height:16px;margin-left:12px;font-size:10px;border:0;border-radius:9px;background:#64b5f6;color:#fff}.app .main-body .song-box{width:618px}.app .main-body .song-box .preview{position:relative;display:flex;align-items:center;width:100%;height:99px;padding-bottom:16px;border-bottom:1px solid rgba(200,200,200,0.1)}.app .main-body .song-box .preview .album{width:80px;height:80px}.app .main-body .song-box .preview .album img{width:100%;height:100%}.app .main-body .song-box .preview .info{display:flex;flex-direction:column;justify-content:center;width:320px;margin-left:32px}.app .main-body .song-box .preview .info strong{height:36px;font-size:18px;font-weight:normal}.app .main-body .song-box .preview .info cite{font-size:12px;font-style:normal}.app .main-body .song-box .preview .info p{font-size:12px;color:#bdbdbd}.app .main-body .song-box .preview .total{position:absolute;right:32px;bottom:16px;font-size:16px;font-weight:bold;font-family:Raleway}.app .main-body .song-box .scroll-box{width:100%;height:269px;padding:16px 6px;border-top:1px solid rgba(32,32,32,0.1)}.app .main-body .song-box .list{height:237px;font-size:12px}.app .main-body .song-box .list .item{display:flex;align-items:center;height:26px;padding:0 12px;border-radius:13px}.app .main-body .song-box .list .item .idx{position:relative;width:64px;padding-left:16px;font-size:12px;font-family:Raleway}.app .main-body .song-box .list .item .name{flex:1}.app .main-body .song-box .list .item .artist{width:128px;margin-left:12px}.app .main-body .song-box .list .item .duration{width:42px;margin-left:12px}.app .main-body .song-box .list .item.on{color:#feac23;font-size:14px}.app .main-body .song-box .list .item.on .idx::before{position:absolute;left:0;top:3px;font-size:10px;content:'▶ '}.app .main-body .song-box .list .item.active,.app .main-body .song-box .list .item:hover{color:#58ffdf;background:rgba(29,77,68,0.15)}.app .play-bar{height:66px;width:100%;background:rgba(255,255,255,0.25);color:#fff}.app .play-bar .stat-bar{display:flex;align-items:center;justify-content:space-between;height:20px;color:#ebebeb}.app .play-bar .stat-bar .time{width:42px;margin:0 6px;text-align:center;font-size:12px}.app .play-bar .stat-bar .progress{flex:1;display:flex;align-items:flex-start;height:3px;background:#b2cfe3}.app .play-bar .stat-bar .thumb{width:8%;height:3px;background:#58ffdf}.app .play-bar .ctrl-box{display:flex;align-items:center;height:42px}.app .play-bar .ctrl-box .holder{flex:1}.app .play-bar .ctrl-box .info{display:flex;flex-direction:column;justify-content:center;width:320px;height:42px;padding-left:12px;line-height:1.25}.app .play-bar .ctrl-box .info strong{font-size:14px;font-weight:500}.app .play-bar .ctrl-box .info cite{font-size:12px;font-style:normal;color:#aeaeae}.app .play-bar .ctrl-box .play-btn{display:flex;align-items:center;justify-content:space-between;width:120px;height:42px;margin-left:32px}.app .play-bar .ctrl-box .play-btn .item{width:22px;height:22px;background-repeat:no-repeat;background-size:cover;transition:background 0.1s ease-in-out;cursor:pointer}.app .play-bar .ctrl-box .play-btn .item.prev{background-image:url(/images/ctrl/prev.png)}.app .play-bar .ctrl-box .play-btn .item.prev:hover,.app .play-bar .ctrl-box .play-btn .item.prev:active{background-image:url(/images/ctrl/prev_a.png)}.app .play-bar .ctrl-box .play-btn .item.on,.app .play-bar .ctrl-box .play-btn .item.off{width:42px;height:42px}.app .play-bar .ctrl-box .play-btn .item.on{background-image:url(/images/ctrl/play.png);-webkit-animation:round 2s linear infinite;animation:round 2s linear infinite}.app .play-bar .ctrl-box .play-btn .item.on:hover,.app .play-bar .ctrl-box .play-btn .item.on:active{background-image:url(/images/ctrl/play_a.png)}.app .play-bar .ctrl-box .play-btn .item.off{background-image:url(/images/ctrl/pause.png)}.app .play-bar .ctrl-box .play-btn .item.off:hover,.app .play-bar .ctrl-box .play-btn .item.off:active{background-image:url(/images/ctrl/pause_a.png)}.app .play-bar .ctrl-box .play-btn .item.next{background-image:url(/images/ctrl/next.png)}.app .play-bar .ctrl-box .play-btn .item.next:hover,.app .play-bar .ctrl-box .play-btn .item.next:active{background-image:url(/images/ctrl/next_a.png)}.app .play-bar .ctrl-box .play-action{display:flex;align-items:center;justify-content:space-between;width:64px;height:22px;margin-right:16px}.app .play-bar .ctrl-box .play-action .item{width:22px;height:22px;background-repeat:no-repeat;background-size:cover;transition:background 0.1s ease-in-out;cursor:pointer}.app .play-bar .ctrl-box .play-action .item.volume{background-image:url(/images/ctrl/volume.png)}.app .play-bar .ctrl-box .play-action .item.volume:hover,.app .play-bar .ctrl-box .play-action .item.volume:active{background-image:url(/images/ctrl/volume_a.png)}.app .play-bar .ctrl-box .play-action .item.mute{background-image:url(/images/ctrl/mute.png)}.app .play-bar .ctrl-box .play-action .item.mute:hover,.app .play-bar .ctrl-box .play-action .item.mute:active{background-image:url(/images/ctrl/mute_a.png)}.app .play-bar .ctrl-box .play-action .item.single{background-image:url(/images/ctrl/single.png)}.app .play-bar .ctrl-box .play-action .item.single:hover,.app .play-bar .ctrl-box .play-action .item.single:active{background-image:url(/images/ctrl/single_a.png)}.app .play-bar .ctrl-box .play-action .item.all{background-image:url(/images/ctrl/all.png)}.app .play-bar .ctrl-box .play-action .item.all:hover,.app .play-bar .ctrl-box .play-action .item.all:active{background-image:url(/images/ctrl/all_a.png)}.app .play-bar .ctrl-box .play-action .item.rand{background-image:url(/images/ctrl/rand.png)}.app .play-bar .ctrl-box .play-action .item.rand:hover,.app .play-bar .ctrl-box .play-action .item.rand:active{background-image:url(/images/ctrl/rand_a.png)}@-webkit-keyframes round{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes round{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}} +.app{position:relative;display:flex;flex-direction:column;width:100%;height:100%;background:rgba(0,0,0,0.3)}.app .title-bar{position:relative;display:flex;align-items:center;z-index:9;height:26px}.app .title-bar .btn-box{display:inline-flex;width:auto;height:12px;padding:0 8px}.app .title-bar .btn-box .item{display:inline-flex;width:12px;height:12px;margin:0 3px;background:url(/images/btn-grey.svg) no-repeat;background-size:cover}.app .title-bar .btn-box.focus .quit{background-image:url(/images/btn-close.svg)}.app .title-bar .btn-box.focus .min{background-image:url(/images/btn-mini.svg)}.app .title-bar .btn-box:hover .quit{background-image:url(/images/btn-close_a.svg)}.app .title-bar .btn-box:hover .min{background-image:url(/images/btn-mini_a.svg)}.app .main-body{overflow:hidden;flex:1;display:flex;justify-content:space-between}.app .main-body .aside{width:180px;height:100%;padding:0 16px;line-height:2}.app .main-body .aside fieldset{border:0;color:#ebebeb;font-size:12px}.app .main-body .aside fieldset legend{font-size:18px;background:linear-gradient(to bottom, #58ffdf 50%, #459888);-webkit-background-clip:text;background-clip:text;color:transparent}.app .main-body .aside fieldset .item{padding-left:12px;line-height:1.75}.app .main-body .aside fieldset button{width:42px;height:16px;margin-left:12px;font-size:10px;border:0;border-radius:9px;background:#64b5f6;color:#fff}.app .main-body .song-box{width:618px}.app .main-body .song-box .preview{position:relative;display:flex;align-items:center;width:100%;height:99px;padding-bottom:16px;border-bottom:1px solid rgba(200,200,200,0.1)}.app .main-body .song-box .preview .album{width:80px;height:80px}.app .main-body .song-box .preview .album img{width:100%;height:100%}.app .main-body .song-box .preview .info{display:flex;flex-direction:column;justify-content:center;width:320px;margin-left:32px}.app .main-body .song-box .preview .info strong{height:36px;font-size:18px;font-weight:normal}.app .main-body .song-box .preview .info cite{font-size:12px;font-style:normal}.app .main-body .song-box .preview .info p{font-size:12px;color:#bdbdbd}.app .main-body .song-box .preview .total{position:absolute;right:32px;bottom:16px;font-size:16px;font-weight:bold;font-family:Raleway}.app .main-body .song-box .scroll-box{width:100%;height:269px;padding:16px 6px;border-top:1px solid rgba(32,32,32,0.1)}.app .main-body .song-box .list{height:237px;font-size:12px}.app .main-body .song-box .list .item{display:flex;align-items:center;height:26px;padding:0 12px;border-radius:13px}.app .main-body .song-box .list .item .idx{position:relative;width:64px;padding-left:16px;font-size:12px;font-family:Raleway}.app .main-body .song-box .list .item .name{flex:1}.app .main-body .song-box .list .item .artist{width:128px;margin-left:12px}.app .main-body .song-box .list .item .duration{width:42px;margin-left:12px}.app .main-body .song-box .list .item.on{color:#feac23;font-size:14px}.app .main-body .song-box .list .item.on .idx::before{position:absolute;left:0;top:3px;font-size:10px;content:'▶ '}.app .main-body .song-box .list .item.active,.app .main-body .song-box .list .item:hover{color:#58ffdf;background:rgba(29,77,68,0.15)}.app .play-bar{height:66px;width:100%;background:rgba(255,255,255,0.25);color:#fff}.app .play-bar .stat-bar{display:flex;align-items:center;justify-content:space-between;height:20px;color:#ebebeb}.app .play-bar .stat-bar .time{width:42px;margin:0 6px;text-align:center;font-size:12px}.app .play-bar .stat-bar .progress{flex:1;display:flex;align-items:flex-start;height:3px;background:#b2cfe3}.app .play-bar .stat-bar .thumb{height:3px;background:#58ffdf}.app .play-bar .ctrl-box{display:flex;align-items:center;height:42px}.app .play-bar .ctrl-box .holder{flex:1}.app .play-bar .ctrl-box .info{display:flex;flex-direction:column;justify-content:center;width:320px;height:42px;padding-left:12px;line-height:1.25}.app .play-bar .ctrl-box .info strong{font-size:14px;font-weight:500}.app .play-bar .ctrl-box .info cite{font-size:12px;font-style:normal;color:#aeaeae}.app .play-bar .ctrl-box .play-btn{display:flex;align-items:center;justify-content:space-between;width:120px;height:42px;margin-left:32px}.app .play-bar .ctrl-box .play-btn .item{width:22px;height:22px;background-repeat:no-repeat;background-size:cover;transition:background 0.1s ease-in-out;cursor:pointer}.app .play-bar .ctrl-box .play-btn .item.prev{background-image:url(/images/ctrl/prev.png)}.app .play-bar .ctrl-box .play-btn .item.prev:hover,.app .play-bar .ctrl-box .play-btn .item.prev:active{background-image:url(/images/ctrl/prev_a.png)}.app .play-bar .ctrl-box .play-btn .item.on,.app .play-bar .ctrl-box .play-btn .item.off{width:42px;height:42px}.app .play-bar .ctrl-box .play-btn .item.on{background-image:url(/images/ctrl/play.png);-webkit-animation:round 2s linear infinite;animation:round 2s linear infinite}.app .play-bar .ctrl-box .play-btn .item.on:hover,.app .play-bar .ctrl-box .play-btn .item.on:active{background-image:url(/images/ctrl/play_a.png)}.app .play-bar .ctrl-box .play-btn .item.off{background-image:url(/images/ctrl/pause.png)}.app .play-bar .ctrl-box .play-btn .item.off:hover,.app .play-bar .ctrl-box .play-btn .item.off:active{background-image:url(/images/ctrl/pause_a.png)}.app .play-bar .ctrl-box .play-btn .item.next{background-image:url(/images/ctrl/next.png)}.app .play-bar .ctrl-box .play-btn .item.next:hover,.app .play-bar .ctrl-box .play-btn .item.next:active{background-image:url(/images/ctrl/next_a.png)}.app .play-bar .ctrl-box .play-action{display:flex;align-items:center;justify-content:space-between;width:64px;height:22px;margin-right:16px}.app .play-bar .ctrl-box .play-action .item{width:22px;height:22px;background-repeat:no-repeat;background-size:cover;transition:background 0.1s ease-in-out;cursor:pointer}.app .play-bar .ctrl-box .play-action .item.volume{background-image:url(/images/ctrl/volume.png)}.app .play-bar .ctrl-box .play-action .item.volume:hover,.app .play-bar .ctrl-box .play-action .item.volume:active{background-image:url(/images/ctrl/volume_a.png)}.app .play-bar .ctrl-box .play-action .item.mute{background-image:url(/images/ctrl/mute.png)}.app .play-bar .ctrl-box .play-action .item.mute:hover,.app .play-bar .ctrl-box .play-action .item.mute:active{background-image:url(/images/ctrl/mute_a.png)}.app .play-bar .ctrl-box .play-action .item.single{background-image:url(/images/ctrl/single.png)}.app .play-bar .ctrl-box .play-action .item.single:hover,.app .play-bar .ctrl-box .play-action .item.single:active{background-image:url(/images/ctrl/single_a.png)}.app .play-bar .ctrl-box .play-action .item.all{background-image:url(/images/ctrl/all.png)}.app .play-bar .ctrl-box .play-action .item.all:hover,.app .play-bar .ctrl-box .play-action .item.all:active{background-image:url(/images/ctrl/all_a.png)}.app .play-bar .ctrl-box .play-action .item.rand{background-image:url(/images/ctrl/rand.png)}.app .play-bar .ctrl-box .play-action .item.rand:hover,.app .play-bar .ctrl-box .play-action .item.rand:active{background-image:url(/images/ctrl/rand_a.png)}@-webkit-keyframes round{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes round{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}} diff --git a/src/css/app.scss b/src/css/app.scss index c45a8cf..5e91053 100644 --- a/src/css/app.scss +++ b/src/css/app.scss @@ -245,7 +245,7 @@ } .thumb { - width: 8%; + // width: 0; height: 3px; background: #58ffdf; } diff --git a/src/index.html b/src/index.html index b2e27ec..9fcb922 100644 --- a/src/index.html +++ b/src/index.html @@ -39,12 +39,12 @@
- +
- 情是何物 - 周深 -

经典咏流传第三季 第7期

+ + +

@@ -53,12 +53,14 @@
- - + +
@@ -67,17 +69,17 @@
- 00:13 +
- +
- 05:31 +
- 情是何物 - 周深 + +
diff --git a/src/js/app.js b/src/js/app.js index fbfdc9c..f66958c 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -6,17 +6,34 @@ import Anot from '/js/lib/anot.js' import '/js/lib/scroll/index.js' + +import Keyboard from '/js/lib/keyboard/index.js' import app from '/js/lib/socket.js' // const id3 = require('jsmediatags') const id3 = require('music-metadata') +var kb = new Keyboard() + Anot({ $id: 'app', state: { isplaying: true, playmode: 1, mute: false, + preview: { + name: '', + album: '', + artist: '', + cover: '' + }, + song: { + name: '', + artist: '', + src: '', + time: 0, + duration: 0 + }, curr: 2, list: [] }, @@ -29,10 +46,25 @@ Anot({ let { album, artist, title, duration } = await this.getID3(it.path) it.name = title || it.name - it.artist = artist || '未知歌手' + it.artist = artist it.album = album - it.duration = Anot.filters.time(duration) + it.duration = duration } + + kb.on(['left'], ev => { + var time = this.song.time - 5 + if (time < 0) { + time = 0 + } + this.song.time = time + }) + kb.on(['right'], ev => { + var time = this.song.time + 5 + if (time > this.song.duration) { + time = this.song.duration + } + this.song.time = time + }) }, methods: { play() { @@ -56,6 +88,19 @@ Anot({ } = res return { album, artist, title, duration: ~~duration } }) + }, + prviewSong(it, i) { + var { album, artist, name, cover } = it + Object.assign(this.preview, { album, artist, name, cover }) + }, + playSong(it, i) { + // + this.curr = i + this.song.name = it.name + this.song.artist = it.artist + this.song.duration = it.duration + this.song.src = `file://${it.path}` + this.song.time = 0 } } }) diff --git a/src/js/lib/keyboard/index.js b/src/js/lib/keyboard/index.js index 9c9484c..a9e832a 100644 --- a/src/js/lib/keyboard/index.js +++ b/src/js/lib/keyboard/index.js @@ -1,13 +1 @@ -/** - * - * @authors yutent (yutent.io@gmail.com) - * @date 2020-11-17 09:10:37 - * @version v1.0.0 - * - */ - -export default class Keyboard extends HTMLElement{static get observedAttributes(){return[]}constructor(){super(),Object.defineProperty(this,"root",{value:this.attachShadow({mode:"open"}),writable:!0,enumerable:!1,configurable:!0}),Object.defineProperty(this,"props",{value:{},writable:!0,enumerable:!1,configurable:!0}),this.root.innerHTML='
Esc
` 1 2 3 4 5 6 7 8 9 0 - = Backspace
Tab Q W E R T Y U I O P [ ] \\
Caps A S D F G H J K L ; \' Enter
Shift Z X C V B N M , . / Shift
Ctrl Win Alt Space Alt Win Menu Ctrl
Prt Scr Pau
Ins Home Pg▴
Del End Pg▾
Lock / *
7 8 9
4 5 6
1 2 3
0 .
-
+
Ent
'}} - -if(!customElements.get('wc-keyboard')){ - customElements.define('wc-keyboard', Keyboard) -} +import{KEY_DICT,MULTI_KEYS,MULTI_KEY_CODES}from"./key.dict.js";function bind(e,_){return(e||document).addEventListener("keydown",_,!1),_}function unbind(e,_){(e||document).removeEventListener("keydown",_,!1)}function hide(e,_,t){Object.defineProperty(e,_,{value:t,writable:!0,enumerable:!1,configurable:!0})}function check(e){var _=!1;if(_="object"==typeof this.keys.key?this.keys.key.includes(e.keyCode):e.keyCode===this.keys.key)for(let t in this.keys)if(e[t]!==this.keys[t]){_=!1;break}return _}export default class Keyboard{constructor(e){this.$elem=e,hide(this,"__EVENTS__",{}),hide(this,"paused",!1),hide(this,"__finally__",null),hide(this,"_keydown",bind(e,e=>{if(!this.paused&&!MULTI_KEY_CODES.includes(e.keyCode)){for(let n in this.__EVENTS__){var _=this.__EVENTS__[n],t=_.check(e),i=Date.now(),s=!1;if(!0===_.actived)if(i-_.last>300)delete _.actived;else for(let t of _.next){if(t.check(e)){s=!0,t.fn.forEach(function(_){_(e)});break}}if(t&&(s=!0,_.next&&(_.actived=!0,_.last=i),_.fn&&_.fn.forEach(function(_){_(e)})),s)break}this.__finally__&&this.__finally__(e)}}))}get disabled(){return this.paused}set disabled(e){this.paused=!!e}destroy(){unbind(this.$elem,this._keydown),delete this.__EVENTS__,delete this._keydown}__parse_action__(e){var _=[],t=[],i=!0;return e.forEach(e=>{var s={};e=e.split("+").map(_=>(_=_.trim().toLowerCase(),MULTI_KEYS[_]?s[`${_}Key`]?(i=!1,console.error("功能键,同组中不能重复。⎣%s⎤",e)):s[`${_}Key`]=!0:s.key?(i=!1,console.error("非功能键,同组不能出现多个。⎣%s⎤",e)):hide(s,"key",KEY_DICT[_]),_));for(let e in MULTI_KEYS)s[`${e}Key`]=s[`${e}Key`]||!1;t.push(s),_.push(e.join("+"))}),{keys:_,dict:t,passed:i}}off(e,_){if(e.length<1||"function"!=typeof _)return console.error("无效热键或回调");let{keys:t,dict:i,passed:s}=this.__parse_action__(e);if(s){let e=t[0];if(1===t.length){if(this.__EVENTS__[e]&&this.__EVENTS__[e].fn){let t=0;for(let i of this.__EVENTS__[e].fn){if(i===_){this.__EVENTS__[e].fn.splice(t,1),this.__EVENTS__[e].fn.length<1&&(delete this.__EVENTS__[e].fn,this.__EVENTS__[e].next||delete this.__EVENTS__[e]);break}t++}}}else if(this.__EVENTS__[e]&&this.__EVENTS__[e].next){let i,s=t[1],n=0;for(i of this.__EVENTS__[e].next){if(i.id===s)break;n++}if(i.fn){let t=0;for(let s of i.fn)s===_&&(i.fn.splice(t,1),i.fn.length<1&&(this.__EVENTS__[e].next.splice(n,1),this.__EVENTS__[e].next.length<1&&(delete this.__EVENTS__[e].next,this.__EVENTS__[e].fn||delete this.__EVENTS__[e]))),t++}}}}on(e,_){if(e.length<1||"function"!=typeof _)return console.error("无效热键或回调");let{keys:t,dict:i,passed:s}=this.__parse_action__(e);if(s){let e=t.shift(),s=t.shift();if(this.__EVENTS__[e]||(this.__EVENTS__[e]={id:e,keys:i[0],last:0,check:check}),s){if(this.__EVENTS__[e].next)for(let t,i=-1;t=this.__EVENTS__[e].next[++i];)if(t.id===s)return void t.fn.push(_);this.__EVENTS__[e].next=[{id:s,keys:i[1],check:check,fn:[_]}]}else this.__EVENTS__[e].fn?this.__EVENTS__[e].fn.push(_):this.__EVENTS__[e].fn=[_]}}finally(e){"function"==typeof e&&(this.__finally__=e)}}; \ No newline at end of file diff --git a/src/js/lib/keyboard/key.dict.js b/src/js/lib/keyboard/key.dict.js new file mode 100644 index 0000000..1e3d33f --- /dev/null +++ b/src/js/lib/keyboard/key.dict.js @@ -0,0 +1 @@ +export const MULTI_KEYS={ctrl:1,shift:1,alt:1,meta:1};export const MULTI_KEY_CODES=[16,17,18,91];export const KEY_DICT={0:48,1:49,2:50,3:51,4:52,5:53,6:54,7:55,8:56,9:57,"'":222,"*":106,"+":107,",":188,"-":[109,189],".":[110,190],"/":[111,191],";":186,"=":187,"[":219,"\\":220,"]":221,"`":192,a:65,b:66,c:67,d:68,e:69,f:70,g:71,h:72,i:73,j:74,k:75,l:76,m:77,n:78,o:79,p:80,q:81,r:82,s:83,t:84,u:85,v:86,w:87,x:88,y:89,z:90,enter:13,shift:16,ctrl:17,alt:18,space:32,meta:91,tab:9,backspace:8,numlock:12,capslock:20,esc:27,menu:93,insert:45,delete:46,pagedown:34,pageup:33,home:36,end:35,up:38,down:40,left:37,right:39,f1:112,f2:113,f3:114,f4:115,f5:116,f6:117,f7:118,f8:119,f9:120,f10:121,f11:122,f12:123,f13:124,f14:125,f15:126,print:124,screen:125,pause:126}; \ No newline at end of file