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

(Undo revision 244046 by Zigapusnik (talk))
Line 1: Line 1:
−
/* from docs.css */
+
function reloader() {
−
#example .main.container .introduction p,
+
    try {
−
#example .main.container .example p,
+
        console.log('start');
−
#example .main.container p {
+
        $('.ui.sticky.global').sticky({
−
    font-size: 16px;
+
            context: '#context',
−
    line-height: 1.5;
+
            offset: 16
−
    color: rgba(0, 0, 0, 0.8);
+
        });
−
}
+
        $('.ui.sticky.image').sticky({
 +
            context: '#context',
 +
            offset: 21
 +
        });
 +
        $('.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();
  
−
#example .main.container .examples h2,
+
            var elemTop = $(elem).offset().top;
−
#example .main.container h2,
+
            var elemBottom = elemTop + $(elem).height();
−
#example .main.container .tab > h2 {
+
−
    position: relative;
+
−
    margin: 5rem 0 3rem;
+
−
}
+
  
−
#example .main.container .examples > .rail + h2,
+
            if (elemTop >= docViewTop) {
−
#example .main.container > .rail + h2,
+
                return true;
−
#example .main.container > .tab > .rail + h2,
+
            }
−
#example .main.container0 .examples h2:first-child,
+
            else if (elemBottom >= docViewBottom) {
−
#example .main.container h2:first-child,
+
                return true;
−
#example .main.container > .tab > h2:first-child {
+
            }
−
    margin-top: 0;
+
            return false; // || elemTop >= docViewTop) ;
−
}
+
        }
  
−
#example > .pusher > .full.height {
+
        function clearStyleOfSideMenu() {
−
    display: -webkit-box;
+
console.log("calling a function");
−
    display: -webkit-flex;
+
            var id = null;
−
    display: -ms-flexbox;
+
            $("span.section").each(function () {
−
    display: flex;
+
                var id = this.id;
−
    -webkit-flex-direction: row;
+
console.log(id);
−
    -ms-flex-direction: row;
+
                var selector = 'a[href*="#'.concat(id).concat('"]');
−
    flex-direction: row;
+
                $(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) {
  
−
#example .full.height > .banana {
+
console.log("section is found");
−
    position: relative;
+
color = false;
−
    z-index: 1;
+
return false; //break from function
−
    background-color: #1b1c1d;
+
}
−
    width: 200px;
+
                }
−
    -webkit-box-flex: 0;
+
            });*/
−
    -webkit-flex: 0 0 auto;
+
        }
−
    -ms-flex: 0 0 auto;
+
−
    flex: 0 0 auto;
+
−
    padding-left: 50px;
+
−
}
+
−
 
+
−
#example .article {
+
−
    -webkit-box-flex: 1;
+
−
    -webkit-flex: 1 1 auto;
+
−
    -ms-flex: 1 1 auto;
+
−
    flex: 1 1 auto;
+
−
    min-width: 0;
+
−
}
+
−
 
+
−
#example .main.container {
+
−
    padding: 100px 0 7em;
+
−
}
+
−
 
+
−
/* Defaults */
+
−
/*#example .masthead > .container,*/
+
−
#example .main.container {
+
−
/*#example .fixed.menu > .container {*/
+
−
    margin-left: 3em !important;
+
−
    margin-right: 3em !important;
+
−
    width: auto !important;
+
−
    max-width: 960px !important;
+
−
}
+
−
 
+
−
/*#example .masthead > .container {*/
+
−
/*margin-right: 387px !important;*/
+
−
/*}*/
+
−
#example .main.container {
+
−
    /*margin-right: 387px !important;*/
+
−
    margin-right: 20% !important;
+
−
}
+
  
−
/* Remove Fixed Sidebar */
+
        $(document).ready(function () {
−
@media only screen and (max-width: 1144px) {
+
                clearStyleOfSideMenu();
−
    /* Hide Fixed Sidebar */
+
                $(window).scroll(function () {
−
    #example .full.height > .banana {
+
                    clearStyleOfSideMenu();
−
         display: none;
+
                });
 +
            }
 +
        );
 +
        $(".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;
  
−
/* Remove Rail */
+
    var matches = document.body.querySelectorAll(object + '[data-ref]');
−
@media only screen and (max-width: 992px) {
+
     while (number < matches.length) {
−
     /* Fluid Containers */
+
        var refName = matches[number].dataset.ref;
−
    #example .masthead > .container,
+
        if (refName in numberPairs) {
−
    #example .main.container,
+
            console.log(refName, "This label has already been assigned.");
−
    #example .fixed.menu > .container {
+
         } else {
−
         margin-left: 1em !important;
+
            numberPairs[number + 1] = matches[number];
−
        margin-right: 1em !important;
+
            objectPairs[refName] = number + 1;
−
         max-width: none !important;
+
         }
 +
        number++;
 
     }
 
     }
 +
    return [numberPairs, objectPairs, number];
 
}
 
}
  
−
/* end of docs*/
+
function enumerate() {
 +
    var tables = enumerateKeys('table');
 +
    var figures = enumerateKeys('figure');
  
−
/* override default */
+
     var maximum = Math.max(tables[2], figures[2]);
−
#content {
+
−
     width: 100%;
+
−
    background-color: transparent;
+
−
    margin-left: 0;
+
−
    padding-left: 0;
+
−
}
+
  
−
#contentSub, #firstHeading, #column-one, #footer {
+
    for (var number = 1; number <= maximum; number++) {
−
    display: none;
+
        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 + ": ")
 +
        }
 +
    }
  
−
#firstHeading, #content {
+
    $(this).find('ref').each(function () {
−
    margin-top: 0 !important;
+
        var label = $(this).text();
−
     padding-top: 0 !important;
+
        $(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);
  
−
#bodyContent {
+
function resize(img) {
−
     margin-left: 0;
+
     if (img.className.includes("medium")) {
−
     padding-left: 0;
+
        img.className = "ui huge image";
 +
     }
 +
    else {
 +
        img.className = "ui medium image";
 +
    }
 
}
 
}
  
−
body {
+
function setDefaultMenu() {
−
     /*padding-top: 14px;*/
+
console.log("calling set default item");
−
    background-color: #FCFCFC;
+
     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");
 +
                }
 +
            });
  
−
/* transparenten pravokotnik na levi in del za besedilo */
+
        }
−
#example:not(.site) > .pusher > .full.height {
+
    );
−
    background-color: transparent;
+
    $(".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");
 +
        }
 +
    });
  
−
/* pravokotnik na levi - sirina, ozadje.. */
+
    var submenuText = document.getElementById("SecondarySubmenu");
−
#example .full.height > .banana {
+
     defaultItem = document.getElementById(defaultItem);
−
     width: 25%;
+
     parent.attr("class", "ui simple active item menuItem");
−
     background-color: transparent;
+
     submenuText.innerHTML = defaultItem.innerHTML;
−
     padding-top: 12px;
+
 
}
 
}
  
−
/* menus */
+
function clearElements() {
−
#projectSubmenu, #partsSubmenu, #notebookSubmenu, #notebookSubmenu, #societySubmenu, #ideaSubmenu, #homeSubmenu, #dryLabSubmenu, #teamSubmenu, #proteaseSignallingSubmenu, #mechanosensingSubmenu, #implementationSubmenu {
+
     var elements = document.getElementsByClassName("menuItem");
−
     display: none;
+
     for (var i = 0; i < elements.length; i++) {
−
}
+
         elements[i].className = "ui simple item menuItem";
−
 
+
     }
−
#menucomb {
+
−
    background-color: #FCFCFC;
+
−
    padding-top: 12px;
+
−
    padding-bottom: 12px;
+
−
    margin-top: 0;
+
−
}
+
−
 
+
−
.ui.vertical.sticky.menu {
+
−
    font-size: 1rem;
+
−
    background-color: transparent;
+
−
    padding-top: 80px;
+
−
    margin-left: 10px; /*
+
−
    margin-right: auto;*/
+
−
}
+
−
 
+
−
/* end of menus */
+
−
 
+
−
h1 > span, h2 > span, h3 > span, h4 > span  {
+
−
  margin-top: -122px;        /* Size of fixed header */
+
−
  padding-bottom: 122px;
+
−
  display: block;
+
−
}
+
−
 
+
−
/* tabelite neka bidat na sredina */
+
−
.ui.table {
+
−
    margin: auto;
+
−
    width: 100%;
+
−
}
+
−
 
+
−
/*црна боја на менито */
+
−
.home:link, .home:visited, .home:active, .home:hover {
+
−
    color: black;
+
−
}
+
−
 
+
−
/* koga se namaluva ekranot ne sakame da gi skrsime zborovite */
+
−
/*h1, h2, h3, h4 {*/
+
−
/*!*white-space: nowrap;*!*/
+
−
    /*padding-top: 120px!important;*/
+
−
    /*margin-top: 0!important;*/
+
−
/*}*/
+
−
 
+
−
/* скриј го вертикалното мени доколку е екранот премногу мал и не изгледа убаво */
+
−
/*@media (max-width: 1350px) {*/
+
−
/*.ui.sticky.container {*/
+
−
/*display: none;*/
+
−
/*}*/
+
−
/*}*/
+
−
 
+
−
/*.menu {
+
−
     white-space: nowrap;
+
−
}*/
+
−
 
+
−
/* glavniot naslov neka ima edna crvena boja */
+
−
#context h1 {
+
−
    color: #8b2545
+
−
}
+
−
 
+
−
/* ostanatite naslovi neka bidat vo druga crvena */
+
−
#context h2 {
+
−
    color: #ab0000
+
−
}
+
−
 
+
−
/* naslovot na bibliografijata neka e vo treta boja */
+
−
#ref-title {
+
−
    color: #860000
+
−
}
+
−
 
+
−
caption, figcaption {
+
−
    caption-side: bottom;
+
−
    text-align: center
+
−
}
+
−
 
+
−
figure {
+
−
    display: block;
+
−
}
+
−
 
+
−
/* bibliography*/
+
−
x-ref sup > a, x-ref sup > a:visited, x-ref sup > a:hover, x-ref sup > a:active {
+
−
    color: grey;
+
−
}
+
−
 
+
−
.reference > a {
+
−
    color: black;
+
−
}
+
−
 
+
−
/* end of bibliography */
+
−
 
+
−
/* enumeration of tables and figures */
+
−
ref > a, ref > a:visited, ref > a:active, ref > a:hover {
+
−
    color: black;
+
−
}
+
−
 
+
−
/* team images */
+
−
.teamimg {
+
−
    overflow: hidden;
+
−
}
+
−
 
+
−
.hiddentext {
+
−
    position: absolute;
+
−
    max-width: 80%;
+
−
}
+
−
 
+
−
.image_div {
+
−
    position: relative;
+
−
    overflow: hidden;
+
−
    width: 50%;
+
−
    float: left;
+
−
}
+
−
 
+
−
.right img {
+
−
    position: relative;
+
−
    margin-left: -100%;
+
−
}
+
−
 
+
−
/* end of team images */
+
−
 
+
−
/* logo row */
+
−
footer .column > a {
+
−
    margin: auto;
+
−
    display: inline-block !important;
+
−
}
+
−
 
+
−
/* Calendar */
+
−
/*#calendarTable {
+
−
         position:relative;
+
−
        width: auto;
+
−
}*/
+
−
#calendarHead:hover {
+
−
    background-color: white;
+
−
    color: #DB2828;
+
−
    cursor: pointer;
+
−
    cursor: hand;
+
−
}
+
−
#right, #left, #tdays, #tmonth {
+
−
    text-align:center;
+
−
    background-color: #AFAFAF;
+
−
    color:white;
+
−
    font-weight: bold;
+
−
}
+
−
#calendarHead {
+
−
    text-align:center;
+
−
    font-weight: bold;
+
−
    color: white;
+
−
    background-color: #AFAFAF;
+
−
}
+
−
.week > td, .weekHighLight > td {
+
−
    margin: 0 auto;
+
−
     background-color: white; /* #AFAFAF; */
+
−
    text-align: right;
+
−
    vertical-align: top;
+
−
}
+
−
.weak {
+
−
    color:  #DB2828;
+
−
}
+
−
.week:hover > td, #right:hover, #left:hover, .weekHighLight > td {
+
−
    background-color: #DB2828;
+
−
    color: white;
+
−
    cursor: pointer;
+
−
    cursor: hand;
+
−
}
+
−
 
+
−
/* Images and resizing stuff */
+
−
figure {
+
−
  background-color: #fff;
+
−
  padding: 5px;
+
−
  font-size: .875em;
+
−
  display: table;
+
 
}
 
}
  
−
figure img {
+
function injectHeader() {
−
     display: block;
+
     console.log("Injecting header");
−
     width: 100%;
+
     var menu = "<div class='submenu' id='projectSubmenu'> \
 +
<div class='menu'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Description' \
 +
  class='item'>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> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Demonstrate' \
 +
  class='item'>Demonstration</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Proof' \
 +
  class='item'>Proof of Concept</a> \
 +
</div> \
 +
</div> \
 +
<div class='submenu' id='partsSubmenu'> \
 +
<div class='menu' style = 'position: absolute; right: 15%'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Basic_Part' \
 +
  class='item'>Basic Part</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Composite_Part' \
 +
  class='item'>Composite part</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Part_Collection' \
 +
  class='item'>Part Collection</a> \
 +
</div> \
 +
</div> \
 +
<div class='submenu' id='notebookSubmenu'> \
 +
<!-- this is notebook submenu --> \
 +
<div class='menu' style = 'position: absolute; right: 15%'>\
 +
<a href='https://2016.igem.org/Team:Slovenia/Notebook/Protocols' class='item'>Protocols</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Notebook/LogBook' class='item'>Log book</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Notebook/InitialProposals' class='item'>Initial proposals</a> \
 +
</div>\
 +
</div> \
 +
<div class='submenu' id='societySubmenu'> \
 +
<div class='menu' style = 'position: absolute; right: 0'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Engagement' \
 +
  class='item'>Education and Public Engagement</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Integrated_Practices' \
 +
  class='item'>Integrated Practices</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Collaborations' \
 +
  class='item'>Collaboration</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Safety' \
 +
  class='item'>Safety</a> \
 +
</div> \
 +
</div> \
 +
<div class='submenu' id='homeSubmenu'> \
 +
</div> \
 +
<div class='submenu' id='ideaSubmenu'> \
 +
<!-- this is idea submenu -->\
 +
<div class='menu'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Idea/Challenge' class='item'>Challenge</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Idea/Solution' class='item'>Solution</a> \
 +
</div>\
 +
</div> \
 +
<div class='submenu' id='mechanosensingSubmenu'> \
 +
<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/Mechanosensitive_channels' class='item'>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/CaDependent_mediator' class='item'>Ca-dependent mediator</a> \
 +
</div> \
 +
</div> \
 +
<div class='submenu' id='implementationSubmenu'> \
 +
<div class='menu' style = 'position: absolute; right: 50%'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Implementation/ProteaseInducible_secretion' class='item'>Protease inducible secretion</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Implementation/Impact' class='item'>Impact</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Implementation/Touch_painting' class='item'>Touch painting</a> \
 +
</div> \
 +
</div> \
 +
<div class='submenu' id='proteaseSignallingSubmenu'> \
 +
<div class='menu'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Protease_signalling/Overview' class='item'>Overview</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Protease_signalling/Reporters' class='item'>Reporters</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Protease_signalling/Orthogonality' class='item'>Orthogonality</a> \
 +
<a href='https://2016.igem.org/Team:SloveniaProtease_signalling/Split_proteases' class='item'>Split proteases</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Protease_signalling/Logic' class='item'>Logic</a> \
 +
</div> \
 +
</div> \
 +
<div  class='submenu' id='dryLabSubmenu'> \
 +
<div class='menu' style = 'position: absolute; right: 30%'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Software' class='item'>CaPTURE software</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Hardware' class='item'>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'>Modeling logic gates</a> \
 +
</div> \
 +
</div> \
 +
<div class='submenu' id='teamSubmenu'> \
 +
<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/Advisors' class='item'>Advisors</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Attributions' class='item'>Attributions</a> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Sponsors'  class='item'>Sponsors</a> \
 +
</div> \
 +
</div> \
 +
<div class='ui sticky global' id='menucomb'> \
 +
<div class='ui red secondary ten item pointing menu'> \
 +
<div class='ui simple item menuItem' id='home'> \
 +
<a href='https://2016.igem.org/Team:Slovenia' class='home'> \
 +
Home \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='idea'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Idea' class='home'> \
 +
Idea \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='mechanosensing'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Mechanosensing' class='home'> \
 +
Mechanosensing \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='proteaseSignalling'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Protease_signalling' class='home'> \
 +
Protease signaling\
 +
</a> \
 +
</div> \
 +
<!-- <div class='ui simple item menuItem' id='project'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Project' class='home'> \
 +
Project \
 +
</a> \
 +
</div> -->\
 +
<div class='ui simple item menuItem' id='dryLab'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Dry_lab' class='home'> \
 +
Dry lab \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='implementation'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Implementation' class='home'> \
 +
Implementation \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='parts' > \
 +
<a href='https://2016.igem.org/Team:Slovenia/Parts' class='home'> \
 +
Parts \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='notebook' > \
 +
<a href='https://2016.igem.org/Team:Slovenia/Notebook' class='home'> \
 +
Notebook \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='society'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Society' class='home'> \
 +
Society \
 +
</a> \
 +
</div> \
 +
<div class='ui simple item menuItem' id='team'> \
 +
<a href='https://2016.igem.org/Team:Slovenia/Team' class='home'> \
 +
Team \
 +
</a> \
 +
</div> \
 +
</div> \
 +
  \
 +
<div class='ui secondary menu' id='SecondarySubmenu'> \
 +
</div> \
 +
</div>";
 +
    var contextDiv = document.getElementById("context");
 +
    contextDiv.innerHTML = menu.concat(contextDiv.innerHTML);
 
}
 
}
  
−
figcaption {
+
$('.playGif').on('click', function () {
−
     display: table-caption;
+
     console.log("play detected");
−
     caption-side: bottom;
+
     var parent = $(this);
−
     background: #fff;
+
    var parAlt = parent.attr('data-alt');
−
     padding: 0 5px 5px;
+
     var parSrc = parent.attr('src');
−
}​
+
     parent.attr("src", parAlt).attr("data-alt", parSrc);
 +
});

Revision as of 21:36, 14 October 2016

function reloader() { 

   try {
       console.log('start');
       $('.ui.sticky.global').sticky({
           context: '#context',
           offset: 16
       });
       $('.ui.sticky.image').sticky({
           context: '#context',
           offset: 21
       });
       $('.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);

function resize(img) { 

   if (img.className.includes("medium")) {
       img.className = "ui huge image";
   }
   else {
       img.className = "ui medium image";
   }

}

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);

});