New Topic/Question
Reply
Basically, things generally seem to work - however the proportions of the browser window are the proportions that the video object scales to - not the proportions of the video itself.
So if the video loads in to an especially narrow or elogated window, the view will be squint, and use these proportions for scaling.
I want the script to sense the proportions of the video and then use these to scale and or crop the video if needed to maintain full window and image proportions.
see what I mean here: http://orionrush.nfshost.com/test/
any thoughts would be very appreciated. . .
The AS3 Script:
//variables
//Video
var video = Video;
var nc;
var ns;
var videoToPlay = "lunarpass.flv";
//Function Declarations
//The stage
function initStage():void {
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, onStageResize);
scaleVid();
}
//Video loding
function playVideo( videoToPlay ) {
nc = new NetConnection();
nc.connect( null );
ns = new NetStream( nc );
ns.client = this;
video = new Video ( stage.stageWidth, stage.stageHeight );
addChildAt(video, 0);
video.attachNetStream(ns);
ns.play( videoToPlay );
}
//Scale Video
function scaleVid():void {
video.width=stage.stageWidth;
video.height=stage.stageHeight;
video.scaleX > video.scaleY ? video.scaleY = video.scaleX : video.scaleX = video.scaleY;
}
//run on start up
playVideo( videoToPlay );
initStage();
//Stage Listener and resizeing
function onStageResize(e:Event):void {
scaleVid();
};
The HTML generated by swfObj generator 2.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="swfobject.js"></script>
<!--
have to use dyanamic content due to FF3 Bug
-->
<script type="text/javascript">
var flashvars = {};
var params = {};
params.menu = "false";
params.scale = "noscale";
params.salign = "tl";
params.wmode = "opaque";
var attributes = {};
swfobject.embedSWF("scaling_video.swf", "myFlashContent", "550", "400", "9.0.0", false, flashvars, params, attributes);
</script>
<style type="text/css">
html {
height:100%;
width:100%;
}
body {
margin:0px;
padding:0px;
background-color:blue;
height:100%;
width: 100%;
text-align:center;
}
#myFlashContent {
height:100%;
width: 100%;
z-index: 0;
}
</style>
</head>
<body>
<div id="myFlashContent">
<img src="hexagonal5.png" alt="" />
</div>
</body>
</html>
Many thanks again
MultiQuote
| 