blob42
/
bootstrap-magic-button
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

reindent long lines

Browse Source
master
Chakib Benziane 12 years ago
parent a508c4119b
commit d4efc68c8e
1 changed files with 186 additions and 219 deletions
Show Stats Download Patch File Download Diff File

405
bootstrap-magic-button.js vendored
Unescape Escape View File

@ -18,224 +18,191 @@
* *
* Modified work : bootstrap-button.js v2.0.2 * Modified work : bootstrap-button.js v2.0.2
* Copyright 2012 Twitter, Inc. * Copyright 2012 Twitter, Inc.
* ============================================================ */ * ============================================================ */!
function ($) {
!function( $ ){
"use strict"
"use strict"
/* BUTTON PUBLIC CLASS DEFINITION
/* BUTTON PUBLIC CLASS DEFINITION * ============================== */
* ============================== */
var MagicBtn = function (element, options) {
var MagicBtn = function ( element, options ) { this.$element = $(element)
this.$element = $(element)
// The parent Div
// The parent Div this.$parentDiv = $(element).closest('div')
this.$parentDiv = $(element).closest('div') this.$parentHeight = this.$parentDiv.outerHeight()
this.$parentHeight = this.$parentDiv.outerHeight() this.$parentWidth = this.$parentDiv.outerWidth()
this.$parentWidth = this.$parentDiv.outerWidth() this.$parentPosition = this.$parentDiv.position();
this.$parentPosition = this.$parentDiv.position(); this.options = $.extend({}, $.fn.magicBtn.defaults, options)
this.options = $.extend({}, $.fn.magicBtn.defaults, options)
// Store number of buttons on parent div
// Store number of buttons on parent div if (!this.$parentDiv.data('nbMagicBtns')) this.$parentDiv.data('nbMagicBtns', 1)
if (!this.$parentDiv.data('nbMagicBtns')) else this.$parentDiv.data().nbMagicBtns++;
this.$parentDiv.data('nbMagicBtns', 1)
else // Store the current button number
this.$parentDiv.data().nbMagicBtns++; this.$currentBtnNb = this.$parentDiv.data('nbMagicBtns')
// Store the current button number // store the currunt button size
this.$currentBtnNb = this.$parentDiv.data('nbMagicBtns') this.$height = this.$element.outerHeight() + this.options.betweenSpace / 2
this.$width = this.$element.outerWidth()
// store the currunt button size
this.$height = this.$element.outerHeight() + this.options.betweenSpace / 2 // current button image and toggle image if there is
this.$width = this.$element.outerWidth() this.$imgUrl = 'url("' + this.$element.data('image') + '")'
var toggleimg
// current button image and toggle image if there is if (toggleimg = this.$element.data('toggle-image')) this.$toggleImgUrl = 'url("' + toggleimg + '")'
this.$imgUrl = 'url("' + this.$element.data('image') + '")' else this.$toggleImgUrl = this.$imgUrl
var toggleimg
if (toggleimg = this.$element.data('toggle-image')) this.$isToggled = false
this.$toggleImgUrl = 'url("' + toggleimg + '")'
else if (this.options.hover) this.addHover()
this.$toggleImgUrl = this.$imgUrl }
this.$isToggled = false MagicBtn.prototype = {
if (this.options.hover) constructor: MagicBtn
this.addHover()
} // state is the option recieved from jQuery plugin
,
MagicBtn.prototype = { setState: function (state) {
var d = 'disabled',
constructor: MagicBtn $el = this.$element,
data = $el.data(),
// state is the option recieved from jQuery plugin val = $el.is('input') ? 'val' : 'html'
, setState: function ( state ) {
var d = 'disabled' state = state + 'Text'
, $el = this.$element data.resetText || $el.data('resetText', $el[val]())
, data = $el.data()
, val = $el.is('input') ? 'val' : 'html' $el[val](data[state] || this.options[state])
state = state + 'Text' // push to event loop to allow forms to submit
data.resetText || $el.data('resetText', $el[val]()) setTimeout(function () {
state == 'loadingText' ? $el.addClass(d).attr(d, d) : $el.removeClass(d).removeAttr(d)
$el[val](data[state] || this.options[state]) }, 0)
}
// push to event loop to allow forms to submit
setTimeout(function () { ,
state == 'loadingText' ? calculatePosition: function (direction) {
$el.addClass(d).attr(d, d) : var space = (this.$currentBtnNb === 1) ? 0 : this.options.betweenSpace
$el.removeClass(d).removeAttr(d) var left = this.$parentPosition.left + this.$parentWidth
}, 0) switch (this.options.alignement) {
} case 'top':
this.$top = (
, calculatePosition: function(direction) { (this.$currentBtnNb * this.$height) - this.$height + this.$parentPosition.top + (space * (this.$currentBtnNb - 1)))
var space = (this.$currentBtnNb === 1) ? 0 : this.options.betweenSpace break;
var left = this.$parentPosition.left + this.$parentWidth case 'center':
switch (this.options.alignement) {
case 'top': if (this.$currentBtnNb === 1) {
this.$top = ( this.$top = (
(this.$currentBtnNb * this.$height) - (this.$parentHeight / 2) - (this.$height / 2) + this.$parentPosition.top)
this.$height + this.$parentDiv.data('top-space', (this.$parentHeight / 2 - (this.$height / 2)))
this.$parentPosition.top + this.$parentDiv.data('bottom-space', (this.$parentHeight / 2 - (this.$height / 2)))
(space * (this.$currentBtnNb - 1)) } else if (this.$currentBtnNb % 2 === 0) {
) this.$top = (
break; this.$parentDiv.data('top-space') - this.$height + this.$parentPosition.top)
case 'center': this.$parentDiv.data('top-space', this.$parentDiv.data('top-space') - this.$height)
{ } else {
if (this.$currentBtnNb === 1) this.$top = (
{ this.$parentHeight - this.$parentDiv.data('bottom-space') + this.$parentPosition.top)
this.$top = (
(this.$parentHeight / 2) - this.$parentDiv.data('bottom-space', this.$parentDiv.data('bottom-space') - this.$height)
(this.$height / 2) + }
this.$parentPosition.top break;
)
this.$parentDiv.data('top-space',
(this.$parentHeight / 2 - (this.$height /2))
) }
this.$parentDiv.data('bottom-space',
(this.$parentHeight / 2 - (this.$height /2)) this.$left = this.$parentPosition.left + this.$parentWidth
) }
}
else if (this.$currentBtnNb % 2 === 0) { ,
this.$top = ( show: function () {
this.$parentDiv.data('top-space') - var $o = this.options
this.$height + this.$element.css({
this.$parentPosition.top top: this.$top,
) left: this.$left,
this.$parentDiv.data('top-space', 'background-image': this.$imgUrl
this.$parentDiv.data('top-space') - this.$height }).show()
) }
}
,
else { hide: function () {
this.$top = ( this.$element.hide()
this.$parentHeight - }
this.$parentDiv.data('bottom-space') +
this.$parentPosition.top ,
) toggle: function () {
var $el = this.$element
this.$parentDiv.data('bottom-space', if (!this.$isToggled) {
this.$parentDiv.data('bottom-space') - $el.css('background-image', this.$toggleImgUrl)
this.$height this.$isToggled = true
) $el.addClass('magicBtn-active')
} } else {
break; $el.css('background-image', this.$imgUrl)
this.$isToggled = false
} $el.removeClass('magicBtn-active')
}
} }
this.$left = this.$parentPosition.left + this.$parentWidth ,
} addHover: function () {
var $el = this.$element
, show: function() { var obj = this
var $o = this.options var config = {
this.$element.css({ over: function () {
top: this.$top, if (!obj.$isToggled) $(this).toggleClass('magicBtn-active')
left: this.$left, },
'background-image': this.$imgUrl timeout: 1,
}).show() out: function () {
} if ((!obj.$isToggled) && (!$el.is(':hover')) && ($el.hasClass('magicBtn-active'))) $(this).toggleClass('magicBtn-active', 100)
}
, hide: function() { }
this.$element.hide() $el.hoverIntent(config)
}
}
, toggle: function () {
var $el = this.$element }
if (!this.$isToggled) {
$el.css('background-image', this.$toggleImgUrl)
this.$isToggled = true /* BUTTON PLUGIN DEFINITION
$el.addClass('magicBtn-active') * ======================== */
}
else { $.fn.magicBtn = function (option) {
$el.css('background-image', this.$imgUrl) return this.each(function () {
this.$isToggled = false var $this = $(this),
$el.removeClass('magicBtn-active') data = $this.data('magicBtn'),
} options = typeof option == 'object' && option
} if (!data) $this.data('magicBtn', (data = new MagicBtn(this, options)))
data.calculatePosition('right')
, addHover: function () { if (option == 'toggle') data.toggle()
var $el = this.$element if (option == 'show') data.show()
var obj = this if (option == 'hide') data.hide()
var config = { else if (option) data.setState(option)
over: function () {
if (!obj.$isToggled) })
$(this).toggleClass('magicBtn-active') }
},
timeout: 1, $.fn.magicBtn.defaults = {
out: function () { loadingText: 'loading...',
if ((!obj.$isToggled) && direction: 'right',
(!$el.is(':hover')) && betweenSpace: 2,
($el.hasClass('magicBtn-active'))) alignement: 'center',
$(this).toggleClass('magicBtn-active', 100) hover: false
} }
}
$el.hoverIntent( config ) $.fn.magicBtn.Constructor = MagicBtn
}
/* BUTTON DATA-API
} * =============== */
$(function () {
/* BUTTON PLUGIN DEFINITION $('body').on('click.magicBtn.data-api', '[data-toggle^=magicBtn]', function (e) {
* ======================== */ var $btn = $(e.target)
if (!$btn.hasClass('magicBtn')) $btn = $btn.closest('.magicBtn')
$.fn.magicBtn = function ( option ) { $btn.magicBtn('toggle')
return this.each(function () { })
var $this = $(this)
, data = $this.data('magicBtn')
, options = typeof option == 'object' && option
if (!data) $this.data('magicBtn', (data = new MagicBtn(this, options)))
data.calculatePosition('right')
if (option == 'toggle') data.toggle()
if (option == 'show') data.show()
if (option == 'hide') data.hide()
else if (option) data.setState(option)
}) })
}
$.fn.magicBtn.defaults = { }(window.jQuery);
loadingText: 'loading...',
direction: 'right',
betweenSpace: 2,
alignement: 'center',
hover: false
}
$.fn.magicBtn.Constructor = MagicBtn
/* BUTTON DATA-API
* =============== */
$(function () {
$('body').on('click.magicBtn.data-api', '[data-toggle^=magicBtn]', function ( e ) {
var $btn = $(e.target)
if (!$btn.hasClass('magicBtn')) $btn = $btn.closest('.magicBtn')
$btn.magicBtn('toggle')
})
})
}( window.jQuery );
Write Preview
Loading…
Cancel
Save