Raycastを使ってYoutubeの操作をグローバルホットキーとして設定する方法


Youtubeの操作をグローバルホットキーに設定して操作できるようになるとYoutubeで動画教材を学ぶときにとても便利になります。

Youtubeを開きながらVScodeで作業しているときにいちいちフォーカスを切り替えないで済むので、ずっとVScodeのウィンドウにフォーカスしたまま学習ができます。それにより手間が減りストレスが減ります。動画を止めたり巻き戻したりなどをするのに、マウスを使わないでポチッとするだけで済むようになります。
ブラウザで開く動画ならばYoutubeだけでなくUdemyなどでももちろん使えます。

5秒または10秒スキップと巻き戻し、停止/再生のグローバルホットキーを設定するだけで格段に便利になると思います。

※Macでのやり方なのでWindowsの人は注意してください。
※今回はchromeを使っている場合のコードを書いているので、違うブラウザを使っている人は「chrome」の部分を自分が使っているブラウザの名前に変えてください。

## Youtubeの操作をグローバルホットキーに設定する方法

それでは**Raycast**を使って、YouTube操作のための**グローバルホットキー**を設定する具体的な手順を説明します。この方法では、**AppleScript**を使って、ChromeでYouTubeを操作するためのショートカットをRaycast経由で実行できるように設定します。


### 手順1: Raycastでスクリプトコマンドを作成
1. **Raycast**を開きます。
2. Extensionsのボタンを押してから、Scriptというボタンを押して、Script Commands**セクションに移動します。
3. 右上のプラスマークのボタンを押してから「**Create Script Command**」ボタンをクリックします。
4. TemplateはAppleScriptを選ぶ
5. Modeはsilentにする
6. Titleは再生/停止のグローバルホットキーならPlayPauseとか適当に好きな名前をつける
7. そこから下は書かなくてよい。
8. 右下のcreate scriptを押すとAppleScriptのファイルが作成され、そのファイルをどのフォルダに入れるか選べるので、好きなフォルダに入れておく。

### 手順2: スクリプトファイルの作成
先ほど作ったファイルをエディタで開くと下のようなコードが出てくる。

```
#!/usr/bin/osascript

# Required parameters:
# @raycast.schemaVersion 1
# @raycast.title a
# @raycast.mode silent

# Optional parameters:
# @raycast.icon 🤖

log "Hello World!"
```

`log "Hello World!"`のところを消して、下に書いたコードをコピペする。
下の3つのグローバルホットキーを全部作るなら、３つファイルを用意してそれぞれに一つずつ`log "Hello World!"`のところを消してコピペする。

#### 例1: **YouTubeの再生・一時停止** のAppleScript

```applescript
tell application "Google Chrome"
    if (windows count) > 0 then
        tell active tab of front window
            execute javascript "document.querySelector('.ytp-play-button').click();"
        end tell
    end if
end tell
```

#### 例2: **10秒スキップ** のAppleScript

```applescript
tell application "Google Chrome"
    if (windows count) > 0 then
        tell active tab of front window
            execute javascript "document.querySelector('video').currentTime += 10;"
        end tell
    end if
end tell
```

#### 例3: **10秒戻し** のAppleScript

```applescript
tell application "Google Chrome"
    if (windows count) > 0 then
        tell active tab of front window
            execute javascript "document.querySelector('video').currentTime -= 10;"
        end tell
    end if
end tell
```



### 手順3: グローバルホットキーの設定
1. Raycastの設定画面の「**Extensions > Script Commands**」セクションに移動します。
2. 各スクリプトの**Hotkey**欄をクリックして、グローバルホットキーを設定します。
   - 例:
     - **Control + Right Arrow**: 10秒スキップ
     - **Control + Left Arrow**: 10秒戻し
     - **Control + P**: 再生・一時停止

### 手順4: 動作確認
1. **ChromeでYouTubeを開いた状態**で、設定したホットキーを押してみてください。
2. 他のウィンドウやアプリケーションがフォーカスされていても、YouTubeタブで再生・スキップ・戻しの操作が行われるはずです。

### 注意点
- AppleScriptは、ChromeのタブがYouTubeを表示している場合に動作します。他のページが開かれていると動作しません。
- Raycastの**グローバルホットキー**を利用するため、設定後にRaycastの権限設定が必要な場合があります。

これで、Raycastを使ってYouTube操作用のグローバルホットキーを設定することができます。

## ホットキー使用時にRaycastの検索ウィンドウが表示されてしまう問題
Modeでsilentを選択していないとこの問題が起きます。

### 回避策: `raycast.mode silent` を利用
通常、スクリプトの上部に設定している `raycast.mode compact` の代わりに、**`raycast.mode silent`** を使用することで、検索ウィンドウが表示されないようにすることができます。

#### 修正版のスクリプト
以下のようにスクリプトを修正してみてください。

```applescript
#!/usr/bin/osascript

# Required parameters:
# @raycast.schemaVersion 1
# @raycast.title Youtube-skip
# @raycast.mode silent　　　　　　←ここがちゃんとsilentになっていればOK

# Optional parameters:
# @raycast.icon 🤖

tell application "Google Chrome"
    if (windows count) > 0 then
        tell active tab of front window
            execute javascript "document.querySelector('video').currentTime += 10;"
        end tell
    end if
end tell
```

### 変更内容のポイント
- `raycast.mode compact` を **`raycast.mode silent`** に変更しました。
  - これにより、Raycastウィンドウが表示されず、バックグラウンドで直接スクリプトが実行されます。