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

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

    <script id="network" type="text/x-handlebars-template">
      {{#each rows}}
      <li>
        {{#compare this.doc.type}}
        <a href=#page=control&id={{this.id}}&action=online>
          <img src={{this.doc.picture}}>
          <h3> {{this.doc.title}} </h3>
          <P>  {{this.doc.artist}} </p>
          <P>  {{this.doc.album}} </p>
        </a>
        {{else}}
        <a href=#page=video_control&id={{this.id}}&action=online>
          <img src={{this.doc.picture}}>
          <h3> {{this.doc.title}} </h3>
          <P>  {{this.doc.artist}} </p>
          <P>  {{this.doc.album}} </p>
        </a>
        {{/compare}}
      </li>
      {{/each}}
    </script>
    <!-- custom script -->
    <script src="gadget_officejs_audioplayer_playlist_online.js" type="text/javascript"></script>
    <body>
      <input type="text" class="inputIp" placeholder="input webdav's ip: http://xxx.xxx.xxx.xxx:port/(xxx is between 0 ~ 255) or url"/>
      <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 class="info">
      </div>

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

    </body>
</html>
