Application Development Tips and Tricks > Snapshots and thumbnails > Thumbnails

Thumbnails

Thumbnails are a smaller, discrete version of an original recording. Like snapshots, they provide single-frame representations of recorded video stream. In the snapshot example, you are only sending one frame of data. In this sample, you are playing only the first frame of a recorded stream.

In the previous example, you used the snapShotMilliseconds property of the NetStream.attachVideo object to get a snapshot of your stream. In this sample, you also need to get a one frame picture of a stream. Here, however, you use a call to NetStream.play:

thumbStream.play("myRecording", 0, 0, true)

The first parameter of the NetStream.play method describes what to play, "myRecording"; the second is where to begin on the stream (0 means at the start of a recorded stream); the third, where to end (0 means play only one frame); and the fourth tells the Player to flush any previous play streams. For more information see the NetStream.play entry in the Client-Side Communication ActionScript Dictionary.

In the following client-side ActionScript code in doc_thumbnails.fla, the server records the incoming stream until the user chooses to stop the recording. Then, with the call to thumb_ns.play("myRecording", 0, 0, true), only the first frame of that recording is returned to the client.

#include "NetDebug.as"

// Recording state variable
recState = 0;

// Initialize button label
Record_btn.setLabel("Record");

// Show the recording in a thumbnail
showThumb();

// Connect to the thumbnails app and get connection status 
function doConnect()
{
	client_nc = new NetConnection();
	// If connection is closed, clear the History and the list

	// Handle status message
	client_nc.onStatus = function(info) {
		trace("Level: " + info.level + newline + "Code: " + info.code);
	}

	client_nc.connect("rtmp:/doc_thumbnails/room_01");
}

// Create a stream for recording and getting the thumbnail
function initStreams()
{
	out_ns = new NetStream(client_nc);
	
	out_ns.onStatus = function(info)
	{
		if (info.code == "NetStream.Publish.Success") {
			var description = "You have published.";
			trace(description);
		}
	};

	thumb_ns = new NetStream(client_nc);
}

// Get a camera instance and attach it to the local
// video, Live_video, and the output stream
function initMovie()
{
	client_cam = Camera.get();
	Live_video.attachVideo(client_cam);
	out_ns.attachVideo(client_cam);
}

// Button event handler for publishing and showing the thumbnail
function doRecord()
{
	if (recState == 0) {
		out_ns.publish("myRecording", "record");
		Record_btn.setLabel("Stop");
		recState = 1;
	} else {
		out_ns.publish(false);
		Record_btn.setLabel("Record");
		recState = 0;
		showThumb();
	}
}

// Show the thumbnail by attaching the stream to the ThumbView_vc
// video object and playing it
function showThumb()
{
	ThumbView_vc.attachVideo(thumb_ns);
	thumb_ns.play("myRecording", 0, 0, true);
}

// Connect to the server
doConnect();

// Initialize the streams
initStreams();

// Initialize the movie
initMovie();