SeesmicAPIGenericRecorderPlayer html

From Seesmic

Jump to: navigation, search
<!DOCTYPE html
  PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
   <title>Sample page for creating a Seesmic player with JavaScript</title>
  
   <script type="text/javascript">
     /* Optional this is to get notified when a video is posted */
     function videoFromRecorder(videoUri, title, url_thumbnail,
       recState, hasTitle) {
         if($('cb_error').checked)
         {
         seesmic.player.setError('Please fill the name and email in the html page!')
         return
         }
         alert('videoUri ' + videoUri + ' title ' + title +
         ' thumbnail ' + url_thumbnail + ' recState ' + recState +
         ' hasTitle' + hasTitle)
         
         /**Third party developers can now refresh the page / close the recorder
         *  Third party developers can also use the data from videoFromRecorder
         *  and display them accordingly */
       return;
     }
   </script>
  
   <!-- use this style for opening  / closing of thumbnail -->
   <style type="text/css">
     .playerExample {
       margin-bottom: 12px;
     }
     .seePlayOverlay {
       width:50px !important;
       height:50px !important;
       float:left !important;
       padding-left:55px !important;
       padding-top:35px !important;
     }
   </style>
 </head>
 <body>
   <div>
     This example is to create a player.
   </div>
   <div class="playerExample">
     <form action="">
       <input type="button"
         onclick="seesmic.player.createPlayer($('playerHolder'), 'I3CFMk9wOo', false);"
         value="Show Player"/>
     </form>
     <div id="playerHolder">
       <!-- This is where the player will go -->
     </div>
   </div>
   <!--
   <div>
     This example is to create a recorder.
   </div>
   <div class="playerExample">
     <form action="">
       <input type="button"
         onclick="seesmic.player.createRecorder($('recorderHolder'), 'testsite', 'I3CFMk9wOo');"
         value="Show Recorder"/>
     </form>
     <div id="recorderHolder">
       <!-- This is where the recorder will go -->
     </div>
   </div> -->
   <div>
     This example is to create a player with thumbnail
   </div>
   <div class="playerExample">
     <div id='I3CFMk9wOo_preview'>
       <div>
         <a href="http://v.seesmic.com/video/I3CFMk9wOo"
           target="_blank" class="see_link">
           Re : Test
         </a>
       </div>
       <div style="display: block; width: 160px; height: 120px; border:none;
         background-image:url(http://t.seesmic.com/thumbnail/iqJS1MOPDN_th1.jpg);">
         <div id="I3CFMk9wOo_hide" class="seePlayOverlay" style="display:none;">
           <img onclick="seePlayVideo('I3CFMk9wOo',false)"
             src="images/stop_overlay.png" width="50" height="50"
             style="cursor:pointer; cursor:hand; border:none;"/>
         </div>
         <div id="I3CFMk9wOo_show" class="seePlayOverlay">
           <img onclick="seePlayVideo('I3CFMk9wOo',true)"
             src="images/play_overlay.png" width="50"  height="50"
               style="cursor:pointer; cursor:hand; border:none;"/>
         </div>
       </div>
     </div>
     <div id="I3CFMk9wOo_content">
       <!-- This is where the player will go -->
     </div>
   </div>
   <div>
     This example is to create a recorder and that it will cause validation error
   </div>
   <div class="playerExample">
     <form action="">
       <input type="button"
         onclick="seesmic.player.createRecorder($('recorderHolder2'), 'testrc', 'I3CFMk9wOo');"
         value="Show Recorder"/>
     </form>
     <div id="recorderHolder2">
       <!-- This is where the recorder will go -->
     </div>
    <label for="cb_error"><input id="cb_error" value="1" checked="checked" type="checkbox">

Cause Validation Error</label>

   </div>
   
   <script  type="text/javascript" src="http://api.seesmic.com/js/pkg/seesmic_standalone.js"></script>
    
 </body>
</html>
Personal tools