Commit a2838ca30e084887a1d2b985ec0fcec32b666337

Authored by Charles Oliveira
Committed by Sergio Oliveira
1 parent 6ea03de1

Added necessary js to colab's navbar dropdown and responsiviness

colab/proxy/noosfero/static/js/collapse.js 0 → 100644
... ... @@ -0,0 +1,211 @@
  1 +/* ========================================================================
  2 + * Bootstrap: collapse.js v3.2.0
  3 + * http://getbootstrap.com/javascript/#collapse
  4 + * ========================================================================
  5 + * Copyright 2011-2014 Twitter, Inc.
  6 + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  7 + * ======================================================================== */
  8 +
  9 +
  10 ++function ($) {
  11 + 'use strict';
  12 +
  13 + // COLLAPSE PUBLIC CLASS DEFINITION
  14 + // ================================
  15 +
  16 + var Collapse = function (element, options) {
  17 + this.$element = $(element)
  18 + this.options = $.extend({}, Collapse.DEFAULTS, options)
  19 + this.$trigger = $(this.options.trigger).filter('[href="#' + element.id + '"], [data-target="#' + element.id + '"]')
  20 + this.transitioning = null
  21 +
  22 + if (this.options.parent) {
  23 + this.$parent = this.getParent()
  24 + } else {
  25 + this.addAriaAndCollapsedClass(this.$element, this.$trigger)
  26 + }
  27 +
  28 + if (this.options.toggle) this.toggle()
  29 + }
  30 +
  31 + Collapse.VERSION = '3.2.0'
  32 +
  33 + Collapse.TRANSITION_DURATION = 350
  34 +
  35 + Collapse.DEFAULTS = {
  36 + toggle: true,
  37 + trigger: '[data-toggle="collapse"]'
  38 + }
  39 +
  40 + Collapse.prototype.dimension = function () {
  41 + var hasWidth = this.$element.hasClass('width')
  42 + return hasWidth ? 'width' : 'height'
  43 + }
  44 +
  45 + Collapse.prototype.show = function () {
  46 + if (this.transitioning || this.$element.hasClass('in')) return
  47 +
  48 + var activesData
  49 + var actives = this.$parent && this.$parent.find('> .panel').children('.in, .collapsing')
  50 +
  51 + if (actives && actives.length) {
  52 + activesData = actives.data('bs.collapse')
  53 + if (activesData && activesData.transitioning) return
  54 + }
  55 +
  56 + var startEvent = $.Event('show.bs.collapse')
  57 + this.$element.trigger(startEvent)
  58 + if (startEvent.isDefaultPrevented()) return
  59 +
  60 + if (actives && actives.length) {
  61 + Plugin.call(actives, 'hide')
  62 + activesData || actives.data('bs.collapse', null)
  63 + }
  64 +
  65 + var dimension = this.dimension()
  66 +
  67 + this.$element
  68 + .removeClass('collapse')
  69 + .addClass('collapsing')[dimension](0)
  70 + .attr('aria-expanded', true)
  71 +
  72 + this.$trigger
  73 + .removeClass('collapsed')
  74 + .attr('aria-expanded', true)
  75 +
  76 + this.transitioning = 1
  77 +
  78 + var complete = function () {
  79 + this.$element
  80 + .removeClass('collapsing')
  81 + .addClass('collapse in')[dimension]('')
  82 + this.transitioning = 0
  83 + this.$element
  84 + .trigger('shown.bs.collapse')
  85 + }
  86 +
  87 + if (!$.support.transition) return complete.call(this)
  88 +
  89 + var scrollSize = $.camelCase(['scroll', dimension].join('-'))
  90 +
  91 + this.$element
  92 + .one('bsTransitionEnd', $.proxy(complete, this))
  93 + .emulateTransitionEnd(Collapse.TRANSITION_DURATION)[dimension](this.$element[0][scrollSize])
  94 + }
  95 +
  96 + Collapse.prototype.hide = function () {
  97 + if (this.transitioning || !this.$element.hasClass('in')) return
  98 +
  99 + var startEvent = $.Event('hide.bs.collapse')
  100 + this.$element.trigger(startEvent)
  101 + if (startEvent.isDefaultPrevented()) return
  102 +
  103 + var dimension = this.dimension()
  104 +
  105 + this.$element[dimension](this.$element[dimension]())[0].offsetHeight
  106 +
  107 + this.$element
  108 + .addClass('collapsing')
  109 + .removeClass('collapse in')
  110 + .attr('aria-expanded', false)
  111 +
  112 + this.$trigger
  113 + .addClass('collapsed')
  114 + .attr('aria-expanded', false)
  115 +
  116 + this.transitioning = 1
  117 +
  118 + var complete = function () {
  119 + this.transitioning = 0
  120 + this.$element
  121 + .removeClass('collapsing')
  122 + .addClass('collapse')
  123 + .trigger('hidden.bs.collapse')
  124 + }
  125 +
  126 + if (!$.support.transition) return complete.call(this)
  127 +
  128 + this.$element
  129 + [dimension](0)
  130 + .one('bsTransitionEnd', $.proxy(complete, this))
  131 + .emulateTransitionEnd(Collapse.TRANSITION_DURATION)
  132 + }
  133 +
  134 + Collapse.prototype.toggle = function () {
  135 + this[this.$element.hasClass('in') ? 'hide' : 'show']()
  136 + }
  137 +
  138 + Collapse.prototype.getParent = function () {
  139 + return $(this.options.parent)
  140 + .find('[data-toggle="collapse"][data-parent="' + this.options.parent + '"]')
  141 + .each($.proxy(function (i, element) {
  142 + var $element = $(element)
  143 + this.addAriaAndCollapsedClass(getTargetFromTrigger($element), $element)
  144 + }, this))
  145 + .end()
  146 + }
  147 +
  148 + Collapse.prototype.addAriaAndCollapsedClass = function ($element, $trigger) {
  149 + var isOpen = $element.hasClass('in')
  150 +
  151 + $element.attr('aria-expanded', isOpen)
  152 + $trigger
  153 + .toggleClass('collapsed', !isOpen)
  154 + .attr('aria-expanded', isOpen)
  155 + }
  156 +
  157 + function getTargetFromTrigger($trigger) {
  158 + var href
  159 + var target = $trigger.attr('data-target')
  160 + || (href = $trigger.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') // strip for ie7
  161 +
  162 + return $(target)
  163 + }
  164 +
  165 +
  166 + // COLLAPSE PLUGIN DEFINITION
  167 + // ==========================
  168 +
  169 + function Plugin(option) {
  170 + return this.each(function () {
  171 + var $this = $(this)
  172 + var data = $this.data('bs.collapse')
  173 + var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)
  174 +
  175 + if (!data && options.toggle && option == 'show') options.toggle = false
  176 + if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))
  177 + if (typeof option == 'string') data[option]()
  178 + })
  179 + }
  180 +
  181 + var old = $.fn.collapse
  182 +
  183 + $.fn.collapse = Plugin
  184 + $.fn.collapse.Constructor = Collapse
  185 +
  186 +
  187 + // COLLAPSE NO CONFLICT
  188 + // ====================
  189 +
  190 + $.fn.collapse.noConflict = function () {
  191 + $.fn.collapse = old
  192 + return this
  193 + }
  194 +
  195 +
  196 + // COLLAPSE DATA-API
  197 + // =================
  198 +
  199 + $(document).on('click.bs.collapse.data-api', '[data-toggle="collapse"]', function (e) {
  200 + var $this = $(this)
  201 +
  202 + if (!$this.attr('data-target')) e.preventDefault()
  203 +
  204 + var $target = getTargetFromTrigger($this)
  205 + var data = $target.data('bs.collapse')
  206 + var option = data ? 'toggle' : $.extend({}, $this.data(), { trigger: this })
  207 +
  208 + Plugin.call($target, option)
  209 + })
  210 +
  211 +}(jQuery);
... ...
colab/proxy/noosfero/static/js/jquery.dropdown.js 0 → 100644
... ... @@ -0,0 +1,150 @@
  1 ++function ($) {
  2 + 'use strict';
  3 +
  4 + // DROPDOWN CLASS DEFINITION
  5 + // =========================
  6 +
  7 + var backdrop = '.dropdown-backdrop'
  8 + var toggle = '[data-toggle="dropdown"]'
  9 + var Dropdown = function (element) {
  10 + $(element).on('click.bs.dropdown', this.toggle)
  11 + }
  12 +
  13 + Dropdown.VERSION = '3.2.0'
  14 +
  15 + Dropdown.prototype.toggle = function (e) {
  16 + var $this = $(this)
  17 +
  18 + if ($this.is('.disabled, :disabled')) return
  19 +
  20 + var $parent = getParent($this)
  21 + var isActive = $parent.hasClass('open')
  22 +
  23 + clearMenus()
  24 +
  25 + if (!isActive) {
  26 + if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) {
  27 + // if mobile we use a backdrop because click events don't delegate
  28 + $('<div class="dropdown-backdrop"/>').insertAfter($(this)).on('click', clearMenus)
  29 + }
  30 +
  31 + var relatedTarget = { relatedTarget: this }
  32 + $parent.trigger(e = $.Event('show.bs.dropdown', relatedTarget))
  33 +
  34 + if (e.isDefaultPrevented()) return
  35 +
  36 + $this
  37 + .trigger('focus')
  38 + .attr('aria-expanded', 'true')
  39 +
  40 + $parent
  41 + .toggleClass('open')
  42 + .trigger('shown.bs.dropdown', relatedTarget)
  43 + }
  44 +
  45 + return false
  46 + }
  47 +
  48 + Dropdown.prototype.keydown = function (e) {
  49 + if (!/(38|40|27|32)/.test(e.which)) return
  50 +
  51 + var $this = $(this)
  52 +
  53 + e.preventDefault()
  54 + e.stopPropagation()
  55 +
  56 + if ($this.is('.disabled, :disabled')) return
  57 +
  58 + var $parent = getParent($this)
  59 + var isActive = $parent.hasClass('open')
  60 +
  61 + if ((!isActive && e.which != 27) || (isActive && e.which == 27)) {
  62 + if (e.which == 27) $parent.find(toggle).trigger('focus')
  63 + return $this.trigger('click')
  64 + }
  65 +
  66 + var desc = ' li:not(.divider):visible a'
  67 + var $items = $parent.find('[role="menu"]' + desc + ', [role="listbox"]' + desc)
  68 +
  69 + if (!$items.length) return
  70 +
  71 + var index = $items.index(e.target)
  72 +
  73 + if (e.which == 38 && index > 0) index-- // up
  74 + if (e.which == 40 && index < $items.length - 1) index++ // down
  75 + if (!~index) index = 0
  76 +
  77 + $items.eq(index).trigger('focus')
  78 + }
  79 +
  80 + function clearMenus(e) {
  81 + if (e && e.which === 3) return
  82 + $(backdrop).remove()
  83 + $(toggle).each(function () {
  84 + var $this = $(this)
  85 + var $parent = getParent($this)
  86 + var relatedTarget = { relatedTarget: this }
  87 +
  88 + if (!$parent.hasClass('open')) return
  89 +
  90 + $parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget))
  91 +
  92 + if (e.isDefaultPrevented()) return
  93 +
  94 + $this.attr('aria-expanded', 'false')
  95 + $parent.removeClass('open').trigger('hidden.bs.dropdown', relatedTarget)
  96 + })
  97 + }
  98 +
  99 + function getParent($this) {
  100 + var selector = $this.attr('data-target')
  101 +
  102 + if (!selector) {
  103 + selector = $this.attr('href')
  104 + selector = selector && /#[A-Za-z]/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
  105 + }
  106 +
  107 + var $parent = selector && $(selector)
  108 +
  109 + return $parent && $parent.length ? $parent : $this.parent()
  110 + }
  111 +
  112 +
  113 + // DROPDOWN PLUGIN DEFINITION
  114 + // ==========================
  115 +
  116 + function Plugin(option) {
  117 + return this.each(function () {
  118 + var $this = $(this)
  119 + var data = $this.data('bs.dropdown')
  120 +
  121 + if (!data) $this.data('bs.dropdown', (data = new Dropdown(this)))
  122 + if (typeof option == 'string') data[option].call($this)
  123 + })
  124 + }
  125 +
  126 + var old = $.fn.dropdown
  127 +
  128 + $.fn.dropdown = Plugin
  129 + $.fn.dropdown.Constructor = Dropdown
  130 +
  131 +
  132 + // DROPDOWN NO CONFLICT
  133 + // ====================
  134 +
  135 + $.fn.dropdown.noConflict = function () {
  136 + $.fn.dropdown = old
  137 + return this
  138 + }
  139 +
  140 +
  141 + // APPLY TO STANDARD DROPDOWN ELEMENTS
  142 + // ===================================
  143 +
  144 + $(document)
  145 + .on('click.bs.dropdown.data-api', clearMenus)
  146 + .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
  147 + .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
  148 + .on('keydown.bs.dropdown.data-api', toggle + ', [role="menu"], [role="listbox"]', Dropdown.prototype.keydown)
  149 +
  150 +}(jQuery);
0 151 \ No newline at end of file
... ...
colab/proxy/noosfero/templates/proxy/noosfero.html
... ... @@ -12,4 +12,6 @@
12 12  
13 13 {% block head_js %}
14 14 <script>jQuery.noConflict();</script>
  15 +<script src="{% static 'js/jquery.dropdown.js' %}" type="text/javascript"></script>
  16 +<script src="{% static 'js/collapse.js' %}" type="text/javascript"></script>
15 17 {% endblock %}
... ...