まえがき
自分用メモ書きです。
前提として、私自身はサーバサイドにはある程度…ですが
クライアントサイドの言語には明るくないので独自解釈交えますご容赦ください
前提
- QBCore Frameworkでサーバを立てていること
- resourceディレクトリに[qb]サブディレクトリが存在すること
ローディング画面で好きな音楽 & 好きなムービー流したい！
とても簡単
[qb]/qb-loading/assets/
ディレクトリ下にいくつかフォルダがあるが、それぞれにmp3なりmp4なりを置く
audioフォルダにはmp3を、imagesにはpngを、videoにはmp4を、てな感じ
入れ替えたファイルを指定する
次にHTMLを編集して指定するファイルを変更していく
QBcoreは基本的なWEB開発と同じで、HTML, CSS, JavaScriptで成り立っている(※例外あり)ので、当然指定するファイルの入れ替えもHTMLから行う
(ESXとかの他のフレームワークは全く知らないので同じか不明)
面倒な人は元から入っているファイルを削除して、入れ替えたファイルに消したファイル名と全く同じ名前をつけてやれば、わざわざHTML編集しなくて良いのでオススメ
まぁそれだと入れ替えたファイルの名前が変わってしまうので今回はHTMLまで編集する
修正する箇所
オーディオ
- <audio autoplay loop id="audio" src="/assets/audio/noncopyright.mp3"></audio>
+ <audio autoplay loop id="audio" src="/assets/audio/入れ替えたファイル名.mp3"></audio>
スライドショー(静止画)をOFFにしてムービーを再生
- <q-carousel animated v-model="firstslide" :autoplay="secondap" ref="carousel" infinite>
- <q-carousel-slide :name="1" img-src="/assets/images/1.png"></q-carousel-slide>
- <q-carousel-slide :name="2" img-src="/assets/images/2.png"></q-carousel-slide>
- <q-carousel-slide :name="3" img-src="/assets/images/3.png"></q-carousel-slide>
- <q-carousel-slide :name="4" img-src="/assets/images/4.png"></q-carousel-slide>
- </q-carousel>
+ <q-parallax :height="1080">
+ <template v-slot:media>
+ <video id="video" width="1920" height="1080" autoplay loop muted>
- <source type="video/mp4" src="/assets/video/freestockvideo.mp4"></video>
+ <source type="video/mp4" src="/assets/video/入れ替えたファイル名.mp4"></video>
+ </template>
+ </q-parallax>
imagesディレクトリのスライドショーか、videoディレクトリのムービーの
どちらかしか再生不可なので、コメントアウト等しておくと良い
FiveMからテストサーバにconnectしてみる
ドラクリオットOPムービーを拝借しました
ドラクリオットは神
(ローカル環境で公開していないので大目に見てください…)
他にもキーバインドの削除やらダイアログの削除なんかもカスタムしているのでそちらはおまけで
※黄色丸印で囲んでおかないとFiveMのローディング画面に見えないと思ったので一応
おまけ
41行目～211行目までコメントアウト等で消すと、
キーバインドのヒントなり、ダイアログなり、ローディングバー等が消えます
どのブロックがそれぞれどれに対応しているのかは、
class名等をちゃんと読んでもらえたら英語で書いてあるので頑張ってください
引用
なにか参考にしたっけな？と思ったのですが、
多分コードを読んで独自解釈したので引用はない…はず