So I got Chromium auto starting in Kiosk mode and using it to view local html files.
it auto starts with index.html and when a user touch a button it opens PDF files to view, what I am looking to do is have it return to the start page if there is no further activity.
like what they did here, but this is old
https://stackoverflow.com/questions/29994313/chromium-auto-refresh-command-line
the file /etc/xdg/lxsession/LXDE/autostart does not exist.
how should I do this?
Thank you.
I have no solution for the problem with the missing folder.
But why don’t check the idle time directly with the browser via JavaScript? And after a defined idle time the browser reloads the home page:
https://stackoverflow.com/questions/667555/how-to-detect-idle-time-in-javascript
Hi,
on DietPi we use /var/lib/dietpi/dietpi-software/installed/chromium-autostart.sh to start Chromium in kiosk mode.
because when viewing PDF files, there is no HTML codes.
But you could embed it into the page:
https://www.w3docs.com/snippets/html/how-to-embed-pdf-in-html.html
oh yea, that should do, I just have to find how to do an inactivity action in HTML , i saw javascript stuff, but I couldn’t figure out how to make it work.
Check out the link I posted earlier, there are some examples for JavaScript.
you could embed it as iframe. This way you should be able to reload the web page, right?
https://pspdfkit.com/blog/2018/open-pdf-in-your-web-app/
https://iq.opengenus.org/embed-pdf-in-html/
I am looking at https://stackoverflow.com/questions/667555/how-to-detect-idle-time-in-javascript
I don’t understand it.
put the code in the body? , all I see is the code, not how to put it in HTML?
You can put it in the head section or the body section.
In this example the waiting timer is set to 3 seconds and will be reset by any mouse movement or when a key is pressed.
When 3 seconds past, it will show an alert message “You are now logged out.”, and the user get’s redirected to “logout.html”.
Edit it to you requirements.
<script type="text/javascript">
var inactivityTime = function () {
var time;
window.onload = resetTimer;
// DOM Events
document.onmousemove = resetTimer;
document.onkeydown = resetTimer;
function logout() {
alert("You are now logged out.")
//location.href = 'logout.html'
}
function resetTimer() {
clearTimeout(time);
time = setTimeout(logout, 3000)
// 1000 milliseconds = 1 second
}
};
window.onload = function() {
inactivityTime();
}
</script>
thank you for the help
I did see the pop up once but not on second try, I think something is inhibiting it.
I will keep trying.
edit… it is working… but only when mouse cursor is moved off the page. so progress.
Yes I guess when you move the mouse inside the iframe, the script can’t detect that.
Try window instead of document
window.onmousemove = resetTimer;
window.onkeydown = resetTimer;
When you move the mouse out of the document, to the taskbar or the adressbar of the browser, it can’t be detected either if the mouse is moved there.
So instead of an alert message you could tweak the script with a confirm() function. So after a the timer runs out there comes a message where you can choose to go back or stay on the side.
The tweaked script:
<script type="text/javascript">
var inactivityTime = function () {
var time;
window.onload = resetTimer;
// DOM Events
window.onmousemove = resetTimer;
window.onkeydown = resetTimer;
function logout() {
if (confirm("Go back?") == true) {
location.href = 'test.html';
} else {
resetTimer();
}
}
function resetTimer() {
clearTimeout(time);
time = setTimeout(logout, 3000)
// 1000 milliseconds = 1 second
}
};
window.onload = function() {
inactivityTime();
}
</script>
Alright I found the ultimate script for your needs:
https://jillelaine.github.io/jquery-idleTimeout/index.html
So after set time period, there comes a dialog box, where you can choose to stay or to “log out” (redirect to another page) and there is also a timer, so without interaction you get automatically redirected. And it works with iframes too (so it detects movement inside an iframe).
If you need help, I can try to help you again!
Jillielaine script did not work for me at all, I did read about the iframe detection issue, that requires $.fn.idleTimeout().iframeRecheck() in body
<html>
<head>
<title>EASA</title>
<head>
<script type = "text/javascript" src="timer2.js"></script>
</head>
<body style="margin:0px;">
<iframe src="PDFs/EASA.pdf" width="1916px" height="1076px">
</iframe>
$.fn.idleTimeout().iframeRecheck()
</body>
</html>
and I tried the following in earlier script, which did not improve it.
window.onmousemove = resetTimer;
window.onkeydown = resetTimer;
It is like the clock is not counting and never hits the time to go to URL
or something is resetting the clock not allowing it to reach the timeout.
adding the following code made it worse , so problem is the opposite?
EDIT, adding the code didn’t make it worse, it was because
document.onmousemove = resetTimer;
document.onkeydown = resetTimer;
was removed.
IDK, it works for me
https://jappevpn.ddns.net/javascript/
For iFrame detection use jquery-idleTimeout-iframes.min.js instead of jquery-idleTimeout.min.js
<head>
<title>Seitentitel</title>
<meta charset="utf-8">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js" type="text/javascript"></script>
<script src="https://jappevpn.ddns.net/javascript/store.legacy.min.js"></script>
<script src="https://jappevpn.ddns.net/javascript/jquery-idleTimeout.min.js"></script>
<script>
store.set('user', { name:'Marcus' })
store.get('user').name == 'Marcus'
</script><script type="text/javascript" charset="utf-8">
$(document).ready(function () {
$(document).idleTimeout({
redirectUrl: 'test.html', // redirect to this url
idleTimeLimit: 5, // 15 seconds
activityEvents: 'click keypress scroll wheel mousewheel', // separate each event with a space
dialogDisplayLimit: 30, // Time to display the warning dialog before logout (and optional callback) in seconds
sessionKeepAliveTimer: false, // Set to false to disable pings.
enableDialog: true,
dialogDisplayLimit: 10,
dialogTitle: 'Session Expiration Warning',
dialogText: 'Because you have been inactive, your session is about to expire.',
dialogTimeRemaining: 'Time remaining',
dialogStayLoggedInButton: 'Stay Logged In',
dialogLogOutNowButton: 'Log Out Now'
});
});
</script>
</head>
<body>
Test idle time 5 seconds
</body>
have you tried saving this to a local location? this kiosk will not have access to the internet and I am also do thing these tests off a local location.
the link to the online site works, but soon as I save it a local file it does not work, even tho I saved the jquery-idleTimeout.min.js in same folder as html.
do I need all four of these lines?
or just the last one?
The first 3 scripts are requirements, like mentioned on the project page. (The store.js is maybe only to handle multiple tabs, but I’m not completly sure, just put it also in).
The 4th script is the “actual” script, but can not function without the 3 others.
Since the first 3 scripts are not stored locally but loaded from a external source, you have to download them and put them on your machine, when you have no internet connection available, like you did with the jquery-idleTimeout.min.js.