PHP Video Recorder Script

• Record from Webcam
• Preview
• Browse Videos
• Strobe Player
• JwPlayer integration
• JPG Snapshots
• JavaScript notification / control support (2 way)
• Video files browser
• HTML5 video conversion for mobile playback
• HTML5 fallback camera upload for mobile
• Write text over video (hard coded)

The php edition for the webcam video recorder site plugin is the easiest to setup and integrate with any php script or cms.

iPhone / iPad Playback Support:
If conversion is possible with hosting software (ffmpeg) a video variant for iOS is generated (when recording or later on access when support is available).
When iPhone/iPad/Android users try to watch a video, the device is automatically detected and HTML5 player shows up instead of flash players. HTML5 version can also be accessed with a link from computers with flash support.

Find on this page:

• live demo
• installation instructions
• customization and integration documentation
  

1. Publish on a recording channel (you can specify a name or a ChannelYYY name will be automatically generated)
2. Allow access to your webcam and select the camera/audio source if you have multiple on your system.
3. Click the record button to start and stop to end video recording
4. Preview the video played on the right panel, use replay button if needed and decide to click on save button to accept or discard to try again
5. Use Recordings Browser to watch videos by RTMP or Video File Browser to watch by HTTP/RTMP and download.

For a more advanced implementation test the WordPress Video Posts Webcam Recorder plugin in combination with Video Share VOD plugin : Video Share VOD - Script Demo .

Before installing, make sure your hosting environment meets all requirements.

HTML5 playback support requires ffmpeg (to generate html5 mp4), ffmpeg2theora (to generate ogv) with codecs h264, speex, aac and web, rtmp to be hosted on same server (same file system) for web scripts to access rtmp video files. Writing text over videos requires freetype support in ffmpeg. FFMPEG encoding parameters need to be adjusted depending on available version and codec libraries.

1. If you're not hosting RTMP with us go to RTMP Application Setup for details about setting up the rtmp server side for this application.
   If using wowza media server make sure you're using an application with Stream Type "record" (use videowhisper-recorder application as default).
2. Download archive, unzip and copy contents of recorder_php to your web installation location. (Example: www.yoursite.com/recorder/)
3. Fill your RTMP path into settings.php .
   Also configure addresses of videos on your server (where rtmp server saves videos) and review options.

Optional:

• For some integrations you may need to configure the rtmp server to store flv files in a public web location.
• You can change location of videolist/index.php and tweak script to update paths.
  
  

• Edit skins, incons, sounds in templates/recorder for recorder and templates/streamplayer for player.
• To integrate this with other scripts read an integration overview for videowhisper applications first, to understand the framwework and where to start from.
  
• This can be integrated with your members database and login system. Variables like username, loggedin (1 if user was logged in and allowed to enter, 0 otherwise) are passed from r_login.php
  
• sets maximum recording time in secods (no limits in licensed full mode):
  &recordLimit=600
  
• webcam settings:
  &camWidth=320&camHeight=240&camFPS=15
  &camBandwidth=49158&showCamSettings=1&camMaxBandwidth=131072
  &micRate=11&advancedCamSettings=1
  
• recording file type and name (may need to be configured depending on server):
  &recordContainer=flv Use FLV as MP4 container does not support NellyMoser, Speex audio codecs. MP4 will only save H264 video, without sound.
  &recordExtension= Leave blank for default (depending on container).
  &withStamp=1 Adds a timestamp to each stream filename to generate different stream names.
  &recordingMode=record&recordingModeResume=append Mode for recording in files.
• configure buffering for recording and playback:
  &bufferLive=900&bufferFull=900&bufferLivePlayback=0.2&bufferFullPlayback=10
  
• configure layout:
  $layoutCode=<<<layoutEND
  id=0&label=Video&x=346&y=10&width=326&height=298; id=1&label=Camcorder&x=10&y=10&width=326&height=298
  layoutEND;
  ...
  &layoutCode=<?=urlencode($layoutCode)?>&fillWindow=0
• If you remove preview panel (&disablePreview=1) , Camcorder is only panel and layoutcode should be:
  $layoutCode=<<<layoutEND
  id=0&label=Camcorder&x=10&y=10&width=526&height=498
  layoutEND;
  Video panel width and heigh are adapted to match video aspect ratio when user changes webcam resolution, so exact height may vary.
  
• layoutToClipboard =0 Copies layout code to clipboard when media panel (preview) is right clicked.
• showButtons=1 Toggles showing recording buttons.
• hideButtons=0 Hides buttons after starting recording (great for disabling user controls when syncronising with external functionality - Stop / saving needs to be externally controlled).
• showMediaButtons =1 Toggles buttons on media interface (Mic, Cam, Preview).
• configure features:
  &disablePreview=0 Disables special recording preview panel. Only webcam preview panel remains.
  &ownPreview=0 Recording preview will show in same panel where webcam preview shows.
  &disableStop=0 Removes stop button. Stop button will show instead of Record button when recording starts.
  &disableExit=0 Removes exit/quit button. User can exit by saving or closing/leaving page.
  &disableSave=0 Removes save button. Stop also saves.
  &disableRefresh=0 Removes refresh/reload preview button.
  &disableDiscard=0 Removes discard/trash button.
  &disableMirror=0 Disables showing own preview (from webcam preview panel). Also disables cam settings and preview toggle button.
• Recorder can notify JavaScript of main actions (record, stop, save, discard, exit) if enabled with &notifyJS=1 (in r_login.php):
  <SCRIPT language="JavaScript">
  function videowhisperNotify(notification)
  {
  switch (notification)
  {
  
  case 'record':
  break;
  case 'stop':
  break;
  case 'pause':
  break;
  case 'resume':
  break;
  
  case 'hardwareSelected': //called when user closed privacy/hardware select popup
  break;
  
  case 'camAvailable':
  break;
   
  case 'camInaccessible':
  case 'camMuted':
  window.alert('Webcam access is required to use recorder. Webcam can not be used: ' + notification);
  break;
  }
  }
  </SCRIPT>
  
• Recording can be controlled externally using JavaScript. Same logic applies as for internal interface controls (i.e. user can save only after recording something and buffers finished uploading to server).
  <SCRIPT language="JavaScript">
  //the code below allows activating certain functions from javascript
  function getFlashMovie(movieName) {
  
  if (navigator.appName.indexOf("Microsoft") != -1) {
  //alert("IE");
  if (typeof (window[movieName].videowhisperRecorder) == 'function') {
  // alert("< IE9");
  movie = window[movieName];
  }
  else if (typeof (document[movieName].videowhisperRecorder) == 'function') {
  // alert(">= IE9");
  movie = document[movieName];
  }
  }
  else {
  // alert("NON IE");
  movie = document[movieName];
  }
  return movie;
  }
  
  
  //flash = flash html object name (ie "videowhisper_recorder")
  //action = record, stop, preview, save, discard, exit, hideButtons, showButtons
  function videowhisperCall(flash, action)
  {
  var movie = getFlashMovie(flash);
  if (movie == null || movie == undefined) window.alert("Flash element not found:" + flash + " :" + movie);
  else movie.videowhisperRecorder(action);
  }
  </SCRIPT>
  
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','record');">record</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','stop');">stop</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','pause');">pause</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','resume');">resume</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','preview');">preview</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','discard');">discard</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','save');">save</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','exit');">exit</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','hideButtons');">hide buttons</a>,
  <a href="javascript:void(0)" onclick="videowhisperCall('videowhisper_recorder','showButtons');">show buttons</a>.
  
• On logout broadcaster is redirected to finished.php .
  
• Snapshot is saved by r_snapshots.php
  
• Recording info is saved by recorded.php . This script also calls FFMPEG and FFMPEG2THEORA to convert videos to HTML5 formats.
  
• Recorder video list is retrieved by recorder_videos.php and played by streamplay.php
  
• RTMP Video Stream Player can be configured with swf parameters from streamplay.php:
  $swfurl = "streamplayer.swf?streamName=" . urlencode( $vid ) . "&serverRTMP=" . urlencode( $rtmp_server ) . "&templateURL=&autoPlayback=0&overLogo=" . urlencode( "http://www.videowhisper.com/media/logo.png" ) . "&overLink=" . urlencode( "http://www.videowhisper.com" ) . "&snapshot=" . urlencode( dirname ( $_SERVER['PHP_SELF'] ) . "/" . ( file_exists ( "snapshots/$vid.jpg" ) ? "snapshots/$vid.jpg" : "snapshots/no_video.png" ));
  • streamName, serverRTMP Identifies what to play.
  • templateURL Where to take play, fullscreen buttons from.
  • autoPlayback Change from 0 to enable automated playback (without clicking play button).
  • overLogo, overLink Clickable watermark logo to show over video.
  • snapshot Image to show after load, before playing video.
• videolist/index.php can be used to browse other folders containing vidoes. Tweak script to update paths.
• strobe folder should contain Strobe Media Player that can be used for recordings rtmp playback and video files http playback
• jwplayer folder should contain JwPlayer that can be used recordings rtmp playback
• You can integrate other players like JW Player or Flow Player for rtmp or http playback.
  Just feed them the rtmp application address and recorded stream name, or directly the flv file for http playback.

VideoWhisper Video Recorder