sco.tab.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. /* ==========================================================
  2. * sco.tab.js
  3. * http://github.com/terebentina/sco.js
  4. * ==========================================================
  5. * Copyright 2013 Dan Caragea.
  6. *
  7. * Licensed under the Apache License, Version 2.0 (the "License");
  8. * you may not use this file except in compliance with the License.
  9. * You may obtain a copy of the License at
  10. *
  11. * http://apache.org/licenses/LICENSE-2.0
  12. *
  13. * Unless required by applicable law or agreed to in writing, software
  14. * distributed under the License is distributed on an "AS IS" BASIS,
  15. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16. * See the License for the specific language governing permissions and
  17. * limitations under the License.
  18. * ========================================================== */
  19. /*jshint laxcomma:true, sub:true, browser:true, jquery:true, devel:true */
  20. ;(function($, undefined) {
  21. "use strict";
  22. var pluginName = 'scojs_tab';
  23. function Tab($header_wrapper, options) {
  24. this.options = $.extend({}, $.fn[pluginName].defaults, options);
  25. this.$header_wrapper = $header_wrapper;
  26. if (this.options.content === undefined) {
  27. this.options.content = this.$header_wrapper[this.options.mode]('.pane-wrapper');
  28. }
  29. var self = this
  30. ,auto_click = false
  31. ;
  32. if (typeof this.options.onBeforeSelect == 'function') {
  33. this.options.onBeforeSelect = $.proxy(this.options.onBeforeSelect, self);
  34. }
  35. this.panes = $.scojs_panes(this.options.content, this.options);
  36. this.$header_wrapper.find('> li').removeClass('active').eq(this.options.active).addClass('active');
  37. this.$header_wrapper.on('click.' + pluginName, 'a', function(e) {
  38. var $this = $(this)
  39. ,$my_li = $this.closest('li')
  40. ,my_index = $my_li.index()
  41. ;
  42. if (!$.address || $this.attr('href') == '#') {
  43. e.preventDefault();
  44. }
  45. if (self.panes.select(my_index)) {
  46. self.$header_wrapper.find('> li.active').removeClass('active');
  47. $my_li.addClass('active');
  48. }
  49. });
  50. if ($.address) {
  51. $.address.externalChange(function(e) {
  52. var hash = '#' + e.value.slice(1);
  53. self.$header_wrapper.find('> li a').each(function() {
  54. var $this = $(this);
  55. if ($this.attr('href') === hash) {
  56. $this.trigger('click');
  57. return false;
  58. }
  59. });
  60. }).history(true);
  61. }
  62. }
  63. $.extend(Tab.prototype, {
  64. select: function(index) {
  65. this.$header_wrapper.find('> li:eq(' + index + ') a').trigger('click');
  66. return this;
  67. }
  68. });
  69. $.fn[pluginName] = function(options) {
  70. return this.each(function() {
  71. var obj;
  72. if (!(obj = $.data(this, pluginName))) {
  73. var $this = $(this)
  74. ,data = $this.data()
  75. ,opts = $.extend({}, $.fn[pluginName].defaults, options, data)
  76. ;
  77. obj = new Tab($this, opts);
  78. $.data(this, pluginName, obj);
  79. }
  80. });
  81. };
  82. $[pluginName] = function(elem, options) {
  83. if (typeof elem === 'string') {
  84. elem = $(elem);
  85. }
  86. return new Tab(elem, options);
  87. };
  88. $.fn[pluginName].defaults = {
  89. active: 0
  90. ,mode: 'next' // "next" means panes are under headers, "prev" means panes are above headers
  91. ,easing: ''
  92. };
  93. $(function() {
  94. $('[data-trigger="tab"]')[pluginName]();
  95. });
  96. })(jQuery);