Difference between revisions of "Template:Groningen/index js"

Line 339: Line 339:
  
 
function buildToc(toc, cnt){
 
function buildToc(toc, cnt){
−
var elm = cnt.append('<p><a href="#'+toc.id+'">'+toc.title+'</a></p>'),
+
var elm = cnt.append('<p class="toc-title"><a href="#'+toc.id+'">'+toc.title+'</a></p>'),
−
ul = $('<ul class="toc"></ul>');
+
ul = $('<ul class="toc-ul"></ul>');
 
 
 
console.log('buildToc', toc, cnt);
 
console.log('buildToc', toc, cnt);
Line 347: Line 347:
 
toc.children.forEach(function(child){
 
toc.children.forEach(function(child){
 
console.log('tocChild', child);
 
console.log('tocChild', child);
−
ul.append(buildToc(child, $('<li></li>')));
+
ul.append(buildToc(child, $('<li class="toc-li"></li>')));
 
});
 
});
 
elm.append(ul);
 
elm.append(ul);

Revision as of 13:45, 19 October 2016

function menuClickers(){ var menuItems = $("#content-header .menu-item");

$(".menu-item img,.menu-title").click(function(evt){ var item = $(this).parents('.menu-item').first(); if(!item.hasClass('hover')){ menuItems.removeClass('hover'); } item.toggleClass('hover');

evt.stopPropagation(); });

$(document).click(function(){ menuItems.removeClass('hover'); }); }

function updateCollapseAll(){ var img = $('#collapse-all img').first();

if(collapsers.open){ img.attr('src', 'https://static.igem.org/mediawiki/2016/7/77/T--Groningen--minux.png'); }else{ img.attr('src', 'https://static.igem.org/mediawiki/2016/f/fa/T--Groningen--plus.png'); } }

function hideOne(h, sec){ if(!sec.hasClass('hide')){ collapsers.open--; } sec.addClass('hide'); h.addClass('collapsed');

updateCollapseAll(); }

function showOne(h, sec, rec){ var id = h.attr('id');

if(sec.hasClass('hide')){ collapsers.open++; }

sec.removeClass('hide'); h.removeClass('collapsed'); updateCollapseAll();

if(!rec){ if(id && id.substr(0, 'collapser-'.length) !== 'collapser-'){ window.location.hash = '#'+id; }

sec.parents('.collapser-sec').each(function(){ var sec = $(this), h = $('#'+sec.attr('id').substr('sec-'.length));

showOne(h, sec, true); }); } }

function collapsers(hlvl){ var secs = $('.collapse'+ (hlvl ? '-' + hlvl : ));

function toggleOne(h, sec){ if(sec.hasClass('hide')){ showOne(h, sec); }else{ hideOne(h, sec); } }

secs.each(function(idx, sec){ sec = $(sec);

if(sec.hasClass('collapse-conditional')){ var id = sec.attr('id'); if(id){ if(collapsers.allow.indexOf(id) === -1){ return; } }else if(!collapsers.allowConditional){ return; } }

var h = sec.find(hlvl || 'h3').first(), hid = h.attr('id'), secid = sec.attr('id'), id;

if(hid){ if(!secid){ secid = 'sec-'+hid; sec.attr('id', secid); id = hid; } }else if(secid){ hid = secid; secid = 'sec-'+hid; h.attr('id', hid); sec.attr('id', secid); id = hid; }else{ id = 'collapser-'+(collapsers.nextId++); secid = 'sec-'+id; sec.attr('id', secid); hid = id; h.attr('id', hid); }

if(id !== hid){ console.log(id, hid, secid); }

h.insertBefore(sec); h.click(function(evt){ toggleOne(h, sec); }); h.addClass('collapser'); sec.addClass('collapser-sec'); collapsers.all.push({sec: sec, h: h});

hideOne(h, sec); }); } collapsers.open = 0; collapsers.openedOne = false; collapsers.allowConditional = false; collapsers.allow = []; collapsers.all = []; collapsers.nextId = 0;

function postcollapse(){ function toggleAll(evt){ evt.preventDefault();

var open = collapsers.open;

collapsers.all.forEach(function(act){ if(open){ hideOne(act.h, act.sec); }else{ showOne(act.h, act.sec, true); } });

return false; }

if(collapsers.all.length){ var wrap = $('#ayoop-wrap'), btn = $('<a id="collapse-all"><img src="T--Groningen--minux.png" title="Collapse all" alt="Collapse all" /></a>');

wrap.prepend(btn); btn.click(toggleAll); }

collapsers.open = 0;

if(window.location.hash.length > 1){ var h = $(window.location.hash), sec;

if(!h.length){ return; }

sec = $('#sec-'+h.attr('id'));

showOne(h, sec); } updateCollapseAll(); }

function memberate(){ var mems = /*{ eike: "T--Groningen--team-eike.png", bente: "T--Groningen--team-bente.png", daniel: "T--Groningen--team-daniel.jpg", sambit: "T--Groningen--team-sambit.jpg", luis: "T--Groningen--team-luis.jpg", matthia: "T--Groningen--team-matthia.jpg", mareike: "T--Groningen--team-mareike.jpg", bara: "T--Groningen--team-barbora.jpg", kathinka: "T--Groningen--team-kathinka.jpg", ilona: "T--Groningen--team-ilona.jpg", carlos: "T--Groningen--team-carlos.jpg", pj: "T--Groningen--team-pj.jpg", marco: "T--Groningen--team-agar-marco.jpg" }*/{ eike: "159px-T--Groningen--team-eike.png.jpeg", bente: "159px-T--Groningen--team-bente.png.jpeg", daniel: "159px-T--Groningen--team-daniel.jpg", sambit: "159px-T--Groningen--team-sambit.jpg", luis: "159px-T--Groningen--team-luis.jpg", matthia: "159px-T--Groningen--team-matthia.jpg", mareike: "159px-T--Groningen--team-mareike.jpg", bara: "159px-T--Groningen--team-barbora.jpg", kathinka: "159px-T--Groningen--team-kathinka.jpg", ilona: "159px-T--Groningen--team-ilona.jpg", carlos: "159px-T--Groningen--team-carlos.jpg", pj: "159px-T--Groningen--team-pj.jpg", marco: "159px-T--Groningen--team-marco.jpg" }, mem = window.location.hash, elm = $('#memberate');

if(!mem || mem.length < 2){ return; }

mem = mem.substr(1);

if(!mems.hasOwnProperty(mem)){ return; } console.log(mem);

if(!elm || !elm.length){ elm = $('<img style="max-width: 100px; max-height: 100px; position: fixed; bottom: 0; left: 0; opacity: 0.1; z-index: 2" onmouseover="this.style.opacity=0.9;" onmouseout="this.style.opacity=0.1;" id="memberate" />'); elm.appendTo('#content_wrapper'); }

elm.attr('src', mems[mem]);

$('a').each(function(a){ var us = '/Team:Groningen'; if(this.pathname.substr(0, us.length) === us && (this.hash === '#' || this.hash === )){ this.hash = '#' + mem; } }); }

// Source: http://www.simonbattersby.com/blog/simple-jquery-image-crossfade/ function cyclers(){ var cycs = $('.cycler');

function cycleImages(idx, cyc){ cyc = $(cyc);

if(!cyc.data('done')){ return; }

var imgs = cyc.find('img:not(.base)'), active = imgs.siblings('.active'), next = active.next();

if(!next.length){ next = imgs.first(); }

next.css('z-index',3); //move the next image up the pile active.fadeOut(1500, function(){ //fade out the top image active.removeClass('active').css('z-index', 2).show(); //reset the z-index and unhide the image next.css('z-index', 4).addClass('active'); //make the next image the top one }); }

function cycleAll(){ cycs.each(cycleImages); }

cycs.each(function(idx, cyc){ cyc = $(cyc); cyc.data('done', false); var imgs = cyc.find('img'), base = imgs.filter('.base'), backlog = imgs.length;

base.removeClass('active').clone().prependTo(cyc).css('visibility', 'hidden'); base.last().removeClass('base').addClass('active'); imgs.click(function(){ cycleImages(0, cyc); }).on('load', function(){ backlog--;

if(!backlog){ cyc.data('done', true); } });

/*var maxHt = cyc.height(); cyc.find('img').each(function(idx, img){ var ht = $(img).height(); maxHt = ht > maxHt ? ht : maxHt; }); cyc.height(maxHt);*/ });

if(cycs && cycs.length){ setInterval(cycleAll, 5000); } }

function ayOop(){ var oop = $('#ayoop'), head = $('#content-header'), headOff = head.offset().top + head.height();

function toggle(){ if($(window).scrollTop() >= headOff){ oop.show(); }else{ oop.hide(); } if(window.location.hash === '#top'){ window.location.replace('#'); } }

$(document).scroll(toggle); toggle(); }

function fixify(){ var fix = $('.fix'); if(!fix || !fix.length){ return; } var off = fix.offset(), topMenu = $('#top_menu_14').height();

$(document).scroll(function(){ if($(window).scrollTop() >= off.top){ fix.removeClass('static').addClass('fixed'); fix.width(fix.parent().width()); fix.css('top', topMenu); }else{ fix.removeClass('fixed').addClass('static'); fix.width(fix.parent().width()); //guide.css } }); }

function fixTitle(){ var firstH2 = $('h2').first()[0], suff = 'CryptoGErM - iGEM Groningen 2016'; document.title = (firstH2 ? firstH2.innerText + ' - ' : ) + suff }

function buildToc(toc, cnt){

var elm = cnt.append('

<a href="#'+toc.id+'">'+toc.title+'</a>

'), ul = $('
    ');

    console.log('buildToc', toc, cnt);

    if(toc.children){ toc.children.forEach(function(child){ console.log('tocChild', child);

    ul.append(buildToc(child, $('
  • ')));

    }); elm.append(ul); } return elm; }

    function makeToc(){ var tocElm = $('#tocgerm'); if(!tocElm || !tocElm.length){ return; } var h2s = $('h2'), toc = [], count = 0;

    h2s.each(function(){ var cont = $(this).parents('article').first(), h3s = cont.find('h3'), cot = [];

    if(!this.id){ this.id = 'h2-'+(count++); }

    h3s.each(function(){ if(!this.id){ this.id = 'h3-'+(count++); } cot.push({id: this.id, title: this.innerText}); });

    toc.push({id: this.id, title: this.innerText, children: cot}); });

    if(!toc.length){ return; }

    console.log(toc);

    var elm = buildToc({id: 'the-toc', title: 'Contents', children: toc}, tocElm); return tocElm.append(elm); }

    $(document).ready(function(){ menuClickers(); collapsers(); collapsers('h2'); collapsers('h3'); collapsers('h4'); postcollapse(); memberate(); cyclers(); ayOop(); fixify(); fixTitle(); makeToc(); });

    window.onhashchange = memberate;