app/scripts/plugins/globalnav.coffee

EPFL global navigation plugin

Handle the global navigation

requires: jQuery or Zepto DOM library
author: Julien Ramboz
version: 1.0

AMD loader

Try loading as AMD module or fall back to default loading

((plugin) -> if typeof define is "function" and define.amd define ["jslib", "plugin"], plugin else plugin @$, AbstractPlugin ).call this, globalnav = ($, AbstractPlugin) -> "use strict"

Plugin

The actual plugin class

class GlobalNav extends AbstractPlugin

Event handling

Attach evenets to the plugin

bindEvents: () ->

Reload the navigation after the header has been loaded

@element.on "headerLoaded", (e) => @bindEvents() @element.on "click", (e) -> if $(e.target).closest(".pane,.epflnav").length is 0 $(".epflnav .nav-link.toggle-visible").click()

Toggle the epflnav/search elements together

$(".epflnav > a, .search > a").on "click", (e) -> $(".epflnav .nav-link.toggle-visible").epfl_toggle "hide", e if e.target is $(".epflnav > a").get(0) $(".search > .toggle-visible").epfl_toggle "hide", e if e.target is $(".search > a").get(0) $(".epflnav > .toggle-visible").epfl_toggle "hide", e

Hide the opened pane if any

@element.on "beforeToggle", ".epflnav .nav-link", (e, o) -> if o.toggle.hasClass("toggle-hidden") $(".epflnav .nav-link.toggle-visible").epfl_toggle "hide"

Also overlay the header bar in addition to the pane

@element.on "afterOverlay", ".pane", (e, o) => if o.status @element.css "background": "#fff" "z-index": o.element.css("z-index") else if o.event @element.css "background": "transparent" "z-index": "initial" else

If no event is defined, it is not a user click so force visible (keeps the overlay visible when switching panes)

$("#overlay").attr "aria-hidden", "false"

Installation

Install the plugin into the JS library

GlobalNav.install("GlobalNav", () -> $("#epfl-header")["#{AbstractPlugin.namespace}globalnav"]() )