Is there a Flash MP3 player that would allow me to do following to pass URL to mp3 file and get it automatically played. To help out with answer - here is detailed code that describes what I would like to do:
<object id="mp3PlayerSwf" type="application/x-shockwave-flash" data="mp3Player.swf">
<param name="movie" value="mp3Player.swf">
</object>
<input type="button" id="soundPlay1" value="Sound Play 1" />
<script type="text/javascript">
function eventHandler1(sender) {
var mp3Player = document.getElementById("mp3PlayerSwf");
mp3Player.playSound("http://myUrl.com/my.mp3");
}
var soundPlay1 = document.getElementById('soundPlay1');
if (soundPlay1.addEventListener) {
soundPlay1.addEventListener('click', eventHandler1, false);
}
// IE
else if (soundPlay1.attachEvent) {
soundPlay1.attachEvent('onclick', eventHandler1);
}
</script>
Constraint is that I can't use libraries that have JavaScript initialization - like for example SoundManager2 - http://www.schillmania.com/content/projects/soundmanager2/
Thanks for any help!
Try dewplayer: http://www.alsacreations.fr/dewplayer-en
You can use it like this (sample code taken from the link):
<object type="application/x-shockwave-flash" data="dewplayer.swf" width="200" height="20" id="dewplayer" name="dewplayer">
<param name="movie" value="dewplayer.swf" />
<param name="flashvars" value="mp3=test.mp3" />
<param name="wmode" value="transparent" />
</object>
Another player would be http://musicplayer.sourceforge.net
Related
I need to control the play and pause of video element in my website. The significant part of the html is given below.
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="800" height="515">
<param name="pluginspage" value="http://www.apple.com/quicktime/download/" />
<param name="src" value="http://lms.alefeducation.com/pluginfile.php/886/mod_lesson/page_contents/506/6N1.1%20Intro%20Video.mp4" />
<param name="controller" value="true" />
<param name="loop" value="false" />
<param name="autoplay" value="false" />
<param name="autostart" value="false" />
<param name="scale" value="aspect" />
<!--[if !IE]>-->
<object data="http://lms.alefeducation.com/pluginfile.php/886/mod_lesson/page_contents/506/6N1.1%20Intro%20Video.mp4" type="video/mp4" width="800" height="515">
<param name="src" value="http://lms.alefeducation.com/pluginfile.php/886/mod_lesson/page_contents/506/6N1.1%20Intro%20Video.mp4" />
<param name="pluginurl" value="http://www.apple.com/quicktime/download/" />
<param name="controller" value="true" />
<param name="loop" value="false" />
<param name="autoplay" value="false" />
<param name="autostart" value="false" />
<param name="scale" value="aspect" />
<!--<![endif]-->
<span class="mediaplugin mediaplugin_html5video">
<video controls="true" width="800" height="500" preload="metadata" title="6N1.1 Intro Video.mp4">
<source src="http://lms.alefeducation.com/pluginfile.php/886/mod_lesson/page_contents/506/6N1.1%20Intro%20Video.mp4" type="video/mp4"></source>
<a class="mediafallbacklink" href="http://lms.alefeducation.com/pluginfile.php/886/mod_lesson/page_contents/506/6N1.1%20Intro%20Video.mp4">6N1.1%20Intro%20Video.mp4</a>
</video>
</span>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</span><br></p>
Now I am trying to control the video with the following code
var videos = document.querySelectorAll('video');
for(i=0;i<videos.length;i++) {
videos[i].id = 'video-'+i;
}
$(document).ready(function () {
var interval = self.setInterval(function(){LoopForever()},1000);
var video0 = document.getElementById('video-0');
function LoopForever() {
$.ajax({url:"http://localhost/StudentState.php",
headers: {
'Access-Control-Allow-Origin': '*'
},
success:function(data){
var video0 = document.getElementById('video-0');
if(video0.ended == false){
if(data >0){
video0.play();
} else{
video0.pause();
}
}
}
})
}
});
But what happens that two video objects are created. And from the javascript code above, only the newly created object is being controlled, not the object being shown in the browser.
Do anyone have answer to this???
Update
The complete code goes here:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<p><span class="mediaplugin mediaplugin_qt">
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="800" height="515">
<param name="pluginspage" value="http://www.apple.com/quicktime/download/" />
<param name="src" value="Area_of_irregular_shape.mp4" />
<param name="controller" value="true" />
<param name="loop" value="false" />
<param name="autoplay" value="false" />
<param name="autostart" value="false" />
<param name="scale" value="aspect" />
<!--[if !IE]>-->
<object data="Area_of_irregular_shape.mp4" type="video/mp4" width="800" height="515">
<param name="src" value="Area_of_irregular_shape.mp4" />
<param name="pluginurl" value="http://www.apple.com/quicktime/download/" />
<param name="controller" value="true" />
<param name="loop" value="false" />
<param name="autoplay" value="false" />
<param name="autostart" value="false" />
<param name="scale" value="aspect" />
<!--<![endif]-->
<span class="mediaplugin mediaplugin_html5video">
<video controls="true" width="800" height="500" preload="metadata">
<source src="Area_of_irregular_shape.mp4" type="video/mp4"></source>
</video>
</span>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</span><br></p>
<script>
var videos = document.querySelectorAll('video');
for(i=0;i<videos.length;i++) {
videos[i].id = 'video-'+i;
}
$(document).ready(function () {
var interval = self.setInterval(function(){LoopForever()},1000);
var video0 = document.getElementById('video-0');
function LoopForever() {
$.ajax({url:"http://localhost/StudentState.php",
headers: {
'Access-Control-Allow-Origin': '*'
},
success:function(data){
var video0 = document.getElementById('video-0');
if(video0.ended == false){
if(data >0){
video0.play();
} else{
video0.pause();
}
}
}
})
}
});
</script>
</body>a
</html>
Now if I debug it in chrome, it is replicated.
I understood the problem and got a hack around it.
The inner object has a type video/mp4. So browser was rendering it as a video. And javascript code was just identifying it as an object. When trying to get video object through code, the script was giving reference to the code in video tag. So, two instances of the same video has been created. And through javascript, only the second video could be controlled.
Now here I got the hack. I won't say it is a standard solution. But its a way around the problem.
I got reference to the video element and appended it to the outer object. Now I removed the inner object.
So, the new video got rendered and now I have controls of the video through javascript.
Here goes the relevant code.
var objects = document.getElementsByTagName('object');
var video = objects[1].lastElementChild.firstChild.nextElementSibling;
var object0 = objects[0];
object0.appendChild(video);
object0.removeChild(object0.childNodes[17]);
var video = object0.lastChild;
Am working on a flash slider.I have 2 images embeded in it.. is it possible to click on the images and load a new html page?Here is my code:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="308" height="118" title="location">
<param name="movie" value="<?=base_url()?>flash/home/locationsliders.swf">
<param name="quality" value="high">
<embed src="<?=base_url()?>flash/home/locationsliders.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="308" height="118" ></embed>
</object>
<script type="text/javascript">
AC_FL_RunContent('codebase',
'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','308','height',
'118','title','location','src',
'<=base_url()>flash/home/locationsliders',
'quality','high','pluginspage',
'http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash',
'movie','<?=base_url()?>flash/home/locationsliders' ); //end AC code
</script>
I have Orekaweb a audio recorder. It runs on Apache tomcat. What it does is it records all calls on VOIP network and provides a easy access to view them on web browser.
The issue is the recorded calls are in WAV format and it works perfect in IE. the codes are.
<td colspan="2">
<script language="JavaScript">
function play (audioFilename)
{
document.all.player.autoStart = true;
document.all.player.fileName = audioFilename;
}
</script>
<OBJECT ID="player"
CLASSID="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"
CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/
en/nsmp2inf.cab#Version=5,1,52,701"
STANDBY="Loading Microsoft Windows Media Player components..."
TYPE="application/x-oleobject"
WIDTH=280 HEIGHT=50 >
<PARAM NAME="fileName" VALUE="">
<PARAM NAME="animationatStart" VALUE="false">
<PARAM NAME="transparentatStart" VALUE="true">
<PARAM NAME="showControls" VALUE="true">
<PARAM NAME="ShowStatusBar" VALUE="true">
<PARAM NAME="ShowDisplay" VALUE="false">
<PARAM NAME="ShowPositionControls" VALUE="true">
<PARAM NAME="ShowTracker" VALUE="true">
<PARAM NAME="CurrentPosition" VALUE="0">
<PARAM NAME="autoStart" VALUE="true">
</OBJECT>
The audio play back function is not playing on Google chrome or other browsers.
So i thought of adding up inbuilt webkit player.
I added up the codes its below.
<td colspan="2">
<script language="JavaScript">
function play (audioFilename)
{
document.all.player.autoStart = true;
document.all.player.fileName = audioFilename;
}
</script>
<audio width="280" height="50" controls="controls" src="audiofileName" >
<object width="280" height="50" type="audio/x-wav" data="audiofileName">
<PARAM NAME="fileName" VALUE="">
<!-- Image as a last resort -->
</object>
</audio>
I see the player, but its playing.
Can anyone help me in this regards.
Stephen Paulraj
I made a progress bar for .swf.
Code in <head>:
function ProgressBar(){
setTimeout(function (){
if (swfobject.getObjectById("Object").IsPlaying()) {
var TotalFrames = swfobject.getObjectById("Object").TotalFrames();
console.log(console.log("TotalFrames: " + TotalFrames));
var TCurrentFrame = swfobject.getObjectById("Object").CurrentFrame;
console.log(TCurrentFrame);
}
}, 200);
}
Code in <body>:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="600" height="600" id="Object">
<param name="movie" value="./Flash.swf">
<param name="wmode" value="transparent">
<param name="loop" value="false">
<param name="play" value="false">
<param name="quality" value="high">
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="./Flash.swf" width="600" height="600" id="Object">
<param name="wmode" value="transparent">
<param name="loop" value="false">
<param name="play" value="false">
<param name="quality" value="high">
</object>
<!--<![endif]-->
</object>
jQuery:
$("#button").on("click", function(){
ProgressBar();
})
I want the output TotalFrame and CurrentFrame, but the function SetInterval shows the result only once.
Output in console log:
TotalFrames: 745
undefined
102
How do I write this? What is the error?
Perhaps because you aren't using setInterval like in your question's title but setTimeout in your code ;)
Your ProgressBar function is using setTimeout(), not setInterval(). setTimeout() only fires the timeout once.
I am trying to call a Jscript function from a flash object. I want the function to be called when the animation ends.
Here is the embed code
<h1 align="center">
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
WIDTH="360" HEIGHT="250" id="Yourfilename" ALIGN="center">
<PARAM NAME=movie VALUE="newbanner.swf">
<PARAM NAME=quality VALUE=high/><param name="LOOP" value="false" />
<param name="allowscriptaccess" value="always" />
<param name="wmode" value="transparent">
<param name="bgcolor" value="#FFFFFF">
<EMBED src="newbanner.swf" quality="high" bgcolor="#FFFFFF"
WIDTH="360" HEIGHT="250" loop="false" NAME="newbanner.swf" ALIGN=""
TYPE="application/x-shockwave-flash"
PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
</EMBED>
</OBJECT>
</h1>
here is the jScript function i want to call:
<script language="javascript">
function mainFunction() {
var mydiv = document.getElementById('content');
mydiv.innerHTML = "hello";
}
</script>
here is the action code I add to the last frame of the flash object
URLLoader("javascript:mainFunction();");
The object loads but the function is not called. I can call the function other ways such as using an "onclick = mainFunction()" event on a button for example. Where am i going wrong?
thanks in advance.
Why don't you use flash.external.ExternalInterface.call ?