global-nav.js

'use strict';

var $ = require('zepto');
var MobileMenu = require('../components/mobile-menu.js');
var Dropdown = require('../components/dropdown');
var bind = require('lodash/function/bind');

module.exports = {
    initialize: function () {
        new MobileMenu();

        this.todaysSectionDropdown = new Dropdown({
            $toggle: $('.js-editionDropdownToggle'),
            $content: $('.js-editionDropdownContent'),
            modalClassModifier: 'translucent'
        });

        this.myAccountDropdown = new Dropdown({
            $toggle: $('.js-accountDropdownToggle'),
            $content: $('.js-accountDropdownContent')
        });

        this.bindEvents();
    },

    bindEvents: function () {
        this.todaysSectionDropdown.on('open', bind(this.closeMyAccountDropdown, this));
        this.myAccountDropdown.on('open', bind(this.closeTodaysSectionDropdown, this));

        $(document).on('keydown', bind(function (event) {
            if (event.keyCode === 27) {
                this.closeTodaysSectionDropdown();
                this.closeMyAccountDropdown();
            }
        }, this));
    },

    closeTodaysSectionDropdown: function () {
        if (this.todaysSectionDropdown.isActive) {
            this.todaysSectionDropdown.close();
        }
    },

    closeMyAccountDropdown: function () {
        if (this.myAccountDropdown.isActive) {
            this.myAccountDropdown.close();
        }
    }
};