Comparing version 1.3.0 to 1.3.1
@@ -43,2 +43,9 @@ !========_ Version 1.1 _========! | ||
°Added the ripple-cancel-on-move attribute | ||
°You can unregister a ripple now by removing the ripple class | ||
°You can unregister a ripple now by removing the ripple class | ||
!========_ Version 1.3.1 _========! | ||
°Bug where ripples would not start fixed |
{ | ||
"name": "ripple-js", | ||
"version": "1.3.0", | ||
"version": "1.3.1", | ||
"description": "A small library for ripple effects", | ||
@@ -5,0 +5,0 @@ "main": "ripple.min.js", |
@@ -49,2 +49,5 @@ //Written by Aaron Längert | ||
rippleContainer = getRippleContainer(e.target); | ||
if (rippleContainer.style.transform == "translate(-50%, -50%) scale(0)") { | ||
rippleContainer.setAttribute("animating", "0"); | ||
} | ||
if (rippleContainer.getAttribute("animating") == "1") { | ||
@@ -51,0 +54,0 @@ rippleContainer.setAttribute("animating", "3"); |
//Written by Aaron Längert | ||
var ripple=function(){function t(t){rippleContainer=r(t.target),("0"==rippleContainer.getAttribute("animating")||!rippleContainer.hasAttribute("animating"))&&t.target.className.indexOf("ripple")>-1&&(rippleContainer.setAttribute("animating","1"),offsetX="number"==typeof t.offsetX?t.offsetX:t.touches[0].clientX-t.target.getBoundingClientRect().left,offsetY="number"==typeof t.offsetY?t.offsetY:t.touches[0].clientY-t.target.getBoundingClientRect().top,fullCoverRadius=Math.max(Math.sqrt(Math.pow(offsetX,2)+Math.pow(offsetY,2)),Math.sqrt(Math.pow(t.target.clientWidth-offsetX,2)+Math.pow(t.target.clientHeight-offsetY,2)),Math.sqrt(Math.pow(offsetX,2)+Math.pow(t.target.clientHeight-offsetY,2)),Math.sqrt(Math.pow(offsetY,2)+Math.pow(t.target.clientWidth-offsetX,2))),expandTime=t.target.getAttribute("ripple-press-expand-time")||3,rippleContainer.style.transition="transform "+expandTime+"s ease-out, box-shadow 0.1s linear",rippleContainer.style.background=t.target.getAttribute("ripple-color")||"white",rippleContainer.style.opacity=t.target.getAttribute("ripple-opacity")||"0.6",rippleContainer.style.boxShadow=t.target.getAttribute("ripple-shadow")||"none",rippleContainer.style.top=offsetY+"px",rippleContainer.style.left=offsetX+"px",rippleContainer.style.transform="translate(-50%, -50%) scale("+fullCoverRadius/100+")")}function e(t){rippleContainer=r(t.target),"1"==rippleContainer.getAttribute("animating")&&(rippleContainer.setAttribute("animating","2"),background=window.getComputedStyle(rippleContainer,null).getPropertyValue("background"),destinationRadius=t.target.clientWidth+t.target.clientHeight,rippleContainer.style.transition="none",expandTime=t.target.getAttribute("ripple-release-expand-time")||.4,rippleContainer.style.transition="transform "+expandTime+"s linear, background "+expandTime+"s linear, opacity "+expandTime+"s ease-in-out",rippleContainer.style.transform="translate(-50%, -50%) scale("+destinationRadius/100+")",rippleContainer.style.background="radial-gradient(transparent 10%, "+background+" 40%)",rippleContainer.style.opacity="0",t.target.dispatchEvent(new CustomEvent("ripple-button-click",{target:t.target})))}function n(t){rippleContainer=r(t.target),"1"==rippleContainer.getAttribute("animating")&&(rippleContainer.setAttribute("animating","3"),collapseTime=t.target.getAttribute("ripple-leave-collapse-time")||.4,rippleContainer.style.transition="transform "+collapseTime+"s linear, box-shadow "+collapseTime+"s linear",rippleContainer.style.boxShadow="none",rippleContainer.style.transform="translate(-50%, -50%) scale(0)")}function r(t){for(childs=t.childNodes,ii=0;ii<childs.length;ii++)try{if(childs[ii].className.indexOf("rippleContainer")>-1)return childs[ii]}catch(e){}return t}window.addEventListener("load",function(){css=document.createElement("style"),css.type="text/css",css.innerHTML=".ripple { overflow: hidden !important; position: relative; } .ripple .rippleContainer { display: block; height: 200px !important; width: 200px !important; padding: 0px 0px 0px 0px; border-radius: 50%; position: absolute !important; top: 0px; left: 0px; transform: translate(-50%, -50%) scale(0); -webkit-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); background-color: transparent; } .ripple * {pointer-events: none !important;}",document.head.appendChild(css),a.registerRipples()});var a={registerRipples:function(){for(rippleButtons=document.getElementsByClassName("ripple"),i=0;i<rippleButtons.length;i++)rippleButtons[i].addEventListener("touchstart",function(e){t(e)},!1),rippleButtons[i].addEventListener("touchmove",function(t){t.target.hasAttribute("ripple-cancel-on-move")&&n(t);try{overEl=document.elementFromPoint(t.touches[0].clientX,t.touches[0].clientY).className.indexOf("ripple")>=0}catch(e){overEl=!1}overEl||n(t)},!1),rippleButtons[i].addEventListener("touchend",function(t){e(t)},!1),rippleButtons[i].addEventListener("mousedown",function(e){t(e)},!1),rippleButtons[i].addEventListener("mouseup",function(t){e(t)},!1),rippleButtons[i].addEventListener("mousemove",function(t){t.target.hasAttribute("ripple-cancel-on-move")&&n(t)},!1),rippleButtons[i].addEventListener("mouseleave",function(t){n(t)},!1),rippleButtons[i].addEventListener("transitionend",function(t){("2"==t.target.getAttribute("animating")||"3"==t.target.getAttribute("animating"))&&(t.target.style.transition="none",t.target.style.transform="translate(-50%, -50%) scale(0)",t.target.style.boxShadow="none",t.target.setAttribute("animating","0"))},!1),r(rippleButtons[i])==rippleButtons[i]&&(rippleButtons[i].innerHTML+='<div class="rippleContainer"></div>')}};return a}(); | ||
var ripple=function(){function t(t){rippleContainer=r(t.target),("0"==rippleContainer.getAttribute("animating")||!rippleContainer.hasAttribute("animating"))&&t.target.className.indexOf("ripple")>-1&&(rippleContainer.setAttribute("animating","1"),offsetX="number"==typeof t.offsetX?t.offsetX:t.touches[0].clientX-t.target.getBoundingClientRect().left,offsetY="number"==typeof t.offsetY?t.offsetY:t.touches[0].clientY-t.target.getBoundingClientRect().top,fullCoverRadius=Math.max(Math.sqrt(Math.pow(offsetX,2)+Math.pow(offsetY,2)),Math.sqrt(Math.pow(t.target.clientWidth-offsetX,2)+Math.pow(t.target.clientHeight-offsetY,2)),Math.sqrt(Math.pow(offsetX,2)+Math.pow(t.target.clientHeight-offsetY,2)),Math.sqrt(Math.pow(offsetY,2)+Math.pow(t.target.clientWidth-offsetX,2))),expandTime=t.target.getAttribute("ripple-press-expand-time")||3,rippleContainer.style.transition="transform "+expandTime+"s ease-out, box-shadow 0.1s linear",rippleContainer.style.background=t.target.getAttribute("ripple-color")||"white",rippleContainer.style.opacity=t.target.getAttribute("ripple-opacity")||"0.6",rippleContainer.style.boxShadow=t.target.getAttribute("ripple-shadow")||"none",rippleContainer.style.top=offsetY+"px",rippleContainer.style.left=offsetX+"px",rippleContainer.style.transform="translate(-50%, -50%) scale("+fullCoverRadius/100+")")}function e(t){rippleContainer=r(t.target),"1"==rippleContainer.getAttribute("animating")&&(rippleContainer.setAttribute("animating","2"),background=window.getComputedStyle(rippleContainer,null).getPropertyValue("background"),destinationRadius=t.target.clientWidth+t.target.clientHeight,rippleContainer.style.transition="none",expandTime=t.target.getAttribute("ripple-release-expand-time")||.4,rippleContainer.style.transition="transform "+expandTime+"s linear, background "+expandTime+"s linear, opacity "+expandTime+"s ease-in-out",rippleContainer.style.transform="translate(-50%, -50%) scale("+destinationRadius/100+")",rippleContainer.style.background="radial-gradient(transparent 10%, "+background+" 40%)",rippleContainer.style.opacity="0",t.target.dispatchEvent(new CustomEvent("ripple-button-click",{target:t.target})))}function n(t){rippleContainer=r(t.target),"translate(-50%, -50%) scale(0)"==rippleContainer.style.transform&&rippleContainer.setAttribute("animating","0"),"1"==rippleContainer.getAttribute("animating")&&(rippleContainer.setAttribute("animating","3"),collapseTime=t.target.getAttribute("ripple-leave-collapse-time")||.4,rippleContainer.style.transition="transform "+collapseTime+"s linear, box-shadow "+collapseTime+"s linear",rippleContainer.style.boxShadow="none",rippleContainer.style.transform="translate(-50%, -50%) scale(0)")}function r(t){for(childs=t.childNodes,ii=0;ii<childs.length;ii++)try{if(childs[ii].className.indexOf("rippleContainer")>-1)return childs[ii]}catch(e){}return t}window.addEventListener("load",function(){css=document.createElement("style"),css.type="text/css",css.innerHTML=".ripple { overflow: hidden !important; position: relative; } .ripple .rippleContainer { display: block; height: 200px !important; width: 200px !important; padding: 0px 0px 0px 0px; border-radius: 50%; position: absolute !important; top: 0px; left: 0px; transform: translate(-50%, -50%) scale(0); -webkit-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); background-color: transparent; } .ripple * {pointer-events: none !important;}",document.head.appendChild(css),a.registerRipples()});var a={registerRipples:function(){for(rippleButtons=document.getElementsByClassName("ripple"),i=0;i<rippleButtons.length;i++)rippleButtons[i].addEventListener("touchstart",function(e){t(e)},!1),rippleButtons[i].addEventListener("touchmove",function(t){t.target.hasAttribute("ripple-cancel-on-move")&&n(t);try{overEl=document.elementFromPoint(t.touches[0].clientX,t.touches[0].clientY).className.indexOf("ripple")>=0}catch(e){overEl=!1}overEl||n(t)},!1),rippleButtons[i].addEventListener("touchend",function(t){e(t)},!1),rippleButtons[i].addEventListener("mousedown",function(e){t(e)},!1),rippleButtons[i].addEventListener("mouseup",function(t){e(t)},!1),rippleButtons[i].addEventListener("mousemove",function(t){t.target.hasAttribute("ripple-cancel-on-move")&&n(t)},!1),rippleButtons[i].addEventListener("mouseleave",function(t){n(t)},!1),rippleButtons[i].addEventListener("transitionend",function(t){("2"==t.target.getAttribute("animating")||"3"==t.target.getAttribute("animating"))&&(t.target.style.transition="none",t.target.style.transform="translate(-50%, -50%) scale(0)",t.target.style.boxShadow="none",t.target.setAttribute("animating","0"))},!1),r(rippleButtons[i])==rippleButtons[i]&&(rippleButtons[i].innerHTML+='<div class="rippleContainer"></div>')}};return a}(); |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
141338
128