search

JillElaine / jquery-idleTimeout

Idle activity timeout and logout redirect for jQuery for multiple windows & tabs
Other
72 stars 79 forks source link

Unable to change dialogue on buttons, #44

Closed crayner closed 7 years ago

crayner commented 7 years ago

Hi, I set up and got it all working, but the code to change the button text seems to be ignored.

// idleTimeout
$(document).ready(function () {
    $(document).idleTimeout({
        redirectUrl:  '/app_dev.php/security/logout',
        idleTimeLimit: 840,
        dialogDisplayLimit: 60,
        activityEvents: 'click keypress scroll wheel mousewheel',
        sessionKeepAliveTimer: false,
        dialogTitle: 'Timed Sign Out',
        dialogText: 'No activitiy has been detected for 14 minutes.  You are about to be signed out of the system for security reasons.',
        dialogTimeRemaining: 'Time Remaining: ',
        dialogStayLoggedInButton: 'Stay Connected',
        dialogLogOutNowButton: 'Sign Out'
    });
});

The buttons still chow the default setting: All other string values display as per the example.

dialogStayLoggedInButton: 'Stay Logged In' - String dialogLogOutNowButton: 'Log Out Now' - String

Thanks so much for your work on this script.

Craig Rayner

JillElaine commented 7 years ago

Hmm, with the example configuration you posted above, the assignment of the button text works in my test box. If you had an un-espaced special character, missing comma or single quote, the script wouldn't work at all, so that's not the problem...and I'm sure you've already checked that. Your variable names in the example above are correctly typed.

Are you possibly setting the configuration of the idleTimeout function in more than one place?

What happens if you move the dialog button variables above the dialogText variable? Please let me know how this code works.

// idleTimeout
$(document).ready(function () {
    $(document).idleTimeout({
        redirectUrl:  '/app_dev.php/security/logout',
        idleTimeLimit: 840,
        dialogDisplayLimit: 60,
        activityEvents: 'click keypress scroll wheel mousewheel',
        sessionKeepAliveTimer: false,
        dialogTitle: 'Timed Sign Out',
    dialogTimeRemaining: 'Time Remaining: ',
    dialogStayLoggedInButton: 'Stay Connected',
    dialogLogOutNowButton: 'Sign Out',
        dialogText: 'No activitiy has been detected for 14 minutes.  You are about to be signed out of the system for security reasons.'
    });
});

Do you have other jQuery dialogs set up on the page?

crayner commented 7 years ago

Hi Jill, Here is a source dump of all javascript used on the page. I have tried rearranging the order the file are called without any change. I was going to comment some out and see if that made a difference.

<script src=/js/jquery.min.js http://home.craigrayner.com/js/jquery.min.js

<script src=/js/jquery-ui.min.js http://home.craigrayner.com/js/jquery-ui.min.js> <script src=/js/dist/store.legacy.min.js http://home.craigrayner.com/js/dist/store.legacy.min.js> <script src=/js/jquery-idleTimeout.min.js http://home.craigrayner.com/js/jquery-idleTimeout.min.js> <script src=/js/bootstrap.min.js http://home.craigrayner.com/js/bootstrap.min.js> <script src=/js/bootstrap-submenu.min.js http://home.craigrayner.com/js/bootstrap-submenu.min.js> <script src=/js/ie10-viewport-bug-workaround.js http://home.craigrayner.com/js/ie10-viewport-bug-workaround.js> <script src=/js/holder.min.js http://home.craigrayner.com/js/holder.min.js

Further testing shows the ' ​ dialogTimeRemaining' also does not change. So, using idletimer 1.0.10, store.modern.min.js 2.0.3 Have tried everything, modern, legacy, v1-backcompat in the store as well. Same issue.

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 03:46, JillElaine notifications@github.com wrote:

Hmm, with the example configuration you posted above, the assignment of the button text works in my test box. If you had an un-espaced special character, missing comma or single quote, the script wouldn't work at all, so that's not the problem...and I'm sure you've already checked that. Your variable names in the example above are correctly typed.

Are you possibly setting the configuration of the idleTimeout function in more than one place?

What happens if you move the dialog button variables above the dialogText variable? Please let me know how this code works.

// idleTimeout $(document).ready(function () { $(document).idleTimeout({ redirectUrl: '/app_dev.php/security/logout', idleTimeLimit: 840, dialogDisplayLimit: 60, activityEvents: 'click keypress scroll wheel mousewheel', sessionKeepAliveTimer: false, dialogTitle: 'Timed Sign Out', dialogTimeRemaining: 'Time Remaining: ', dialogStayLoggedInButton: 'Stay Connected', dialogLogOutNowButton: 'Sign Out', dialogText: 'No activitiy has been detected for 14 minutes. You are about to be signed out of the system for security reasons.' }); });

Do you have other jQuery dialogs set up on the page?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-285957098, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqT9kwmRkqdednXEN78DkDS8VtUB-ks5rlCFygaJpZM4MacZd .

JillElaine commented 7 years ago

Enclose all code in 'code' tags. Makes it much easier to read.

My JS debugger indicates that you have 'illegal characters' after the comma at the end of the dialogText string, and also in the dialogTimeRemainingstring. I think perhaps they are new line characters?

A javascript string must be all on ONE line. If you want a 'new line' within a javascript string, use '\n'. See below.

Try the code below. How does it work?

<script type="text/javascript" charset="utf-8">
// idleTimeout 
$(document).ready(function () {
$(document).idleTimeout({
redirectUrl: '/app_dev.php/security/logout',
idleTimeLimit: 15, //840, 
dialogDisplayLimit: 60, 
activityEvents: 'click keypress scroll wheel mousewheel', 
sessionKeepAliveTimer: false,
dialogTitle: 'Timed Sign Out', 
dialogText: 'No activitiy has been detected for 14 minutes. \n You are about to be signed out of the system for security reasons.', ​
dialogTimeRemaining: '\n\n Bye Bye In \n ', 
dialogStayLoggedInButton: 'Stay Connected',
dialogLogOutNowButton: 'Sign Out Now' 
}); 
}); 
$('[data-submenu]').submenupicker(); 
</script>
crayner commented 7 years ago

Sorry, not a real example. The new line characters where added by the email program, so this is not an issue as it would stop the whole thing working.

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 10:45, JillElaine notifications@github.com wrote:

Enclose all code in 'code' tags. Makes it much easier to read.

My JS debugger indicates that you have 'illegal characters' after the comma at the end of the dialogText string, and also in the dialogTimeRemainingstring. I think perhaps they are new line characters?

A javascript string must be all on ONE line. If you want a 'new line' within a javascript string, use '\n'. See below.

Try the code below. How does it work?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-285988013, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqcoCRP7nJsseyNxpOpOcgWfbRX68ks5rlIOhgaJpZM4MacZd .

JillElaine commented 7 years ago

If you copy & paste the above code, does it work?

crayner commented 7 years ago

This code, copied from source, is working, with the exception of the three text variables not being updated:

<script src=/js/jquery.min.js http://home.craigrayner.com/js/jquery.min.js

<script src=/js/jquery-ui.min.js http://home.craigrayner.com/js/jquery-ui.min.js> <script src=/js/dist/store.modern.min.js http://home.craigrayner.com/js/dist/store.modern.min.js> <script src=/js/jquery-idleTimeout.min.js http://home.craigrayner.com/js/jquery-idleTimeout.min.js>

<script src=/js/bootstrap.min.js http://home.craigrayner.com/js/bootstrap.min.js> <script src=/js/bootstrap-submenu.min.js http://home.craigrayner.com/js/bootstrap-submenu.min.js> <script src=/js/ie10-viewport-bug-workaround.js http://home.craigrayner.com/js/ie10-viewport-bug-workaround.js> <script src=/js/holder.min.js http://home.craigrayner.com/js/holder.min.js

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 10:52, JillElaine notifications@github.com wrote:

If you copy & paste the above code, does it work?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-285988457, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqdKzClMfhuhP2xXzXcsjlqavv8MLks5rlIVbgaJpZM4MacZd .

JillElaine commented 7 years ago

I understand that the last 3 lines of your code is not working. Please run a test. Replace your $(document).ready code with the code below. And let me know the results.

<script type="text/javascript" charset="utf-8">
// idleTimeout 
$(document).ready(function () {
$(document).idleTimeout({
redirectUrl: '/app_dev.php/security/logout',
idleTimeLimit: 15, //840, 
dialogDisplayLimit: 60, 
activityEvents: 'click keypress scroll wheel mousewheel', 
sessionKeepAliveTimer: false,
dialogTitle: 'Timed Sign Out', 
dialogText: 'No activitiy has been detected for 14 minutes. \n You are about to be signed out of the system for security reasons.', ​
dialogTimeRemaining: '\n\n Bye Bye In \n ', 
dialogStayLoggedInButton: 'Stay Connected',
dialogLogOutNowButton: 'Sign Out Now' 
}); 
}); 
$('[data-submenu]').submenupicker(); 
</script>
crayner commented 7 years ago

Remove illegal characters and no change. idletime works but the messages do not change. Attached is the original TWIG code, showing the code posted.

<script src={{ asset('js/jquery.min.js') }}> <script src={{ asset('js/jquery-ui.min.js') }}> {% if app.getUser is not empty %} <script src={{ asset('js/dist/store.modern.min.js') }}> <script src={{ asset('js/jquery-idleTimeout.min.js') }}>

{% endif %} <script src={{ asset('js/bootstrap.min.js') }}> <script src={{ asset('js/bootstrap-submenu.min.js') }}> <script src={{ asset('js/ie10-viewport-bug-workaround.js') }}> <script src={{ asset('js/holder.min.js') }}> {% if script is defined %} {% for xx in script %} {% include xx %} {% endfor %} {% endif %}

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 11:00, JillElaine notifications@github.com wrote:

I understand that the last 3 lines of your code is not working. Please run a test. Replace your $(document).ready code with the code below. And let me know the results.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-285989004, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqZ7iMb6L1Gt5cjqaRSrQYhK4Ue4Mks5rlIc2gaJpZM4MacZd .

JillElaine commented 7 years ago

Please...edit your response above to enclose all code in 'code' tags. Because you did not put your code in 'code' tags, I cannot tell if there is a syntax problem or not.

Everything that you have told me so far indicates that there is a problem with the syntax of your $(document).ready configuration; specifically a problem with the dialogText string, since the three variables, (dialogTimeRemaining, dialogStayLoggedInButton & dialogLogOutNowButton) under it do not load correctly.

You could easily verify if I am correct by simply putting the assignments for the dialogTimeRemaining, dialogStayLoggedInButton & dialogLogOutNowButton ABOVE the dialogText assignment in your $(document).ready configuration.

Once you've identified the problem location, it will make it easier to fix.

I do not think that the order of scripts loaded nor the version of store.js, etc, could possibly cause 3 specific variables to be ignored while others are not ignored.

crayner commented 7 years ago

Hi Jill, I moved the order of the definitions already. The result is the same. The redirect URL works correctly in this example, so nothing wrong with the 'dialogText'

// idleTimeout $(document).ready(function () { $(document).idleTimeout({ dialogTimeRemaining: '{{ 'idletimeout.timeRemaining'|trans({}, 'BusybeeHomeBundle') }}', dialogStayLoggedInButton: '{{ 'idletimeout.stay'|trans({}, 'BusybeeHomeBundle') }}', dialogLogOutNowButton: '{{ 'idletimeout.signout'|trans({}, 'BusybeeHomeBundle') }}', idleTimeLimit: {{ get_setting('idleTimeout', 15) * 60 - 60 }}, dialogDisplayLimit: 60, activityEvents: 'click keypress scroll wheel mousewheel', sessionKeepAliveTimer: false, dialogTitle: '{{ 'idletimeout.title'|trans({}, 'BusybeeHomeBundle') }}', dialogText: '{{ 'idletimeout.dialogue'|trans({'%time%': get_setting('idleTimeout', 15) - 1}, 'BusybeeHomeBundle') }}', redirectUrl: '{{ path('busybee_security_logout') }}' }); });

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 13:43, JillElaine notifications@github.com wrote:

Please...edit your response above to enclose all code in 'code' tags. Because you did not put your code in 'code' tags, I cannot tell if there is a syntax problem or not.

Everything that you have told me so far indicates that there is a problem with the syntax of your $(document).ready configuration; specifically a problem with the dialogText string, since the three variables, ( dialogTimeRemaining, dialogStayLoggedInButton & dialogLogOutNowButton) under it do not load correctly.

You could easily verify if I am correct by simply putting the assignments for the dialogTimeRemaining, dialogStayLoggedInButton & dialogLogOutNowButton ABOVE the dialogText assignment in your $(document).ready configuration.

Once you've identified the problem location, it will make it easier to fix.

I do not think that the order of scripts loaded nor the version of store.js, etc, could possibly cause 3 specific variables to be ignored while others are not ignored.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-286003044, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqXQ1Vh1HomG86Tl4gKzfqT0m3zotks5rlK1ngaJpZM4MacZd .

crayner commented 7 years ago

[image: Inline images 1]

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 13:43, JillElaine notifications@github.com wrote:

Please...edit your response above to enclose all code in 'code' tags. Because you did not put your code in 'code' tags, I cannot tell if there is a syntax problem or not.

Everything that you have told me so far indicates that there is a problem with the syntax of your $(document).ready configuration; specifically a problem with the dialogText string, since the three variables, ( dialogTimeRemaining, dialogStayLoggedInButton & dialogLogOutNowButton) under it do not load correctly.

You could easily verify if I am correct by simply putting the assignments for the dialogTimeRemaining, dialogStayLoggedInButton & dialogLogOutNowButton ABOVE the dialogText assignment in your $(document).ready configuration.

Once you've identified the problem location, it will make it easier to fix.

I do not think that the order of scripts loaded nor the version of store.js, etc, could possibly cause 3 specific variables to be ignored while others are not ignored.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-286003044, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqXQ1Vh1HomG86Tl4gKzfqT0m3zotks5rlK1ngaJpZM4MacZd .

JillElaine commented 7 years ago

Perhaps there is a problem with your twig references in your configuration?

You could verify if it's an issue with twig or not by trying this $(document).ready config in place of your twig configuration.

<script type="text/javascript" charset="utf-8">
// idleTimeout 
$(document).ready(function () {
$(document).idleTimeout({
redirectUrl: '/app_dev.php/security/logout',
idleTimeLimit: 15, 
dialogDisplayLimit: 60, 
activityEvents: 'click keypress scroll wheel mousewheel', 
sessionKeepAliveTimer: false,
dialogTitle: 'Timed Sign Out', 
dialogText: 'No activitiy has been detected for 14 minutes. You are about to be signed out of the system for security reasons.',
dialogTimeRemaining: 'Bye Bye In', 
dialogStayLoggedInButton: 'Stay Connected',
dialogLogOutNowButton: 'Sign Out Now' 
}); 
}); 
</script>
crayner commented 7 years ago

As per your instruction, copied and pasted. The result do not change:

[image: Inline images 1]

I did remove invalid characters form the end of dialogText line that you sent me..

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 14:15, JillElaine notifications@github.com wrote:

Perhaps there is a problem with your twig references in your configuration?

You could verify if it's an issue with twig or not by trying this $(document).ready config in place of your twig configuration.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-286006352, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqVKD7KqXMfaShStSYWmZho9t85rSks5rlLTngaJpZM4MacZd .

JillElaine commented 7 years ago

Good catch on the invalid char at the end of the dialogText string. I edited my comment to remove it.

I can't see your images that you post.

Have your cleared your cache to make sure that your changes have an effect?

crayner commented 7 years ago

Yes, Cache cleared. Changes showing the Chrome development console.

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 14:27, JillElaine notifications@github.com wrote:

Good catch on the invalid char at the end of the dialogText string. I edited my comment to remove it.

I can't see your images that you post.

Have your cleared your cache to make sure that your changes have an effect?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-286007564, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4Fqe7YzSt_KY4I_A3p0Oa9GT35qgjnks5rlLeVgaJpZM4MacZd .

crayner commented 7 years ago

ps. Tested in Edge, Chrome Firefox. All the same...

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 14:42, Craig Rayner craig@craigrayner.com wrote:

Yes, Cache cleared. Changes showing the Chrome development console.

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 <+61%202%206352%205571> Mobile: +61 456 560 018 <+61%20456%20560%20018>

On 13 March 2017 at 14:27, JillElaine notifications@github.com wrote:

Good catch on the invalid char at the end of the dialogText string. I edited my comment to remove it.

I can't see your images that you post.

Have your cleared your cache to make sure that your changes have an effect?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-286007564, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4Fqe7YzSt_KY4I_A3p0Oa9GT35qgjnks5rlLeVgaJpZM4MacZd .

JillElaine commented 7 years ago

Load the idleTimeout 'test' script, https://github.com/JillElaine/jquery-idleTimeout/blob/master/jquery-idleTimeout-for-testing.js and watch the console.

Add some console logs to the script in several locations to spit out the value of the variables.

Examples:

console.log('The value of dialogStayLoggedInButton =' + currentConfig.dialogStayLoggedInButton + '.');
console.log('The value of dialogLogOutNowButton =' + currentConfig.dialogLogOutNowButton + '.');
crayner commented 7 years ago

Found the issue in the cache. This issue was in 1.0.8, but when the system load 1.0.10 correctly, it worked as expected. Thank your persistence in chasing this down.

I greet you with the great words, Grace and Peace

Craig Rayner craig@craigrayner.com Phone: +61 2 6352 5571 Mobile: +61 456 560 018

On 13 March 2017 at 14:51, JillElaine notifications@github.com wrote:

Load the idleTimeout 'test' script, https://github.com/JillElaine/ jquery-idleTimeout/blob/master/jquery-idleTimeout-for-testing.js and watch the console.

Add some console logs to the script in several locations to spit out the value of the variables.

Examples:

console.log('The value of dialogStayLoggedInButton =' + currentConfig.dialogStayLoggedInButton + '.'); console.log('The value of dialogLogOutNowButton =' + currentConfig.dialogLogOutNowButton + '.');

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/JillElaine/jquery-idleTimeout/issues/44#issuecomment-286009800, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4FqZFGTpXFiogWpokYnRioZ3__Zxptks5rlL0kgaJpZM4MacZd .

JillElaine commented 7 years ago

I'm glad you got it working. I doubt that the issue was in IdleTimeout version 1.0.8. There are no differences in code between versions 1.0.8 & 1.0.10 to account for a portion of the configuration variables being ignored, while others are loaded. I stand by my original assessment that the problem lay in the $(document).ready configuration, and that fixes were masked by an uncleared cache.