Team:HokkaidoU Japan/JS

From 2014.igem.org

(Difference between revisions)
(Blanked the page)
Line 1: Line 1:
 +
<html>
 +
<script type="text/javascript">
 +
(function() {
 +
  $(function() {
 +
    return $('#menubar.left-menu ul li:last-child').css('color', '');
 +
  });
 +
 +
}).call(this);
 +
 +
/*
 +
* DC Mega Menu - jQuery mega menu
 +
* Copyright (c) 2011 Design Chemical
 +
*
 +
*/
 +
(function($){
 +
 +
  //define the defaults for the plugin and how to call it
 +
  $.fn.dcMegaMenu = function(options){
 +
    //set default options
 +
    var defaults = {
 +
      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(){}
 +
    };
 +
 +
    //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'};
 +
 +
                params = {left: 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 {
 +
              $(this).addClass('dc-nonmega-li');
 +
              $('.'+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() {
 +
  $(function() {
 +
    $('#header-menu').dcMegaMenu({
 +
      rowItems: '5',
 +
      speed: 'fast',
 +
      effect: 'fade'
 +
    });
 +
    return $('#header-menu .dc-nonmega-li .sub-container').css('left', 0);
 +
  });
 +
 +
}).call(this);
 +
 +
 +
</script>
 +
</html>

Revision as of 05:28, 20 August 2014

Retrieved from "http://2014.igem.org/Team:HokkaidoU_Japan/JS"