RecorderAndPlayer

From Seesmic

Jump to: navigation, search

Contents

Player/Recorder

Seesmic Player / Recorder that will allow inline viewing and recording of Seesmic videos.

Key Features

  1. Recording Functionality
  2. Playback Functionality


Tested on the following browsers:

  • IE7
  • IE6
  • Safari
  • Firefox 3
  • Firefox 2

Requirements

  1. Site must be able to execute Javascript

Known Issues

  1. Not working for Opera.

Overview

Samples examples.html - contains an example on how to:

  • How to create a player
  • How to create a recorder
  • How to create a closable player
  • How to create a recorder with validation

We also have some sample images you can use:

How to run

  1. Place the folders under localhost / server
  2. Run index.html under localhost to see the recorder


How to use the Recorder

1. Add the following to the bottom of your HTML page, before the </body> tag

<script  type="text/javascript" src="http://api.seesmic.com/js/pkg/seesmic_standalone.js"></script>

2. Have a Div tag such as the following:

<div id='recorder' style='display:block; clear:both; width:100%; padding-top:5px'></div>

3. To create a recorder instance within the tag, use the following javascript:

seesmic.player.createRecorder($('DIV_ID'), 'SITE_NAME', 'VIDEO_ID_TO_REPLY_TO')

for example:

seesmic.player.createRecorder($('recorder'), 'my web site', 'I3CFMk9wOo')

4. After a video is being posted, it will call the javascript 'videoFromRecorder'. You can implement the function to perform any actions you want upon a video post. For example:

function videoFromRecorder(videoUri, title, url_thumbnail, recState, hasTitle)
{
  alert('videoUri ' + videoUri + ' title ' + title +  ' thumbnail ' + url_thumbnail + ' recState ' + recState + ' hasTitle' + hasTitle)
  return 'posted'
}

5. You can do validation in the videoFromRecorder function. To show an error in the Recorder use the seesmic.recorder.setError function.

var name_is_blank = false
function videoFromRecorder(videoUri, title, url_thumbnail, recState, hasTitle)
{
  if(name_is_blank)
  {
    seesmic.player.setError('please fill in the name');
  }
  return 'posted'
}
How to use the Player
  1. Add the following to the head section of your page
<script  type="text/javascript" src="http://api.seesmic.com/js/pkg/seesmic_standalone.js"></script>
  1. Have a Div tag such as the following:
  1. To create a recorder instance within the tag, use the following javascript:
seesmic.player.createPlayer($('DIV_ID'), 'VIDEO_ID_PLAY', CLOSABLE, AUTOPLAY)

For example:

seesmic.player.createPlayer($('divplayer'), 'I3CFMk9wOo', true, true)
Personal tools