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

 
(15 intermediate revisions by 2 users not shown)
Line 284: Line 284:
 
<div class='menu'> \
 
<div class='menu'> \
 
<a href='https://2016.igem.org/Team:Slovenia/Description' \
 
<a href='https://2016.igem.org/Team:Slovenia/Description' \
  class='item'>Description</a> \
+
  class='item menuFix'>Description</a> \
<a href='https://2016.igem.org/Team:Slovenia/Design' \
+
  class='item'>Design</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Experiments' \
+
  class='item'>Experiments</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Results' \
+
  class='item'>Results</a> \
+
 
</div> \
 
</div> \
 
</div> \
 
</div> \
 
<div class = 'submenu' id='homeSubmenu'> \
 
<div class = 'submenu' id='homeSubmenu'> \
 
<div class='menu'> \
 
<div class='menu'> \
  <a href='https://2016.igem.org/Team:Slovenia' class='item'><img border='0' alt='USflag' src='//2016.igem.org/wiki/images/5/5d/T--Slovenia--USflag.png'></a> \
+
  <a href='https://2016.igem.org/Team:Slovenia' class='item menuFix'><img border='0' alt='USflag' src='//2016.igem.org/wiki/images/5/5d/T--Slovenia--USflag.png'></a> \
  <a href='https://2016.igem.org/Team:Slovenia/HomeSlo' class='item'><img border='0' alt='USflag' src='//2016.igem.org/wiki/images/7/7b/T--Slovenia--SLOflag.png'></a> \
+
  <a href='https://2016.igem.org/Team:Slovenia/HomeSlo' class='item menuFix'><img border='0' alt='USflag' src='//2016.igem.org/wiki/images/7/7b/T--Slovenia--SLOflag.png'></a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
Line 302: Line 296:
 
<div class='menu' style = 'position: absolute; right: 15%'> \
 
<div class='menu' style = 'position: absolute; right: 15%'> \
 
<a href='https://2016.igem.org/Team:Slovenia/Parts' \
 
<a href='https://2016.igem.org/Team:Slovenia/Parts' \
  class='item'>All Parts</a> \
+
  class='item menuFix'>All Parts</a> \
 
  <a href='https://2016.igem.org/Team:Slovenia/Basic_Part' \
 
  <a href='https://2016.igem.org/Team:Slovenia/Basic_Part' \
  class='item'>New Basic Part</a> \
+
  class='item menuFix'>New Basic Part</a> \
 
<a href='https://2016.igem.org/Team:Slovenia/Part_Collection' \
 
<a href='https://2016.igem.org/Team:Slovenia/Part_Collection' \
  class='item'>Part Collection</a> \
+
  class='item menuFix'>Part Collection</a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
Line 312: Line 306:
 
<!-- this is notebook submenu --> \
 
<!-- this is notebook submenu --> \
 
<div class='menu' style = 'position: absolute; right: 8%'>\
 
<div class='menu' style = 'position: absolute; right: 8%'>\
<a href='https://2016.igem.org/Team:Slovenia/Notebook' class='item'>Log book</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Notebook' class='item menuFix'>Log book</a> \
<a href='https://2016.igem.org/Team:Slovenia/Measurement' class='item'>Protocols</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Measurement' class='item menuFix'>Protocols</a> \
<a href='https://2016.igem.org/Team:Slovenia/Notebook/Proposals' class='item'>Initial proposals</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Notebook/Proposals' class='item menuFix'>Initial proposals</a> \
 
</div>\
 
</div>\
 
</div> \
 
</div> \
 
<div class='submenu' id='societySubmenu'> \
 
<div class='submenu' id='societySubmenu'> \
 
<div class='menu' style = 'position: absolute; right: 0'> \
 
<div class='menu' style = 'position: absolute; right: 0'> \
<a href='https://2016.igem.org/Team:Slovenia/Integrated_Practices' class='item'>Integrated Practices</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Integrated_Practices' class='item menuFix'>Integrated Practices</a> \
 
<a href='https://2016.igem.org/Team:Slovenia/Engagement' \
 
<a href='https://2016.igem.org/Team:Slovenia/Engagement' \
  class='item'>Education and Public Engagement</a> \
+
  class='item menuFix'>Education and Public Engagement</a> \
 
<a href='https://2016.igem.org/Team:Slovenia/Collaborations' \
 
<a href='https://2016.igem.org/Team:Slovenia/Collaborations' \
  class='item'>Collaboration</a> \
+
  class='item menuFix'>Collaboration</a> \
 
<a href='https://2016.igem.org/Team:Slovenia/Safety' \
 
<a href='https://2016.igem.org/Team:Slovenia/Safety' \
  class='item'>Safety</a> \
+
  class='item menuFix'>Safety</a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
Line 333: Line 327:
 
<!-- this is idea submenu -->\
 
<!-- this is idea submenu -->\
 
<div class='menu'> \
 
<div class='menu'> \
<a href='https://2016.igem.org/Team:Slovenia/Idea/Challenge' class='item'>Challenges</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Idea/Challenge' class='item menuFix'>Challenges</a> \
<a href='https://2016.igem.org/Team:Slovenia/Idea/Solution' class='item'>Solutions</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Idea/Solution' class='item menuFix'>Solutions</a> \
 
</div>\
 
</div>\
 
</div> \
 
</div> \
 
<div class='submenu' id='mechanosensingSubmenu'> \
 
<div class='submenu' id='mechanosensingSubmenu'> \
 
<div class='menu'> \
 
<div class='menu'> \
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Overview' class='item'>Overview</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Overview' class='item menuFix'>Overview</a> \
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Mechanosensitive_channels' class='item'>Mechanosensitive channels</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Mechanosensitive_channels' class='item menuFix'>Mechanosensitive channels</a> \
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Gas_vesicles' class='item'>Gas vesicles</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Gas_vesicles' class='item menuFix'>Gas vesicles</a> \
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/CaDependent_mediator' class='item'>Ca-dependent mediator</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/CaDependent_mediator' class='item menuFix'>Ca-dependent mediator</a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
 
<div class='submenu' id='implementationSubmenu'> \
 
<div class='submenu' id='implementationSubmenu'> \
 
<div class='menu' style = 'position: absolute; right: 30%'> \
 
<div class='menu' style = 'position: absolute; right: 30%'> \
<a href='https://2016.igem.org/Team:Slovenia/Demonstrate' class='item'>Protease inducible secretion</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Demonstrate' class='item menuFix'>Protease inducible secretion</a> \
<a href='https://2016.igem.org/Team:Slovenia/Proof' class='item'>Touch painting</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Proof' class='item menuFix'>Touch painting</a> \
<a href='https://2016.igem.org/Team:Slovenia/Implementation/Impact' class='item'>Impact</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Implementation/Impact' class='item menuFix'>Impact</a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
 
<div class='submenu' id='proteaseSignallingSubmenu'> \
 
<div class='submenu' id='proteaseSignallingSubmenu'> \
 
<div class='menu'> \
 
<div class='menu'> \
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Overview' class='item'>Overview</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Overview' class='item menuFix'>Overview</a> \
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Reporters' class='item'>Reporters</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Reporters' class='item menuFix'>Reporters</a> \
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Orthogonality' class='item'>Orthogonality</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Orthogonality' class='item menuFix'>Orthogonality</a> \
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Split_proteases' class='item'>Split proteases</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Split_proteases' class='item menuFix'>Split proteases</a> \
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Light_dependent_mediator' class='item'>Light-dependent mediator</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Light_dependent_mediator' class='item menuFix'>Light-dependent mediator</a> \
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Logic' class='item'>Logic</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Logic' class='item menuFix'>Logic</a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
 
<div  class='submenu' id='dryLabSubmenu'> \
 
<div  class='submenu' id='dryLabSubmenu'> \
 
<div class='menu' style = 'position: absolute; right: 30%'> \
 
<div class='menu' style = 'position: absolute; right: 30%'> \
<a href='https://2016.igem.org/Team:Slovenia/Hardware' class='item'>Ultrasound controlling device</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Hardware' class='item menuFix'>Ultrasound controlling device</a> \
<a href='https://2016.igem.org/Team:Slovenia/Model' class='item'>Modeling of ultrasound</a>  \
+
<a href='https://2016.igem.org/Team:Slovenia/Model' class='item menuFix'>Modeling of ultrasound</a>  \
<a href='https://2016.igem.org/Team:Slovenia/Software' class='item'>CaPTURE software</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Software' class='item menuFix'>CaPTURE software</a> \
<a href='https://2016.igem.org/Team:Slovenia/ModelLogic' class='item'>Modeling logic gates</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/ModelLogic' class='item menuFix'>Modeling logic gates</a> \
<a href='https://2016.igem.org/Team:Slovenia/CoiledCoilInteraction' class='item'>Coiled-coil interaction model</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/CoiledCoilInteraction' class='item menuFix'>Coiled-coil interaction model</a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
 
<div class='submenu' id='teamSubmenu'> \
 
<div class='submenu' id='teamSubmenu'> \
 
<div class='menu' style = 'position: absolute; right: 0'> \
 
<div class='menu' style = 'position: absolute; right: 0'> \
<a href='https://2016.igem.org/Team:Slovenia/Team/Students' class='item'>Students</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Team/Students' class='item menuFix'>Students</a> \
<a href='https://2016.igem.org/Team:Slovenia/Team/Advisors' class='item'>Advisors</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Team/Advisors' class='item menuFix'>Advisors</a> \
<a href='https://2016.igem.org/Team:Slovenia/Attributions' class='item'>Attributions</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Attributions' class='item menuFix'>Attributions</a> \
<a href='https://2016.igem.org/Team:Slovenia/Sponsors'  class='item'>Sponsors</a> \
+
<a href='https://2016.igem.org/Team:Slovenia/Sponsors'  class='item menuFix'>Sponsors</a> \
 
</div> \
 
</div> \
 
</div> \
 
</div> \
 
<div class='ui sticky global' id='menucomb'> \
 
<div class='ui sticky global' id='menucomb'> \
 
<div class='ui red secondary ten item pointing menu'> \
 
<div class='ui red secondary ten item pointing menu'> \
<a href='https://2016.igem.org/Team:Slovenia' class='ui simple item menuItem' id='home'> \
+
<a href='https://2016.igem.org/Team:Slovenia' class='ui simple item menuItem menuFix' id='home'> \
 
                         Home \
 
                         Home \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Idea/Challenge' class='ui simple item menuItem' id='idea'> \
+
<a href='https://2016.igem.org/Team:Slovenia/Idea/Challenge' class='ui simple item menuItem menuFix' id='idea'> \
 
                         Idea \
 
                         Idea \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Overview' class='ui simple item menuItem' id='mechanosensing'> \
+
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing/Overview' class='ui simple item menuItem menuFix' id='mechanosensing'> \
 
                         Mechano- <br>sensing \
 
                         Mechano- <br>sensing \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Overview' class='ui simple item menuItem' id='proteaseSignalling'> \
+
<a href='https://2016.igem.org/Team:Slovenia/Protease_signaling/Overview' class='ui simple item menuItem menuFix' id='proteaseSignalling'> \
 
                         Protease<br /> signaling\
 
                         Protease<br /> signaling\
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Hardware' class='ui simple item menuItem' id='dryLab'> \
+
<a href='https://2016.igem.org/Team:Slovenia/Hardware' class='ui simple item menuItem menuFix' id='dryLab'> \
 
                         Dry lab \
 
                         Dry lab \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Demonstrate' class='ui simple item menuItem' id='implementation'> \
+
<a href='https://2016.igem.org/Team:Slovenia/Demonstrate' class='ui simple item menuItem menuFix' id='implementation'> \
 
                         Implementation \
 
                         Implementation \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Parts' class='ui simple item menuItem' id='parts' > \
+
<a href='https://2016.igem.org/Team:Slovenia/Parts' class='ui simple item menuItem menuFix' id='parts' > \
 
                         Parts \
 
                         Parts \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Notebook' class='ui simple item menuItem' id='notebook' > \
+
<a href='https://2016.igem.org/Team:Slovenia/Notebook' class='ui simple item menuItem menuFix' id='notebook' > \
 
                         Notebook \
 
                         Notebook \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Integrated_Practices' class='ui simple item menuItem' id='society'> \
+
<a href='https://2016.igem.org/Team:Slovenia/Integrated_Practices' class='ui simple item menuItem menuFix' id='society'> \
 
                         Society \
 
                         Society \
 
</a> \
 
</a> \
<a href='https://2016.igem.org/Team:Slovenia/Team/Students' class='ui simple item menuItem' id='team'> \
+
<a href='https://2016.igem.org/Team:Slovenia/Team/Students' class='ui simple item menuItem menuFix' id='team'> \
 
                         Team \
 
                         Team \
 
</a> \
 
</a> \
Line 417: Line 411:
 
</div>";
 
</div>";
 
     var contextDiv = document.getElementById("context");
 
     var contextDiv = document.getElementById("context");
     contextDiv.innerHTML = menu.concat(contextDiv.innerHTML);
+
     contextDiv.innerHTML = menu.concat(contextDiv.innerHTML);
 +
var elements = document.getElementsByClassName("menuFix");
 +
 +
if(window.innerWidth < 768 ) {
 +
//phone
 +
console.log("small screen");
 +
for (var i = 0; i < elements.length; i++) {
 +
elements[i].setAttribute("style", "font-size:5px;");
 +
}
 +
}
 +
else if(window.innerWidth < 800) {
 +
//small screen
 +
console.log("small screen");
 +
for (var i = 0; i < elements.length; i++) {
 +
elements[i].setAttribute("style", "font-size:7px;");
 +
}
 +
}
 +
else if(window.innerWidth < 980) {
 +
//medium screen
 +
console.log("small screen");
 +
for (var i = 0; i < elements.length; i++) {
 +
elements[i].setAttribute("style", "font-size:9px;");
 +
}
 +
}
 +
else if(window.innerWidth < 1280) {
 +
//normal
 +
console.log("small screen");
 +
for (var i = 0; i < elements.length; i++) {
 +
elements[i].setAttribute("style", "font-size:11px;");
 +
}
 +
}
 +
console.log("end of injecting");
 
}
 
}
  

Latest revision as of 18:03, 19 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.colorize").each(function () {
               var id = this.id;
               //console.log(id);
               var selector = 'a[href*="#'.concat(id).concat('"]');
               $(selector).css("color", "");
           });
           $("span.section.colorize").each(function() {
               var ident = this.id;
               console.log(ident);
               console.log(this);
               if(ident != "") {
                   var parent = (this.parentNode).parentNode;
                   if(isScrolledIntoView(parent)) {
                       var selector = 'a[href*="#'.concat(ident).concat('"]');
                       $(selector).css("color", "#DB2828");
                       console.log(selector);
                       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;

console.log(refName); console.log(matches[number]);

       if (refName in numberPairs) {
           console.log(refName, "This label has already been assigned.");
       } else {
           numberPairs[number + 1] = matches[number];
           objectPairs[refName] = number + 1;
           console.log(refName);
       }
       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 - 150);
           })
       } 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 - 150);
           })
       }
   });

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

   $('.ui.accordion').accordion();

});

function resize(img) {

   if (!(img.className.indexOf("big") >= 0)) {
       img.className = "ui big centered image";
       img.parentElement.parentElement.setAttribute("align-property", img.parentElement.parentElement.align);
       img.parentElement.parentElement.setAttribute("align", "center");
       img.parentElement.parentElement.setAttribute("data-property", img.parentElement.parentElement.style.cssText);
       img.parentElement.parentElement.style.cssText = "clear: both";
   }
   else {
       img.parentElement.parentElement.setAttribute("align", "");
       img.className = "ui image";
       img.parentElement.parentElement.style.cssText = img.parentElement.parentElement.getAttribute("data-property");
       img.parentElement.parentElement.align = img.parentElement.parentElement.getAttribute("align-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($("menucomb").height());
   $(window).scrollTop($(img).offset().top -  $(window).height()/2 + $(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);	

var elements = document.getElementsByClassName("menuFix");

if(window.innerWidth < 768 ) { //phone console.log("small screen"); for (var i = 0; i < elements.length; i++) { elements[i].setAttribute("style", "font-size:5px;"); } } else if(window.innerWidth < 800) { //small screen console.log("small screen"); for (var i = 0; i < elements.length; i++) { elements[i].setAttribute("style", "font-size:7px;"); } } else if(window.innerWidth < 980) { //medium screen console.log("small screen"); for (var i = 0; i < elements.length; i++) { elements[i].setAttribute("style", "font-size:9px;"); } } else if(window.innerWidth < 1280) { //normal console.log("small screen"); for (var i = 0; i < elements.length; i++) { elements[i].setAttribute("style", "font-size:11px;"); } } console.log("end of injecting"); }

$('.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);

}); function relativeCoords() {

   console.log("what what");
   var img = document.getElementById("projectScheme");
   var c1 = [74, 132, 136, 217, 241, 225, 319, 175, 365, 89, 298, 42, 152, 62];
   var c2 =  [387, 125, 393, 283, 423, 316, 518, 190, 486, 120];
   var c3 = [528, 77, 497, 134, 537, 173, 672, 185, 739, 145, 733, 94, 694, 71];
   var c4 = [393, 283, 423, 316, 454, 300, 474, 260, 537, 273, 494, 305, 678, 285, 697, 243, 788, 239, 788, 330, 383, 374, 343, 319];
   for(i = 0; i < c1.length; i++) {
       c1[i] = (c1[i]/(800.0)*img.clientWidth);
   }
   document.getElementById("area1").coords = c1.toString();
   for(i = 0; i < c2.length; i++) {
       c2[i] = (c2[i]/(800.0)*img.clientWidth);
   }
   document.getElementById("area2").coords = c2.toString();
   for(i = 0; i < c3.length; i++) {
       c3[i] = (c3[i]/(800.0)*img.clientWidth);
   }
   document.getElementById("area3").coords = c3.toString();
   for(i = 0; i < c4.length; i++) {
       c4[i] = (c4[i]/(800.0)*img.clientWidth);
   }
   document.getElementById("area4").coords = c4.toString();

}

function relativeCoordsStar() {

   var img = document.getElementById("starScheme");

var c1 = [254, 239, 194, 163, 225, 51, 319, 163]; var c2 = [260, 242, 323, 170, 452, 193, 363, 288]; var c3 = [260, 249, 362, 295, 389, 433, 260, 369]; var c4 = [252, 246, 252, 369, 131, 426, 150, 294]; var c5 = [250, 242, 147, 288, 55, 192, 187, 169];

   for(i = 0; i < c1.length; i++) {
       c1[i] = (c1[i]/(515.0)*img.clientWidth);
   }
   document.getElementById("patients").coords = c1.toString();
   for(i = 0; i < c2.length; i++) {
       c2[i] = (c2[i]/(515.0)*img.clientWidth);
   }
   document.getElementById("scientists").coords = c2.toString();
   for(i = 0; i < c3.length; i++) {
       c3[i] = (c3[i]/(515.0)*img.clientWidth);
   }
   document.getElementById("iGEMers").coords = c3.toString();
   for(i = 0; i < c4.length; i++) {
       c4[i] = (c4[i]/(515.0)*img.clientWidth);
   }
   document.getElementById("researches").coords = c4.toString();
   for(i = 0; i < c5.length; i++) {
       c5[i] = (c5[i]/(515.0)*img.clientWidth);
   }
   document.getElementById("doctors").coords = c5.toString();	

}