Flash video in AIR

Dev Shed Forums Sponsor:

November 29th, 2011, 03:51 AM

phunder

Contributing User

Join Date: Mar 2010

Posts: 58

Time spent in forums: 10 h 23 m 48 sec
Reputation Power: 9

Air - Flash video in AIR

I am trying to create an app used to display my company's portfolio. This includes a show-reel section.

I developed it using HTML and jQuery, and converted it into an AIR app using the plugin for Dreamweaver.

Admittedly this my first attempt at creating an app this way, but it all went smoothly until I wanted to play the video.

My Flash video player does not work, and according to some similar posts I read this is because of a referencing issue. I found several solutions for Flex, but that does not help my specific case.

HTML 5 does not seem to work in AIR 2.0 either, so I am a bit stumped. Does anyone have any suggestions for me?

November 29th, 2011, 05:17 AM

Tann San

Gotta get to the next screen..

Dev Shed God 4th Plane (6500 - 6999 posts)

Join Date: Nov 2003

Location: Legion of Dynamic Discord

Posts: 6,663

Folding Points: 14767 Folding Title: Novice Folder

Time spent in forums: 1 Month 1 Week 3 Days 20 h 9 m 55 sec
Reputation Power: 3163

I've never done what you described and I haven't used Dreamweaver since maybe it's first version! By "referencing" they could be referring to the file path for the supplied video file as in, maybe you are using an absolute path that is correct on your local machine but incorrect for your live server. It's hard to tell without further information but that is what jumped to mind when you dropped that word in there ^_^

__________________

Quis custodiet ipsos custodes?

November 29th, 2011, 06:01 AM

phunder

Contributing User

Join Date: Mar 2010

Posts: 58

Time spent in forums: 10 h 23 m 48 sec
Reputation Power: 9

Thanks for the reply Tann San

Here is some more about exactly what I did:

I created a site using jQuery, HTML and Flash. I now want to convert it to an AIR application so I can package everything into a CD.

The reason for this is that my images and video needs to be very high quality, so it can't really be loaded online.

My problem is that the video is not displaying. If I understand correctly the problem lies in that for some reason relative paths go awry between AIR and Flash. If you compile the embedded Flash into an AIR application you can only reference absolute paths.

I have found a lot of discussions about it on line, but all of them relating to Flex. It all goes over my head since I don't know the language.

What I need is another way to display my videos. I tried HTML 5 video elements, but this is not supported in AIR either.

A bit at a loss as to how to move forward

November 29th, 2011, 06:16 AM

phunder

Contributing User

Join Date: Mar 2010

Posts: 58

Time spent in forums: 10 h 23 m 48 sec
Reputation Power: 9

PS: Here is a ink to my work in progress. The video section is currently under construction, so ignore that for now

http://azisaafrica.co.za/toolkit/

November 29th, 2011, 06:47 AM

Tann San

Gotta get to the next screen..

Join Date: Nov 2003

Location: Legion of Dynamic Discord

Posts: 6,663

Time spent in forums: 1 Month 1 Week 3 Days 20 h 9 m 55 sec
Reputation Power: 3163

So you provide the user with a CD with your Air application on it. The user then installs the Air app from the CD onto their local computer. You should be able to use the ActionScript/Air property to access the application directory. It is described here on the Adobe LiveDocs. Here's a bit of an example:

Code:

import flash.filesystem.File;

var docs:File = File.applicationDirectory;
trace(docs.nativePath); // C:\Program Files\Azisa Africa
trace(docs.url); // file:///C:/Program%20Files/Azisa%20Africa

So you might use:

Code:

import flash.filesystem.File;

var docs:File = File.applicationDirectory;
myFLVPlaybackComponent.source = docs.url + "/videos/somevideo.flv"

So there I am assuming you are using an FLVPlayback component with the instance name "myFLVPlaybackComponent". When you set the "source" property it updates the player internally and automatically calls the load function to start loading in the video.

The path it uses (from my example) is the application directory where the Air app was installed + a sub directory called "videos" (that I made up) and then in there a video file called "somevideo.flv" which again, I made up.

November 29th, 2011, 07:12 AM

phunder

Contributing User

Join Date: Mar 2010

Posts: 58

Time spent in forums: 10 h 23 m 48 sec
Reputation Power: 9

Hey thanks, this looks promising. Will try it and let you know how it turns out

November 29th, 2011, 07:28 AM

phunder

Contributing User

Join Date: Mar 2010

Posts: 58

Time spent in forums: 10 h 23 m 48 sec
Reputation Power: 9

Hey again

I'm getting some compile errors when I try this.

Code:

Scene 1, Layer 'Layer 2', Frame 1, Line 2	1172: Definition flash.filesystem:File could not be found.
Scene 1, Layer 'Layer 2', Frame 1, Line 2	1172: Definition flash.filesystem:File could not be found.
Scene 1, Layer 'Layer 2', Frame 1, Line 4	1046: Type was not found or was not a compile-time constant: File.
Scene 1, Layer 'Layer 2', Frame 1, Line 4	1120: Access of undefined property File.

Here is my code:

Code:

import fl.video.*;
import flash.filesystem.File;

var docs:File = File.applicationDirectory;
var paramObj:Object = LoaderInfo(this.root.loaderInfo).parameters;
myVideo.source = docs.url+"/"+ paramObj['video'];

addChild(myVideo);

As you can see I am reading the file name form a FlashVars variable in the HTML. This way I can use the same swf for all the videos. It work fine in the browser.

I assume that I am getting these errors because I do not have the AIR libraries included in my project.

Is this code for creating an air file form Flash? That is not really what I am trying to do.

I need to embed the video player inside some HTML code, then convert it to an AIR application. Can I embed an AIR file in HTML?

Sorry if I seem badly informed. Like I said this is my first AIR app.

November 29th, 2011, 08:52 AM

Tann San

Gotta get to the next screen..

Join Date: Nov 2003

Location: Legion of Dynamic Discord

Posts: 6,663

Time spent in forums: 1 Month 1 Week 3 Days 20 h 9 m 55 sec
Reputation Power: 3163

Yup, you have to set the publish target to be Air to use the filesystem package. I've never packaged anything that wasn't a pure ActionScript based SWF file into an Air application before so I'm just guessing at what's going on.

I don't think that an Air application can be embedded in a web page. It needs the Air runtime to be installed on the end users computer and then your application is loaded into that.

If you are passing in the file path from HTML then you can probably ignore the code I posted and just update your HTML directly. You could try using Javascript although I'm not sure how that will port over to an Air application with your Dreamweaver converter:

video = unescape(document.location).substring(8, path.lastIndexOf("/")+1);

I kinda nicked that from the last post here ^_^

November 30th, 2011, 02:14 AM

phunder

Contributing User

Join Date: Mar 2010

Posts: 58

Time spent in forums: 10 h 23 m 48 sec
Reputation Power: 9

Thanks again for your suggestions Tan San. I'm working on another project today, so probably won't have time to play with the AIR app. Will let you know if I get anything working though.Thanks again :

#10

November 30th, 2011, 08:13 AM

phunder

Contributing User

Join Date: Mar 2010

Posts: 58

Time spent in forums: 10 h 23 m 48 sec
Reputation Power: 9

Hey Tan San. Thanks for the suggestion. After reading the posts in the link provided I was sure you had found a solution for me, but sadly no.

I used the following code to get the directory that the files are being stored in:

Code:

var fileURL = new String(document.location);
fileURL=fileURL.replace("index.html","");
fileURL=fileURL.replace("file:///","");

The first line gets the location and the other two just cuts off the excess text. It works great from a browser and returns the absolute path for where the files are stored. But when I converted the file to an AIR application it failed to work.

The JavaScript does not seem to pick up the file location from the AIR app. It simply output's the path as ""app:/".

This was so close though. Thanks for the suggestion. I think finding the absolute path will solve my problem.

Is there a similar command for Flash? Mind you, even if there is, I might run into the same problem as I got with the JavaScript.

Sigh...

#11

November 30th, 2011, 10:40 AM

Tann San

Gotta get to the next screen..

Join Date: Nov 2003

Location: Legion of Dynamic Discord

Posts: 6,663

Time spent in forums: 1 Month 1 Week 3 Days 20 h 9 m 55 sec
Reputation Power: 3163

You can try these two but I don't know how they will work in an Air app:

trace(this.loaderInfo.loaderURL, this.loaderInfo.url);

Air - Flash video in AIR

Developer Shed Advertisers and Affiliates