1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-28 15:50:01 +02:00

add active class to css for buttons, write new spec for button, "use strict"

This commit is contained in:
Jacob Thornton
2011-10-29 18:49:35 -07:00
parent e8b66a9626
commit ea50e8aeee
13 changed files with 109 additions and 34 deletions

View File

@@ -20,6 +20,8 @@
!function( $ ){
"use strict"
/* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
* ======================================================= */

View File

@@ -36,10 +36,16 @@
$el.removeClass(d).removeAttr(d)
}
$.fn.button = function(state) {
var d = 'disabled'
function toggle(el) {
$(el).toggleClass('active')
}
$.fn.button = function(options) {
return this.each(function () {
state && setState(this, state)
if (options == 'toggle') {
return toggle(this)
}
options && setState(this, options)
})
}
@@ -47,4 +53,10 @@
loadingText: 'loading...'
}
$(function () {
$('body').delegate('.btn[data-toggle]', 'click', function () {
$(this).button('toggle')
})
})
}( window.jQuery || window.ender );

View File

@@ -20,6 +20,8 @@
!function( $ ){
"use strict"
/* DROPDOWN PLUGIN DEFINITION
* ========================== */

37
js/bootstrap-modal.js vendored
View File

@@ -20,6 +20,8 @@
!function( $ ){
"use strict"
/* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
* ======================================================= */
@@ -115,17 +117,9 @@
.trigger('hide')
.removeClass('in')
function removeElement () {
that.$element
.hide()
.trigger('hidden')
backdrop.call(that)
}
$.support.transition && this.$element.hasClass('fade') ?
this.$element.one(transitionEnd, removeElement) :
removeElement()
this.$element.one(transitionEnd, $.proxy(hideModal, this)) :
hideModal.call(this)
return this
}
@@ -136,6 +130,14 @@
/* MODAL PRIVATE METHODS
* ===================== */
function hideModal (that) {
this.$element
.hide()
.trigger('hidden')
backdrop.call(this)
}
function backdrop ( callback ) {
var that = this
, animate = this.$element.hasClass('fade') ? 'fade' : ''
@@ -162,19 +164,20 @@
} else if ( !this.isShown && this.$backdrop ) {
this.$backdrop.removeClass('in')
function removeElement() {
that.$backdrop.remove()
that.$backdrop = null
}
$.support.transition && this.$element.hasClass('fade')?
this.$backdrop.one(transitionEnd, removeElement) :
removeElement()
this.$backdrop.one(transitionEnd, $.proxy(removeBackdrop, this)) :
removeBackdrop.call(this)
} else if ( callback ) {
callback()
}
}
function removeBackdrop() {
this.$backdrop.remove()
this.$backdrop = null
}
function escape() {
var that = this
if ( this.isShown && this.settings.keyboard ) {

View File

@@ -20,6 +20,8 @@
!function( $ ) {
"use strict"
var Popover = function ( element, options ) {
this.$element = $(element)
this.options = options

View File

@@ -20,6 +20,8 @@
!function ( $ ) {
"use strict"
var $window = $(window)
function ScrollSpy( topbar, selector ) {

View File

@@ -20,6 +20,8 @@
!function( $ ){
"use strict"
function activate ( element, container ) {
container
.find('> .active')
@@ -39,6 +41,7 @@
, $ul = $this.closest('ul:not(.dropdown-menu)')
, href = $this.attr('href')
, previous
, $href
if ( /^#\w+/.test(href) ) {
e.preventDefault()

View File

@@ -21,6 +21,8 @@
!function( $ ) {
"use strict"
/* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
* ======================================================= */

View File

@@ -4,7 +4,7 @@
<title>Bootstrap Plugin Test Suite</title>
<!-- jquery -->
<script src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<!-- qunit -->
<link rel="stylesheet" href="vendor/qunit.css" type="text/css" media="screen" />
@@ -17,6 +17,7 @@
<script src="../../js/bootstrap-tabs.js"></script>
<script src="../../js/bootstrap-twipsy.js"></script>
<script src="../../js/bootstrap-popover.js"></script>
<script src="../../js/bootstrap-buttons.js"></script>
<!-- unit tests -->
<script src="unit/bootstrap-alerts.js"></script>
@@ -25,6 +26,7 @@
<script src="unit/bootstrap-popover.js"></script>
<script src="unit/bootstrap-tabs.js"></script>
<script src="unit/bootstrap-twipsy.js"></script>
<script src="unit/bootstrap-buttons.js"></script>
<body>
<div>

42
js/tests/unit/bootstrap-buttons.js vendored Normal file
View File

@@ -0,0 +1,42 @@
$(function () {
module("bootstrap-buttons")
test("should be defined on jquery object", function () {
ok($(document.body).button, 'tabs method is defined')
})
test("should return element", function () {
ok($(document.body).button()[0] == document.body, 'document.body returned')
})
test("should return set state to loading", function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equals(btn.html(), 'mdo', 'btn text equals mdo')
btn.button('loading')
equals(btn.html(), 'fat', 'btn text equals fat')
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
})
test("should return reset state", function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equals(btn.html(), 'mdo', 'btn text equals mdo')
btn.button('loading')
equals(btn.html(), 'fat', 'btn text equals fat')
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn is disabled')
btn.button('reset')
equals(btn.html(), 'mdo', 'btn text equals mdo')
ok(!btn.attr('disabled'), 'btn is not disabled')
ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
})
test("should toggle active", function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
ok(!btn.hasClass('active'), 'btn does not have active class')
btn.button('toggle')
ok(btn.hasClass('active'), 'btn has class active')
})
})