js控制MediaPlayer播放器

其實用js來做一個音樂播放器很容易,因爲mediaplayer提供了一系列的接口來對網頁嵌入的播放器進行控制。下面簡單的介紹一下:

在網頁內插入播放器的代碼爲:


<object id="player" height="64" width="260" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">
<param NAME="AutoStart" VALUE="-1">
<!--是否自動播放-->
<param NAME="Balance" VALUE="0">
<!--調整左右聲道平衡,同上面舊播放器代碼-->
<param name="enabled" value="-1">
<!--播放器是否可人爲控制-->
<param NAME="EnableContextMenu" VALUE="-1">
<!--是否啓用上下文菜單-->
<param NAME="url" value="/blog/1.wma">
<!--播放的文件地址-->
<param NAME="PlayCount" VALUE="1">
<!--播放次數控制,爲整數-->
<param name="rate" value="1">
<!--播放速率控制,1爲正常,允許小數,1.0-2.0-->
<param name="currentPosition" value="0">
<!--控件設置:當前位置-->
<param name="currentMarker" value="0">
<!--控件設置:當前標記-->
<param name="defaultFrame" value="">
<!--顯示默認框架-->
<param name="invokeURLs" value="0">
<!--腳本命令設置:是否調用URL-->
<param name="baseURL" value="">
<!--腳本命令設置:被調用的URL-->
<param name="stretchToFit" value="0">
<!--是否按比例伸展-->
<param name="volume" value="50">
<!--默認聲音大小0%-100%,50則爲50%-->
<param name="mute" value="0">
<!--是否靜音-->
<param name="uiMode" value="mini">
<!--播放器顯示模式:Full顯示全部;mini最簡化;None不顯示播放控制,只顯示視頻窗口;invisible全部不顯示-->
<param name="windowlessVideo" value="0">
<!--如果是0可以允許全屏,否則只能在窗口中查看-->
<param name="fullScreen" value="0">
<!--開始播放是否自動全屏-->
<param name="enableErrorDialogs" value="-1">
<!--是否啓用錯誤提示報告-->
<param name="SAMIStyle" value>
<!--SAMI樣式-->
<param name="SAMILang" value>
<!--SAMI語言-->
<param name="SAMIFilename" value>
<!--字幕ID-->
</object>


下面是一些常用的方法和屬性:

//基本屬性
URL:String; 指定媒體位置,本機或網絡地址
uiMode:String; 播放器界面模式,可爲Full, Mini, None, Invisible
playState:integer; 播放狀態,1=停止,2=暫停,3=播放,6=正在緩衝,9=正在連接,10=準備就緒
enableContextMenu:Boolean; 啓用/禁用右鍵菜單(也是簡單的防盜鏈方法)
fullScreen:boolean; 是否全屏顯示

//播放器控制屬性
controls.play; 播放
controls.pause; 暫停
controls.stop; 停止
controls.currentPosition:double; 當前進度
controls.currentPositionString:string; 當前進度,字符串格式。如“00:23”
controls.fastForward; 快進
controls.fastReverse; 快退
controls.next; 下一曲
controls.previous; 上一曲
注: 上一曲和下一曲屬性一般不能使用,因爲這種功能是對一個播放列表氣作用的,而對於新版本的播放器,js腳本一般沒有權限去新建和修改播放列表的。只能自己去設計一個播放列表,自己去修改url屬性去選曲。

//播放器基本屬性
settings.volume:integer; 音量,0-100
settings.autoStart:Boolean; 是否自動播放
settings.mute:Boolean; 是否靜音
settings.playCount:integer; 播放次數

//當前播放媒體的屬性
currentMedia.duration:double; 媒體總長度
currentMedia.durationString:string; 媒體總長度,字符串格式。如“03:24”
currentMedia.getItemInfo(const string); 獲取當前媒體信息"Title"=媒體標題,"Author"=藝術家,"Copyright"=版權信息,"Description"=媒體內容描述,"Duration"=持續時間(秒),"FileSize"=文件大小,"FileType"=文件類型,"sourceURL"=原始地址
currentMedia.setItemInfo(const string); 通過屬性名設置媒體信息
currentMedia.name:string; 同 currentMedia.getItemInfo("Title")
[currentPlaylist] wmp.currentPlaylist //當前播放列表屬性
currentPlaylist.count:integer; 當前播放列表所包含媒體數
currentPlaylist.Item[integer]; 獲取或設置指定項目媒體信息,其子屬性同wmp.currentMedia

//最後是一些很少用到的參數和屬性
AllowChangeDisplaySize 返回或設置最終用戶是否能設置顯示尺寸(邏輯型)
AllowScan 返回或設置是否允許掃描(邏輯型)
AnimationAtStart 返回或設置控件開始播放之前是否先播放一個動畫序列(邏輯型)
AudioStream 返回或設置音頻流的編號(用於多音頻流的剪輯,默認爲-1)(長整型)
AutoRewind 返回或設置媒體文件播放完畢後是否自動迴繞(邏輯型)
AutoSize 返回或設置是否自動調整控件大小來適應載入的媒體(邏輯型)
AutoStart 返回或設置在載入媒體文件之後是否自動開始播放(邏輯型)
Balance 返回或設置指定立體聲媒體文件的播放聲道(-10000爲左聲道,10000爲右聲道,0爲立體聲)(長整型)
Bandwidth 返回或設置當前文件的帶寬(長整型)
BaseURL 返回基本的 HTTP URL(字符串)
BufferingCount 返回媒體文件回放時緩衝的總時間(長整型)
BufferingProgress 返回緩衝完成的百分比(長整型)
BufferingTime 返回緩衝的時間(雙精度型)
CanPreview 返回或設置當前顯示的剪輯是能否被預覽(邏輯型)
CanScan 返回或設置當前文件是否支持快進或快退(邏輯型)
CanSeek 返回或設置當前文件是否能搜索並定位到某個時間(邏輯型)
CanSeekToMarkers 返回或設置文件是否支持搜索到標籤(邏輯型)
CaptioningID 返回在標題中顯示的幀或控件的名稱(字符串)
ChannelDescription 返回電臺的描述(字符串)
ChannelName 返回電臺的名稱(字符串)
ChannelURL 返回電臺的元文件的位置(字符串)
ClickToPlay 返回或設置是否可以通過點擊圖像暫停或播放剪輯(邏輯型)
ClientID 返回客戶端唯一的標識符(字符串)
CodecCount 返回文件使用的可安裝的 codecs 的個數(長整型)
ContactAddress 返回電臺的聯繫地址(字符串)
ContactEmail 返回電臺的聯繫電子郵件地址(字符串)
ContactPhone 返回電臺的聯繫電話(字符串)
CreationDate 返回剪輯的創建日期(日期型)
CurrentMarker 返回或設置當前書籤號碼(長整型)
CurrentPosition 返回或設置剪輯的當前位置(雙精度型)
CursorType 返回或設置指針類型(長整型)
DefaultFrame 返回或設置控件的默認目標 Http 幀(字符串)
DisplayBackColor 返回或設置顯示面板的背景色(OLE_COLOR 值)
DisplayForeColor 返回或設置顯示面板的前景色(OLE_COLOR 值)
DisplayMode 返回或設置顯示面板是否用秒或幀的形式顯示當前位置(MPDisplayModeConstants 值)
DisplaySize 返回或設置圖像顯示窗口的大小(MPDisplaySizeConstant 值)
Duration 返回或設置剪輯剪輯的播放時間(雙精度型)
EnableContextMenu 返回或設置是否允許使用上下文菜單(邏輯型)
Enabled 返回或設置控件是否可用(邏輯型)
EnableFullScreenControls 返回或設置全屏幕控制是否可用(邏輯型)
EnablePositionControls 返回或設置位置控制是否可用(邏輯型)
EnableTracker 返回或設置搜索欄控制是否可用(邏輯型)
ErrorCode 返回當前錯誤代碼(長整型)
ErrorCorrection 返回當前剪輯的錯誤修正類型(長整型)
ErrorDescription 返回當前錯誤的描述(字符串)
FileName 返回或設置要播放的剪輯的文件名稱(字符串)
HasError 返回控件是否發生錯誤(邏輯型)
HasMultipleItems 返回或設置控件是否包含某些多重項目的內容(邏輯型)
ImageSourceHeight 返回或設置當前剪輯的原始圖像高度(長整型)
ImageSourceWidth 返回或設置當前剪輯的原始圖像寬度(長整型)
InvokeURLs 返回或設置 URL 是否自動發送請求(邏輯型)
IsBroadcast 返回或設置源是否進行廣播(邏輯型)
IsDurationValid 返回或設置持續時間值是否有效(邏輯型)
Language 返回或設置用於本地化語言支持的當前區域語言(長整型)
LostPackets 返回丟失的數據包數量(長整型)
MarkerCount 返回文件書籤的數量(長整型)
Mute 返回或設置控件是否播放聲音(邏輯型)
OpenState 返回控件的內容源狀態(長整型)
PlayCount 返回或設置一個剪輯播放的次數(長整型)
PlayState 返回控件的當前操作狀態(長整型)
PreviewMode 返回或設置控件是否處在預覽模式(邏輯型)
Rate 返回或設置回放幀頻(雙精度型)
ReadyState 返回控件是否準備就緒(ReadyStateConstant 值)
ReceivedPackets 返回已接收到的數據包的數量(長整型)
ReceptionQuality 返回最後 30 秒接收到的數據包的百分比(長整型)
RecoveredPackets 返回已轉換的數據包的數量(長整型)
SAMIFileName 返回或設置 closed-captioning 文件名(字符串)
SAMILang 返回或設置 closed captioning 語言(字符串)
SAMIStyle 返回或設置 closed captioning 風格(字符串)
SelectionEnd 返回或設置流的結束位置(雙精度型)
SelectionStart 返回或設置流的起始位置(雙精度型)
SendErrorEvents 返回或設置控件是否發送錯誤事件(邏輯型)
SendKeyboardEvents 返回或設置控件是否發送鍵盤事件(邏輯型)
SendMouseClickEvents 返回或設置控件是否發送鼠標單擊事件(邏輯型)
SendMouseMoveEvents 返回或設置控件是否發送鼠標移動事件(邏輯型)
SendOpenStateChangeEvents 返回或設置控件是否發送打開狀態改變事件(邏輯型)
SendPlayStateChangeEvents 返回或設置控件是否發送播放狀態改變事件(邏輯型)
SendWarningEvents 返回或設置控件是否發送警告事件(邏輯型)
ShowAudioControls 返回或設置是否顯示音頻控制(邏輯型)
ShowCaptioning 返回或設置是否顯示字幕(邏輯型)
ShowControls 返回或設置控制面板是否可見(邏輯型)
ShowDisplay 返回或設置是否顯示顯示面板(邏輯型)
ShowGotoBar 返回或設置是否顯示跳轉欄(邏輯型)
ShowPositionControls 返回或設置是否顯示位置控制(邏輯型)
ShowStatusBar 返回或設置是否顯示狀態欄(邏輯型)
ShowTracker 返回或設置是否顯示搜索欄(邏輯型)
SourceLink 返回內容文件的路徑(字符串)
SourceProtocol 返回用於接收數據的協議(長整型)
StreamCount 返回媒體幀的數量(長整型)
TransparentAtStart 返回或設置在開始播放之前和停止之後控件是否透明(邏輯型)
VideoBorder3D 返回或設置視頻邊框是否顯示爲 3D 效果(邏輯型)
VideoBorderColor 返回或設置視頻邊框的顏色(OLE_顏色)
VideoBorderWidth 返回或設置視頻邊框的寬度(長整型)
Volume 返回或設置音量(長整型)



---------------更新部分





embed標籤用法




embed
(一)、基本語法:
embed src=url
說明: embed可以用來插入各種多媒體,格式可以是 Midi、Wav、AIFF、AU、MP3等等,
Netscape及新版的IE 都支持。url爲音頻或視頻文件及其路徑,可以是相對路徑或絕對路徑。
示例: <embed src="your.mid">

(二)、屬性設置:
1、自動播放:
語法: autostart=true、false
說明: 該屬性規定音頻或視頻文件是否在下載完之後就自動播放。
true: 音樂文件在下載完之後自動播放;
false: 音樂文件在下載完之後不自動播放。
示例: <embed src="your.mid" autostart=true>
<embed src="your.mid" autostart=false>


2、循環播放:
語法: loop=正整數、true、false
說明: 該屬性規定音頻或視頻文件是否循環及循環次數。
屬性值爲正整數值時,音頻或視頻文件的循環次數與正整數值相同;
屬性值爲true時,音頻或視頻文件循環;
屬性值爲false時,音頻或視頻文件不循環。
示例: <embed src="your.mid" autostart=true loop=2>
<embed src="your.mid" autostart=true loop=true>
<embed src="your.mid" autostart=true loop=false>

3、面板顯示:
語法: hidden=ture、no
說明: 該屬性規定控制面板是否顯示,默認值爲no。
ture: 隱藏面板;
no: 顯示面板。
示例: <embed src="your.mid" hidden=ture>
          <embed src="your.mid" hidden=no>

4、開始時間:
語法: starttime=mm:ss(分: 秒)
說明: 該屬性規定音頻或視頻文件開始播放的時間。未定義則從文件開頭播放。
示例: <embed src="your.mid" starttime="00:10">

5、音量大小:
語法: volume=0-100之間的整數
說明: 該屬性規定音頻或視頻文件的音量大小。未定義則使用系統本身的設定。
示例: <embed src="your.mid" volume="10">

6、容器屬性:
語法: height=# width=#
說明: 取值爲正整數或百分數,單位爲像素。該屬性規定控制面板的高度和寬度。
height: 控制面板的高度;
width: 控制面板的寬度。
示例: <embed src="your.mid" height=200 width=200>

7、容器單位:
語法: units=pixels、en
說明: 該屬性指定高和寬的單位爲pixels或en。
示例: <embed src="your.mid" units="pixels" height=200 width=200>
<embed src="your.mid" units="en" height=200 width=200>

8、外觀設置:
語法: controls=console、smallconsole、playbutton、pausebutton、stopbutton、
volumelever 說明: 該屬性規定控制面板的外觀。默認值是console。
console: 一般正常面板;
smallconsole: 較小的面板;
playbutton: 只顯示播放按鈕;
pausebutton: 只顯示暫停按鈕;
stopbutton: 只顯示停止按鈕;
volumelever: 只顯示音量調節按鈕。
示例: <embed src="your.mid" controls=smallconsole>
          <embed src="your.mid" controls=volumelever>

9、對象名稱:
語法: name=#
說明: #爲對象的名稱。該屬性給對象取名,以便其他對象利用。
示例: <embed src="your.mid" name="sound1">

10、說明文字:
語法: title=#
說明: #爲說明的文字。該屬性規定音頻或視頻文件的說明文字。
示例: <embed src="your.mid" title="第一首歌">

11、前景色和背景色:
語法: palette=color|color
說明: 該屬性表示嵌入的音頻或視頻文件的前景色和背景色,第一個值爲前景色,第二個值爲背景色,中間用 | 隔開。color可以是RGB色(RRGGBB)也可以是顏色名,還可以是transparent
(透明)。
示例: <embed src="your.mid" palette="red|black">

12、對齊方式:
語法: align=top、bottom、center、baseline、 left、right、texttop、middle、absmiddle、absbottom
說明: 該屬性規定控制面板和當前行中的對象的對齊方式。
center: 控制面板居中;
left: 控制面板居左;
right: 控制面板居右;
top: 控制面板的頂部與當前行中的最高對象的頂部對齊;
bottom: 控制面板的底部與當前行中的對象的基線對齊;
baseline: 控制面板的底部與文本的基線對齊;
texttop: 控制面板的頂部與當前行中的最高的文字頂部對齊;
middle: 控制面板的中間與當前行的基線對齊;
absmiddle: 控制面板的中間與當前文本或對象的中間對齊;
absbottom: 控制面板的底部與文字的底部對齊。
示例: <embed src="your.mid" align=top>
          <embed src="your.mid" align=center>



media player控制

player.controls.play(); 播放
player.controls.stop(); 停止
player.controls.pause(); 暫停
player.controls.currentPosition 返回播放文件的當前時間位置(以秒爲單位)
player.controls.currentPositionString 時間格式的字符串 "0:32"
player.currentMedia.duration 返回播放文件的總長度(以秒爲單位)
player.currentMedia.durationString 時間格式的字符串 "4:34"
player.settings.volume 音量 (0-100)
player.settings.balance 聲道(通過它應該可以進行立體聲、左聲道、右聲道的控制,最左-9640,最右9640。)
player.settings.mute = s 靜音(s取值爲true和false)
player.closedCaption.CaptioningID 網頁中出現字幕的容器的ID
player.closedCaption.SAMIFileName 字幕文件地址
player.playState 返回播放器狀態( 3: 正在播放,2: 暫停1: 已停止)



例子:


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<script>
var music_src = new Array();
music_src[0] = "music/1.mid";
music_src[1] = "music/2.mid";
music_src[2] = "music/3.mid";
music_src[3] = "music/4.mid";
music_src[4] = "music/5.mid";
var array_index = Math.random() * 5;
var music_index = Math.floor(array_index);
function p_music()
{
var starts = wind_meb.playState;
if(starts == 1)
{
music_index++;
alert(music_index);
wind_meb.url = music_src[music_index];
wind_meb.controls.play();
}
timer = setTimeout("p_music()",3000);
}
</script>
</head>
<body onLoad="p_music()">
<object classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" id="wind_meb">
<param value="1" name="ShowStatusBar">
<param name="url" value="music/1.mid">
</object>
</body>
</html>



======================================================


REAL PLAYER控制

player.DoPlay() 播放
player.DoPause() 暫停
player.DoStop() 停止
player.GetLength() 返回播放文件的總長度(以毫秒爲單位)
player.GetPosition() 返回播放文件的當前時間位置(以毫秒爲單位)
player.GetPlayState() 返回播放器狀態(0:停止,1:連接,2:緩衝,3:播放,4:暫停,5:尋找)
player.SetPosition(n) 時間位置跳到n的地方(n取值以毫秒爲單位)
player.SetVolume(n) 設置音量(n取值爲0到100)
player.SetMute(s) 靜音(s取值爲true和false)
player.SetFullScreen() 全屏
player.setSource() 設置文件來源

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章