<% include header.ejs %>
  <header>
    <h1><a href="/">match<span class="audio-lighten">.audio</span></a></h1>
  </header>
  <div class="container">

    <div class="row share-form">
      <div class="col-md-6 col-md-offset-3">
        <form role="form" method="post" action="/search">
        <div class="input-group input-group-lg">
          <input type="text" name="url" placeholder="Paste link here" class="form-control" autofocus>
          <span class="input-group-btn">
            <input type="submit" class="btn btn-lg btn-custom" value="Share Music">
          </span>
        </div>
        </form>
        <% if (error.length > 0) { %>
          <p class="alert alert-danger"><%= error %></p>
        <% } %>
      </div>
    </div>

    <div class="row blurb">
      <div class="col-md-6 col-md-offset-3">
        <p>Make sharing from music services better.
          We match album and track links from Rdio, Spotify, Deezer, Beats Music, Google Music and iTunes and give you back a link with all of them.</p>
      </div>
    </div>

    <div class="row">
      <div class="col-md-6 col-md-offset-3">
      <% if (recent.length) { %><h2>Recently Shared</h2><% } %>
      <div class="row recent">
      <% for (var i=0;i < recent.length;i++) { var item = recent[i].items[0]; %>
        <div class="col-sm-4 col-xs-6">
          <a href="/<%= item.service.replace("playmusic", "") %>/<%= item.type %>/<%= item.id %>"><img src="<%= item.artwork %>" width="100%"></a>
        </div>
      <% } %>
      </div>
      </div>
    </div>
  </div>
<% include footer.ejs %>