<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- renderjs -->
    <script src="../lib/rsvp.min.js" type="text/javascript"></script>
    <script src="../lib/renderjs.min.js" type="text/javascript"></script>
    
    <script src="../lib/jquery.js" type="text/javascript"></script>
    <script src="../lib/handlebars.min.js"></script>

    <script src="../mixin_promise/mixin_promise.js" type="text/javascript"></script>

    <script id="rows-template" type="text/x-handlebars-template">
      {{#each rows}}
      <li>
        {{#compare this.doc.type}}
        <a href=#page=control&id={{this.id}}&action=offline>
          <img src={{this.doc.picture}}>          
          <h3> {{this.doc.title}} </h3>
          <P>{{this.doc.artist}}</p>
          <P>{{this.doc.album}} </p>
          <p class="ui-li-count">{{this.doc.time}} </p>
        </a>
        {{else}}
        <a href=#page=video_control&id={{this.id}}&action=offline>
          <img src={{this.doc.picture}}>
          <h3> {{this.doc.title}} </h3>
          <P>  {{this.doc.artist}} </p>
          <P>  {{this.doc.album}} </p>
          <p class="ui-li-count">{{this.doc.time}} </p>
        </a>
        {{/compare}}
        <a href=#page=playlist&id={{this.id}}&action=delete>
          data-rel=popup
          data-position-to=window 
        </a>
      </li> 
      {{/each}}
    </script>
    <!-- custom script -->
    <script src="./playlist.js" type="text/javascript"></script>
    
    <body>
      <input type="search" class="research" placeholder="research..."/>

      <div data-role="content">
        <ul data-role="listview" data-split-icon="delete" data-split-theme="d">
        </ul>
      </div>


      <div data-role="footer" data-position="fixed" data-theme="b">
        <div data-role="navbar" >
          <ul>
            <li><a data-role="button" class="localhost" data-icon="search">localhost</a></li>
            <li><a data-role="button" class="online" data-icon="search">online</a></li>
        </ul>
      </div><!-- /navbar -->
    </div><!-- /footer -->

    </body>
</html>
