index.html

<!doctype html>
<html class="no-js" lang="">
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">

  <title>NYPL Public Domain Release 2016 - Visualization</title>
  <meta name="description" content="On January 6th, 2016, The New York Public Library made over 187K digital items in the public domain available for high resolution download. This is one of a number of demonstration projects illustrating creative reuse of public domain materials.">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta property="og:site_name" content="NYPL Public Domain Release 2016 - Visualization"/>
  <meta property="og:type" content="website" />
  <meta property="og:url" content="http://publicdomain.nypl.org/pd-visualization/" />
  <meta property="og:title" content="NYPL Public Domain Release 2016 - Visualization" />
  <meta property="og:description" content="On January 6th, 2016, The New York Public Library made over 187K digital items in the public domain available for high resolution download. This is one of a number of demonstration projects illustrating creative reuse of public domain materials." />
  <meta property="og:image" content="http://publicdomain.nypl.org/pd-visualization/img/pd_banner_magnified.png" />
  <meta name="image_src" content="http://publicdomain.nypl.org/pd-visualization/img/pd_banner_magnified.png">
  <link rel="image_src" href="http://publicdomain.nypl.org/pd-visualization/img/pd_banner_magnified.png" />
  <link rel="shortcut icon" href="favicon.ico">

  <link rel="stylesheet" href="css/app.css">
  <script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
<body>

  <div id="main" class="container">
    <div id="viz" class="viz-container">
      <div id="viz-images" class="viz-images">
        <img src="img/clusters_100_10_10.jpg" data-group="centuries" class="viz-image active" />
        <!-- <
        <img src="img/collections_100_10_10.jpg" data-group="collections" class="viz-image" />
        <img src="img/colors_100_10_10.jpg" data-group="colors" class="viz-image" />
        <img src="img/genres_100_10_10.jpg" data-group="genres" class="viz-image" />
        > -->
        <div id="item-info-box" class="item-info-box"></div>
      </div>
      <div id="viz-markers" class="viz-markers">
        <div id="sticky-content" class="sticky-content">testing testing testing</div>
      </div>
    </div>
    
    <div id="nav" class="nav-container">
      <div class="nav">
        <a href="#info" class="info-button nav-item">?</a>
        <div class="label nav-item">Group By:</div>
        <div id="nav-tabs" class="nav-tabs"></div>
      </div>
    </div>
  
    <div class="map-container">
      <div id="map" class="map">
        <img src="img/clusters_100_10_10.jpg" data-group="centuries" class="active" />
        <!-- <
        <img src="img/collections_100_10_10.jpg" data-group="collections" />
        <img src="img/colors_100_10_10.jpg" data-group="colors" />
        <img src="img/genres_100_10_10.jpg" data-group="genres" />
        > -->
        <div id="map-window" class="map-window"></div>
      </div>
    </div>
  </div>
  <div class="info overlay active">
    <div>
      <!-- <
      <p>
        On January 6th, 2016, <a href="http://www.nypl.org/" target="_blank">The New York Public Library</a>  made over 187K digital items in the public domain available for high resolution download. This is one of <a href="http://publicdomain.nypl.org/" target="_blank">many experiments</a> by the <a href="http://www.nypl.org/collections/labs" target="_blank">NYPL Labs</a> to help patrons understand and explore what was contained in that release.</p>
      <p>
        > -->
        <button id="loading-button" class="info-button loading"></button>
      </p>
    </div>
  </div>
   <!-- <
  <div class="nypl-header">
     <a href="http://nypl.org" target="_blank" title="open nypl.org in a new window"><span class="lion">The New York Public Library</span></a>
     &nbsp;&nbsp;
     A <a href="http://publicdomain.nypl.org">public domain remix</a> by <a href="http://brianfoo.com" target="_blank">Brian Foo</a> of <a href="http://labs.nypl.org">NYPL Labs</a>, using the <a href="https://github.com/NYPL-publicdomain/data-and-utilities">data released by NYPL</a>.
     &nbsp;&nbsp;
     <a href="https://github.com/nypl-publicdomain/pd-visualization">View source code</a>.
  </div>
  > -->

  <div id="large-breakpoint"></div>

  <script src="js/vendor/jquery-1.11.3.min.js"></script>
  <!-- <script src="js/vendor/underscore-min.js"></script> -->
  <script src="js/vendor/jquery-ui-1.11.4.custom.min.js"></script>
  <script src="js/vendor/imagesloaded.pkgd.min.js"></script>
  <script src="js/vendor/jquery.hoverIntent.minified.js"></script>
  <script src="js/app.js"></script>

  <script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

    ga('create', 'UA-1420324-131', 'auto');
    ga('send', 'pageview');

  </script>

</body>
</html>