From 98fddaa3557b1c872f1e585d579ec7e5e989e95d Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Fri, 25 Nov 2011 17:23:14 -0800 Subject: new plugin "collapse" for collapsible lists and "accordion" like support --- js/bootstrap-collapse.js | 127 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 127 insertions(+) create mode 100644 js/bootstrap-collapse.js (limited to 'js/bootstrap-collapse.js') diff --git a/js/bootstrap-collapse.js b/js/bootstrap-collapse.js new file mode 100644 index 000000000..6de3d971a --- /dev/null +++ b/js/bootstrap-collapse.js @@ -0,0 +1,127 @@ +/* ============================================================= + * bootstrap-collapsible.js v2.0.0 + * http://twitter.github.com/bootstrap/javascript.html#collapsible + * ============================================================= + * Copyright 2011 Twitter, Inc. + * + * 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. + * ============================================================ */ + +(function( $ ){ + + "use strict" + + var Collapse = function ( element, options ) { + this.$element = $(element) + this.settings = $.extend({}, $.fn.collapse.defaults, options) + + if (this.settings["parent"]) { + this.$parent = $(this.settings["parent"]) + } + + this.settings.toggle && this.toggle() + } + + Collapse.prototype = { + + dimension: function () { + var hasWidth = this.$element.hasClass('width') + return hasWidth ? 'width' : 'height' + } + + , show: function () { + var dimension = this.dimension() + , scroll = $.camelCase(['scroll', dimension].join('-')) + + this.$parent && this.$parent.find('.in').collapse('hide') + + this.$element[dimension](0) + this.transition('addClass', 'show', 'shown') + this.$element[dimension](this.$element[0][scroll]) + + } + + , hide: function () { + var dimension = this.dimension() + this.reset(this.$element[dimension]()) + this.transition('removeClass', 'hide', 'hidden') + this.$element[dimension](0) + } + + , reset: function ( size ) { + var dimension = this.dimension() + + this.$element + .removeClass('collapse') + [dimension](size || '') + [0].offsetWidth + + this.$element.addClass('collapse') + } + + , transition: function ( method, startEvent, completeEvent ) { + var that = this + , complete = function () { + if (startEvent == 'show') that.reset() + that.$element.trigger(completeEvent) + } + + this.$element + .trigger(startEvent) + [method]('in') + + $.support.transition && this.$element.hasClass('collapse') ? + this.$element.one($.support.transition.end, complete) : + complete() + } + + , toggle: function () { + this[this.$element.hasClass('in') ? 'hide' : 'show']() + } + + } + + /* COLLAPSIBLE PLUGIN DEFINITION + * ============================== */ + + $.fn.collapse = function ( option ) { + return this.each(function () { + var $this = $(this) + , data = $this.data('collapse') + , options = typeof option == 'object' && option + if (!data) $this.data('collapse', (data = new Collapse(this, options))) + if (typeof option == 'string') data[option]() + }) + } + + $.fn.collapse.defaults = { + toggle: true + } + + $.fn.collapse.Collapse = Collapse + + + /* COLLAPSIBLE DATA-API + * ==================== */ + + $(function () { + $('body').delegate('[data-toggle=collapse]', 'click.collapse.data-api', function ( e ) { + var $this = $(this) + , target = $this.attr('data-target') + , option = $(target).data('collapse') ? 'toggle' : $this.data() + e.preventDefault() + $(target).collapse(option) + }) + }) + +})( window.jQuery || window.ender ) \ No newline at end of file -- cgit v1.2.3 From 46fe38386afce7149810b1feb534726735ce28b2 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Sun, 27 Nov 2011 17:04:55 -0800 Subject: rename tabs to tab - clean up lots of api stuff make href acceptable target val --- js/bootstrap-collapse.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/bootstrap-collapse.js') diff --git a/js/bootstrap-collapse.js b/js/bootstrap-collapse.js index 6de3d971a..629d9b589 100644 --- a/js/bootstrap-collapse.js +++ b/js/bootstrap-collapse.js @@ -117,9 +117,9 @@ $(function () { $('body').delegate('[data-toggle=collapse]', 'click.collapse.data-api', function ( e ) { var $this = $(this) - , target = $this.attr('data-target') + , target = $this.attr('data-target') || $this.attr('href') , option = $(target).data('collapse') ? 'toggle' : $this.data() - e.preventDefault() + e.preventDefault() $(target).collapse(option) }) }) -- cgit v1.2.3 From 7eb340ec589acd56ad960a020969822636c2bc54 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Sun, 27 Nov 2011 17:31:12 -0800 Subject: add code to reset data for collapsed element so that item can be intitialized with correct options --- js/bootstrap-collapse.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) (limited to 'js/bootstrap-collapse.js') diff --git a/js/bootstrap-collapse.js b/js/bootstrap-collapse.js index 629d9b589..93f91513e 100644 --- a/js/bootstrap-collapse.js +++ b/js/bootstrap-collapse.js @@ -42,8 +42,14 @@ , show: function () { var dimension = this.dimension() , scroll = $.camelCase(['scroll', dimension].join('-')) - - this.$parent && this.$parent.find('.in').collapse('hide') + , actives = this.$parent && this.$parent.find('.in') + , hasData + + if (actives && actives.length) { + hasData = actives.data('collapse') + actives.collapse('hide') + hasData || actives.data('collapse', null) + } this.$element[dimension](0) this.transition('addClass', 'show', 'shown') -- cgit v1.2.3