Template:Team:HokkaidoU Japan/header/js

From 2013.igem.org

(Difference between revisions)
 
(6 intermediate revisions not shown)
Line 1: Line 1:
-
(function($){
+
/*!
-
 
+
* hoverIntent r7 // 2013.03.11 // jQuery 1.9.1+
-
//define the defaults for the plugin and how to call it
+
* http://cherne.net/brian/resources/jquery.hoverIntent.html
-
$.fn.dcMegaMenu = function(options){
+
*
-
//set default options 
+
* You may use hoverIntent under the terms of the MIT license. Basically that
-
var defaults = {
+
* means you are free to use hoverIntent as long as this header is left intact.
-
classParent: 'dc-mega',
+
* Copyright 2007, 2013 Brian Cherne
-
classContainer: 'sub-container',
+
*/
-
classSubParent: 'mega-hdr',
+
(function(a){a.fn.hoverIntent=function(m,d,h){var j={interval:100,sensitivity:7,timeout:0};if(typeof m==="object"){j=a.extend(j,m)}else{if(a.isFunction(d)){j=a.extend(j,{over:m,out:d,selector:h})}else{j=a.extend(j,{over:m,out:m,selector:d})}}var l,k,g,f;var e=function(n){l=n.pageX;k=n.pageY};var c=function(o,n){n.hoverIntent_t=clearTimeout(n.hoverIntent_t);if((Math.abs(g-l)+Math.abs(f-k))<j.sensitivity){a(n).off("mousemove.hoverIntent",e);n.hoverIntent_s=1;return j.over.apply(n,[o])}else{g=l;f=k;n.hoverIntent_t=setTimeout(function(){c(o,n)},j.interval)}};var i=function(o,n){n.hoverIntent_t=clearTimeout(n.hoverIntent_t);n.hoverIntent_s=0;return j.out.apply(n,[o])};var b=function(p){var o=jQuery.extend({},p);var n=this;if(n.hoverIntent_t){n.hoverIntent_t=clearTimeout(n.hoverIntent_t)}if(p.type=="mouseenter"){g=o.pageX;f=o.pageY;a(n).on("mousemove.hoverIntent",e);if(n.hoverIntent_s!=1){n.hoverIntent_t=setTimeout(function(){c(o,n)},j.interval)}}else{a(n).off("mousemove.hoverIntent",e);if(n.hoverIntent_s==1){n.hoverIntent_t=setTimeout(function(){i(o,n)},j.timeout)}}};return this.on({"mouseenter.hoverIntent":b,"mouseleave.hoverIntent":b},j.selector)}})(jQuery);(function(a){a.fn.dcMegaMenu=function(c){var d={classParent:"dc-mega",classContainer:"sub-container",classSubParent:"mega-hdr",classSubLink:"mega-hdr",classWidget:"dc-extra",rowItems:3,speed:"fast",effect:"fade",event:"hover",fullWidth:false,onLoad:function(){},beforeOpen:function(){},beforeClose:function(){}};var c=a.extend(d,c);var b=this;return b.each(function(p){var j=d.classSubParent;var o=d.classSubLink;var m=d.classParent;var n=d.classContainer;var k=d.classWidget;l();function i(){var q=a(".sub",this);a(this).addClass("mega-hover");if(d.effect=="fade"){a(q).fadeIn(d.speed)}if(d.effect=="slide"){a(q).show(d.speed)}d.beforeOpen.call(this)}function f(r){var q=a(".sub",r);a(r).addClass("mega-hover");if(d.effect=="fade"){a(q).fadeIn(d.speed)}if(d.effect=="slide"){a(q).show(d.speed)}d.beforeOpen.call(this)}function h(){var q=a(".sub",this);a(this).removeClass("mega-hover");a(q).hide();d.beforeClose.call(this)}function e(r){var q=a(".sub",r);a(r).removeClass("mega-hover");a(q).hide();d.beforeClose.call(this)}function g(){a("li",b).removeClass("mega-hover");a(".sub",b).hide()}function l(){$arrow='<span class="dc-mega-icon"></span>';var s=m+"-li";var r=b.outerWidth();a("> li",b).each(function(){var D=a("> ul",this);var u=a("> a",this);if(D.length){u.addClass(m).append($arrow);D.addClass("sub").wrap('<div class="'+n+'" />');var y=a(this).position();pl=y.left;if(a("ul",D).length){a(this).addClass(s);a("."+n,this).addClass("mega");a("> li",D).each(function(){if(!a(this).hasClass(k)){a(this).addClass("mega-unit");if(a("> ul",this).length){a(this).addClass(j);a("> a",this).addClass(j+"-a")}else{a(this).addClass(o);a("> a",this).addClass(o+"-a")}}});var v=a(".mega-unit",this);rowSize=parseInt(d.rowItems);for(var J=0;J<v.length;J+=rowSize){v.slice(J,J+rowSize).wrapAll('<div class="row" />')}D.show();var B=a(this).width();var H=pl+B;var G=r-H;var F=D.outerWidth();var E=D.parent("."+n).outerWidth();var C=E-F;if(d.fullWidth==true){var w=r-C;D.parent("."+n).css({width:w+"px"});b.addClass("full-width")}var x=a(".mega-unit",D).outerWidth(true);var I=a(".row:eq(0) .mega-unit",D).length;var z=x*I;var A=z+C;a(".row",this).each(function(){a(".mega-unit:last",this).addClass("last");var N=undefined;a(".mega-unit > a",this).each(function(){var O=parseInt(a(this).height());if(N===undefined||N<O){N=O}});a(".mega-unit > a",this).css("height",N+"px");a(this).css("width",z+"px")});if(d.fullWidth==true){M={left:0}}else{var K=G<K?K+K-G:(A-B)/2;var L=pl-K;var M={left:pl+"px",marginLeft:-K+"px"};M={left:0}}a("."+n,this).css(M);a(".row",D).each(function(){var N=a(this).height();a(".mega-unit",this).css({height:N+"px"});a(this).parent(".row").css({height:N+"px"})});D.hide()}else{a(this).addClass("dc-nonmega-li");a("."+n,this).addClass("non-mega").css("left",pl+"px")}}});var t=a("> li > a",b).outerHeight(true);a("."+n,b).css({top:t+"px"}).css("z-index","1000");if(d.event=="hover"){var q={sensitivity:2,interval:100,over:i,timeout:400,out:h};a("li",b).hoverIntent(q)}if(d.event=="click"){a("body").mouseup(function(u){if(!a(u.target).parents(".mega-hover").length){g()}});a("> li > a."+m,b).click(function(u){var v=a(this).parent();if(v.hasClass("mega-hover")){e(v)}else{f(v)}u.preventDefault()})}d.onLoad.call(this)}})}})(jQuery);(function(){$(function(){$("#header-menu").dcMegaMenu({rowItems:"5",speed:"fast",effect:"fade"});return $("#header-menu .dc-nonmega-li .sub-container").css("left",0)})}).call(this);(function(){$(function(){return $("#menubar.left-menu ul li:last-child").css("color","")})}).call(this);
-
classSubLink: 'mega-hdr',
+
-
classWidget: 'dc-extra',
+
-
rowItems: 3,
+
-
speed: 'fast',
+
-
effect: 'fade',
+
-
event: 'hover',
+
-
fullWidth: false,
+
-
onLoad : function(){},
+
-
            beforeOpen : function(){},
+
-
beforeClose: function(){}
+
-
};
+
-
 
+
-
//call in the default otions
+
-
var options = $.extend(defaults, options);
+
-
var $dcMegaMenuObj = this;
+
-
 
+
-
//act upon the element that is passed into the design   
+
-
return $dcMegaMenuObj.each(function(options){
+
-
 
+
-
var clSubParent = defaults.classSubParent;
+
-
var clSubLink = defaults.classSubLink;
+
-
var clParent = defaults.classParent;
+
-
var clContainer = defaults.classContainer;
+
-
var clWidget = defaults.classWidget;
+
-
+
-
megaSetup();
+
-
+
-
function megaOver(){
+
-
var subNav = $('.sub',this);
+
-
$(this).addClass('mega-hover');
+
-
if(defaults.effect == 'fade'){
+
-
$(subNav).fadeIn(defaults.speed);
+
-
}
+
-
if(defaults.effect == 'slide'){
+
-
$(subNav).show(defaults.speed);
+
-
}
+
-
// beforeOpen callback;
+
-
defaults.beforeOpen.call(this);
+
-
}
+
-
function megaAction(obj){
+
-
var subNav = $('.sub',obj);
+
-
$(obj).addClass('mega-hover');
+
-
if(defaults.effect == 'fade'){
+
-
$(subNav).fadeIn(defaults.speed);
+
-
}
+
-
if(defaults.effect == 'slide'){
+
-
$(subNav).show(defaults.speed);
+
-
}
+
-
// beforeOpen callback;
+
-
defaults.beforeOpen.call(this);
+
-
}
+
-
function megaOut(){
+
-
var subNav = $('.sub',this);
+
-
$(this).removeClass('mega-hover');
+
-
$(subNav).hide();
+
-
// beforeClose callback;
+
-
defaults.beforeClose.call(this);
+
-
}
+
-
function megaActionClose(obj){
+
-
var subNav = $('.sub',obj);
+
-
$(obj).removeClass('mega-hover');
+
-
$(subNav).hide();
+
-
// beforeClose callback;
+
-
defaults.beforeClose.call(this);
+
-
}
+
-
function megaReset(){
+
-
$('li',$dcMegaMenuObj).removeClass('mega-hover');
+
-
$('.sub',$dcMegaMenuObj).hide();
+
-
}
+
-
 
+
-
function megaSetup(){
+
-
$arrow = '<span class="dc-mega-icon"></span>';
+
-
var clParentLi = clParent+'-li';
+
-
var menuWidth = $dcMegaMenuObj.outerWidth();
+
-
$('> li',$dcMegaMenuObj).each(function(){
+
-
//Set Width of sub
+
-
var $mainSub = $('> ul',this);
+
-
var $primaryLink = $('> a',this);
+
-
if($mainSub.length){
+
-
$primaryLink.addClass(clParent).append($arrow);
+
-
$mainSub.addClass('sub').wrap('<div class="'+clContainer+'" />');
+
-
+
-
var pos = $(this).position();
+
-
pl = pos.left;
+
-
+
-
if($('ul',$mainSub).length){
+
-
$(this).addClass(clParentLi);
+
-
$('.'+clContainer,this).addClass('mega');
+
-
$('> li',$mainSub).each(function(){
+
-
if(!$(this).hasClass(clWidget)){
+
-
$(this).addClass('mega-unit');
+
-
if($('> ul',this).length){
+
-
$(this).addClass(clSubParent);
+
-
$('> a',this).addClass(clSubParent+'-a');
+
-
} else {
+
-
$(this).addClass(clSubLink);
+
-
$('> a',this).addClass(clSubLink+'-a');
+
-
}
+
-
}
+
-
});
+
-
 
+
-
// Create Rows
+
-
var hdrs = $('.mega-unit',this);
+
-
rowSize = parseInt(defaults.rowItems);
+
-
for(var i = 0; i < hdrs.length; i+=rowSize){
+
-
hdrs.slice(i, i+rowSize).wrapAll('<div class="row" />');
+
-
}
+
-
 
+
-
// Get Sub Dimensions & Set Row Height
+
-
$mainSub.show();
+
-
+
-
// Get Position of Parent Item
+
-
var pw = $(this).width();
+
-
var pr = pl + pw;
+
-
+
-
// Check available right margin
+
-
var mr = menuWidth - pr;
+
-
+
-
// // Calc Width of Sub Menu
+
-
var subw = $mainSub.outerWidth();
+
-
var totw = $mainSub.parent('.'+clContainer).outerWidth();
+
-
var cpad = totw - subw;
+
-
+
-
if(defaults.fullWidth == true){
+
-
var fw = menuWidth - cpad;
+
-
$mainSub.parent('.'+clContainer).css({width: fw+'px'});
+
-
$dcMegaMenuObj.addClass('full-width');
+
-
}
+
-
var iw = $('.mega-unit',$mainSub).outerWidth(true);
+
-
var rowItems = $('.row:eq(0) .mega-unit',$mainSub).length;
+
-
var inneriw = iw * rowItems;
+
-
var totiw = inneriw + cpad;
+
-
+
-
// Set mega header height
+
-
$('.row',this).each(function(){
+
-
$('.mega-unit:last',this).addClass('last');
+
-
var maxValue = undefined;
+
-
$('.mega-unit > a',this).each(function(){
+
-
var val = parseInt($(this).height());
+
-
if (maxValue === undefined || maxValue < val){
+
-
maxValue = val;
+
-
}
+
-
});
+
-
$('.mega-unit > a',this).css('height',maxValue+'px');
+
-
$(this).css('width',inneriw+'px');
+
-
});
+
-
+
-
// Calc Required Left Margin incl additional required for right align
+
-
+
-
if(defaults.fullWidth == true){
+
-
params = {left: 0};
+
-
} else {
+
-
+
-
var ml = mr < ml ? ml + ml - mr : (totiw - pw)/2;
+
-
var subLeft = pl - ml;
+
-
 
+
-
// If Left Position Is Negative Set To Left Margin
+
-
var params = {left: pl+'px', marginLeft: -ml+'px'};
+
-
+
-
if(subLeft < 0){
+
-
params = {left: 0};
+
-
}else if(mr < ml){
+
-
params = {right: 0};
+
-
}
+
-
}
+
-
$('.'+clContainer,this).css(params);
+
-
+
-
// Calculate Row Height
+
-
$('.row',$mainSub).each(function(){
+
-
var rh = $(this).height();
+
-
$('.mega-unit',this).css({height: rh+'px'});
+
-
$(this).parent('.row').css({height: rh+'px'});
+
-
});
+
-
$mainSub.hide();
+
-
+
-
} else {
+
-
$('.'+clContainer,this).addClass('non-mega').css('left',pl+'px');
+
-
}
+
-
}
+
-
});
+
-
// Set position of mega dropdown to bottom of main menu
+
-
var menuHeight = $('> li > a',$dcMegaMenuObj).outerHeight(true);
+
-
$('.'+clContainer,$dcMegaMenuObj).css({top: menuHeight+'px'}).css('z-index','1000');
+
-
+
-
if(defaults.event == 'hover'){
+
-
// HoverIntent Configuration
+
-
var config = {
+
-
sensitivity: 2,
+
-
interval: 100,
+
-
over: megaOver,
+
-
timeout: 400,
+
-
out: megaOut
+
-
};
+
-
$('li',$dcMegaMenuObj).hoverIntent(config);
+
-
}
+
-
+
-
if(defaults.event == 'click'){
+
-
+
-
$('body').mouseup(function(e){
+
-
if(!$(e.target).parents('.mega-hover').length){
+
-
megaReset();
+
-
}
+
-
});
+
-
 
+
-
$('> li > a.'+clParent,$dcMegaMenuObj).click(function(e){
+
-
var $parentLi = $(this).parent();
+
-
if($parentLi.hasClass('mega-hover')){
+
-
megaActionClose($parentLi);
+
-
} else {
+
-
megaAction($parentLi);
+
-
}
+
-
e.preventDefault();
+
-
});
+
-
}
+
-
+
-
// onLoad callback;
+
-
defaults.onLoad.call(this);
+
-
}
+
-
});
+
-
};
+
-
})(jQuery);(function() {
+
-
  $('#header-menu').dcMegaMenu({
+
-
    rowItems: '5',
+
-
    speed: 'fast',
+
-
    effect: 'fade'
+
-
  });
+
-
 
+
-
}).call(this);
+
-
(function() {
+
-
  $('<div id="wiki-menu">').appendTo('#top-section');
+
-
 
+
-
  $('<div id="open-wiki-menu">').appendTo('#top-section').text('Wiki Menu');
+
-
 
+
-
  $('<h2>').appendTo('#wiki-menu').text('Page Menu');
+
-
 
+
-
  $('.left-menu').appendTo('#wiki-menu');
+
-
 
+
-
  $('<h2>').appendTo('#wiki-menu').text('User Menu');
+
-
 
+
-
  $('.right-menu').appendTo('#wiki-menu');
+
-
 
+
-
  $('<div id="close-wiki-menu">').appendTo('#wiki-menu').text('Close');
+
-
 
+
-
  $('#open-wiki-menu').click(function() {
+
-
    $(this).hide();
+
-
    return $('#wiki-menu').show();
+
-
  });
+
-
 
+
-
  $('#close-wiki-menu').click(function() {
+
-
    $('#wiki-menu').hide();
+
-
    return $('#open-wiki-menu').show();
+
-
  });
+
-
 
+
-
}).call(this);
+

Latest revision as of 07:54, 22 September 2013

/*! 

* hoverIntent r7 // 2013.03.11 // jQuery 1.9.1+
* http://cherne.net/brian/resources/jquery.hoverIntent.html
*
* You may use hoverIntent under the terms of the MIT license. Basically that
* means you are free to use hoverIntent as long as this header is left intact.
* Copyright 2007, 2013 Brian Cherne
*/

(function(a){a.fn.hoverIntent=function(m,d,h){var j={interval:100,sensitivity:7,timeout:0};if(typeof m==="object"){j=a.extend(j,m)}else{if(a.isFunction(d)){j=a.extend(j,{over:m,out:d,selector:h})}else{j=a.extend(j,{over:m,out:m,selector:d})}}var l,k,g,f;var e=function(n){l=n.pageX;k=n.pageY};var c=function(o,n){n.hoverIntent_t=clearTimeout(n.hoverIntent_t);if((Math.abs(g-l)+Math.abs(f-k))<j.sensitivity){a(n).off("mousemove.hoverIntent",e);n.hoverIntent_s=1;return j.over.apply(n,[o])}else{g=l;f=k;n.hoverIntent_t=setTimeout(function(){c(o,n)},j.interval)}};var i=function(o,n){n.hoverIntent_t=clearTimeout(n.hoverIntent_t);n.hoverIntent_s=0;return j.out.apply(n,[o])};var b=function(p){var o=jQuery.extend({},p);var n=this;if(n.hoverIntent_t){n.hoverIntent_t=clearTimeout(n.hoverIntent_t)}if(p.type=="mouseenter"){g=o.pageX;f=o.pageY;a(n).on("mousemove.hoverIntent",e);if(n.hoverIntent_s!=1){n.hoverIntent_t=setTimeout(function(){c(o,n)},j.interval)}}else{a(n).off("mousemove.hoverIntent",e);if(n.hoverIntent_s==1){n.hoverIntent_t=setTimeout(function(){i(o,n)},j.timeout)}}};return this.on({"mouseenter.hoverIntent":b,"mouseleave.hoverIntent":b},j.selector)}})(jQuery);(function(a){a.fn.dcMegaMenu=function(c){var d={classParent:"dc-mega",classContainer:"sub-container",classSubParent:"mega-hdr",classSubLink:"mega-hdr",classWidget:"dc-extra",rowItems:3,speed:"fast",effect:"fade",event:"hover",fullWidth:false,onLoad:function(){},beforeOpen:function(){},beforeClose:function(){}};var c=a.extend(d,c);var b=this;return b.each(function(p){var j=d.classSubParent;var o=d.classSubLink;var m=d.classParent;var n=d.classContainer;var k=d.classWidget;l();function i(){var q=a(".sub",this);a(this).addClass("mega-hover");if(d.effect=="fade"){a(q).fadeIn(d.speed)}if(d.effect=="slide"){a(q).show(d.speed)}d.beforeOpen.call(this)}function f(r){var q=a(".sub",r);a(r).addClass("mega-hover");if(d.effect=="fade"){a(q).fadeIn(d.speed)}if(d.effect=="slide"){a(q).show(d.speed)}d.beforeOpen.call(this)}function h(){var q=a(".sub",this);a(this).removeClass("mega-hover");a(q).hide();d.beforeClose.call(this)}function e(r){var q=a(".sub",r);a(r).removeClass("mega-hover");a(q).hide();d.beforeClose.call(this)}function g(){a("li",b).removeClass("mega-hover");a(".sub",b).hide()}function l(){$arrow='';var s=m+"-li";var r=b.outerWidth();a("> li",b).each(function(){var D=a("> ul",this);var u=a("> a",this);if(D.length){u.addClass(m).append($arrow);D.addClass("sub").wrap('<div class="'+n+'" />');var y=a(this).position();pl=y.left;if(a("ul",D).length){a(this).addClass(s);a("."+n,this).addClass("mega");a("> li",D).each(function(){if(!a(this).hasClass(k)){a(this).addClass("mega-unit");if(a("> ul",this).length){a(this).addClass(j);a("> a",this).addClass(j+"-a")}else{a(this).addClass(o);a("> a",this).addClass(o+"-a")}}});var v=a(".mega-unit",this);rowSize=parseInt(d.rowItems);for(var J=0;J<v.length;J+=rowSize){v.slice(J,J+rowSize).wrapAll('<div class="row" />')}D.show();var B=a(this).width();var H=pl+B;var G=r-H;var F=D.outerWidth();var E=D.parent("."+n).outerWidth();var C=E-F;if(d.fullWidth==true){var w=r-C;D.parent("."+n).css({width:w+"px"});b.addClass("full-width")}var x=a(".mega-unit",D).outerWidth(true);var I=a(".row:eq(0) .mega-unit",D).length;var z=x*I;var A=z+C;a(".row",this).each(function(){a(".mega-unit:last",this).addClass("last");var N=undefined;a(".mega-unit > a",this).each(function(){var O=parseInt(a(this).height());if(N===undefined||N<O){N=O}});a(".mega-unit > a",this).css("height",N+"px");a(this).css("width",z+"px")});if(d.fullWidth==true){M={left:0}}else{var K=G<K?K+K-G:(A-B)/2;var L=pl-K;var M={left:pl+"px",marginLeft:-K+"px"};M={left:0}}a("."+n,this).css(M);a(".row",D).each(function(){var N=a(this).height();a(".mega-unit",this).css({height:N+"px"});a(this).parent(".row").css({height:N+"px"})});D.hide()}else{a(this).addClass("dc-nonmega-li");a("."+n,this).addClass("non-mega").css("left",pl+"px")}}});var t=a("> li > a",b).outerHeight(true);a("."+n,b).css({top:t+"px"}).css("z-index","1000");if(d.event=="hover"){var q={sensitivity:2,interval:100,over:i,timeout:400,out:h};a("li",b).hoverIntent(q)}if(d.event=="click"){a("body").mouseup(function(u){if(!a(u.target).parents(".mega-hover").length){g()}});a("> li > a."+m,b).click(function(u){var v=a(this).parent();if(v.hasClass("mega-hover")){e(v)}else{f(v)}u.preventDefault()})}d.onLoad.call(this)}})}})(jQuery);(function(){$(function(){$("#header-menu").dcMegaMenu({rowItems:"5",speed:"fast",effect:"fade"});return $("#header-menu .dc-nonmega-li .sub-container").css("left",0)})}).call(this);(function(){$(function(){return $("#menubar.left-menu ul li:last-child").css("color","")})}).call(this);

Retrieved from "http://2013.igem.org/Template:Team:HokkaidoU_Japan/header/js"