bootstrap-tab.js 3.41 KB
Newer Older
1
/* ========================================================
Mark Otto's avatar
Mark Otto committed
2
 * bootstrap-tab.js v3.0.0
3
4
 * http://twitter.github.com/bootstrap/javascript.html#tabs
 * ========================================================
Mark Otto's avatar
Mark Otto committed
5
 * Copyright 2012 Twitter, Inc.
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * ======================================================== */


21
22
23
!function ($) {

  "use strict"; // jshint ;_;
24
25
26
27
28


 /* TAB CLASS DEFINITION
  * ==================== */

Jacob Thornton's avatar
Jacob Thornton committed
29
  var Tab = function (element) {
30
31
32
33
34
    this.element = $(element)
  }

  Tab.prototype = {

35
36
37
    constructor: Tab

  , show: function () {
38
39
      var $this = this.element
        , $ul = $this.closest('ul:not(.dropdown-menu)')
Jacob Thornton's avatar
Jacob Thornton committed
40
        , selector = $this.attr('data-target')
41
        , previous
Jacob Thornton's avatar
Jacob Thornton committed
42
        , $target
43
        , e
Jacob Thornton's avatar
Jacob Thornton committed
44
45
46
47
48

      if (!selector) {
        selector = $this.attr('href')
        selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
      }
49
50
51

      if ( $this.parent('li').hasClass('active') ) return

Kevin Attfield's avatar
Kevin Attfield committed
52
      previous = $ul.find('.active:last a')[0]
53

54
55
      e = $.Event('show', {
        relatedTarget: previous
56
57
      })

58
59
60
61
      $this.trigger(e)

      if (e.isDefaultPrevented()) return

Jacob Thornton's avatar
Jacob Thornton committed
62
      $target = $(selector)
63
64

      this.activate($this.parent('li'), $ul)
Jacob Thornton's avatar
Jacob Thornton committed
65
      this.activate($target, $target.parent(), function () {
66
67
68
69
        $this.trigger({
          type: 'shown'
        , relatedTarget: previous
        })
70
71
72
      })
    }

73
74
75
76
77
78
79
80
81
82
83
  , activate: function ( element, container, callback) {
      var $active = container.find('> .active')
        , transition = callback
            && $.support.transition
            && $active.hasClass('fade')

      function next() {
        $active
          .removeClass('active')
          .find('> .dropdown-menu > .active')
          .removeClass('active')
84

85
        element.addClass('active')
86

87
88
89
        if (transition) {
          element[0].offsetWidth // reflow for transition
          element.addClass('in')
Jacob Thornton's avatar
Jacob Thornton committed
90
91
        } else {
          element.removeClass('fade')
92
93
94
95
96
97
98
        }

        if ( element.parent('.dropdown-menu') ) {
          element.closest('li.dropdown').addClass('active')
        }

        callback && callback()
99
      }
100
101
102
103
104
105

      transition ?
        $active.one($.support.transition.end, next) :
        next()

      $active.removeClass('in')
106
107
108
109
110
111
112
    }
  }


 /* TAB PLUGIN DEFINITION
  * ===================== */

113
114
  var old = $.fn.tab

115
  $.fn.tab = function ( option ) {
116
117
118
119
120
121
122
123
    return this.each(function () {
      var $this = $(this)
        , data = $this.data('tab')
      if (!data) $this.data('tab', (data = new Tab(this)))
      if (typeof option == 'string') data[option]()
    })
  }

124
  $.fn.tab.Constructor = Tab
125
126


127
128
129
130
131
132
133
134
135
 /* TAB NO CONFLICT
  * =============== */

  $.fn.tab.noConflict = function () {
    $.fn.tab = old
    return this
  }


136
137
138
 /* TAB DATA-API
  * ============ */

139
140
141
  $(document).on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
    e.preventDefault()
    $(this).tab('show')
142
143
  })

144
}(window.jQuery);