Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

open and close events does not work on mobile #164

Open
nuryagdym opened this issue Mar 31, 2017 · 5 comments
Open

open and close events does not work on mobile #164

nuryagdym opened this issue Mar 31, 2017 · 5 comments

Comments

@nuryagdym
Copy link

nuryagdym commented Mar 31, 2017

On PC it is working, but on mobile when I click button ng-click="toggle()". $scope.checked value is always stay false, I dont know why but when I run it on mobile th value of $scope.checked should be reversed but it stays in same value.
edit:
This is issue occurs when close button is outside, and when I click that button it conflicts with click outside event thus it is not closing

@antonio-rodrigues
Copy link

Plus: on iPad devices the onBodyClick(e) is always called twice when clicking on a button/div to trigger the display.

@CosyStudios
Copy link

I believe this is something to do with the body click auto close function .
Setting ps-click-outside="false" seems to resolve this -

Presumbly this might be because of the phantom "double click" in some mobile browsers, particularly idevices.
...i.e the button is clicked , ps-open set to true , but then the body click handler is also fired

Could be resolved with a temporary ignore to the body click which then switches the behaviour back on after a timeout ?

@CosyStudios
Copy link

Perhaps ps-open could include a $scope.isopening = true;
and include a $timeout(function() {$scope.isopening = false;}, 500);

then
` function onBodyClick(e) {
var target = e.touches && e.touches[0] || e.target;
if(
isOpen &&
body.contains(target) &&
!slider.contains(target)
) {
isOpen = false;
scope.psOpen = false;
scope.$apply();
}

                    if(scope.psOpen) {
                        isOpen = true;
                    }
                }`

could be changed to

function onBodyClick(e) {
var target = e.touches && e.touches[0] || e.target;
if(
isOpen && (!$scope.isopening)
body.contains(target) &&
!slider.contains(target)
) {
isOpen = false;
scope.psOpen = false;
scope.$apply();
}

                    if(scope.psOpen) {
                        isOpen = true;
                    }
                }

@CosyStudios
Copy link

Just a punt..

@SergkeiM
Copy link

Hi

Change:
In function psOpen(slider, param) {
$document.on('touchend click', onBodyClick); to $document.on('click', onBodyClick);

In function psClose(slider, param) {
$document.off('touchend click', onBodyClick); to $document.off('click', onBodyClick);

Worked for me.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants