Phoenixとは
Phoenix (フェニックス)はJavaScriptでスクリプト可能な軽量macOSウィンドウ＆アプリマネージャです。
Phoenixアプリを起動していれば以下のようなJavaScriptのコードで、Safariアプリを起動するなどの処理が作成できます。
// 「s + control + shift」のキーが押されたら
// Safariを起動してフォーカスする
Key.on('s', ['control', 'shift'], () => {
App.launch('Safari', { focus: true })
})Phoenixの設定手順
まず公式サイトにある「Download Phoenix」のリンクをクリックしてダウンロードします。
https://kasper.github.io/phoenix
Homebrewが使用可能であれば、以下のコマンドでもダウンロードできます。
brew install --cask phoenixダウンロード後に起動すると、メニューバーの右上にアイコンが表示されます。
常に使用するのであれば、「Open at Login」をクリックして、自動ログインにしておきます。
Phoenixでアプリを操作するJavaScriptコード
Phoenixのアプリを起動したら、JavaScriptファイルを「~/.phoenix.js」に置いてください。
「~/.phoenix.js」ではなく、以下の場所にファイルを置いても動作します。
~/Library/Application Support/Phoenix/phoenix.js
~/.config/phoenix/phoenix.js
「~/.phoenix.js」にファイルを置いたら、エディタで開いて、以下のコードを書いて保存してください。
// 「s + control + shift」のキーが押されたら
// Safariを起動してフォーカスする
Key.on('s', ['control', 'shift'], () => {
App.launch('Safari', { focus: true })
})保存すると、control + shift + s のショートカットキーでSafariが開けるようになります。
応用すればSafariを起動(フォーカス)して、フォーカス中に実行された場合はSafariを終了する処理のコードを作成できます。
Safariだけでなく、Microsoft EdgeやFirefoxなどでも同様のショートカットキーによる処理を作成できます。
const toggleApp = (appName) => {
const app = App.get(appName) || App.launch(appName)
if (app.isActive()) {
const script = `tell application "${appName}" to quit`
Task.run('/usr/bin/osascript', ['-e', script])
} else {
app.focus()
}
}
Key.on('s', ['control', 'shift'], () => toggleApp('Safari'))
Key.on('e', ['control', 'shift'], () => toggleApp('Microsoft Edge'))
Key.on('f', ['control', 'shift'], () => toggleApp('Firefox'))フロントエンドエンジニアだとChrome以外のブラウザを開いて確認する機会が多いので、このショートカットキーがあると非常に便利です。
Phoenixでウィンドウを操作するJavaScriptコード
Phoenixはウィンドウの操作もできます。
例えばフォーカス中(アクティブ)のウィンドウを左上に配置するショートカットキーを作成する場合は以下のようなコードになります。
Key.on('q', ['control', 'shift'], () => {
const window = Window.focused()
window.setTopLeft({ x: 0, y: 0 })
})ウィンドウのサイズを変更したい場合は、window.screen().flippedVisibleFrame() でスクリーンを取得して、setSize()でウィンドウのサイズを指定します。
Key.on('q', ['control', 'shift'], () => {
const window = Window.focused()
const screen = window.screen().flippedVisibleFrame()
window.setTopLeft({ x: 0, y: 0 })
window.setSize({ width: screen.width, height: screen.height })
})Phoenixのログの取得方法
Phoenixでscreen.widthの値などのログを確認したい場合はconsole.log()が使用できます。
Key.on('q', ['control', 'shift'], () => {
const window = Window.focused()
const screen = window.screen().flippedVisibleFrame()
console.log(`screen.width: ${screen.width}`)
window.setTopLeft({ x: 0, y: 0 })
window.setSize({ width: screen.width, height: screen.height })
})console.log()の結果を確認する際は、ターミナルで以下のコマンドを実行してください。
log stream --process Phoenix
