metpetdb · a3r0d7n4m1k · Jul 31, 2017 · Jul 31, 2017 · Jul 31, 2017 · Jul 31, 2017
diff --git a/__init__.py b/__init__.py
diff --git a/static/css/lightbox.2.9.0.min.css b/static/css/lightbox.2.9.0.min.css
diff --git a/static/images/BingWallpaper-2017-07-26.jpg b/static/images/BingWallpaper-2017-07-26.jpg
diff --git a/static/images/BingWallpaper-2017-07-27.jpg b/static/images/BingWallpaper-2017-07-27.jpg
diff --git a/static/images/BingWallpaper-2017-07-29.jpg b/static/images/BingWallpaper-2017-07-29.jpg
diff --git a/static/images/BingWallpaper-2017-07-30.jpg b/static/images/BingWallpaper-2017-07-30.jpg
diff --git a/static/images/BingWallpaper-2017-07-31.jpg b/static/images/BingWallpaper-2017-07-31.jpg
diff --git a/static/js/carousel.js b/static/js/carousel.js
@@ -0,0 +1,58 @@
+$(document).ready(function(){
+    var thumbnail = $("#thumbnail-carousel").carousel();
+    thumbnail.carousel("pause");
+
+    var totalImages = $("li.item").length;
+    var displayedImages = 3; //This should change later;
+    var totalImagesNoClones = totalImages-displayedImages;
+
+    var start = $(".start").index();
+    var resetIndex = $("#reset").index();
+
+    console.log("Total Images with Clones: ", totalImages);
+    console.log("displayed Images: ", displayedImages);
+    console.log("Total Images, no clones: ", totalImagesNoClones);
+    console.log("Start: ", start, ", Reset: ", resetIndex);
+
+    if (totalImagesNoClones > displayedImages) {
+        $('.right').on('click', function(){
+            $(".start").removeClass("active");
+            $(".start").addClass("old");
+            $(".item").eq((start+1)%totalImages).addClass("start");
+            $(".item").eq((start+displayedImages)%totalImages).addClass("active");
+            $(".old").removeClass("start");
+            $(".old").removeClass("old");
+            start++;
+            console.log(start);
+            if (start%(totalImages-displayedImages)==0) {
+                console.log("RESET BITHC")
+                $("#anchor").addClass("active start");
+                $("#reset").removeClass("active start");
+                $(".clone").removeClass("active");
+                start = 0;
+                for (var i = 0; i < displayedImages; i++) {
+                    $(".item").eq(i).addClass("active");
+                };
+            }
+        });
+
+        $('.left').on('click', function(){
+            $(".start").addClass("old");
+            $(".item").eq((start+(displayedImages-1))%totalImages).removeClass("active");
+            $(".item").eq((start-1)%totalImages).addClass("active start");
+            $(".old").removeClass("start");
+            $(".old").removeClass("old");
+            start--;
+            if (start%(totalImages-displayedImages)==-1) {
+                $(".item").eq(resetIndex-1).addClass("active start");
+                $("#anchor").removeClass("active start");
+                $(".clone").addClass("active");
+                $("#last").removeClass("active start");
+                for (var j = 0; j < displayedImages; j++) {
+                    $(".item").eq(j).removeClass("active");
+                };
+                start = resetIndex-1;
+            };
+        });
+    }
+});
diff --git a/static/js/jquery-3.2.1.min.js b/static/js/jquery-3.2.1.min.js
diff --git a/static/js/lightbox.2.9.0.min.js b/static/js/lightbox.2.9.0.min.js
diff --git a/templates/base.html b/templates/base.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title></title>
+    {% block head %}
     <link rel="stylesheet" type="text/css" href="/static/css/base.css">
     <meta name="viewport" content="width=device-width"/>
     <script>
@@ -34,6 +34,8 @@
       }
 
     </script>
+    <title></title>
+    {% endblock %}
   </head>
 
   <body class="container">
@@ -101,13 +103,19 @@ <h3 class="brand" id="page_title">MetPetDB: Database for Metamorphic Petrology</
     {% block body %}
     {% endblock %}
 
+    {% block scripts %}
     <!--Gives errors in the browser console if jquery not included, but formats
         search page checkboxes not in columns if included-->
     <script type="text/javascript" src="/static/js/jquery-2.1.1.min.js"></script>
     <script type="text/javascript" src="/static/js/jquery-ui.min.js"></script>
     <script type="text/javascript" src="/static/js/chosen.jquery.min.js"></script>
     <script type="text/javascript" src="/static/js/bootstrap.min.js"></script>
     <script src="/static/js/lightbox.js"></script>
+
+    <link href="/static/css/bootstrap.min.css" rel="stylesheet" media="screen">
+    <link href="/static/css/lightbox.css" rel="stylesheet" />
+    {% endblock %}
+
     <script>
       function parse_fragment_ids(){
         var parser = document.createElement('a');
@@ -152,11 +160,8 @@ <h3 class="brand" id="page_title">MetPetDB: Database for Metamorphic Petrology</
       }
       parse_fragment_ids();
     </script>
-    <link href="/static/css/bootstrap.min.css" rel="stylesheet" media="screen">
     <link rel="stylesheet" type="text/css" href="/static/css/style.css">
-    <link href="/static/css/lightbox.css" rel="stylesheet" />
     <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
-
   </body>
 </html>