Skip to content

B
bootstrap
Commit 1b183e2f authored by fat's avatar fat
Browse files
Options

carousel -> es6

parent 66050518
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 962 additions and 233 deletions
Gruntfile.js
View file @ 1b183e2f
......@@ -66,6 +66,7 @@ module.exports = function (grunt) {
'js/dist/util.js': 'js/src/util.js',
'js/dist/alert.js': 'js/src/alert.js',
'js/dist/button.js': 'js/src/button.js',
'js/dist/carousel.js': 'js/src/carousel.js',
}
}
},
......
js/button.js deleted 100644 → 0
View file @ 66050518
/* ========================================================================
* Bootstrap: button.js v3.3.4
* http://getbootstrap.com/javascript/#buttons
* ========================================================================
* Copyright 2011-2015 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* ======================================================================== */
+function ($) {
'use strict';
// BUTTON PUBLIC CLASS DEFINITION
// ==============================
var Button = function (element, options) {
this.$element = $(element)
this.options = $.extend({}, Button.DEFAULTS, options)
this.isLoading = false
}
Button.VERSION = '3.3.4'
Button.DEFAULTS = {
loadingText: 'loading...'
}
Button.prototype.setState = function (state) {
var d = 'disabled'
var $el = this.$element
var val = $el.is('input') ? 'val' : 'html'
var data = $el.data()
state += 'Text'
if (data.resetText == null) $el.data('resetText', $el[val]())
// push to event loop to allow forms to submit
setTimeout($.proxy(function () {
$el[val](data[state] == null ? this.options[state] : data[state])
if (state == 'loadingText') {
this.isLoading = true
$el.addClass(d).attr(d, d)
} else if (this.isLoading) {
this.isLoading = false
$el.removeClass(d).removeAttr(d)
}
}, this), 0)
}
Button.prototype.toggle = function () {
var changed = true
var $parent = this.$element.closest('[data-toggle="buttons"]')
if ($parent.length) {
var $input = this.$element.find('input')
if ($input.prop('type') == 'radio') {
if ($input.prop('checked')) changed = false
$parent.find('.active').removeClass('active')
this.$element.addClass('active')
} else if ($input.prop('type') == 'checkbox') {
if (($input.prop('checked')) !== this.$element.hasClass('active')) changed = false
this.$element.toggleClass('active')
}
$input.prop('checked', this.$element.hasClass('active'))
if (changed) $input.trigger('change')
} else {
this.$element.attr('aria-pressed', !this.$element.hasClass('active'))
this.$element.toggleClass('active')
}
}
// BUTTON PLUGIN DEFINITION
// ========================
function Plugin(option) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.button')
var options = typeof option == 'object' && option
if (!data) $this.data('bs.button', (data = new Button(this, options)))
if (option == 'toggle') data.toggle()
else if (option) data.setState(option)
})
}
var old = $.fn.button
$.fn.button = Plugin
$.fn.button.Constructor = Button
// BUTTON NO CONFLICT
// ==================
$.fn.button.noConflict = function () {
$.fn.button = old
return this
}
// BUTTON DATA-API
// ===============
$(document)
.on('click.bs.button.data-api', '[data-toggle^="button"]', function (e) {
var $btn = $(e.target)
if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')
Plugin.call($btn, 'toggle')
if (!($(e.target).is('input[type="radio"]') || $(e.target).is('input[type="checkbox"]'))) e.preventDefault()
})
.on('focus.bs.button.data-api blur.bs.button.data-api', '[data-toggle^="button"]', function (e) {
$(e.target).closest('.btn').toggleClass('focus', /^focus(in)?$/.test(e.type))
})
}(jQuery);
js/dist/alert.js
View file @ 1b183e2f
......@@ -51,9 +51,7 @@ var Alert = (function ($) {
function Alert(element) {
_classCallCheck(this, Alert);
if (element) {
this.element = element;
}
this._element = element;
}
_createClass(Alert, [{
......@@ -62,7 +60,7 @@ var Alert = (function ($) {
// public
value: function close(element) {
element = element || this.element;
element = element || this._element;
var rootElement = this._getRootElement(element);
var customEvent = this._triggerCloseEvent(rootElement);
......
js/dist/alert.js.map
View file @ 1b183e2f
This diff was suppressed by a .gitattributes entry.
js/dist/button.js
View file @ 1b183e2f
......@@ -54,7 +54,7 @@ var Button = (function ($) {
function Button(element) {
_classCallCheck(this, Button);
this.element = element;
this._element = element;
}
_createClass(Button, [{
......@@ -64,14 +64,14 @@ var Button = (function ($) {
value: function toggle() {
var triggerChangeEvent = true;
var rootElement = $(this.element).closest(Selector.DATA_TOGGLE)[0];
var rootElement = $(this._element).closest(Selector.DATA_TOGGLE)[0];
if (rootElement) {
var input = $(this.element).find(Selector.INPUT)[0];
var input = $(this._element).find(Selector.INPUT)[0];
if (input) {
if (input.type === 'radio') {
if (input.checked && $(this.element).hasClass(ClassName.ACTIVE)) {
if (input.checked && $(this._element).hasClass(ClassName.ACTIVE)) {
triggerChangeEvent = false;
} else {
var activeElement = $(rootElement).find(Selector.ACTIVE)[0];
......@@ -83,16 +83,16 @@ var Button = (function ($) {
}
if (triggerChangeEvent) {
input.checked = !$(this.element).hasClass(ClassName.ACTIVE);
$(this.element).trigger('change');
input.checked = !$(this._element).hasClass(ClassName.ACTIVE);
$(this._element).trigger('change');
}
}
} else {
this.element.setAttribute('aria-pressed', !$(this.element).hasClass(ClassName.ACTIVE));
this._element.setAttribute('aria-pressed', !$(this._element).hasClass(ClassName.ACTIVE));
}
if (triggerChangeEvent) {
$(this.element).toggleClass(ClassName.ACTIVE);
$(this._element).toggleClass(ClassName.ACTIVE);
}
}
}], [{
......
js/dist/button.js.map
View file @ 1b183e2f
This diff was suppressed by a .gitattributes entry.
js/dist/carousel.js 0 → 100644
View file @ 1b183e2f
This diff is collapsed.
js/dist/carousel.js.map 0 → 100644
View file @ 1b183e2f
This diff was suppressed by a .gitattributes entry.
js/dist/util.js
View file @ 1b183e2f
......@@ -63,7 +63,7 @@ var Util = (function ($) {
setTimeout(function () {
if (!called) {
$(_this).trigger(transition.end);
Util.triggerTransitionEnd(_this);
}
}, duration);
......@@ -110,6 +110,10 @@ var Util = (function ($) {
new Function('bs', 'return bs')(element.offsetHeight);
},
triggerTransitionEnd: function triggerTransitionEnd(element) {
$(element).trigger(transition.end);
},
supportsTransitionEnd: function supportsTransitionEnd() {
return !!transition;
}
......
js/dist/util.js.map
View file @ 1b183e2f
This diff was suppressed by a .gitattributes entry.
js/src/alert.js
View file @ 1b183e2f
......@@ -49,16 +49,14 @@ const Alert = (($) => {
class Alert {
constructor(element) {
if (element) {
this.element = element
}
this._element = element
}
// public
close(element) {
element = element || this.element
element = element || this._element
let rootElement = this._getRootElement(element)
let customEvent = this._triggerCloseEvent(rootElement)
......
js/src/button.js
View file @ 1b183e2f
......@@ -49,24 +49,24 @@ const Button = (($) => {
class Button {
constructor(element) {
this.element = element
this._element = element
}
// public
toggle() {
let triggerChangeEvent = true
let rootElement = $(this.element).closest(
let rootElement = $(this._element).closest(
Selector.DATA_TOGGLE
)[0]
if (rootElement) {
let input = $(this.element).find(Selector.INPUT)[0]
let input = $(this._element).find(Selector.INPUT)[0]
if (input) {
if (input.type === 'radio') {
if (input.checked &&
$(this.element).hasClass(ClassName.ACTIVE)) {
$(this._element).hasClass(ClassName.ACTIVE)) {
triggerChangeEvent = false
} else {
......@@ -79,17 +79,17 @@ const Button = (($) => {
}
if (triggerChangeEvent) {
input.checked = !$(this.element).hasClass(ClassName.ACTIVE)
$(this.element).trigger('change')
input.checked = !$(this._element).hasClass(ClassName.ACTIVE)
$(this._element).trigger('change')
}
}
} else {
this.element.setAttribute('aria-pressed',
!$(this.element).hasClass(ClassName.ACTIVE))
this._element.setAttribute('aria-pressed',
!$(this._element).hasClass(ClassName.ACTIVE))
}
if (triggerChangeEvent) {
$(this.element).toggleClass(ClassName.ACTIVE)
$(this._element).toggleClass(ClassName.ACTIVE)
}
}
......
js/src/carousel.js 0 → 100644
View file @ 1b183e2f
This diff is collapsed.
js/src/util.js
View file @ 1b183e2f
......@@ -60,7 +60,7 @@ const Util = (($) => {
setTimeout(() => {
if (!called) {
$(this).trigger(transition.end)
Util.triggerTransitionEnd(this)
}
}, duration)
......@@ -109,6 +109,10 @@ const Util = (($) => {
new Function('bs', 'return bs')(element.offsetHeight)
},
triggerTransitionEnd(element) {
$(element).trigger(transition.end)
},
supportsTransitionEnd() {
return !!transition
}
......
js/tests/index.html
View file @ 1b183e2f
......@@ -133,9 +133,9 @@
<script src="../../js/dist/util.js"></script>
<script src="../../js/dist/alert.js"></script>
<script src="../../js/dist/button.js"></script>
<script src="../../js/dist/carousel.js"></script>
<!-- Old Plugin sources -->
<script src="../../js/carousel.js"></script>
<script src="../../js/collapse.js"></script>
<script src="../../js/dropdown.js"></script>
<script src="../../js/modal.js"></script>
......
js/tests/unit/carousel.js
View file @ 1b183e2f
This diff is collapsed.
js/tests/visual/carousel.html
View file @ 1b183e2f
......@@ -29,13 +29,13 @@
<li data-target="#carousel-example-generic" data-slide-to="2" class=""></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<div class="carousel-item active">
<img alt="First slide" src="http://37.media.tumblr.com/tumblr_m8tay0JcfG1qa42jro1_1280.jpg">
</div>
<div class="item">
<div class="carousel-item">
<img alt="Second slide" src="http://37.media.tumblr.com/tumblr_m8tazfiVYJ1qa42jro1_1280.jpg">
</div>
<div class="item">
<div class="carousel-item">
<img alt="Third slide" src="http://38.media.tumblr.com/tumblr_m8tb2rVsD31qa42jro1_1280.jpg">
</div>
</div>
......@@ -51,8 +51,8 @@
<!-- JavaScript Includes -->
<script src="../vendor/jquery.min.js"></script>
<script src="../../transition.js"></script>
<script src="../../carousel.js"></script>
<script src="../../dist/util.js"></script>
<script src="../../dist/carousel.js"></script>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment