amorfo77/sogo
1
0
Fork 0
mirror of https://github.com/inverse-inc/sogo.git synced 2026-08-21 22:53:18 +00:00
Code Issues Projects Releases Wiki Activity

(js, css) Improve sg-ripple-click directive

Browse Source
This commit is contained in:
Francis Lachapelle
2016-08-01 12:13:11 -04:00
parent 0ec79e0411
commit 8389ec5f40
2 changed files with 27 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
UI/WebServerResources/js/Common/sgRippleClick.directive.js
+24 -9
View File
@@ -70,27 +70,42 @@
element.on('click', listener);
function listener(event) {
var coordinates;
if (element[0].hasAttribute('disabled')) {
return;
}
if (event.pageX && event.pageY) {
// Event is a mouse click
coordinates = { left: event.pageX, top: event.pageY };
}
else {
// Event is a form submit; target is the submit button
coordinates = event.target.getBoundingClientRect();
}
if (content.classList.contains('ng-hide')) {
// Show ripple
angular.element(container).css({ 'overflow': 'hidden' });
content.classList.remove('ng-hide');
angular.element(content).css({ top: container.scrollTop + 'px' });
ripple.css({
'top': (event.pageY - container.offsetTop + container.scrollTop) + 'px',
'left': (event.pageX - container.offsetLeft) + 'px',
'width': '400vmin',
'height': '400vmin'
});
$timeout(function() {
// Wait until next digest for CSS animation to work
ripple.css({
'top': (coordinates.top - container.offsetTop + container.scrollTop) + 'px',
'left': (coordinates.left - container.offsetLeft) + 'px',
'height': '400vmin',
'width': '400vmin'
});
// Show ripple content
content.classList.remove('ng-hide');
});
}
else {
// Hide ripple layer
ripple.css({
'top': (event.pageY - container.offsetTop + container.scrollTop) + 'px',
'left': (event.pageX - container.offsetLeft) + 'px',
'top': (coordinates.top - container.offsetTop + container.scrollTop) + 'px',
'left': (coordinates.left - container.offsetLeft) + 'px',
'height': '0px',
'width': '0px'
});