change demo storymap to the original; configure to load it from stati…

…c instead of from media.knightlab.com; fix broken map of VA for 1830 slide
MaDDmin · Mar 15, 2017 · 497481b · 497481b
1 parent 579da25
commit 497481b
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 6 deletions.
diff --git a/static/demo/demo.json b/static/demo/demo.json
@@ -98,9 +98,9 @@
                 "line": true
             },
             "media": {
-                    "url":              "https://www.library.yale.edu/MapColl/oldsite/map/va1830.gif",
-                    "credit":               "Yale Library",
-                    "caption":          "Map of Virginia"
+                    "url":              "https://upload.wikimedia.org/wikipedia/commons/thumb/f/f6/1827_Finley_Map_of_Virginia_-_Geographicus_-_Virginia-finley-1827.jpg/1920px-1827_Finley_Map_of_Virginia_-_Geographicus_-_Virginia-finley-1827.jpg",
+                    "credit":               "<a href='https://en.wikipedia.org/wiki/Virginia_Conventions#/media/File:1827_Finley_Map_of_Virginia_-_Geographicus_-_Virginia-finley-1827.jpg'>Wikimedia Commons</a>",
+                    "caption":          "Anthony Finley's 1827 map of Virginia"
                 }
         }, {
             "date": "1840",

diff --git a/templates/_demo.html b/templates/_demo.html
@@ -1,6 +1,23 @@
 
+      <link rel="stylesheet" href="//cdn.knightlab.com/libs/storymapjs/latest/css/fonts/font.pt.css">
         <section id="demo" class="container-fluid">
-            <div class="product-demo">
-                <iframe frameborder="0"  src="https://uploads.knightlab.com/storymapjs/5adc981b33abcca3b95bc93bc2fe088a/a-sunday-on-la-grande-jatte-zoomify/draft.html" width="100%"></iframe>
-            </div>
+          <div id="homepage-storymap">
+          </div>
+        </section>
+        <script>
+          var storymap = new VCO.StoryMap('homepage-storymap',
+                                           '{{ STATIC_URL }}demo/demo.json',
+                                         );
+
+          var e = $(window).height(),
+          t = $("#homepage-storymap");
+          t.height(e - 20);
+
+          $(window).resize(function() {
+             e = $(window).height();
+             t.height(e - 20);
+            storymap.updateDisplay();
+          })
+        </script>
+
         </section>
diff --git a/templates/base.html b/templates/base.html
@@ -5,6 +5,8 @@
 {% block head %}
     {% include "_head.html" %}
 {% endblock head %}
+<link rel="stylesheet" href="//cdn.knightlab.com/libs/storymapjs/latest/css/storymap.css?v2">
+<script type="text/javascript" src="//cdn.knightlab.com/libs/storymapjs/latest/js/storymap.js"></script>
 </head>
 
 <body>