LiveSplitのスプリットに合わせて画像を表示する
LiveSplitの現在区間に基づいて説明テキストを表示する
Speed Guides Live | gamedeveloper
スプリットに合わせて出す系で有名なやつ
テキストは出せるが画像は出せず
さとう菓子さんはTwitterを使っています: 「LiveSplit用コンポーネント、"Text Images"の試作版を公開しました。 LiveSplit上に画像を表示するコンポーネントです。タイマーの文字列を追加したり特定のタイミングで画像が切り替わるといった設定が可能です。 不具合報告等あればここにお願いします。 https://t.co/v7fSjubcIH https://t.co/hC3q0ndfZk」 / Twitter
https://drive.google.com/drive/folders/1pmgVrqz2XIgNvhFyns1iUpBXJErr0aXx
自分の環境ではうまく動かず
ufodauge/MDNotes
今回はこれを使用
少し改造した
MDNotesの使い方
LiveSplitにWebSocketコンポーネントを入れて、Layoutに追加
リポジトリをクローンしてローカルサーバーを立てる
簡単にローカルで Web サーバーを立てる3つの方法(Node/Python/VSCode) | Snow System
VSCodeのLive Serverが一番簡単
lssファイルと同じ名前でmdファイルを作り、assets/notesに入れる
code:例.md
# 区間1
![](index.htmlから見た画像のパス)
# 区間2
![](index.htmlから見た画像のパス)
LiveSplit右クリック→ControlからStart Websocket
localhost:5500をブラウザで開いて、LiveSplitを操作すると動くはず
行った改造
ダークテーマ化
初期表示の文章を変更
CDNで読み込んでいるmarkedのバージョンを固定化
<script src="https://cdn.jsdelivr.net/npm/marked@3.0.7/marked.min.js"></script>
Uncaught TypeError: marked is not a function · Issue #2233 · markedjs/marked