<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title></title>
    <style>
      body {
        line-height: 16px;
        font-size: 14px;
      }

      .indicator {
        background: #000000;
        color: #FFFFFF;
        left: 5px;
        position: absolute;
        text-decoration: none;
        top: 5px;
      }
    </style>
  </head>

  <body style="overflow: hidden;">
    <pre id="data"></pre>
    <div class="indicator" id="indicator"></div>

    <script src="/static/js/jquery-1.7.1.min.js"></script>
    <script src="/static/js/underscore-1.4.3.min.js"></script>
    <script src="/static/js/jquery.pailer.js"></script>

    <script>
      var $body = $('body');
      var $data = $('#data');

      function resize() {
        var margin_left = parseInt($body.css('margin-left'));
        var margin_top = parseInt($body.css('margin-top'));
        var margin_bottom = parseInt($body.css('margin-bottom'));
        $data
          .width($(window).width() - margin_left)
          .height($(window).height() - margin_top - margin_bottom);
      }

      $(window).resize(resize);

      // Set target URL in `sessionStorage` and clean it in `localStorage`.
      (function() {
        // Avoid fetching the target URL if reloading the pailer windoow.
        if (sessionStorage.getItem('isReloaded') !== 'true') {
          var storageKey = window.name;
          sessionStorage.setItem(storageKey, localStorage.getItem(storageKey));
          localStorage.removeItem(storageKey);

          sessionStorage.setItem('isReloaded', 'true');
        }
      })();

      $(document).ready(function() {
        resize();

        var storageKey = window.name;

        $data.pailer({
          read: function(options) {
            var settings = $.extend({
              'offset': -1,
              'length': -1
            }, options);
            var url = sessionStorage.getItem(storageKey)
              + '&offset=' + settings.offset
              + '&length=' + settings.length
              + '&jsonp=?';
            return $.getJSON(url);
          },
          'indicator': $('#indicator')
        });
      });
    </script>
  </body>
</html>