22

✏️ Editing: ripple.js

/*
 * Ripple Effect
 */

jQuery(function($){
	"use strict";

$ripple.on("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){
			setTimeout(function(){
				$ripple.remove();
			}, 300);
		});
	};

$.fn.mdRipple = function(){
		return this.each(function(){
			var $element = $( this ),
				$container, containerOffset;

if (!$element.find('.ripple-container').length) {
				$element.append('<span class="ripple-container"></span>');
			}

$container = $element.find(".ripple-container");

// Storing last touch event for touchEnd coordinates
			var lastTouch = null;
			if ($.isMobile) {
				$element.on('touchstart touchmove', function(e){
					e = e.originalEvent;
					if (e.touches.length === 1) {
						lastTouch = e.touches[0];
					}
				});
			}

$element.on($.isMobile ? 'touchstart' : 'mousedown', function(e){
				if (e.button === 2) return false;
				var offsetLeft, offsetTop, offsetRight,
					$ripple = $( '<span class="ripple"></span>' ),
					rippleSize = Math.max($element.outerWidth(), $element.outerHeight()) / Math.max(20, $ripple.outerWidth()) * 2.5;
				containerOffset = $container.offset();
				$container.append($ripple);

// get pointer position
				if (!$.isMobile) {
					offsetLeft = e.pageX - containerOffset.left;
					offsetTop = e.pageY - containerOffset.top;
				} else if (lastTouch !== null) {
					offsetLeft = lastTouch.pageX - containerOffset.left;
					offsetTop = lastTouch.pageY - containerOffset.top;
					lastTouch = null;
				} else {
					return;
				}

if ( $('body').hasClass('rtl') ) {
					offsetRight = $container.width() - offsetLeft;
					$ripple.css({right: offsetRight, top: offsetTop});
				} else {
					$ripple.css({left: offsetLeft, top: offsetTop});
				}

(function(){
					return window.getComputedStyle($ripple[0]).opacity;
				})();

$element.on($.isMobile ? 'touchend' : 'mouseup mouseleave', function(e){
					removeRipple($ripple);
				});

$ripple.css({
					"transform": "scale(" + rippleSize + ")"
				});
				$ripple.addClass('ripple-on');
				$ripple.data('ripple-time', Date.now());
			});
		});
	};

// Initialize MD Ripples
	jQuery('.w-toplink, .w-btn[href], a.w-nav-anchor[href], .w-grid-item-anchor[rel], .w-gallery-item[href], .g-filters-item, .w-iconbox.style_circle a[href] .w-iconbox-icon, .w-socials-item-link[href], .w-sharing-item[href], .w-tabs-item, .w-message-close, .post_navigation.layout_sided > a, .w-ibanner > a, .vc_column-link').mdRipple();

});

MR SKB