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

Popup defaultFocus speed #150

Open
seltix5 opened this issue Jul 2, 2017 · 12 comments
Open

Popup defaultFocus speed #150

seltix5 opened this issue Jul 2, 2017 · 12 comments

Comments

@seltix5
Copy link

seltix5 commented Jul 2, 2017

Hi,
When oppening a popup there is a delay between the click and the defaultFocus button to be focused, in a batch work it is not possible to do a quick [click] -> [enter] action because of the delay, resulting on a 2 button press (one by click and the second by enter press on the samme button).

Is there a way to reduce this delay?

thank you!

@MohammadYounes
Copy link
Owner

Hi,

This is due to waiting for the animation to end, and then the focus is set. You can reduce this by decreasing the In/Out animation duration. For example:

.alertify.ajs-in:not(.ajs-hidden) .ajs-dialog,
.alertify.ajs-out.ajs-hidden .ajs-dialog {
     animation-duration: 150ms;
}

Thanks.

@seltix5
Copy link
Author

seltix5 commented Jul 3, 2017

hi,
Thanks for the quick reply =).
I try the CSS modification and it does work but the lost of the animation is a sad cost =(
I'm using the "flipx" animation and for a short duration like this the animation is not there anymore...
I supose there is no tweak that i can try?
thanks!

@MohammadYounes
Copy link
Owner

Increase it gradually till you get a duration that best suits your use case.

@seltix5
Copy link
Author

seltix5 commented Jul 3, 2017

ok,
then, to log my final result, since the default time is ".5s" and this problem is only related to the "In animation" I add this class :

.alertify.ajs-in:not(.ajs-hidden) .ajs-dialog {
    animation-duration: 0.3s;
}

this is not the perfect solution but it will work for some fast typing people.
thank you!

@MohammadYounes
Copy link
Owner

Would disabling the animation work better?

@seltix5
Copy link
Author

seltix5 commented Jul 3, 2017

it would work better but not lock better. I do want the animation but i was trying to get a solution where the button get focus from the beggining and not at the end.
I think the user should be able to just press ENTER without needing to wait for the end of the animation.

@MohammadYounes
Copy link
Owner

@seltix5 The waiting is required due to .focus() having no effect on hidden elements. Thus we wait for the animation end to make sure the element is visible.

@seltix5
Copy link
Author

seltix5 commented Jul 3, 2017

yes I understand.
Maybe, is it possible to store the focused object and blur it on prompt open? this way if the enter key is pressed again it will not trigger the prompt again. Then on promp close, focus the stored object again.
Can I do that with events callback?
thanks

@MohammadYounes
Copy link
Owner

The issue is with releasing the key. If one of the dialog buttons receives focus immediately, it will fire keyup event and perform it's action.

I need to look further into this.

@seltix5
Copy link
Author

seltix5 commented Jul 4, 2017

since is not possible to focus the dialog button from the start, as you correctly said, because its not possible to focus hidden elements, maybe a workaround wold be to blur all focus on promp open

@AzzaAzza69
Copy link

How about on first show, if the element is focusable , focus it otherwise delay set focus when animation is finished?

@MohammadYounes
Copy link
Owner

@AzzaAzza69 See #150 (comment).

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

No branches or pull requests

3 participants