shuvi-lib v1.0.6
shuvi-lib
shuvi-libは、YouTube IFrame Player APIをゆるふわにラッピングしたライブラリです。
- shuvi-libについての紹介ページ
- 開発者
Download
shuvi-libの使う方法はいくつかあります。
一つ目は、GitHubページからダウンロードして自分のプロジェクトに置き、使う方法。
二つ目は、shuvi-libはnpm上で公開されているので、
npm install shuvi-libのようにnpmコマンドを使ってプロジェクトに取り込む方法。
三つ目は、私、yuki540のサーバー経由でネットワーク越しにshuvi-libをプロジェクトに取り込む方法です。
<script src="http://api.yuki540.com/shuvi-lib/v1/shuvi.lib.js"></script>Usage
shuvi-libを使えば、YouTube IFrame Player APIをより簡単に操作することが可能です。
shuvi.lib.jsを取り込み、下記のようにパラメータを渡し、newすれば、すぐにプレイヤーの操作が可能になります。
let shuvi = new Shuvi({
video_id : 'fQN2WC_Acpg', // 動画ID
id : 'player', // 要素のID
width : 500, // 画面の幅
height : 300, // 画面の高さ
autoplay : ture, // [option]自動再生（デフォルトはtrue）
loop : false // [option]ループ（デフォルトはfalse）
})npm経由の方は、requireを忘れずに。
const Shuvi = require('shuvi-lib')Methods
shuvi-libは、できるだけシンプルでわかりやすいメソッド名にしています。
動画URLから動画IDの取得
video_id = getId(url)
イベントリスナの追加
shuvi.on(event, fn)
現在設定している動画IDの取得
shuvi.getVideoID()
- returnvideo_id: 動画ID
動画の変更
shuvi.change(video_id)
- paramvideo_id: 動画ID
再生
shuvi.play()
停止
shuvi.pause()
ループの有無
shuvi.loop(bool)
- parambool: trueの場合、ループ有。falseの場合、ループ無。
デフォルトは、ループ無です。
再生位置の移動
shuvi.seek(per)
- paramper: 0~1の数値
動画の総時間
duration = shuvi.duration()
- returnduration: 動画の総時間
現在の再生時間
current = shuvi.current()
- returncurrent: 現在の再生時間
動画の読み込み状況
buffer = shuvi.buffer()
- returnbuffer: 動画の読み込み具合（0~1）
音量の取得
volume = getVolume()
- returnvolume: 0~1の値
音量の設定
shuvi.setVolume(volume)
- paramvolume: 0~1の値
サイズの変更
shuvi.resize(width, height)
Events
shuvi-libは、プレイヤーの動作ごと挙動をイベントとして呼び出されます。
- load
- 動画の起動読み込み終了時に呼び出されます。
- error
- 動画の読み込み・再生の失敗時に呼び出されます。
- change
- 動画の変更時に呼び出されます。
- 初回の動画の時には、発火されません。
- play
- 動画再生時に呼び出されます。
- pause
- 動作停止時に呼び出されます。
- seek
- 動画の再生時間が変更されるたびに呼び出されます。
- end
- 動画の再生が終了時に呼び出されます。
Lisence
このライブラリは、MIT Lisenceのもとで公開されています。