---
layout: page
title: Hot Topics
---
<div ng-app='elastica' ng-controller='elasticaController' ng-init='search(0)'>

<!-- Title and search box -->
<header class='headerclass'>
    <div class='search-box-container'>
    <input type='text' class='search-box' placeholder='Search' autofocus ng-model='query' ng-change='search(0)'>
  </div>
</header>

<!-- Listing of search results -->
<main class='results-container'>
  <section class='results-info'>
    <p id='response-details'>&#123;&#123;(hits | number) || 0&#125;&#125; &#123;&#123;resultsString || 'results'&#125;&#125; (&#123;&#123;timeTook || 0&#125;&#125;ms)</p>
    <p ng-show='paginationEnabled()' id='pagination-details'>Showing &#123;&#123;paginationLowerBound&#125;&#125; - &#123;&#123;paginationUpperBound&#125;&#125;</p>
  </section>
  <section class='results'>
    <p class='no-results' ng-show='!results.length && !loading'>No Results</p>
    <article class='result' ng-repeat='result in results track by $id(result)'>
      <h2>&#123;&#123;result.title&#125;&#125;</h2>
      <p>&#123;&#123;result.author&#125;&#125;</p>
    </article>
  </section>
  <section class='pagination-controls'>
    <button ng-click='search(-1)' ng-show='paginationEnabled() && offset !== 0' class='pager'>Previous</button><button ng-click='search(1)' ng-show='paginationEnabled()' class='pager'>Next</button>
  </section>
</main>

<!-- Load resources -->
<script src='libs/angular/angular.min.js' type='text/javascript'></script>
<script src='libs/angular-animate/angular-animate.min.js' type='text/javascript'></script>
<script src='libs/elasticsearch/elasticsearch.angular.min.js' type='text/javascript'></script>
<script src='js/config.js' type='text/javascript'></script>
<script src='js/app.js' type='text/javascript'></script>
<script src='js/controllers.js' type='text/javascript'></script>
<script src='js/services.js' type='text/javascript'></script>

</div>