refactor Js code for slides

so that it does not generate Js errors on pages others that index

ippisite/ippidb/static/js/ippidb-slides.js

+var slideIndex = 1;
+
+var myTimer;
+
+var slideshowContainer;
+
+window.addEventListener("load", function () {
+    showSlides(slideIndex);
+    myTimer = setInterval(function () { plusSlides(1) }, 5000);
+
+    //COMMENT OUT THE LINE BELOW TO KEEP ARROWS PART OF MOUSEENTER PAUSE/RESUME
+    slideshowContainer = document.getElementsByClassName('slideshow-inner')[0];
+
+    //UNCOMMENT OUT THE LINE BELOW TO KEEP ARROWS PART OF MOUSEENTER PAUSE/RESUME
+    // slideshowContainer = document.getElementsByClassName('slideshow-container')[0];
+
+    slideshowContainer.addEventListener('mouseenter', pause)
+    slideshowContainer.addEventListener('mouseleave', resume)
+})
+
+// NEXT AND PREVIOUS CONTROL
+function plusSlides(n) {
+    clearInterval(myTimer);
+    if (n < 0) {
+        showSlides(slideIndex -= 1);
+    } else {
+        showSlides(slideIndex += 1);
+    }
+
+    //COMMENT OUT THE LINES BELOW TO KEEP ARROWS PART OF MOUSEENTER PAUSE/RESUME
+
+    if (n === -1) {
+        myTimer = setInterval(function () { plusSlides(n + 2) }, 5000);
+    } else {
+        myTimer = setInterval(function () { plusSlides(n + 1) }, 5000);
+    }
+}
+
+//Controls the current slide and resets interval if needed
+function currentSlide(n) {
+    clearInterval(myTimer);
+    myTimer = setInterval(function () { plusSlides(n + 1) }, 5000);
+    showSlides(slideIndex = n);
+}
+
+function showSlides(n) {
+    var i;
+    var slides = document.getElementsByClassName("mySlides");
+    if (n > slides.length) { slideIndex = 1 }
+    if (n < 1) { slideIndex = slides.length }
+    for (i = 0; i < slides.length; i++) {
+        slides[i].style.display = "none";
+    }
+    slides[slideIndex - 1].style.display = "block";
+}
+
+pause = () => {
+    clearInterval(myTimer);
+}
+
+resume = () => {
+    clearInterval(myTimer);
+    myTimer = setInterval(function () { plusSlides(slideIndex) }, 5000);
+}
\ No newline at end of file

ippisite/ippidb/static/js/ippidb.js

@@ -226,71 +226,6 @@ $(document).ready(function () {
     });
 });
 
-var slideIndex = 1;
-
-var myTimer;
-
-var slideshowContainer;
-
-window.addEventListener("load", function () {
-    showSlides(slideIndex);
-    myTimer = setInterval(function () { plusSlides(1) }, 5000);
-
-    //COMMENT OUT THE LINE BELOW TO KEEP ARROWS PART OF MOUSEENTER PAUSE/RESUME
-    slideshowContainer = document.getElementsByClassName('slideshow-inner')[0];
-
-    //UNCOMMENT OUT THE LINE BELOW TO KEEP ARROWS PART OF MOUSEENTER PAUSE/RESUME
-    // slideshowContainer = document.getElementsByClassName('slideshow-container')[0];
-
-    slideshowContainer.addEventListener('mouseenter', pause)
-    slideshowContainer.addEventListener('mouseleave', resume)
-})
-
-// NEXT AND PREVIOUS CONTROL
-function plusSlides(n) {
-    clearInterval(myTimer);
-    if (n < 0) {
-        showSlides(slideIndex -= 1);
-    } else {
-        showSlides(slideIndex += 1);
-    }
-
-    //COMMENT OUT THE LINES BELOW TO KEEP ARROWS PART OF MOUSEENTER PAUSE/RESUME
-
-    if (n === -1) {
-        myTimer = setInterval(function () { plusSlides(n + 2) }, 5000);
-    } else {
-        myTimer = setInterval(function () { plusSlides(n + 1) }, 5000);
-    }
-}
-
-//Controls the current slide and resets interval if needed
-function currentSlide(n) {
-    clearInterval(myTimer);
-    myTimer = setInterval(function () { plusSlides(n + 1) }, 5000);
-    showSlides(slideIndex = n);
-}
-
-function showSlides(n) {
-    var i;
-    var slides = document.getElementsByClassName("mySlides");
-    if (n > slides.length) { slideIndex = 1 }
-    if (n < 1) { slideIndex = slides.length }
-    for (i = 0; i < slides.length; i++) {
-        slides[i].style.display = "none";
-    }
-    slides[slideIndex - 1].style.display = "block";
-}
-
-pause = () => {
-    clearInterval(myTimer);
-}
-
-resume = () => {
-    clearInterval(myTimer);
-    myTimer = setInterval(function () { plusSlides(slideIndex) }, 5000);
-}
-
 var multiselectTypeAhead = function (idSearch, selection, onSelect) {
     var bh = new Bloodhound({
         datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),

ippisite/ippidb/templates/index.html

 {% extends "base.html" %}
 
+{% block extra_js %}
+<script src="/static/js/ippidb-slides.js" type="text/javascript"></script>
+{% endblock %}
+
 
 {% block title %}inhibitors of Protein-Protein Interaction Database{% endblock %}