Creating screencasts should be an easy task. After some trial and error I realised it’s more a question of luck.
Target
Create a web based screencast using only linux tools.
Install xvidcap
Install required packages:
apt-get install libglade2-dev libXmu-dev<br></br>apt-get install liba52-dev libdts-dev libfaac-dev libgsm1-dev liblame-dev libogg-dev libvorbis-dev libtheora-dev <br></br>libxvidcore4-dev libx264-dev libavcodec-dev libavformat-dev liboggflac++-dev liboggflac++2c2 liboggflac-dev <br></br>liboggflac3 libtheora-dev libtheora0 ffmpeg2theora<br></br>
Compile and install xvidcap:
tar xvfz xvidcap-1.1.5.tar.gz <br></br>cd xvidcap-1.1.5/<br></br>./configure <br></br>make<br></br>make install #will install in /usr/local/bin<br></br>
Creating the screencast
Using the gui it’s easy to create a screencast but you have several choices related to the format. I tryied several ways:
- creating directly a flv (works ok)
- creating a divx mpeg4 and then converting to flv (also works ok)
mencoder solis-001ok.mpg -o solis-001ok.flv -of lavf <br></br> -oac mp3lame -lameopts abr:br=56 -srate 22050 -ovc lavc <br></br> -lavcopts vcodec=flv:vbitrate=500:mbd=2:mv0:trell:v4mv:cbp:last_pred=3<br></br> -lavfopts i_certify_that_my_video_stream_does_not_use_b_frames<br></br>
The problem
After testing everything on my Dell D820 with a Nvidia card I decided to do the same things on a Dell I6400 with an ATI card (also feisty-fawn) using the fglrx driver. First everything seemed ok but the succes rate was less than 50%. After installing XDamage and enabling it in xvidcap the success rate goes up to 90% but the result is still bad when scrolling windows only part of the screen gets updated. After loosing almost 2h with xvidcap compilations and xorg.conf I gave up. Could not conclude in any way if this is ATI related or not.
Putting everything on the web
Choice 1.
Use the flv flayer from here: http://www.jeroenwijering.com/?item=Flash_video_Player this works fine but it’s not free for commercial use
Choice 2.
Write my own player. I’m not a very big fan of flash but I recently learned about flex and that I could use it in linux so here is the result, a small flex application which does the same thing in a more crude way.
<?xml version="1.0"?><br></br><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" styleName="plain" creationComplete="initVars()"><br></br><mx:Script><![CDATA[<br></br> // Declare bindable properties in Application scope.<br></br> [Bindable]<br></br> public var flvFile:String;<br></br> <br></br> // Assign values to new properties.<br></br> private function initVars():void {<br></br> flvFile = Application.application.parameters.flvFile;<br></br> }<br></br><br></br> import mx.controls.HSlider;<br></br> import mx.controls.VideoDisplay;<br></br> private function update():void {<br></br> videoDisplay.playheadTime = hSlider.value;<br></br> videoDisplay.play();<br></br> }<br></br> ]]></mx:Script><br></br> <mx:ApplicationControlBar dock="true" height="30"><br></br> <mx:Label <br></br> text="{Application.application.parameters.flvTitle}" <br></br> fontFamily="Verdana" fontWeight="bold" fontSize="12"<br></br> /><br></br> <mx:Spacer width="100%"/><br></br> <mx:HSlider change="update()" click="update()" mouseDown="videoDisplay.pause()" showDataTip="false" id="hSlider" width="90%" minimum="0" maximum="{videoDisplay.totalTime}" bottom="10" horizontalCenter="0"/><br></br> <mx:Button label="Play" click="videoDisplay.play();" fillColors="[0xd5270c, 0x7e0c0c]" fillAlphas="[1, 1]" color="0xFFFFFF" textRollOverColor="0xf6e80f"/><br></br> <mx:Button label="Pause" click="videoDisplay.pause();" fillColors="[0xd5270c, 0x7e0c0c]" fillAlphas="[1, 1]" color="0xFFFFFF" textRollOverColor="0xf6e80f"/><br></br> <mx:Button label="Stop" click="videoDisplay.stop();" fillColors="[0xd5270c, 0x7e0c0c]" fillAlphas="[1, 1]" color="0xFFFFFF" textRollOverColor="0xf6e80f"/><br></br> <!--mx:ProgressBar id="loadProgress" label="" mode="event" minimum="0" maximum="100" source="{videoDisplay}" trackHeight="15"/--><br></br> </mx:ApplicationControlBar><br></br> <mx:VBox width="100%" height="100%"><br></br> <mx:VideoDisplay id="videoDisplay" playheadUpdate="hSlider.value=videoDisplay.playheadTime" source="{flvFile}" height="100%" width="100%"/><br></br> </mx:VBox><br></br></mx:Application><br></br>
Here is how it is used in html:
<br></br><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><br></br><head><br></br><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br></br><title>Load test</title><br></br><script type="text/javascript" src="swfobject.js"></script><br></br></script><br></br></head><br></br><body><br></br><br></br><div id="zone1"> </div><br></br><script type="text/javascript"><br></br>// <![CDATA[<br></br>var z1 = new SWFObject("play_flv.swf", "zone1", "1012", "730", "9", "#000000");<br></br>z1.addVariable("flvFile", "http://www.len.ro/screencasts/test.flv");<br></br>z1.addVariable("flvTitle", "Test screencast");<br></br>z1.write("zone1");<br></br>// ]]><br></br> </script><br></br></body><br></br></html><br></br>
Result
A complete screencast done just on linux from the screen to the web. Check the solis screencasts which are done using this method.