diff --git a/dist/js/ripples.js b/dist/js/ripples.js index 7175e58c..5bbd6069 100644 --- a/dist/js/ripples.js +++ b/dist/js/ripples.js @@ -46,7 +46,7 @@ window.ripples = { mousePos = {x: e.clientX - elPos.left, y: ((window.ontouchstart) ? e.clientY - window.scrollY: e.clientY) - elPos.top}, scale = "scale(" + Math.round($rippleWrapper.offsetWidth / 5) + ")", rippleEnd = new CustomEvent("rippleEnd", {detail: $ripple}), - _rippleOpacity = 0.1, + _rippleOpacity = 0.3, refreshElementStyle; @@ -62,7 +62,7 @@ window.ripples = { // Set ripple class $ripple.className = "ripple"; - // Move ripple to the mouse position + // Move ripple to the mouse position $ripple.setAttribute("style", "left:" + mousePos.x + "px; top:" + mousePos.y + "px;"); // Get the clicked target's text color, this will be applied to the ripple as background-color. @@ -72,7 +72,7 @@ window.ripples = { targetColor = targetColor.replace("rgb", "rgba").replace(")", ", " + _rippleOpacity + ")"); // Insert new ripple into ripple wrapper - $rippleWrapper.appendChild($ripple); + $rippleWrapper.appendChild($ripple); // Make sure the ripple has the class applied (ugly hack but it works) refreshElementStyle = window.getComputedStyle($ripple).opacity; diff --git a/dist/js/ripples.min.js b/dist/js/ripples.min.js index 39fe352e..305f7305 100644 --- a/dist/js/ripples.min.js +++ b/dist/js/ripples.min.js @@ -1 +1 @@ -window.ripples={init:function(a){"use strict";function b(a,b){var c=a.matches||a.matchesSelector||a.webkitMatchesSelector||a.mozMatchesSelector||a.msMatchesSelector||a.oMatchesSelector;return c.call(a,b)}var c=100,d=500,e=function(a,c,d){"string"==typeof a&&(a=[a]),a.forEach(function(a){document.addEventListener(a,function(a){var e="number"!=typeof a.detail?a.detail:a.target;b(e,c)&&d(a,e)})})},f=function(a,b,c){var e,f=b,g=f.parentNode,h=document.createElement("div"),j=g.getBoundingClientRect(),k={x:a.clientX-j.left,y:(window.ontouchstart?a.clientY-window.scrollY:a.clientY)-j.top},l="scale("+Math.round(f.offsetWidth/5)+")",m=new CustomEvent("rippleEnd",{detail:h}),n=.1;a.touches&&(k={x:a.touches[0].clientX-j.left,y:a.touches[0].clientY-j.top}),console.log(k),i=h,h.className="ripple",h.setAttribute("style","left:"+k.x+"px; top:"+k.y+"px;");var o=window.getComputedStyle(g).color;o=o.replace("rgb","rgba").replace(")",", "+n+")"),f.appendChild(h),e=window.getComputedStyle(h).opacity,h.dataset.animating=1,h.className="ripple ripple-on";var p=[h.getAttribute("style"),"background-color: "+o,"-ms-transform: "+l,"-moz-transform"+l,"-webkit-transform"+l,"transform: "+l];h.setAttribute("style",p.join(";")),setTimeout(function(){h.dataset.animating=0,document.dispatchEvent(m),c&&c()},d)},g=function(a){a.className="ripple ripple-on ripple-out",setTimeout(function(){a.remove()},c)},h=!1;e(["mousedown","touchstart"],"*",function(){h=!0}),e(["mouseup","touchend"],"*",function(){h=!1});var i,j=function(a,b){if(0===b.getElementsByClassName("ripple-wrapper").length){b.className+=" withripple";var c=document.createElement("div");c.className="ripple-wrapper",b.appendChild(c),null===window.ontouchstart&&f(a,c,function(){c.getElementsByClassName("ripple")[0].remove()})}};e(["mouseover","touchstart"],a,j),e(["mousedown","touchstart"],".ripple-wrapper",function(a,b){(0===a.which||1===a.which||2===a.which)&&f(a,b)}),e("rippleEnd",".ripple-wrapper .ripple",function(a,b){var c=b.parentNode.getElementsByClassName("ripple");(!h||c[0]==b&&c.length>1)&&g(b)}),e(["mouseup","touchend"],".ripple-wrapper",function(){var a=i;a&&1!=a.dataset.animating&&g(a)})}}; \ No newline at end of file +window.ripples={init:function(a){"use strict";function b(a,b){var c=a.matches||a.matchesSelector||a.webkitMatchesSelector||a.mozMatchesSelector||a.msMatchesSelector||a.oMatchesSelector;return c.call(a,b)}var c=100,d=500,e=function(a,c,d){"string"==typeof a&&(a=[a]),a.forEach(function(a){document.addEventListener(a,function(a){var e="number"!=typeof a.detail?a.detail:a.target;b(e,c)&&d(a,e)})})},f=function(a,b,c){var e,f=b,g=f.parentNode,h=document.createElement("div"),j=g.getBoundingClientRect(),k={x:a.clientX-j.left,y:(window.ontouchstart?a.clientY-window.scrollY:a.clientY)-j.top},l="scale("+Math.round(f.offsetWidth/5)+")",m=new CustomEvent("rippleEnd",{detail:h}),n=.3;a.touches&&(k={x:a.touches[0].clientX-j.left,y:a.touches[0].clientY-j.top}),console.log(k),i=h,h.className="ripple",h.setAttribute("style","left:"+k.x+"px; top:"+k.y+"px;");var o=window.getComputedStyle(g).color;o=o.replace("rgb","rgba").replace(")",", "+n+")"),f.appendChild(h),e=window.getComputedStyle(h).opacity,h.dataset.animating=1,h.className="ripple ripple-on";var p=[h.getAttribute("style"),"background-color: "+o,"-ms-transform: "+l,"-moz-transform"+l,"-webkit-transform"+l,"transform: "+l];h.setAttribute("style",p.join(";")),setTimeout(function(){h.dataset.animating=0,document.dispatchEvent(m),c&&c()},d)},g=function(a){a.className="ripple ripple-on ripple-out",setTimeout(function(){a.remove()},c)},h=!1;e(["mousedown","touchstart"],"*",function(){h=!0}),e(["mouseup","touchend"],"*",function(){h=!1});var i,j=function(a,b){if(0===b.getElementsByClassName("ripple-wrapper").length){b.className+=" withripple";var c=document.createElement("div");c.className="ripple-wrapper",b.appendChild(c),null===window.ontouchstart&&f(a,c,function(){c.getElementsByClassName("ripple")[0].remove()})}};e(["mouseover","touchstart"],a,j),e(["mousedown","touchstart"],".ripple-wrapper",function(a,b){(0===a.which||1===a.which||2===a.which)&&f(a,b)}),e("rippleEnd",".ripple-wrapper .ripple",function(a,b){var c=b.parentNode.getElementsByClassName("ripple");(!h||c[0]==b&&c.length>1)&&g(b)}),e(["mouseup","touchend"],".ripple-wrapper",function(){var a=i;a&&1!=a.dataset.animating&&g(a)})}}; diff --git a/scripts/ripples.js b/scripts/ripples.js index 7175e58c..5bbd6069 100644 --- a/scripts/ripples.js +++ b/scripts/ripples.js @@ -46,7 +46,7 @@ window.ripples = { mousePos = {x: e.clientX - elPos.left, y: ((window.ontouchstart) ? e.clientY - window.scrollY: e.clientY) - elPos.top}, scale = "scale(" + Math.round($rippleWrapper.offsetWidth / 5) + ")", rippleEnd = new CustomEvent("rippleEnd", {detail: $ripple}), - _rippleOpacity = 0.1, + _rippleOpacity = 0.3, refreshElementStyle; @@ -62,7 +62,7 @@ window.ripples = { // Set ripple class $ripple.className = "ripple"; - // Move ripple to the mouse position + // Move ripple to the mouse position $ripple.setAttribute("style", "left:" + mousePos.x + "px; top:" + mousePos.y + "px;"); // Get the clicked target's text color, this will be applied to the ripple as background-color. @@ -72,7 +72,7 @@ window.ripples = { targetColor = targetColor.replace("rgb", "rgba").replace(")", ", " + _rippleOpacity + ")"); // Insert new ripple into ripple wrapper - $rippleWrapper.appendChild($ripple); + $rippleWrapper.appendChild($ripple); // Make sure the ripple has the class applied (ugly hack but it works) refreshElementStyle = window.getComputedStyle($ripple).opacity; diff --git a/template/material/js/ripples.js b/template/material/js/ripples.js index 7175e58c..5bbd6069 100644 --- a/template/material/js/ripples.js +++ b/template/material/js/ripples.js @@ -46,7 +46,7 @@ window.ripples = { mousePos = {x: e.clientX - elPos.left, y: ((window.ontouchstart) ? e.clientY - window.scrollY: e.clientY) - elPos.top}, scale = "scale(" + Math.round($rippleWrapper.offsetWidth / 5) + ")", rippleEnd = new CustomEvent("rippleEnd", {detail: $ripple}), - _rippleOpacity = 0.1, + _rippleOpacity = 0.3, refreshElementStyle; @@ -62,7 +62,7 @@ window.ripples = { // Set ripple class $ripple.className = "ripple"; - // Move ripple to the mouse position + // Move ripple to the mouse position $ripple.setAttribute("style", "left:" + mousePos.x + "px; top:" + mousePos.y + "px;"); // Get the clicked target's text color, this will be applied to the ripple as background-color. @@ -72,7 +72,7 @@ window.ripples = { targetColor = targetColor.replace("rgb", "rgba").replace(")", ", " + _rippleOpacity + ")"); // Insert new ripple into ripple wrapper - $rippleWrapper.appendChild($ripple); + $rippleWrapper.appendChild($ripple); // Make sure the ripple has the class applied (ugly hack but it works) refreshElementStyle = window.getComputedStyle($ripple).opacity; diff --git a/template/material/js/ripples.min.js b/template/material/js/ripples.min.js index 39fe352e..305f7305 100644 --- a/template/material/js/ripples.min.js +++ b/template/material/js/ripples.min.js @@ -1 +1 @@ -window.ripples={init:function(a){"use strict";function b(a,b){var c=a.matches||a.matchesSelector||a.webkitMatchesSelector||a.mozMatchesSelector||a.msMatchesSelector||a.oMatchesSelector;return c.call(a,b)}var c=100,d=500,e=function(a,c,d){"string"==typeof a&&(a=[a]),a.forEach(function(a){document.addEventListener(a,function(a){var e="number"!=typeof a.detail?a.detail:a.target;b(e,c)&&d(a,e)})})},f=function(a,b,c){var e,f=b,g=f.parentNode,h=document.createElement("div"),j=g.getBoundingClientRect(),k={x:a.clientX-j.left,y:(window.ontouchstart?a.clientY-window.scrollY:a.clientY)-j.top},l="scale("+Math.round(f.offsetWidth/5)+")",m=new CustomEvent("rippleEnd",{detail:h}),n=.1;a.touches&&(k={x:a.touches[0].clientX-j.left,y:a.touches[0].clientY-j.top}),console.log(k),i=h,h.className="ripple",h.setAttribute("style","left:"+k.x+"px; top:"+k.y+"px;");var o=window.getComputedStyle(g).color;o=o.replace("rgb","rgba").replace(")",", "+n+")"),f.appendChild(h),e=window.getComputedStyle(h).opacity,h.dataset.animating=1,h.className="ripple ripple-on";var p=[h.getAttribute("style"),"background-color: "+o,"-ms-transform: "+l,"-moz-transform"+l,"-webkit-transform"+l,"transform: "+l];h.setAttribute("style",p.join(";")),setTimeout(function(){h.dataset.animating=0,document.dispatchEvent(m),c&&c()},d)},g=function(a){a.className="ripple ripple-on ripple-out",setTimeout(function(){a.remove()},c)},h=!1;e(["mousedown","touchstart"],"*",function(){h=!0}),e(["mouseup","touchend"],"*",function(){h=!1});var i,j=function(a,b){if(0===b.getElementsByClassName("ripple-wrapper").length){b.className+=" withripple";var c=document.createElement("div");c.className="ripple-wrapper",b.appendChild(c),null===window.ontouchstart&&f(a,c,function(){c.getElementsByClassName("ripple")[0].remove()})}};e(["mouseover","touchstart"],a,j),e(["mousedown","touchstart"],".ripple-wrapper",function(a,b){(0===a.which||1===a.which||2===a.which)&&f(a,b)}),e("rippleEnd",".ripple-wrapper .ripple",function(a,b){var c=b.parentNode.getElementsByClassName("ripple");(!h||c[0]==b&&c.length>1)&&g(b)}),e(["mouseup","touchend"],".ripple-wrapper",function(){var a=i;a&&1!=a.dataset.animating&&g(a)})}}; \ No newline at end of file +window.ripples={init:function(a){"use strict";function b(a,b){var c=a.matches||a.matchesSelector||a.webkitMatchesSelector||a.mozMatchesSelector||a.msMatchesSelector||a.oMatchesSelector;return c.call(a,b)}var c=100,d=500,e=function(a,c,d){"string"==typeof a&&(a=[a]),a.forEach(function(a){document.addEventListener(a,function(a){var e="number"!=typeof a.detail?a.detail:a.target;b(e,c)&&d(a,e)})})},f=function(a,b,c){var e,f=b,g=f.parentNode,h=document.createElement("div"),j=g.getBoundingClientRect(),k={x:a.clientX-j.left,y:(window.ontouchstart?a.clientY-window.scrollY:a.clientY)-j.top},l="scale("+Math.round(f.offsetWidth/5)+")",m=new CustomEvent("rippleEnd",{detail:h}),n=.3;a.touches&&(k={x:a.touches[0].clientX-j.left,y:a.touches[0].clientY-j.top}),console.log(k),i=h,h.className="ripple",h.setAttribute("style","left:"+k.x+"px; top:"+k.y+"px;");var o=window.getComputedStyle(g).color;o=o.replace("rgb","rgba").replace(")",", "+n+")"),f.appendChild(h),e=window.getComputedStyle(h).opacity,h.dataset.animating=1,h.className="ripple ripple-on";var p=[h.getAttribute("style"),"background-color: "+o,"-ms-transform: "+l,"-moz-transform"+l,"-webkit-transform"+l,"transform: "+l];h.setAttribute("style",p.join(";")),setTimeout(function(){h.dataset.animating=0,document.dispatchEvent(m),c&&c()},d)},g=function(a){a.className="ripple ripple-on ripple-out",setTimeout(function(){a.remove()},c)},h=!1;e(["mousedown","touchstart"],"*",function(){h=!0}),e(["mouseup","touchend"],"*",function(){h=!1});var i,j=function(a,b){if(0===b.getElementsByClassName("ripple-wrapper").length){b.className+=" withripple";var c=document.createElement("div");c.className="ripple-wrapper",b.appendChild(c),null===window.ontouchstart&&f(a,c,function(){c.getElementsByClassName("ripple")[0].remove()})}};e(["mouseover","touchstart"],a,j),e(["mousedown","touchstart"],".ripple-wrapper",function(a,b){(0===a.which||1===a.which||2===a.which)&&f(a,b)}),e("rippleEnd",".ripple-wrapper .ripple",function(a,b){var c=b.parentNode.getElementsByClassName("ripple");(!h||c[0]==b&&c.length>1)&&g(b)}),e(["mouseup","touchend"],".ripple-wrapper",function(){var a=i;a&&1!=a.dataset.animating&&g(a)})}};