index.html

---
layout: default
---
<!-- Masthead
================================================== -->
<header class="jumbotron subhead" id="overview">
    <h1>API Documentation</h1>
    <p class="lead">OtherScreen represents the most open platform for fun, real-time, interactive Social TV apps on the web and mobile devices.</p>
    <!-- Instrument this in analytics -->
    <div class="subnav">
      <ul class="nav nav-pills">
        <li><a href="#tutorial">Tutorial</a></li>
        <li><a href="#reference">Reference</a></li>
        <li><a href="#more">More Information</a></li>
      </ul>
    </div>

</header>

<!-- API Tutorial
================================================== -->
<section id="tutorial">
  <div class="page-header">
    <h1>API Tutorial  <small>for walkthroughs and general information</small></h1>
  </div>
  <div class="row">
    <div class="span4">
      <h2>Welcome to OtherScreen!</h2>
      <p>OtherScreen is a social TV platform for delivering companion content to live events.  We can cover everything from live events like lectures and presentations to live television or radio broadcasts.</p>
      <p>We want you to have a great experience working with our API, so we've prepared a <a href="./tutorials/getting-started.html">Getting Started</a> guide that will introduce you to the different concepts that you'll need to understand and implement to have a working OtherScreen client.</p>
      <p>For more information about how to read our documentation the best, you can visit our <a href="./notes.html">Reader's Notes</a></p>
      <p>Thanks very much for working with us, and have fun OtherScreening!</p>
    </div><!-- /.span -->
    <div class="span4">
      <h2>Use Case tutorials</h2>
      <p>Here is a quick reference to the use cases we walk you through.  If your code can complete everything in these walkthroughs, you have a 100% compliant client!</p>
      <ul>
        <li><a href="./tutorials/getting-started.html">Getting started</a></li>
        <li><a href="./tutorials/chat.html">Chatting</a></li>
        <li><a href="./tutorials/gameplay.html">Basic Gameplay</a></li>
        <li><a href="./tutorials/preroll.html">Completing preroll</a></li>
        <li><a href="./tutorials/group-play.html">Basic group play</a></li>
        <li><a href="./tutorials/group-management.html">Starting and managing a group</a></li>
        <li><a href="./tutorials/user-notifications.html">User notifications</a></li>
        <li><a href="./tutorials/weekly-game.html">Weekly game</a></li>
      </ul>
    </div><!-- /.span -->
  </div><!-- /.row -->
</section>

<!-- API Reference
================================================== -->
<section id="reference">
  <div class="page-header">
    <h1>API Reference  <small>when you know exactly what you're looking for</small></h1>
  </div>
  <div class="row">
    <div class="span4">
      <h2>Models and Data</h2>
      <p>This section of the documentation contains direct links to the JSON objects you'll be receiving from API calls and WebSocket messages.</p>
      <p>Also, OtherScreen leverages WebSockets, a part of the HTML 5 spec, to deliver real-time interactivity with the product.  We have separate documentation for those event messages.</p>
      <ul>
        <li><a href="./reference/data/index.html">Glossary</a>-- a single-page reference for our model data</li>
        <li><a href="./reference/data/user.html">User model</a></li>
        <li><a href="./reference/data/live-event.html">Live Event related models</a></li>
        <li><a href="./reference/data/group.html">Group models</a></li>
        <li><a href="./reference/data/question.html">Question models</a></li>
      </ul>
    </div><!-- /.span -->

    <div class="span4">
      <h2>API's</h2>
      <p>The HTTP portion of our specification is described below.  These document the calls you'll need to make to participate in gameplay.</p>
      <ul>
        <li><a href="./reference/api/index.html">Quick Reference</a>-- a single-page reference for our API endpoints</li>
        <li><a href="./reference/api/authentication.html">Authentication</a></li>
        <li><a href="./reference/api/live-events.html">Live Events</a></li>
        <li><a href="./reference/api/groups.html">Groups</a></li>
        <li><a href="./reference/api/questions.html">Questions</a></li>
        <li><a href="./reference/api/users.html">Users</a></li>
        <li><a href="./reference/api/dj.html">DJ API's</a>-- an optional set of API endpoints to allow producing an event, as well as playing.</li>
      </ul>      
    </div><!-- /.span -->    
    <div class="span4">
      <h2>WebSocket reference</h2>
      <p>WebSockets integration is crucial for delivery of an acceptable OtherScreen experience.</p>
      <p>Our <a href="./websockets.html">WebSockets documentation</a> contains all the information you'll 
      need to <a href="./websockets.html#authentication">authenticate</a>, and
      <a href="./websockets.html#subscriptions">subscribe</a> to WebSockets, as well as
      <a href="./websockets.html#management">tips on managing connections</a>.</p>
      <p>A list of all WebSocket event types and what data to expect inside them is also available there.</p>

    </div><!-- /.span -->
  </div><!-- /.row -->
</section>

<section id="more">
  <div class="page-header">
    <h1>More information</h1>
  </div>
  <div class="row">
    <div class="span4">
      <h2>Roadmap  <small>What to expect</small></h2>
      <p>Right now, this documentation itself is one of the primary deliverables on the <a href="./roadmap.html">roadmap</a>!</p>
    </div><!-- /.span -->

    <div class="span4">
      <h2>History <small> looking back on API's past</small></h2>
      <h3>Backward compatability</h3>
      <p>We know how hard you work to implement your client.  We commit to you that once you have completed a working client, our activities will not break your code.  We do maintain the right to deprecate extremely old versions of the API that are at least two breaking changes behind, but will communicate with both you and the users of your client to make the appropriate upgrades before that happens.</p>
      <p>Learn more about how we acheive <a href="backward-compatibility.html">backward compatibility</a>.  Backward compatibility was not offered in our <a href="http://otherscreen.github.com/gotcup">0.9</a> API.</p>
    </div><!-- /.span -->
    <div class="span4">
      <h2>Contact Us <small>All feedback is welcome!</small></h2>
      <p>We'd love to talk to you if you are viewing our page.  Twitter will give you the quickest response.</p>
      <ul>
        <li><a href="http://twitter.com/gertig">@gertig</a></li>
        <li><a href="http://twitter.com/bigfleet">@bigfleet</a></li>
      </ul>      
    </div><!-- /.span -->    
  </div><!-- /.row -->
</section>