The Flash movie is in the object, when the Flash movie is playing I check the element in Chrome, and the code is like this:
<object type="application/x-shockwave-flash" data="http://s2.pstatp.com/site/video/player.swf" width="100%" height="100%" id="vjs_video_3_Flash_api" name="vjs_video_3_Flash_api" class="vjs-tech">
<param name="movie" value="http://s2.pstatp.com/site/video/player.swf">
<param name="flashvars" value="readyFunction=videojs.Flash.onReady&eventProxyFunction=videojs.Flash.onEvent&errorEventProxyFunction=videojs.Flash.onError&autoplay=false&preload=auto&loop=false&muted=undefined&">
<param name="allowScriptAccess" value="always">
<param name="allowNetworking" value="all"><param name="wmode" value="opaque">
<param name="bgcolor" value="#000000">
</object>
I can't see the embed. Why can it play without the embed? Now I have got the <object> element by document.getElementsByTagName('object') in the Chrome console, but how can I get the Flash URL with JavaScript?
Something like this should work:
function getMovieUrl(obj) {
Array.prototype.forEach.call(obj.children, function(param) {
if (param.getAttribute('name') === 'movie') {
return param.geAttribute('value');
}
});
return null;
}
I need pregmatch to fetch 'v1.0' from the first comment line
I tried this, but its not working for me '#[\s\S]*(?<=WebcamJS )([0-9.]+)#' permalink
// WebcamJS v1.0 - http://github.com/jhuckaby/webcamjs - MIT Licensed
(function(e){var Webcam={version:"1.0.0",protocol:location.protocol.match(/https/i)?"https":"http",swfURL:"",loaded:false,live:false,userMedia:true,params:{width:0,height:0,dest_width:0,dest_height:0,image_format:"jpeg",jpeg_quality:90,force_flash:false},hooks:{load:null,live:null,uploadcomplete:null,uploadprogress:null,error:function(e){alert("Webcam.js Error: "+e)}},init:function(){navigator.getUserMedia=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;e.URL=e.URL||e.webkitURL||e.mozURL||e.msURL;this.userMedia=this.userMedia&&!!navigator.getUserMedia&&!!e.URL;if(navigator.userAgent.match(/Firefox\D+(\d+)/)){if(parseInt(RegExp.$1,10)<21)this.userMedia=null}},attach:function(t){if(typeof t=="string"){t=document.getElementById(t)||document.querySelector(t)}if(!t){return this.dispatch("error","Could not locate DOM element to attach to.")}this.container=t;t.innerHTML="";var a=document.createElement("div");t.appendChild(a);this.peg=a;if(!this.params.width)this.params.width=t.offsetWidth;if(!this.params.height)this.params.height=t.offsetHeight;if(!this.params.dest_width)this.params.dest_width=this.params.width;if(!this.params.dest_height)this.params.dest_height=this.params.height;if(this.params.force_flash)this.userMedia=null;var i=this.params.width/this.params.dest_width;var s=this.params.height/this.params.dest_height;if(this.userMedia){var r=document.createElement("video");r.setAttribute("autoplay","autoplay");r.style.width=""+this.params.dest_width+"px";r.style.height=""+this.params.dest_height+"px";if(i!=1||s!=1){t.style.overflow="hidden";r.style.webkitTransformOrigin="0px 0px";r.style.mozTransformOrigin="0px 0px";r.style.msTransformOrigin="0px 0px";r.style.oTransformOrigin="0px 0px";r.style.transformOrigin="0px 0px";r.style.webkitTransform="scaleX("+i+") scaleY("+s+")";r.style.mozTransform="scaleX("+i+") scaleY("+s+")";r.style.msTransform="scaleX("+i+") scaleY("+s+")";r.style.oTransform="scaleX("+i+") scaleY("+s+")";r.style.transform="scaleX("+i+") scaleY("+s+")"}t.appendChild(r);this.video=r;var o=this;navigator.getUserMedia({audio:false,video:true},function(t){r.src=e.URL.createObjectURL(t)||t;Webcam.stream=t;Webcam.loaded=true;Webcam.live=true;Webcam.dispatch("load");Webcam.dispatch("live")},function(e){return o.dispatch("error","Could not access webcam.")})}else{var h=document.createElement("div");h.innerHTML=this.getSWFHTML();t.appendChild(h)}if(this.params.crop_width&&this.params.crop_height){var n=Math.floor(this.params.crop_width*i);var l=Math.floor(this.params.crop_height*s);t.style.width=""+n+"px";t.style.height=""+l+"px";t.style.overflow="hidden";t.scrollLeft=Math.floor(this.params.width/2-n/2);t.scrollTop=Math.floor(this.params.height/2-l/2)}else{t.style.width=""+this.params.width+"px";t.style.height=""+this.params.height+"px"}},reset:function(){if(this.preview_active)this.unfreeze();if(this.userMedia){try{this.stream.stop()}catch(e){}delete this.stream;delete this.video}this.container.innerHTML="";delete this.container;this.loaded=false;this.live=false},set:function(){if(arguments.length==1){for(var e in arguments[0]){this.params[e]=arguments[0][e]}}else{this.params[arguments[0]]=arguments[1]}},on:function(e,t){e=e.replace(/^on/i,"").toLowerCase();if(typeof this.hooks[e]=="undefined")throw"Event type not supported: "+e;this.hooks[e]=t},dispatch:function(){var t=arguments[0].replace(/^on/i,"").toLowerCase();var a=Array.prototype.slice.call(arguments,1);if(this.hooks[t]){if(typeof this.hooks[t]=="function"){this.hooks[t].apply(this,a)}else if(typeof this.hooks[t]=="array"){this.hooks[t][0][this.hooks[t][1]].apply(this.hooks[t][0],a)}else if(e[this.hooks[t]]){e[this.hooks[t]].apply(e,a)}return true}return false},setSWFLocation:function(e){this.swfURL=e},getSWFHTML:function(){var t="";if(location.protocol.match(/file/)){return'<h1 style="color:red">Sorry, the Webcam.js Flash fallback does not work from local disk. Please upload it to a web server first.</h1>'}if(!this.swfURL){var a="";var i=document.getElementsByTagName("script");for(var s=0,r=i.length;s<r;s++){var o=i[s].getAttribute("src");if(o&&o.match(/\/webcam(\.min)?\.js/)){a=o.replace(/\/webcam(\.min)?\.js.*$/,"");s=r}}if(a)this.swfURL=a+"/webcam.swf";else this.swfURL="webcam.swf"}if(e.localStorage&&!localStorage.getItem("visited")){this.params.new_user=1;localStorage.setItem("visited",1)}var h="";for(var n in this.params){if(h)h+="&";h+=n+"="+escape(this.params[n])}t+='<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" type="application/x-shockwave-flash" codebase="'+this.protocol+'://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="'+this.params.width+'" height="'+this.params.height+'" id="webcam_movie_obj" align="middle"><param name="wmode" value="opaque" /><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="false" /><param name="movie" value="'+this.swfURL+'" /><param name="loop" value="false" /><param name="menu" value="false" /><param name="quality" value="best" /><param name="bgcolor" value="#ffffff" /><param name="flashvars" value="'+h+'"/><embed id="webcam_movie_embed" src="'+this.swfURL+'" wmode="opaque" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="'+this.params.width+'" height="'+this.params.height+'" name="webcam_movie_embed" align="middle" allowScriptAccess="always" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="'+h+'"></embed></object>';return t},getMovie:function(){if(!this.loaded)return this.dispatch("error","Flash Movie is not loaded yet");var e=document.getElementById("webcam_movie_obj");if(!e||!e._snap)e=document.getElementById("webcam_movie_embed");if(!e)this.dispatch("error","Cannot locate Flash movie in DOM");return e},freeze:function(){var e=this;var t=this.params;if(this.preview_active)this.unfreeze();var a=this.params.width/this.params.dest_width;var i=this.params.height/this.params.dest_height;var s=t.crop_width||t.dest_width;var r=t.crop_height||t.dest_height;var o=document.createElement("canvas");o.width=s;o.height=r;var h=o.getContext("2d");this.preview_canvas=o;this.preview_context=h;if(a!=1||i!=1){o.style.webkitTransformOrigin="0px 0px";o.style.mozTransformOrigin="0px 0px";o.style.msTransformOrigin="0px 0px";o.style.oTransformOrigin="0px 0px";o.style.transformOrigin="0px 0px";o.style.webkitTransform="scaleX("+a+") scaleY("+i+")";o.style.mozTransform="scaleX("+a+") scaleY("+i+")";o.style.msTransform="scaleX("+a+") scaleY("+i+")";o.style.oTransform="scaleX("+a+") scaleY("+i+")";o.style.transform="scaleX("+a+") scaleY("+i+")"}this.snap(function(){o.style.position="relative";o.style.left=""+e.container.scrollLeft+"px";o.style.top=""+e.container.scrollTop+"px";e.container.insertBefore(o,e.peg);e.container.style.overflow="hidden";e.preview_active=true},o)},unfreeze:function(){if(this.preview_active){this.container.removeChild(this.preview_canvas);delete this.preview_context;delete this.preview_canvas;this.preview_active=false}},savePreview:function(e,t){var a=this.params;var i=this.preview_canvas;var s=this.preview_context;if(t){var r=t.getContext("2d");r.drawImage(i,0,0)}e(t?null:i.toDataURL("image/"+a.image_format,a.jpeg_quality/100),i,s);this.unfreeze()},snap:function(e,t){var a=this;var i=this.params;if(!this.loaded)return this.dispatch("error","Webcam is not loaded yet");if(!this.live)return this.dispatch("error","Webcam is not live yet");if(!e)return this.dispatch("error","Please provide a callback function or canvas to snap()");if(this.preview_active){this.savePreview(e,t);return null}var s=document.createElement("canvas");s.width=this.params.dest_width;s.height=this.params.dest_height;var r=s.getContext("2d");var o=function(){if(this.src&&this.width&&this.height){r.drawImage(this,0,0,i.dest_width,i.dest_height)}if(i.crop_width&&i.crop_height){var a=document.createElement("canvas");a.width=i.crop_width;a.height=i.crop_height;var o=a.getContext("2d");o.drawImage(s,Math.floor(i.dest_width/2-i.crop_width/2),Math.floor(i.dest_height/2-i.crop_height/2),i.crop_width,i.crop_height,0,0,i.crop_width,i.crop_height);r=o;s=a}if(t){var h=t.getContext("2d");h.drawImage(s,0,0)}e(t?null:s.toDataURL("image/"+i.image_format,i.jpeg_quality/100),s,r)};if(this.userMedia){r.drawImage(this.video,0,0,this.params.dest_width,this.params.dest_height);o()}else{var h=this.getMovie()._snap();var n=new Image;n.onload=o;n.src="data:image/"+this.params.image_format+";base64,"+h}return null},configure:function(e){if(!e)e="camera";this.getMovie()._configure(e)},flashNotify:function(e,t){switch(e){case"flashLoadComplete":this.loaded=true;this.dispatch("load");break;case"cameraLive":this.live=true;this.dispatch("live");break;case"error":this.dispatch("error",t);break;default:break}},b64ToUint6:function(e){return e>64&&e<91?e-65:e>96&&e<123?e-71:e>47&&e<58?e+4:e===43?62:e===47?63:0},base64DecToArr:function(e,t){var a=e.replace(/[^A-Za-z0-9\+\/]/g,""),i=a.length,s=t?Math.ceil((i*3+1>>2)/t)*t:i*3+1>>2,r=new Uint8Array(s);for(var o,h,n=0,l=0,c=0;c<i;c++){h=c&3;n|=this.b64ToUint6(a.charCodeAt(c))<<18-6*h;if(h===3||i-c===1){for(o=0;o<3&&l<s;o++,l++){r[l]=n>>>(16>>>o&24)&255}n=0}}return r},upload:function(e,t,a){if(a)Webcam.on("uploadComplete",a);var i="webcam";var s="";if(e.match(/^data\:image\/(\w+)/))s=RegExp.$1;else throw"Cannot locate image format in Data URI";var r=e.replace(/^data\:image\/\w+\;base64\,/,"");var o=new XMLHttpRequest;o.open("POST",t,true);if(o.upload&&o.upload.addEventListener){o.upload.addEventListener("progress",function(e){if(e.lengthComputable){var t=e.loaded/e.total;Webcam.dispatch("uploadProgress",t,e)}},false)}o.onload=function(){Webcam.dispatch("uploadComplete",o.status,o.responseText,o.statusText)};var h=new Blob([this.base64DecToArr(r)],{type:"image/"+s});var n=new FormData;n.append(i,h,i+"."+s.replace(/e/,""));o.send(n)}};Webcam.init();if(typeof define==="function"&&define.amd){define(function(){return Webcam})}else if(typeof module==="object"&&module.exports){module.exports=Webcam}else{e.Webcam=Webcam}})(window);
I would suggest something like this:
/\/\/\s*WebcamJS\s*v([0-9.]+)/i
I have written some JavaScript that will display a video when someone clicks on a picture and then they can click on the "x" to close the video but the video continues to play in ie8 when hidden but stops with FireFox and Chrome. If anyone can tell me how to fix this by having the video stop when the "xbutton" image is clicked I'd greatly appreciate it I have been fighting with this for hours. This is what I have so for JavaScript:
function toggle(div_id) {
var el = document.getElementById(div_id);
if ( el.style.display == 'none' ) { el.style.display = 'block';}
else {el.style.display = 'none';} }
function blanket_size(popUpDivVar) {
var blanket = document.getElementById('blanket');
blanket_height = document.body.parentNode.scrollHeight;
blanket.style.height = blanket_height + 'px';
}
function popup(windowname) {
blanket_size(windowname);
toggle('blanket');
toggle(windowname);
}
and this is the html I am using. I am just using dreamweaver to add a .flv video file from my computer.
<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
<a href="#popUpDiv" onclick="popup('popUpDiv')"><img
src="../New images/newxbtn-red.png" class ="xbutton" alt = "Close"/></a>
<p> Video Header</p>
<!--Dreamweaver video code starts here -->
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="622"
height="350" id="FLVPlayer">
<param name="movie" value="FLVPlayer_Progressive.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="scale" value="noscale" />
<param name="salign" value="lt" />
<param name="allowScriptAccess" value="always" />
<param name="FlashVars"
value="&MM_ComponentVersion=1&skinName=Halo_Skin_3&streamName=video/bf-
eng&autoPlay=true&autoRewind=false" />
<param name="swfversion" value="8,0,0,0" />
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download
the latest version of Flash Player. Delete it if you don’t want users to see the
prompt. -->
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="FLVPlayer_Progressive.swf"
width="622" height="350">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="scale" value="noscale" />
<param name="salign" value="lt" />
<param name="allowScriptAccess" value="always" />
<param name="FlashVars"
value="&MM_ComponentVersion=1&skinName=Halo_Skin_3&streamName=video/bf-
eng&autoPlay=true&autoRewind=false" />
<param name="swfversion" value="8,0,0,0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<!-- The browser displays the following alternative content for users with Flash
Player
6.0 and older. -->'
<div>
<p><a href="http://www.adobe.com/go/getflashplayer"><img
src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"
alt="Get Adobe Flash player" /></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
<!-- Video Ends -->
</div>
<div class ="image">
<a href="#popUpDiv" onclick="popup('popUpDiv')">
<img src="img/farmers/Donahue_Beef.jpg" width="190" height="110" alt="Beef" />
<img src="../New images/playbtn.png" width="200" height="116" alt="Play" class =
"play"/></a>
</div>
Thanks again!
There may be a very easy way using jQuery. In my case I generated a flash embed div with object in it. With jQuery you can easily define a close button with the empty() function on click. This clears the content of the div and the video is no longer in the DOM.
$("#video a.close").click(function(){
$("#flashlayer").empty();
}
First, you'll have to listen for the click event on your xbutton element (which I recommend adding an ID to):
function listen(event, elem, func) {
if (elem.addEventListener) {
elem.addEventListener(event, func, false);
} else if (elem.attachEvent) {
elem.attachEvent(event, func);
}
}
listen('load', window, function() {
var xbutton = document.getElementById('xbutton');
var player = document.getElementById('FLVPlayer');
listen('click', xbutton, function(e) {
player.Stop();
e.preventDefault();
});
});
You can use the JavaScript method Stop() to stop your Flash video.
I want to be able to change the swf file showing on a page using the code below (with the comment turned into real code)
Is this possible??
jquery:
$("div.360container > p").click( function() {
// show different swf by changing the value of the first param and src of the embed
});
html:
<div class="mycontainer" style='padding:2px;'>
<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="650" height="350">
<param name="movie" value="/mySwf.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<embed src="/mySwf.swf" quality="high" wmode="opaque" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="650" height="350"></embed>
</object>
<p>click to change...</p>
</div>
Most reliable way to do that would be to set innerHTML of the element to your HTML. So, using jquery:
$("div.360container > p").click( function() {
// show different swf by changing the value of the first param and src of the embed
$(".mycontainer").html("<object ....><param name='movie' value='" + movieUrl + "' />....");
});
I'm wondering if someone could look over my code. I'm trying to pass a dummy variable from javascript to actionscript 3 with the following code:
HTML:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
id="music_player" width="500" height="375"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab">
<param name="movie" value="music_player.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#869ca7" />
<param name="allowScriptAccess" value="always" />
<embed src="music_player.swf" quality="high" bgcolor="#869ca7"
width="500" height="375" name="music_player" align="middle"
play="true" loop="false" quality="high" allowScriptAccess="always"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed>
</object>
Javascript:
var nextTrackLocation = "dummyString";
getFlashMovie("music_player").jsAlert(nextTrackLocation);
function getFlashMovie(movieName) {
var isIE = navigator.appName.indexOf("Microsoft") != -1;
return (isIE) ? window[movieName] : document[movieName]; }
and the actionscript:
ExternalInterface.addCallback("getNextTrack", jsAlert);
function jsAlert(mess){
ExternalInterface.call("alert", mess);
}
Does anyone see a mistake?
Your question is very confusing. I think you are making two mistakes here.
From Javascript you're trying to call a function in Actionscript called "jsAlert" but the function is in Actionscript exposed as "getNextTrack". I think it should be:
getFlashMovie("music_player").getNextTrack(nextTrackLocation);
Second, where you define the function in Actionscript you overlooked that the ExternalInterface.addCallback actually takes three parameters.
ExternalInterface.addCallback("getNextTrack", null, jsAlert);