|
|
|
date: Thu, 4 Sep 2008 04:42:00 -0700,
group: microsoft.public.windowsmedia.player
back
Problem with the media player PlayState values in Javascript
Hi,
Scenario:
I have created a webpage with embedded Windows Media Player using asp.net
2.0 and JavaScript. I have 3 videos displayed on the webpage, one of them
will be played upon the click event.
Initially I am displaying the Images in place of videos, and once the user
clicks on the image ,hiding the image and playing the .wmv file.
And once the Video is finished with playing the file, again we are
displaying the image for the video.
Problem:
1. Buffering Event:
As buffering is taking some time and user is experiencing the latency, I am
displaying a message to the user just below the video, that the buffering is
in progress.
This is done using JavaScript and using media player buffering event, by
setting a timer.
To display the message when the image is clicked to play the video the
conditions are:
buffering progress is less than 100 and Play state is 3.
This works fine on Win 2003 Server, but I had an issue with this on Vista
and IE7.
On Vista machine, the webpage is displaying the buffering message even for
the first time the page loads.
That time if I display the play state, it is showing as 3.
When I check the same on Win 2003 server, initially it shows up 0 and then 3
and then again 0, within fraction of seconds.
2. PlaystateChange event:
I am handling this event, to reset the image once the video is finished with
playing.
In this code for resetting the video image the condition is : if play state
is "0"
On windows server 2003 we don't have any issues.
On Vista , IE7 system when the user clicks on the image to play the
corresponding video, it starts buffering
(having state value as 2 and sometimes 3). Once the buffering has reached
100%, then just before playing the video again the play state is changing to
0,
and hence our code implementation in this event instead of playing the
video, the image is displayed.
Note: In both the events I am not deciding anything based on the order of
the play states, but using the individual play state values.
Any ideas on how I can use playstate values to work consistently in my
scenario.
Thanks in Advance.
date: Thu, 4 Sep 2008 04:42:00 -0700
author: mswin
Re: Problem with the media player PlayState values in Javascript
On Thu, 4 Sep 2008 04:42:00 -0700, mswin
wrote:
>Initially I am displaying the Images in place of videos, and once the user
>clicks on the image ,hiding the image and playing the .wmv file.
>And once the Video is finished with playing the file, again we are
>displaying the image for the video.
>
>Problem:
>
>1. Buffering Event:
>As buffering is taking some time and user is experiencing the latency, I am
>displaying a message to the user just below the video, that the buffering is
>in progress.
>This is done using JavaScript and using media player buffering event, by
>setting a timer.
>To display the message when the image is clicked to play the video the
>conditions are:
>buffering progress is less than 100 and Play state is 3.
The media player SDK is quite clear about depending on state sequence
that determining playState values is not dependable :
"Windows Media Player states are not guaranteed to occur in any
particular order. Furthermore, not every state necessarily occurs
during a sequence of events. You should not write code that relies
upon state order."
What you'll find if you append each change of the playState value to a
textbox is a sequence which may vary, but could well include 3
(playing) a first time, then some more buffering, followed by a steady
3 state.
For that reason you should do this asynchronously in your timer,
checking if the value still *is* playstate 3 after a predetermined
time (I found 100ms is about right) and then toggle your image at that
point.
If the playstate shows a value of 3, start a new timer using
setInterval - reference a global variable to do this in JS;
Then when it fires (say, 100ms), test the playState again;
Reset (cancel) the timer if the playState has a value other than 3.
To add to the effect, you can set the volume to zero until the event
timer fires, then animate the volume level in 10% steps to 100 - or a
previously saved user selected volume level held in a cookie - read
this value on page load from the player object
>This works fine on Win 2003 Server, but I had an issue with this on Vista
>and IE7.
You're saying AFAIK that you're testing *directly* on the server
hosting the media, which doesn't account for network delays because
it'll resolve the server name to localhost (127.0.0.1) and bypass the
network layer in that case.
That won't get you the same circumstances as those on the cline
machine with say a 250ms ping latency.
>On Vista machine, the webpage is displaying the buffering message even for
>the first time the page loads.
>That time if I display the play state, it is showing as 3.
It's not clear what you mean by that.
>When I check the same on Win 2003 server, initially it shows up 0 and then 3
>and then again 0, within fraction of seconds.
PlayState zero is "Windows Media Player is in an undefined state"
You might also want to consider looking at OpenState events instead :
The values available which might be useful are
10 MediaConnecting Connecting to the server that holds the media item.
11 MediaLoading Media item has been located and is now being
retrieved.
12 MediaOpening Media item has been retrieved and is now being opened.
13 MediaOpen Media item is now open.
However if you have codec acquisition again that might throw off any
expectation of sequence you might have.
>2. PlaystateChange event:
>I am handling this event, to reset the image once the video is finished with
>playing.
>In this code for resetting the video image the condition is : if play state
>is "0"
>On windows server 2003 we don't have any issues.
>On Vista , IE7 system when the user clicks on the image to play the
>corresponding video, it starts buffering
>(having state value as 2 and sometimes 3). Once the buffering has reached
You should never see playState 2 in your event handler unless the user
initiated it. It's not a state which is raised during load or
playback. Are you sure you don't have additional code you forgot to
mention which sets the Pause state in code you wrote yourself ?
>100%, then just before playing the video again the play state is changing to
>0,
>and hence our code implementation in this event instead of playing the
>video, the image is displayed.
>
>Note: In both the events I am not deciding anything based on the order of
>the play states, but using the individual play state values.
>
>Any ideas on how I can use playstate values to work consistently in my
>scenario.
I can post some working code when I dig it out tomorrow, all this is
pretty much tied up (including image flips / fades)
Cheers - Neil
------------------------------------------------
Digital Media MVP : 2004-2008
http://mvp.support.microsoft.com/mvpfaqs
date: Thu, 04 Sep 2008 21:20:04 GMT
author: Neil Smith [MVP Digital Media]
Re: Problem with the media player PlayState values in Javascript
Neil,
Thank you for the response.
For the buffering message, I am displaying only when playstate is 3.
On Windows server 2003 system if I access my webpage, then the buffering
message is displayed properly.
When I access the same webpage from Vista system, the buffering message is
displayed even the user didn't clicked on the image to play the video.On the
intial Pageload itself the buffering message is getting displayed.
If I check the Playstate at this moment, the value gets displayed is 0, 3
and then 0 within just fraction of seconds.As my buffering logic depends on
Playstate 3, this behavior is happening.
Regarding playstatechange event, I am not setting the Playstate to pause
anywhere in my script. But still I get the playstate value as 2
sometimes.This is happening when the user clicks on the image to play the
corresponding video.
If you are going to post some code on this, it will be really of great help.
"Neil Smith [MVP Digital Media]" wrote:
> On Thu, 4 Sep 2008 04:42:00 -0700, mswin
> wrote:
>
>
> >Initially I am displaying the Images in place of videos, and once the user
> >clicks on the image ,hiding the image and playing the .wmv file.
> >And once the Video is finished with playing the file, again we are
> >displaying the image for the video.
> >
> >Problem:
> >
> >1. Buffering Event:
> >As buffering is taking some time and user is experiencing the latency, I am
> >displaying a message to the user just below the video, that the buffering is
> >in progress.
> >This is done using JavaScript and using media player buffering event, by
> >setting a timer.
> >To display the message when the image is clicked to play the video the
> >conditions are:
> >buffering progress is less than 100 and Play state is 3.
>
>
> The media player SDK is quite clear about depending on state sequence
> that determining playState values is not dependable :
>
> "Windows Media Player states are not guaranteed to occur in any
> particular order. Furthermore, not every state necessarily occurs
> during a sequence of events. You should not write code that relies
> upon state order."
>
> What you'll find if you append each change of the playState value to a
> textbox is a sequence which may vary, but could well include 3
> (playing) a first time, then some more buffering, followed by a steady
> 3 state.
>
> For that reason you should do this asynchronously in your timer,
> checking if the value still *is* playstate 3 after a predetermined
> time (I found 100ms is about right) and then toggle your image at that
> point.
>
> If the playstate shows a value of 3, start a new timer using
> setInterval - reference a global variable to do this in JS;
>
> Then when it fires (say, 100ms), test the playState again;
> Reset (cancel) the timer if the playState has a value other than 3.
>
> To add to the effect, you can set the volume to zero until the event
> timer fires, then animate the volume level in 10% steps to 100 - or a
> previously saved user selected volume level held in a cookie - read
> this value on page load from the player object
>
>
> >This works fine on Win 2003 Server, but I had an issue with this on Vista
> >and IE7.
>
>
> You're saying AFAIK that you're testing *directly* on the server
> hosting the media, which doesn't account for network delays because
> it'll resolve the server name to localhost (127.0.0.1) and bypass the
> network layer in that case.
>
> That won't get you the same circumstances as those on the cline
> machine with say a 250ms ping latency.
>
> >On Vista machine, the webpage is displaying the buffering message even for
> >the first time the page loads.
> >That time if I display the play state, it is showing as 3.
>
>
> It's not clear what you mean by that.
>
>
> >When I check the same on Win 2003 server, initially it shows up 0 and then 3
> >and then again 0, within fraction of seconds.
>
>
> PlayState zero is "Windows Media Player is in an undefined state"
>
> You might also want to consider looking at OpenState events instead :
>
> The values available which might be useful are
>
> 10 MediaConnecting Connecting to the server that holds the media item.
> 11 MediaLoading Media item has been located and is now being
> retrieved.
> 12 MediaOpening Media item has been retrieved and is now being opened.
> 13 MediaOpen Media item is now open.
>
>
> However if you have codec acquisition again that might throw off any
> expectation of sequence you might have.
>
> >2. PlaystateChange event:
> >I am handling this event, to reset the image once the video is finished with
> >playing.
> >In this code for resetting the video image the condition is : if play state
> >is "0"
> >On windows server 2003 we don't have any issues.
> >On Vista , IE7 system when the user clicks on the image to play the
> >corresponding video, it starts buffering
> >(having state value as 2 and sometimes 3). Once the buffering has reached
>
>
> You should never see playState 2 in your event handler unless the user
> initiated it. It's not a state which is raised during load or
> playback. Are you sure you don't have additional code you forgot to
> mention which sets the Pause state in code you wrote yourself ?
>
>
> >100%, then just before playing the video again the play state is changing to
> >0,
> >and hence our code implementation in this event instead of playing the
> >video, the image is displayed.
> >
> >Note: In both the events I am not deciding anything based on the order of
> >the play states, but using the individual play state values.
> >
> >Any ideas on how I can use playstate values to work consistently in my
> >scenario.
>
>
> I can post some working code when I dig it out tomorrow, all this is
> pretty much tied up (including image flips / fades)
>
> Cheers - Neil
> ------------------------------------------------
> Digital Media MVP : 2004-2008
> http://mvp.support.microsoft.com/mvpfaqs
>
date: Thu, 4 Sep 2008 21:35:01 -0700
author: mswin
Re: Problem with the media player PlayState values in Javascript
Sorry for the delay - I was best man at a wedding, been tied up.
Something like this, though I haven't tested it on Vista since I wrote
it a couple of years ago :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="javascript1.2" type="text/javascript">
WMP9=new Object();
window.offScreenBuffering=true;
function showPlayItems(state) {
if (state) {
WMP9.style.clip="rect(144px 176px 184px 0px)";
setTimeout("switchAlpha(100,"+state+")",1000);
} else {
WMP9.style.clip="rect(144px 176px 184px 0px)";
setTimeout("switchAlpha(0,"+state+")",50);
}
return;
// document.getElementById("overlay").style.display=("block");
document.getElementById("overlay").style.display=(state?"none":"block");
WMP9.style.clip=(state?"rect(144px 176px 184px 0px)":"rect(0px
176px 184px 0px)");
// WMP9.style.zIndex=0;
// WMP9.style.display=(state?"block":"none");
}
function switchAlpha(i,direction) {
if (i>=0 && i<=100) {
document.getElementById("overlay").style.filter="Alpha(Opacity="+i+")";
window.status=i+" "+(direction?'true':'false');
i=(direction?i-5:i+5);
setTimeout("switchAlpha("+i+","+direction+")",15);
} else {
WMP9.style.clip="rect(0px 176px 184px 0px)";
}
}
function startPlay() {
WMP9.URL="trailer.wmv";
WMP9.controls.play();
}
function stopPlay() {
WMP9.controls.stop();
// switchAlpha(0,false);
}
function setPlayerID() {
WMP9=document.getElementById("MediaPlayer");
WMP9.attachEvent("playstatechange",setPlayerState);
WMP9.stretchToFit=true;
WMP9.windowlessVideo=true;
// WMP9.settings.setMode(showFrame,true);
}
function setPlayerState() {
if (WMP9.playState==3) {
showPlayItems(true);
}
if (WMP9.playState==8) {
WMP9.URL="";
showPlayItems(false);
}
if (WMP9.playState==1) {
WMP9.URL="";
showPlayItems(false);
}
}
</script>
<style type="text/css">
#playerouter {
position: relative;
left: 0;
top: 0;
width: 176px;
height: 184px;
}
#overlay {
position: absolute;
left: 0;
top: 0;
width: 176px;
height: 144px;
z-index: 1;
display: block;
}
#playerinner {
position: absolute;
left: 0;
top: 0;
width: 176px;
height: 184px;
z-index: 0;
clip: rect(0px 176px 184px 0px);
}
</style>
</head>
<body onload="setPlayerID()">
<div id="playerouter">
<div id="overlay"><img src="overlay.gif" width="176" height="140"
border="0" alt="Preview Image" /></div>
<div id="playerinner">
<object id="MediaPlayer"
classid="clsid:6bf52a52-394a-11d3-b153-00c04f79faa6"
type="application/x-oleobject" width="176" height="184">
<param name="autostart" value="0">
<param name="showcontrols" value="0">
<param name="uimode" value="mini">
<param name="stretchtofit" value="0">
<param name="enablecontextmenu" value="1">
</object>
</div>
</div>
<a href="#" onclick="startPlay(); return false">Click to play</a>
<a href="#" onclick="stopPlay(); return false">Click to Stop</a>
</body>
</html>
On Thu, 4 Sep 2008 21:35:01 -0700, mswin
wrote:
>Neil,
>
>Thank you for the response.
>For the buffering message, I am displaying only when playstate is 3.
>On Windows server 2003 system if I access my webpage, then the buffering
>message is displayed properly.
>
>When I access the same webpage from Vista system, the buffering message is
>displayed even the user didn't clicked on the image to play the video.On the
>intial Pageload itself the buffering message is getting displayed.
>
>If I check the Playstate at this moment, the value gets displayed is 0, 3
>and then 0 within just fraction of seconds.As my buffering logic depends on
>Playstate 3, this behavior is happening.
>
>Regarding playstatechange event, I am not setting the Playstate to pause
>anywhere in my script. But still I get the playstate value as 2
>sometimes.This is happening when the user clicks on the image to play the
>corresponding video.
>
>If you are going to post some code on this, it will be really of great help.
>
>
>"Neil Smith [MVP Digital Media]" wrote:
>
>> On Thu, 4 Sep 2008 04:42:00 -0700, mswin
>> wrote:
>>
>>
>> >Initially I am displaying the Images in place of videos, and once the user
>> >clicks on the image ,hiding the image and playing the .wmv file.
>> >And once the Video is finished with playing the file, again we are
>> >displaying the image for the video.
>> >
>> >Problem:
>> >
>> >1. Buffering Event:
>> >As buffering is taking some time and user is experiencing the latency, I am
>> >displaying a message to the user just below the video, that the buffering is
>> >in progress.
>> >This is done using JavaScript and using media player buffering event, by
>> >setting a timer.
>> >To display the message when the image is clicked to play the video the
>> >conditions are:
>> >buffering progress is less than 100 and Play state is 3.
>>
>>
>> The media player SDK is quite clear about depending on state sequence
>> that determining playState values is not dependable :
>>
>> "Windows Media Player states are not guaranteed to occur in any
>> particular order. Furthermore, not every state necessarily occurs
>> during a sequence of events. You should not write code that relies
>> upon state order."
>>
>> What you'll find if you append each change of the playState value to a
>> textbox is a sequence which may vary, but could well include 3
>> (playing) a first time, then some more buffering, followed by a steady
>> 3 state.
>>
>> For that reason you should do this asynchronously in your timer,
>> checking if the value still *is* playstate 3 after a predetermined
>> time (I found 100ms is about right) and then toggle your image at that
>> point.
>>
>> If the playstate shows a value of 3, start a new timer using
>> setInterval - reference a global variable to do this in JS;
>>
>> Then when it fires (say, 100ms), test the playState again;
>> Reset (cancel) the timer if the playState has a value other than 3.
>>
>> To add to the effect, you can set the volume to zero until the event
>> timer fires, then animate the volume level in 10% steps to 100 - or a
>> previously saved user selected volume level held in a cookie - read
>> this value on page load from the player object
>>
>>
>> >This works fine on Win 2003 Server, but I had an issue with this on Vista
>> >and IE7.
>>
>>
>> You're saying AFAIK that you're testing *directly* on the server
>> hosting the media, which doesn't account for network delays because
>> it'll resolve the server name to localhost (127.0.0.1) and bypass the
>> network layer in that case.
>>
>> That won't get you the same circumstances as those on the cline
>> machine with say a 250ms ping latency.
>>
>> >On Vista machine, the webpage is displaying the buffering message even for
>> >the first time the page loads.
>> >That time if I display the play state, it is showing as 3.
>>
>>
>> It's not clear what you mean by that.
>>
>>
>> >When I check the same on Win 2003 server, initially it shows up 0 and then 3
>> >and then again 0, within fraction of seconds.
>>
>>
>> PlayState zero is "Windows Media Player is in an undefined state"
>>
>> You might also want to consider looking at OpenState events instead :
>>
>> The values available which might be useful are
>>
>> 10 MediaConnecting Connecting to the server that holds the media item.
>> 11 MediaLoading Media item has been located and is now being
>> retrieved.
>> 12 MediaOpening Media item has been retrieved and is now being opened.
>> 13 MediaOpen Media item is now open.
>>
>>
>> However if you have codec acquisition again that might throw off any
>> expectation of sequence you might have.
>>
>> >2. PlaystateChange event:
>> >I am handling this event, to reset the image once the video is finished with
>> >playing.
>> >In this code for resetting the video image the condition is : if play state
>> >is "0"
>> >On windows server 2003 we don't have any issues.
>> >On Vista , IE7 system when the user clicks on the image to play the
>> >corresponding video, it starts buffering
>> >(having state value as 2 and sometimes 3). Once the buffering has reached
>>
>>
>> You should never see playState 2 in your event handler unless the user
>> initiated it. It's not a state which is raised during load or
>> playback. Are you sure you don't have additional code you forgot to
>> mention which sets the Pause state in code you wrote yourself ?
>>
>>
>> >100%, then just before playing the video again the play state is changing to
>> >0,
>> >and hence our code implementation in this event instead of playing the
>> >video, the image is displayed.
>> >
>> >Note: In both the events I am not deciding anything based on the order of
>> >the play states, but using the individual play state values.
>> >
>> >Any ideas on how I can use playstate values to work consistently in my
>> >scenario.
>>
>>
>> I can post some working code when I dig it out tomorrow, all this is
>> pretty much tied up (including image flips / fades)
>>
>> Cheers - Neil
>> ------------------------------------------------
>> Digital Media MVP : 2004-2008
>> http://mvp.support.microsoft.com/mvpfaqs
>>
------------------------------------------------
Digital Media MVP : 2004-2008
http://mvp.support.microsoft.com/mvpfaqs
date: Mon, 08 Sep 2008 22:32:19 GMT
author: Neil Smith [MVP Digital Media]
|
|
