皆さん、こんにちは。
私は、普段、PCではmacOSを使用しているので、ウェブブラウザはApple純正のSafariを使用しており、その他のブラウザは、ウェブサイト制作の動作検証や、SNSで別アカウントを使用するぐらいでしか、使用していませんでした。
しかし、このところ、仮想通貨取引所であるbitFlyerの公式ツールが、Safariだとおかしな挙動をしているため、代わりにChromeを使っていたのですが、ふとしたきっかけで、ChromeのExtention(機能拡張)に興味が湧き、自作することにしてみました。
と言っても、意外とやっていることは単純で、チャートの置き換えを含む、DOM操作のみです。
最初の目的は、チャートの置き換えだけだったのですが、よくよく考えてみると、以前にトレードツールを自作したのは、公式ツールの構造が気に入らなかったという理由からでしたので、ならば、公式ツールも組み替えてしまえ、ということで、Extentionを作るついでに、bitFlyer公式ツールを自分用にアレンジしてしまいました。
チャートの領域は広く、板と約定履歴は右に寄せて、オーダー部分はチャートのすぐ右へ移動、注文一覧もオーダー枠の真下に来るよう、取引履歴と逆の配置にしました。
又、数量と価格入力欄が小さすぎるのが気に入らなかったので、ボタンと同サイズに調整し、予想価格表示もボタン直下に下げてしまいました。
自分好みの配置で、誤操作も減ったので、こんなシンプルなハックで使いやすくなるのかと、嬉々としています、笑
Extentionの作り方について、詳しくは、公式サイトに色々と掲載されていますが、基本的には、manifest.json という、簡単な定義ファイルに名称やファイル構成を記述し、あとは、JavaScriptなどで動作内容を記述するのみです。
JavaScriptなどがわかる方であれば、すぐに制作できるでしょう。
今回はレイアウト変更だけでしたが、色々とイベントも追加できるようなので、公式ツールの機能拡張もしてみようかと思っています!