mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2025-07-12 01:02:19 +03:00
Code Issues Packages Projects Releases Wiki Activity

Update ripples.js

Browse Source
This commit is contained in:
Fez Vrasta 2014-08-25 17:09:09 +02:00
parent b18d49141b
commit 24bb10b550
1 changed files with 89 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
material/ripples.js
View File

@ -4,6 +4,10 @@ var ripples = {
init : function(withRipple) {
"use strict";
// animations time
var rippleOutTime = 100,
rippleStartTime = 500;
// Helper to bind events on dynamically created elements
var bind = function(event, selector, callback) {
document.addEventListener(event, function(e) {
@ -53,7 +57,7 @@ var ripples = {
$ripple.dataset.animating = 0;
document.dispatchEvent(rippleEnd);
}, 500);
}, rippleStartTime);
};
@ -64,7 +68,7 @@ var ripples = {
// Let ripple fade out (with CSS)
setTimeout(function() {
$ripple.remove();
}, 1000);
}, rippleOutTime);
};
// Helper, need to know if mouse is up or down
@ -93,15 +97,15 @@ var ripples = {
// init RippleJS and start ripple effect on mousedown
bind("mousedown", withRipple, rippleInit);
// start ripple effect on mousedown
bind("mousedown", ".ripple-wrapper, .ripple", rippleStart);
bind("mousedown", ".ripple-wrapper, .ripple-wrapper .ripple", rippleStart);
// if animation ends and user is not holding mouse then destroy the ripple
bind("rippleEnd", ".ripple-wrapper, .ripple", function(e, $ripple) {
bind("rippleEnd", ".ripple-wrapper, .ripple-wrapper .ripple", function(e, $ripple) {
if (!mouseDown) {
rippleOut($ripple);
}
});
// Destroy ripple when mouse is not holded anymore if the ripple still exists
bind("mouseup", ".ripple-wrapper, .ripple", function(e, $ripple) {
bind("mouseup", ".ripple-wrapper, .ripple-wrapper .ripple", function(e, $ripple) {
if ($ripple.dataset.animating != 1) {
rippleOut($ripple);
}