Synnefo

/*jslint unparam: true, browser: true, indent: 2 */

;(function ($, window, document, undefined) {

  'use strict';

  Foundation.libs.topbar = {

    name : 'topbar',

    version : '4.0.0',

    settings : {

      index : 0,

      stickyClass : 'sticky',

      custom_back_text: true,

      back_text: 'Back',

      init : false

    },

    init : function (scope, method, options) {

      var self = this;

      this.scope = scope || this.scope;

      if (typeof method === 'object') {

        $.extend(true, this.settings, method);

      }

      if (typeof method != 'string') {

        $('.top-bar').each(function () {

          self.settings.$w = $(window);

          self.settings.$topbar = $(this);

          self.settings.$section = self.settings.$topbar.find('section');

          self.settings.$titlebar = self.settings.$topbar.children('ul').first();

          self.settings.$topbar.data('index', 0);

          var breakpoint = $("<div class='top-bar-js-breakpoint'/>").insertAfter(self.settings.$topbar);

          self.settings.breakPoint = breakpoint.width();

          breakpoint.remove();

          self.assemble();

          if (self.settings.$topbar.parent().hasClass('fixed')) {

            $('body').css('padding-top', self.outerHeight(self.settings.$topbar));

          }

        });

        if (!self.settings.init) {

          this.events();

        }

        return this.settings.init;

      } else {

        // fire method

        return this[method].call(this, options);

      }

    },

    events : function () {

      var self = this;

      var offst = this.outerHeight($('.top-bar'));

      $(this.scope)

        .on('click.fndtn.topbar', '.top-bar .toggle-topbar', function (e) {

          var topbar = $(this).closest('.top-bar'),

              section = topbar.find('section, .section'),

              titlebar = topbar.children('ul').first();

          if (!topbar.data('height')) self.largestUL();

          e.preventDefault();

          if (self.breakpoint()) {

            topbar

              .toggleClass('expanded')

              .css('min-height', '');

          }

          if (!topbar.hasClass('expanded')) {

            section.css({left: '0%'});

            section.find('>.name').css({left: '100%'});

            section.find('li.moved').removeClass('moved');

            topbar.data('index', 0);

          }

          if (topbar.parent().hasClass('fixed')) {

            topbar.parent().removeClass('fixed');

            $('body').css('padding-top','0');

            window.scrollTo(0);

          } else if (topbar.hasClass('fixed expanded')) {

            topbar.parent().addClass('fixed');

            $('body').css('padding-top',offst);

          }

        })

        .on('click.fndtn.topbar', '.top-bar .has-dropdown>a', function (e) {

          var topbar = $(this).closest('.top-bar'),

              section = topbar.find('section, .section'),

              titlebar = topbar.children('ul').first();

          if (Modernizr.touch || self.breakpoint()) {

            e.preventDefault();

          }

          if (self.breakpoint()) {

            var $this = $(this),

                $selectedLi = $this.closest('li');

            topbar.data('index', topbar.data('index') + 1);

            $selectedLi.addClass('moved');

            section.css({left: -(100 * topbar.data('index')) + '%'});

            section.find('>.name').css({left: 100 * topbar.data('index') + '%'});

            $this.siblings('ul')

              .height(topbar.data('height') + self.outerHeight(titlebar, true));

            topbar

              .css('min-height', topbar.data('height') + self.outerHeight(titlebar, true) * 2)

          }

      });

      $(window).on('resize.fndtn.topbar', function () {

        if (!this.breakpoint()) {

          $('.top-bar').css('min-height', '');

        }

      }.bind(this));

      // Go up a level on Click

      $(this.scope).on('click.fndtn', '.top-bar .has-dropdown .back', function (e) {

        e.preventDefault();

        var $this = $(this),

            topbar = $this.closest('.top-bar'),

            section = topbar.find('section, .section'),

            $movedLi = $this.closest('li.moved'),

            $previousLevelUl = $movedLi.parent();

        topbar.data('index', topbar.data('index') - 1);

        section.css({left: -(100 * topbar.data('index')) + '%'});

        section.find('>.name').css({'left': 100 * topbar.data('index') + '%'});

        if (topbar.data('index') === 0) {

          topbar.css('min-height', 0);

        }

        setTimeout(function () {

          $movedLi.removeClass('moved');

        }, 300);

      });

    },

    breakpoint : function () {

      return $(window).width() <= this.settings.breakPoint || $('html').hasClass('lt-ie9');

    },

    assemble : function () {

      var self = this;

      // Pull element out of the DOM for manipulation

      this.settings.$section.detach();

      this.settings.$section.find('.has-dropdown>a').each(function () {

        var $link = $(this),

            $dropdown = $link.siblings('.dropdown'),

            $titleLi = $('<li class="title back js-generated"><h5><a href="#"></a></h5></li>');

        // Copy link to subnav

        if (self.settings.custom_back_text == true) {

          $titleLi.find('h5>a').html('« ' + self.settings.back_text);

        } else {

          $titleLi.find('h5>a').html('« ' + $link.html());

        }

        $dropdown.prepend($titleLi);

      });

      // Put element back in the DOM

      this.settings.$section.appendTo(this.settings.$topbar);

      // check for sticky

      this.sticky();

    },

    largestUL : function () {

      var uls = this.settings.$topbar.find('section ul ul'),

          largest = uls.first(),

          total = 0,

          self = this;

      uls.each(function () {

        if ($(this).children('li').length > largest.children('li').length) {

          largest = $(this);

        }

      });

      largest.children('li').each(function () { total += self.outerHeight($(this), true); });

      this.settings.$topbar.data('height', total);

    },

    sticky : function () {

      var klass = '.' + this.settings.stickyClass;

      if ($(klass).length > 0) {

        var distance = $(klass).length ? $(klass).offset().top: 0,

            $window = $(window);

            var offst = this.outerHeight($('.top-bar'));

          $window.scroll(function() {

            if ($window.scrollTop() >= (distance)) {

              $(klass).addClass("fixed");

              $('body').css('padding-top',offst);

            }

            else if ($window.scrollTop() < distance) {

              $(klass).removeClass("fixed");

              $('body').css('padding-top','0');

            }

        });

      }

    },

    off : function () {

      $(this.scope).off('.fndtn.topbar');

      $(window).off('.fndtn.topbar');

    }

  };

}(Foundation.zj, this, this.document));