Log in Register

Login to your account

Username *
Password *
Remember Me

Create an account

Fields marked with an asterisk (*) are required.
Name *
Username *
Password *
Verify password *
Email *
Verify email *
Captcha *

Index

 

Downloading the package
Content of the package
Setting variables passed via php
Understanding the embed code
Supported flashvars
Application events
Quality Presets
Controlbar module
Javascript API
Digicam
CMS integration

 


 

This document is meant to provide you with information to setup FXTubeRecorder on your own site and help you with with general configuration details of the application.

 

Downloading the package

First and foremost you need to download the latest FXTubeRecorder package from our downloads section:

http://rtmpworld.com/downloads/commercial-product-downloads

 

Content of the package

After you download and extract the archive file you will have a folder structure similar to the following:

 

Top Level

  • captured/
  • flashservices/
    • Core/
    • Plugins
    • includes
    • Services/
      • FXTubeRecorder.php
    • ClassLoader.php
    • index.php
  • images/
  • js/
  • css/
  • swf/
  • config.php
  • index.php
  • jsapi.php
  • style.css

 

The folder "flashservices" is the Amfphp installation which connects your swf to php via the service file FXTubeRecorder.php located at:

flashservices/

  • Services/
    • FXTubeRecorder.php

 

All the settings are defined in this FXTubeRecorder.php and are loaded when the swf starts up in the browser. The next section explains all the configuration variables available for you to modify.

 


 

Settings passed in via AMFPHP service file (flashservices/Services/FXTubeRecorder.php)

Variable Name Value Type Default Description
       
licencekey String NULL Your product license
publishName String NULL Stream Name
destination String NULL

RTMP/RTMPT/RTMPS url for publishing

recordtime Number 0 Broadcast duration limit in seconds. (set 0 for unlimited)
bwcheck (deprecated) NA NA NA
server String RED5 Server Type (RED5/FMS/WOWZA)
recordMode String NULL audio/video/duplex
themeColor String 0xEEEEEE Defines the theme color for the application eg: (0x000000)
forceQuality String SD SIF MEDIUM Preset quality selector (Preset Name)
novideo String NULL Url  to a  png/jpg image to show on audio only recording when no camera is used
controlbar String Controlbar.swf Locates the controlbar swf file inside the modules folder
digiCamMode Boolean false Defines the recording aspect for the camera
snapshotWidth Number 320 set / unset digicam mode
snapshotHeight Number 240 Defines the height of digicam capture height
bwStrict Boolean true Allow/disallow fluctuations in bw usage
autoStart Boolean false AutoStart video recording as soon as camera/microphone devices are allowed to flash plugin
userPresets String NULL Presets xml data
auxiliaryVideo String NULL YouTube video ID / Custom media url
auxiliaryYouTube Boolean false True if auxiliaryVideo is YouTube video id else false
auxiliaryVideoLoadPct Number 60 Percentage of auxiliaryVideo to load before starting recording
playback String NULL Alternate url for playback, if recording and playback require different urls
logo String NULL Path to logo image (jpg/png/gif)
buffer Number NULL Thus value overrides the internal recording buffer value (10-60)
snaptime Number 1 Number of seconds into recording to take webcam snapshot

 


 

Understanding The Embed Code

 

SWFObject javascript embed method :

 

{codecitation class="brush: javascript; gutter: true;"}

<script src="/js/swfobject.js" language="javascript"></script>

<script language="javascript" type="text/javascript">
function onHTMLDOMReady(){

var flashvars={};
flashvars.serviceLocation = "flashservices/";
var params={};
params.base = "http://site.com/swf/";
var attributes={};
attributes.id="recorder";
attributes.name="recorder";
swfobject.embedSWF("http://site.com/swf/QuickCapture.swf","FXTubeRecorder","320","240","11.1.0","http://site.com/swf/playerProductInstall.swf",flashvars,params,attributes
}

swfobject.addLoadEvent(onHTMLDOMReady);

</script>

{/codecitation}

The above code snippet embeds a instance of FXTubeRecorder with width and height 320, 240 respectively on the webpage, into a html div element FXTubeRecorder. The flashvars object is used to pass variables into the recorder object. In the given snippet:

{codecitation class="brush: javascript; gutter: true;"}

flashvars.serviceLocation = "flashservices/";

{/codecitation}

serviceLocation variable indicates the location of AmfPhp gateway installation relative to the root of the website. when the page loads and the swf is created, it will load settings from the gateway located by serviceLocation . Any additional variable may be passed in similarly using the flashvars object.

 

The params object controls generic flash configuration data. In the given snippet:

{codecitation class="brush: javascript; gutter: true;"}

params.base = "http://site.com/swf/";

{/codecitation}

The swf base path is set to point to the folder from where all swf modules/dependencies can be loaded.

 

Supported Flashvars

 

Variable Name Variable Value
   
serviceLocation Path to your amfphp installation
scriptLocation Path to your asp/jsp/php script to load settings data from.

** By default the name for amfphp folder is "flashservices". If this is not the folder name you want to use, or if you want amfphp installed inside a sub folder , then you need to use the serviceLocation flashvars as shown below:

{codecitation class="brush: javascript; gutter: true;"}

flashvars.serviceLocation = "flashservices/";

{/codecitation}

or

{codecitation class="brush: javascript; gutter: true;"}

flashvars.serviceLocation = "recorder/flashservices/";

{/codecitation}

** *serviceLocation and scriptLocation are mutually exclusive. scriptLocation is used to set path to regular script in case Amfphp does not work well for your needs. scriptLocation facilitates loading settings in regular name-value pair format. for more info on how to provide data as name-value to flash please follow the links provided:

http://www.nunomira.com/tutorials/loading_variables.php#php

http://help.adobe.com/en_US/AS2LCR/Flash_10.0/help.html?content=00000575.html


 

Application Events & Callback Parameters

Event Name Callback parmeters
   
SESSIONSAVESUCCESS Stream Name, Duration
SESSIONSAVEFAILED Stream Name, Duration
   
CONNECTSUCCESS NULL
CONNECTFAILED NULL
   
BROADCASTBEGIN Stream Name
BROADCASTEND Stream Name

 

Note: To capture a single parameter use:  eval(params)[0]  and for multiple parameters use eval(params)[0],eval(params)[1],eval(params)[2] etc: The first parameter,objid always refers to the id/name of the swf item invoking the function.

Example:

{codecitation class="brush: javascript;wrap-lines: false;"}

 

// This global function (Hook) is called whenever a instance of FXTubeRecorder loads in the page

function onBroadcasterReady(objid){

broadcaster = swfobject.getObjectById(objid);

 

// Register event listener for the event you need

broadcaster.addNotificationListener("SESSIONSAVESUCCESS","onSaveSuccess");

 

}

 

/* **************************** */

function onSaveSuccess(objid,params){

var streamname=eval(params)[0];

var duration=eval(params)[1];

// do something when recording was saved successfully

}

{/codecitation}

 

 


ForceQuality Presets (String constants)

 

User Defined Presets (*HD presets are applicable only when videocodec is set to H264Avc which ia applicable to HDTubeRecorder*)

 

You can define your own set of presets, in case you are not happy with the provided presets. A sample of presets file is provided in the package as recorderpresets.xml located at :

flashservices/

  • includes/
    • recorderpresets.xml

 

Below is a sample of the xml structure used to define user defined presets (HD presets are applicable only when codec is set to H264Avc codec only) :

{codecitation class="brush: xml;wrap-lines: false;"}

<?xml version="1.0" encoding="utf-8"?>
<presets>
<sd>
<preset>
<label>SD AVERAGE</label>
<width>120</width>
<height>90</height>
<fps>10</fps>
<keyframeInterval>30</keyframeInterval>
<quality>90</quality>
<bandwidth>18000</bandwidth>
<videocodec>Sorenson</videocodec>
<audiocodec>Speex</audiocodec>
<samplerate>16</samplerate>
<speexquality>4</speexquality>
</preset>

<preset>
<label>SD GOOD</label>
<width>160</width>
<height>120</height>
<fps>10</fps>
<keyframeInterval>25</keyframeInterval>
<quality>90</quality>
<bandwidth>25000</bandwidth>
<videocodec>Sorenson</videocodec>
<audiocodec>Speex</audiocodec>
<samplerate>16</samplerate>
<speexquality>5</speexquality>
</preset>

</sd>

<hd>

<preset>
<label>HD SIF GOOD</label>
<width>320</width>
<height>240</height>
<fps>15</fps>
<keyframeInterval>90</keyframeInterval>
<quality>90</quality>
<bandwidth>43750</bandwidth>
<videocodec>H264Avc</videocodec>
<h264profile>baseline</h264profile>
<h264level>3.1</h264level>
<audiocodec>Speex</audiocodec>
<samplerate>16</samplerate>
<speexquality>6</speexquality>
</preset>

<preset>
<label>HD SIF LOW</label>
<width>320</width>
<height>240</height>
<fps>12</fps>
<keyframeInterval>105</keyframeInterval>
<quality>90</quality>
<bandwidth>37500</bandwidth>
<videocodec>H264Avc</videocodec>
<h264profile>baseline</h264profile>
<h264level>3.1</h264level>
<audiocodec>Speex</audiocodec>
<samplerate>16</samplerate>
<speexquality>6</speexquality>
</preset>

</hd>
</presets>

{/codecitation}

 

Possible values for videocodec : Sorenson

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/media/VideoCodec.html

 

Possible values for audiocodec : Speex or Nellymoser

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/media/SoundCodec.html

 

To set a particular HD preset use the following syntax for the forceQuality variable in your service file - FXtubeRecorder.php

{codecitation class="brush: php; gutter: true;"}

$settings["forceQuality"] = "SD SIF LOW";

{/codecitation}

 

To set a particular SD preset use the following syntax for the forceQuality variable in your service file - FXtubeRecorder.php

{codecitation class="brush: php; gutter: true;"}

$settings["forceQuality"] = "SD GOOD";

$settings["videocodec"] = "Sorenson";

{/codecitation}

 

Note: When user defined presets are not provided, system defined presets take over automatically.

 


 

The Controlbar module

Controlbar is the container for all control items that the recorder will have. ie: record, stop, save etc: The new versions of FXTubeRecorder will deploy the controlbar module as a separate swf on your server. The main advantage of this is , the ability to choose different types of control layouts as published by rtmpworld.com. For example, there may be two controlbar versions, one with a record timer display and one without it. You can choose which controlbar to use for your recorder. This can be done by providing the path to the respective controlbar swf as shown below. Controlbars are provided in your swf/modules directory.

{codecitation class="brush: php; gutter: true;"}

$settings["controlbar"] = $this->controlbar; // Path to Controlbar.swf, gives you ability to change controlbar type

{/codecitation}

 

Thus to use different controlbar simply change the controlbar to the one you wish to use.

 

{codecitation class="brush: php; gutter: true;"}

$settings["controlbar"] = "Controlbar_normal_notimer.swf";

{/codecitation}

OR

 

{codecitation class="brush: php; gutter: true;"}

$settings["controlbar"] = "Controlbar_recordpause_timer.swf";

{/codecitation}

 

OR

 

 

{codecitation class="brush: javascript;wrap-lines: false;"}

$settings["controlbar"] = "DigiCamControlbar"; // for DigiCam mode

{/codecitation}

 

Etc:

 

 


 

The New JS API for FXTubeRecorder !- Build Your own interface!!  [Hot !]

We have provided enriched FXTubeRecorder with a comprehensive javascript API, which lets you embed the recorder swf as a dynamic and flexible swf, setting up to any dimension that you need. You can build your own controlbar by using ordinary HTML/CSS knowledge and control the swf with that.

 

Before using any of the javascript funtions you need to have a reference to the recorder flash object on the html page. you can do this by defining a hook as mentioned in Application events section. Define a global hook function onBroadcasterReady the the page as shown below. Function receives the id of the recorder swf object on the html page. you can then use swfobject (js prototype) to obtain the reference.

Example:

{codecitation class="brush: javascript;wrap-lines: false;"}

// This global function (Hook) is called whenever a instance of FXTubeRecorder loads in the page

function onBroadcasterReady(objid){

// Reference to recorder flash object

var broadcaster = swfobject.getObjectById(objid);

// Api usage

broadcaster.startRecording();

}

{/codecitation}

 

The Javascript API functions

Function

Parameters

Return value

Description

startRecording

NA

NULL

start recording

stopRecording

NA

NULL

stop recording

pauseRecording

NA

NULL

pause recording

playRecording

NA

NULL

playback last recording

saveRecording

NA

NULL

save recording

toggleView

NA

NULL

toggleView between camera and playback

showSettings

NA

NULL

show settings wizzard

setMicGain

Number

NULL

set microphone boost (1 - 100)

getMicGain

NA

Number

get microphone boost

isConnected

NA

Boolean

check if connection exists or not

isBroadcasting

NA

Boolean

check if recorder is currently recording or not

isCameraAllowed

NA

Boolean

check if video broadcast is allowed / camera permitted

isMicrophoneAllowed

NA

Boolean

check if audio broadcast is allowed / microphone permitted

canBroadcast

NA

Boolean

check if recorder can record (satisfies all requirements to start recording or not)

canSave

NA

Boolean

check if recorder can save (satisfies requirements for saving or not)

canPlay

NA

Boolean

check if recorder can playback (satisfies requirements for playing or not)

getAudioLevel

NA

Number

get the current audio level to use in showing mic indicators. Value ranges between 0 and 1

getRecordTime

NA

Number

get the total record duration set for the recorder

getElapsedTime

NA

Number

get the recording time elapsed. Use this to show record time.

applyFilter

NA

NULL

set the current photo filter for digicam

takePhoto

NA

NULL

capture a static photo

accept

NA

NULL

accept and save the current photo

reject

NA

NULL

reject and discard the current photo

To view a live demo of the javascript API & custom controlbar design , navigate to the file jsapi.php in your download package. You may use the existing example in your projects or create your own controlbar css.

 

JSAPI Files provided in demo package:

js/recorder.js

jsapi.php

Note:* These files demonstrate the use of js api practically. you can use these files directly or in a modified manner to quick start javascript interactions with the recorder object.

 




The New DigiCam Feature !- Now use your recorder for taking classic photo snaps !!  [Hot !]

FXTubeRecorder features yet another stunning mode called DIGICAM. This enables you to setup FXTubeRecorder to take photos of your users on your regular php site without the need of any special software. You can snap photos, allow users to apply standard camera filters on them and then save them to your server.

Build Facebook like in-house photo camera so your users dont have to bother about searching for their photos to upload. Enable site users to upload their profile photos directly from webcam on your web page.

 

Webcam filters that can be set via javascript api applyFilter(filtername);

Filter Name String Value
   
NORMAL NORMAL
BRIGHTNESS BRIGHT
CONTRAST CONTRAST
SATURATION SATURATE
SEPIA SEPIA
GRAYSCALE GRAY
INVERTED INVERT
EMBOSS EMBOSS
SHARP SHARP

 

Note: To use FXTubeRecorder in  DigiCam mode:

 

Download digicam-addon.zip package from http://rtmpworld.com/downloads/freebies

Extract the content on your webserver

Copy content of swf folder from FXTubeRecorder into swf folder in digicam-addon package


Integrating FXTubeRecorder With CMS

 

FXTubeRecorder integrates well with any CMS. all you will need to do is hook up your CMS engine required classes into AMFPHP ClassLoader. The below example explains integrating the AMF Service with Joomla. You can use the similar method to load any CMS engine into AMFPHP.

Joomla Integration

(This setup assumes that you have uploaded the entire flashservices folder to the root of your joomla installation)

1 Edit the file ClassLoader.php located at :

flashservices/

  • ClassLoader.php
Add include statements and define blocks, required to load joomla:

{codecitation class="brush: php; gutter: true;"}

define( 'AMFPHP_ROOTPATH', dirname(__FILE__) . DIRECTORY_SEPARATOR);

define( '_JEXEC', 1 );

define('JPATH_BASE', AMFPHP_ROOTPATH . "..");

define( 'DS', DIRECTORY_SEPARATOR );

require_once (JPATH_BASE . DS . 'includes' . DS . 'defines.php');

require_once (JPATH_BASE . DS . 'includes' . DS . 'framework.php');

{/codecitation}

Save and close the file.

 

2. Edit the file index.php located at :

flashservices/

  • index.php

Add the following code to initialize joomla website

{codecitation class="brush: php; gutter: true;"}

$mainframe =& JFactory::getApplication('site');

$mainframe->initialise();

JTable::addIncludePath ( JPATH_COMPONENT . DS . 'tables' );

{/codecitation}

Just after the line :

{codecitation class="brush: php; gutter: true;"}

require_once dirname(__FILE__) . '/ClassLoader.php'

{/codecitation}

This will initialize your website each time amf call is made. You can then start using the usual joomla apis in your service file  FXTubeRecorder.php as you normally.