Tag: Flash

Here I would like to discuss the FMS, Live Streaming and Sync issues between publisher and subscribers. Also I would discuss about possible solutions 🙂

The problem: Let’s say we are publishing a live stream using FMLE (Flash Media Live Encoder) or our custom publisher to FMS (Flash Media Server). There are 5 subscribers who are watching this live stream (given that those subscribers connected to stream after the stream has been already published). Now NetStream.time will not give absolute stream time for any of the subscriber connected to live stream because it gives time since the playback of live stream is started by subscriber. Now let’s say I (as a publisher) want to take certain action (such as displaying an image, or some message, or slide) on subscribers on specific point of time (in terms of viewing the live stream). Let’s say from publisher side, when I see (or speak) something (a tortoise in scene!) on screen, I want to show another picture of that same thing to all subscribers (dancing tortoises!) exactly at the same time when each one of them see tortoise on their live stream.

SharedObject can not be used because that will not provide any kind of sync (in terms of live streaming) because they are asynchronous and live streams may get delayed due to slow bandwidths on subscribers.

Even we can not directly call a function on FMS which would in turn call functions to all subscribers because that process would be instantaneous (compared to delay in live stream) and if there are number of subscribers this process may hang FMS (and publisher) application for a fraction of second.

The Solutions:

1) Somehow give all subscribers the absolute stream time. This would be an ideal solution but not easy. From FMLE, I managed to find a solutions and that is timecode. Let’s say if the publishing video frame rate is 15 fps then FMLE would encode a keyframe at each group of 15 frames (given that timecode interval is same as frame rate of video). Now the timecode is embedded as system time and date which we need to take care of. The condition here is the video must be recorded on server so that we can know the start time of publishing. On subscribers we get onFI() event at each 1 second which would give you current date and time. From this current time subtract the initial time (which is found by playing recorded stream) and that would give you absolute live stream time 🙂

2) Another way is kind of events instead of focusing on time but yet it keeps solid track of sync. From publisher side, call NetStream.send() function along with necessary parameters. This will actually embed metadata on current frame being encoded. When subscribers get this frame, they get the embedded event and they can take the necessary action by analyzing the data given in that event. Usually I would prefer to use onMetaData event for this stuff 🙂

Phue! It’s been late night now (1:43 AM already) and I am going for sleep now. If any one have any questions, post me a comment and I will be back there right away 🙂

It seems like Firefox 4 is having problem with Flash Player 10.2 (may be older versions as well). For any content in Flash Player where you set to use hand cursor for buttons, movieclips etc., Firefox does not show hand cursor for those items. I just experienced this issue on my mac.

Let’s say you want to create a snapshot of a movieclip inside your Flash/Flex application. The constraint here is you need to resize the snapshot to the values (width and height) entered by user. Here is how you could do this :

var bitmapData:BitmapData = new BitmapData(clip.width, clip.height); //clip is a movieclip whose snapshot is to be taken
bitmapData.draw(clip);

var bitmap:Bitmap = new Bitmap(bitmapData.clone());
bitmap.width = int(width); //rounding width and height to integer values
bitmap.height = int(height); //This is important to resize the child (bitmap) here as you can not resize the sprite (sp) itself as sprite is going to be drawn inside bitmap data.
var sp:Sprite = new Sprite();
sp.addChild(bitmap);

var bmd:BitmapData = new BitmapData(sp.width, sp.height); //As the child of sprite is already resized it will think that actual width and height of sprite are unscaled and hence it can map pixel to pixel on full width and height.
bmd.draw(sp); //now draw sprite over bitmap data.

That’s it. Again keep in mind that the clip which you are going to draw over bitmap data should not be resized because that will not affect the drawing of bitmap data and you could see some unusual results.

There may be other ways to achieve this 🙂 but I found (may be others found before me) this method convenient for me.

var searchIndex:int = toys.indexOf({name:”ball”, count:2});
if(searchIndex == -1)
{
trace(“No! how can it be there”); //output will always be from here if you search an object
}
else
{
trace(“Yup! it’s there”);
}

So, that’s the case for objects. In the syntax of Array.indexOf(itemToSearch:*, fromIndex:int = 0), we notice that the first argument is * data type – i.e. it can be any data type, BUT it’s not working for Object. Would any one have lights on this?

If you want to set the position of horizontal scroll position inside TextField, you can use TextField.scrollH.

Let’s say I am typing in the input TextField and I typed beyond the width of TextField. You will see the last characters visible you typed. Now due to some other event, say user clicks on other than this TextField, focus is changed to some other object than this TextField, you may want to reset the scroll position of TextField to starting characters in it.
You will use :TextField.scrollH = 0;

This will set the horizontal scroll of TextField to 0 and hence showing the starting characters in TextField.

Loader class can load image from ByteArray. I used this method before a year ago to set a part of a screen for Screen Sharing application. Right now I was having a case where I need to create an image from Base64 encoded string. I am using following code to do this ::

var str:String = ""; //It won't be an empty string :) because it will a base64 encoded string of image.

var byteArr:ByteArray = Base64.converToByteArray(str); //Here you can use any ready made library to decode and convert the String into ByteArray. I used ready made library from here.

Is there any way to hide default context menu items on Flash TextField? Some one will try to answer with ContextMenu.hideBuiltInItems() function, but this function does not really work with Flash TextField. It does not hide the built in items.

Problem :: When you deal with TextField.htmlText don’t append any html strings directly to htmlText property of TextField. Because the TextField appends “<br>” tag automatically before it appends any html string to htmlText property, it will set your string automatically in next line instead of the current line. This mistake is done to save memory as we don’t have to create a temporary string.

//output would be something like following ::
Hello World
//This line break because of <br> tag
Hello World //This is an automatic line break
//This line break because of <br> tag
Hello World //This is an automatic line break
//output finished

Possible Solution :: Create an empty string and append all the html strings to this string. When the final string is ready, assign this string to htmlText property of TextField. This will not create any unnecessary line breaks inside TextField.