Difference between revisions of "Team:Slovenia/libraries/custom-js"

Line 224: Line 224:
 
console.log($(img).offset().top);
 
console.log($(img).offset().top);
 
console.log($(img).height());
 
console.log($(img).height());
$(window).scrollTop($(img).offset().top + ($(img).height())/2);
+
$(window).scrollTop($(img).offset().top - ($(img).height())/2);
 
}
 
}
  

Revision as of 02:26, 16 October 2016

function reloader() {

   try {
       console.log('start');
       $('.ui.sticky.global').sticky({
           context: '#context',
           offset: 16
       });
       $('.ui.sticky.image').sticky({
           context: '#context',
           offset: 27
       });
       $('.ui.sticky.text.menu').sticky({
           context: '#context',
           offset: 200
       });
       $('.ui.sticky.text').sticky({
           context: '#context',
           offset: 200
       });
       $('.image_div > img').visibility({
           type: 'image',
           transition: 'fade in',
           duration: 500
       });
       $('.teamimg').hover(function () {
           var width = $(this).outerWidth() / 2;
           $(this).find('.left').animate({right: width}, {queue: false, duration: 300});
           $(this).find('.right').animate({left: width}, {queue: false, duration: 300});
       }, function () {
           $(this).find('.left').animate({right: 0}, {queue: false, duration: 300});
           $(this).find('.right').animate({left: 0}, {queue: false, duration: 300});
       });
       $(function () {
           // The parameter are the selector for the container(s) of text in which you want replacement
           // and a URL pointing to your bibfile - mind the same origin policy...
           var zitator = new Zitator(".citing", "//2016.igem.org/wiki/images/5/53/T--Slovenia--references.txt");
           zitator.zitiere();
       });
       function isScrolledIntoView(elem) {
           var docViewTop = $(window).scrollTop();
           var docViewBottom = docViewTop + $(window).height() - $("#menucomb").height();
           var elemTop = $(elem).offset().top;
           var elemBottom = elemTop + $(elem).height();
           if (elemTop >= docViewTop) {
               return true;
           }
           else if (elemBottom >= docViewBottom) {
               return true;
           }
           return false; // || elemTop >= docViewTop) ;
       }
       function clearStyleOfSideMenu() {

console.log("calling a function");

           var id = null;
           $("span.section").each(function () {
               var id = this.id;

console.log(id);

               var selector = 'a[href*="#'.concat(id).concat('"]');
               $(selector).css("color", "");
           });

$("span.section").each(function() { var ident = this.id; var parent = (this.parentNode).parentNode; if(isScrolledIntoView(parent)) { var selector = 'a[href*="#'.concat(ident).concat('"]'); $(selector).css("color", "#DB2828"); return false; } });

/*var color = true;

           $(".section").each(function () {
               //clear each parent
               var id = this.id;
               var selector = 'a[href*="#'.concat(id).concat('"]');
               if (isScrolledIntoView($(this).parent().parent())) {
                   // nastavi barvo trenutni sekcij

if(color) {

console.log("section is found"); color = false; return false; //break from function }

               }
           });*/
       }
       $(document).ready(function () {
               clearStyleOfSideMenu();
               $(window).scroll(function () {
                   clearStyleOfSideMenu();
               });
           }
       );
       $(".menuItem").mouseenter(
           function () {
               var loc = window.location.href;
               var defaultItem;
               var parent;
               $(".submenu").each(function () {
                       var context = this;
                       $("a", context).each(function () {
                           if (loc.match(/[^#]*/) == $(this).attr("href")) {
                               defaultItem = $(context).attr("id");
                               parent = $("#".concat(defaultItem.replace("Submenu", "")));
                           }
                       });
                   }
               );
               $(".ui.simple.item.menuItem a").each(function () {
                   if (loc.match(/[^#]*/) == $(this).attr("href")) {
                       parent = $($(this).parents('.ui.simple.item.menuItem'));
                       defaultItem = (parent.attr('id')).concat("Submenu");
                       console.log(defaultItem);
                   }
               });
               defaultItem = document.getElementById(defaultItem);
               clearElements();
               var submenu = document.getElementById(this.id.concat("Submenu"));
               var submenuText = document.getElementById("SecondarySubmenu");
               if (submenuText.innerHTML != submenu.innerHTML) {
                   this.className = "ui simple active item menuItem";
                   submenuText.innerHTML = submenu.innerHTML;
               }
               else {
                   parent.attr("class", "ui simple active item menuItem");
                   submenuText.innerHTML = defaultItem.innerHTML;
               }
           }
       );
       $("#menucomb").mouseleave(function () {
               setDefaultMenu();
           }
       );
   } catch (e) {
       console.log('startReloading');
       $.getScript("https://2016.igem.org/Team:Slovenia/libraries/semantic-min-js?action=raw&ctype=text/javascript", function () {
           console.log('success');
           reloader();
       });
       console.log('endReloading');
   }

} $(document).ready(injectHeader); $(document).ready(reloader); function enumerateKeys(object) {

   var numberPairs = {};
   var objectPairs = {};
   var number = 0;
   var matches = document.body.querySelectorAll(object + '[data-ref]');
   while (number < matches.length) {
       var refName = matches[number].dataset.ref;
       if (refName in numberPairs) {
           console.log(refName, "This label has already been assigned.");
       } else {
           numberPairs[number + 1] = matches[number];
           objectPairs[refName] = number + 1;
       }
       number++;
   }
   return [numberPairs, objectPairs, number];

}

function enumerate() {

   var tables = enumerateKeys('table');
   var figures = enumerateKeys('figure');
   var maximum = Math.max(tables[2], figures[2]);
   for (var number = 1; number <= maximum; number++) {
       if (number in tables[0]) {
           $(tables[0][number]).children('caption').prepend("Table " + number + ": ")
       }
       if (number in figures[0]) {
           $(figures[0][number]).children('figcaption').prepend("Figure " + number + ": ")
       }
   }
   $(this).find('ref').each(function () {
       var label = $(this).text();
       $(this).click(function (event) {
           event.preventDefault();
       });
       if (label in tables[1]) {
           var number = tables[1][label];
           $(this).html("<a href=> Table " + tables[1][label] + " </a>");
           $(this).on('click', function () {
               window.scroll(0, $(tables[0][number]).offset().top - 122);
           })
       } else {
           var number = figures[1][label];
           $(this).html("<a href=>Figure " + figures[1][label] + "</a>");
           $(this).on('click', function () {
               window.scroll(0, $(figures[0][number]).offset().top - 122);
           })
       }
   });

} $(document).ready(enumerate); $(document).ready(setDefaultMenu); $(document).ready(function(){ $('.ui.accordion').accordion(); });

function resize(img) {

   if (img.className.includes("medium")) {
       img.className = "ui big centered image";

img.parentElement.parentElement.setAttribute("align", "center"); img.parentElement.parentElement.setAttribute("data-property", img.parentElement.parentElement.style.cssText); img.parentElement.parentElement.style = "clear: both";

   }
   else {	

img.parentElement.parentElement.setAttribute("align", "");

       img.className = "ui medium image";

img.parentElement.parentElement.style.cssText = img.parentElement.parentElement.getAttribute("data-property");

   }

//scroll to image, (if two images are floated and the right one is resised, then the image gets pushed down) //var top = img.offsetTop; console.log($(img).offset().top); console.log($(img).height()); $(window).scrollTop($(img).offset().top - ($(img).height())/2); }

function setDefaultMenu() { console.log("calling set default item");

   clearElements();
   var loc = window.location.href;
   var defaultItem;
   var parent;
   $(".submenu").each(function () {
           var context = this;
           $(this).css("color", "#DB2828");
           $(this).css("font-weight", "bold");
           $("a", context).each(function () {

console.log($(this).attr("href"));

               if (loc.match(/[^#]*/) == $(this).attr("href")) {
                   defaultItem = $(context).attr("id");
                   parent = $("#".concat(defaultItem.replace("Submenu", "")));
                   $(this).css("color", "#DB2828");
                   $(this).css("font-weight", "bold");
               }
           });
       }
   );
   $(".ui.simple.item.menuItem a").each(function () {
       if (loc.match(/[^#]*/) == $(this).attr("href")) {
           parent = $($(this).parents('.ui.simple.item.menuItem'));
           defaultItem = (parent.attr('id')).concat("Submenu");
       }
   });
   var submenuText = document.getElementById("SecondarySubmenu");
   defaultItem = document.getElementById(defaultItem);
   parent.attr("class", "ui simple active item menuItem");
   submenuText.innerHTML = defaultItem.innerHTML;

}

function clearElements() {

   var elements = document.getElementsByClassName("menuItem");
   for (var i = 0; i < elements.length; i++) {
       elements[i].className = "ui simple item menuItem";
   }

}

function injectHeader() {

   console.log("Injecting header");
var menu = " \ \ \ \ \ \ \ \ \ \ \ ";
   var contextDiv = document.getElementById("context");
   contextDiv.innerHTML = menu.concat(contextDiv.innerHTML);

}

$('.playGif').on('click', function () {

   console.log("play detected");
   var parent = $(this);
   var parAlt = parent.attr('data-alt');
   var parSrc = parent.attr('src');
   parent.attr("src", parAlt).attr("data-alt", parSrc);

});