PawooMusicKeybind.js

// ==UserScript==
// @name         Pawoo Music Keybind
// @namespace    https://k0ta.net
// @version      0.4
// @description  Keybind script for music.pawoo.net
// @author       k0ta0uchi
// @match        https://music.pawoo.net/web/timelines/*
// @downloadUrl  https://gist.githubusercontent.com/k0ta0uchi/b34bd01a84cff8016f7b61a59409fe4b/raw/10dc5a66327fe01fde791f55e07657834d9935be/PawooMusicKeybind.js
// @grant        none
// ==/UserScript==

(() => {
    'use strict';
    const KEY_UP = 38,
          KEY_RIGHT = 39,
          KEY_DOWN = 40,
          KEY_ENTER = 13,
          KEY_SPACE = 32,
          KEY_TAB = 9,
          KEY_ESC = 27,
          KEY_N = 78,
          KEY_S = 83,
          KEY_1 = 49,
          KEY_2 = 50,
          KEY_3 = 51,
          KEY_4 = 52,
          KEY_5 = 53,
          KEY_6 = 54;
    document.onkeyup = (e) => {
        if (document.activeElement.tagName != "INPUT" && document.activeElement.tagName != "TEXTAREA") {
            console.log(e.keyCode);
            let pc = document.querySelector('.player-control');
            let decks = document.querySelectorAll('.deck-selector__selector-body');
            switch (e.keyCode) {
                case KEY_UP:
                    // Key: ↑, open deck and move deck
                    if(!pc.classList.contains('is-open')) {
                        pc.classList.add('is-open');
                    } else {
                        let deck_num;
                        for(let i = 0; i < decks.length; i++) {
                            if(decks[i].classList.contains('active')) {
                                if(i > 0) {
                                    decks[i - 1].click();
                                } else {
                                    decks[decks.length - 1].click();
                                }
                                break;
                            }
                        }
                    }
                    break;
                case KEY_DOWN:
                    // Key: ↓, open deck and move deck
                    if(!pc.classList.contains('is-open')) {
                        pc.classList.add('is-open');
                    } else {
                        let decks = document.querySelectorAll('.deck-selector__selector-body');
                        let deck_num;
                        for(let i = 0; i < decks.length; i++) {
                            if(decks[i].classList.contains('active')) {
                                if(i < 5) {
                                    decks[i + 1].click();
                                } else {
                                    decks[0].click();
                                }
                                break;
                            }
                        }
                    }
                    break;
                case KEY_ENTER:
                    // key: enter, close decks
                    pc.classList.remove('is-open');
                    break;
                case KEY_SPACE:
                    // key: space, start or pause
                    document.querySelector('.control-bar__controller-toggle').click();
                    break;
                case KEY_RIGHT:
                    // key: →, skipps music
                    document.querySelector('.control-bar__controller-skip > span').click();
                    break;
                case KEY_N:
                    // Key: n, focus text input
                    document.querySelector(".autosuggest-textarea__textarea").focus();
                    document.querySelector(".autosuggest-textarea__textarea").value="";
                    break;
                case KEY_S:
                    // key: s, focus search input
                    document.querySelector(".search__input").focus();
                    document.querySelector(".input.search__input").value="";
                    break;
                case KEY_1:
                    // key: 1, choose deck1
                    decks[0].click();
                    break;
                case KEY_2:
                    // key: 2, choose apollo
                    decks[1].click();
                    break;
                case KEY_3:
                    // key: 3, choose deck3
                    decks[2].click();
                    break;
                case KEY_4:
                    // key: 4, choose deck4
                    decks[3].click();
                    break;
                case KEY_5:
                    // key: 5, choose deck5
                    decks[4].click();
                    break;
                case KEY_6:
                    // key: 6, choose deck6
                    decks[5].click();
                    break;
            }
        } else {
            if(e.keyCode === KEY_ESC) {
                // key: esc, exit text input
                document.activeElement.blur();
            }
        }
    };
})();

Pawoo Music Keybind

Pawoo Music用のキーバインド

使い方

• 上下キーでDeckを選択
• スペースで再生・ストップ
• 右キーでスキップ
• EnterキーでDeckを閉じる
• nキーでテキスト入力
• sキーで検索入力
• ESCキーで入力終了（入力時はDeck操作が出来ません。）
• 数字キー(1,2,3,4,5,6)で指定のDeckに移動

このスクリプトを使用するには、下記のブラウザ拡張が必要になります。

Firefox

Greasemonkey

https://addons.mozilla.org/ja/firefox/addon/greasemonkey/

Tamepermonkey

https://addons.mozilla.org/ja/firefox/addon/tampermonkey/

Chrome

Tamepermonkey

https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=ja

Issues

キーバインドでDeck移動など行なうと、正常に遷移せずにDeckの数字が変わらない、クリックでDeckが開けないなどの不具合が出る。