May 17, 2023 09:55 PMLast Modified: May 17, 2023 9:55 PM
JSL to write HTML.
@cbarilrequested a slide deck for the JMP Tip of the Day items to run in kiosk mode. The tips are stored in a JMP install directory as HTML files that will display in a browser. Here's some JSL that will create an index.html file to play the tips in a loop. There really isn't much JSL here: load the file names and insert them into an HTML/JavaScript template, write the result to disk and open it in a browser. Most of the magic is in the CSS and JavaScript; Google was my friend. You'll need to adjust the tip of the day directory for your machine. I only tested with FireFox and a couple of other browsers. You can change the 1.5s transition (two places) and the 10s delay (one place, 10000 ms).
If(JMP Version()<"16",Throw("This JSL needs JMP 16 or greater"));
todd =Match(Left(JMP Version(),2),"16","C:\Program Files\SAS\JMP\16\Tip of the Day\","17","C:\Program Files\SAS\JMP\17\Tip of the Day\","18","C:\Program Files\JMP\JMPEA\18\Tip of the Day\",Throw("open the jsl and add the tip file location for JMP "||JMP Version()));If(!Directory Exists( todd ),Throw("Can't find "|| todd ));
todd =Substitute( todd,"\","/");
filelist =Filter Each({f},Files In Directory( todd ),Ends With( f,".htm"));
filelist =Transform Each({f}, filelist,"'file://"|| todd || f ||"'");
html =Save Text File("$temp/index.html",Eval Insert("
<html>
<head>
<style>
.container_row{
display: grid;
}
.layerVisible, .layerHidden{
grid-column: 1;
grid-row: 1;
}
.layerVisible {
opacity: 1.0;
transition: opacity 1.5s ease-in-out;
}
.layerHidden {
opacity: 0.0;
transition: opacity 1.5s ease-in-out;
}
</style>
<title>JMP ^left(jmpversion(),2)^ tips</title>
</head>
<body>
<div class='container_row'>
<div class='layerVisible'>
<iframe id='if_1' src='' style='width: 2500px;height: 2000px;float: left;margin: 20px;'></iframe>
</div>
<div class='layerHidden'>
<iframe id='if_2' src='' style='width: 2500px;height: 2000px;float: left;margin: 20px;'></iframe>
</div>
</div>
</body>
<script type='text/javascript'>
/*
http://www.dynamicdrive.com/forums/showthread.php?73827-Java-Script-for-cycling-through-pages
https://stackoverflow.com/questions/59940969/looking-to-do-transitions-between-iframes-using-javascript
https://stackoverflow.com/questions/6780614/css-how-to-position-two-elements-on-top-of-each-other-without-specifying-a-hei
https://stackoverflow.com/questions/507138/how-to-add-a-class-to-a-given-element
(and others for css transition opacity)
*/
var pages = [
^concatitems(filelist,\!",\!")^
];
var p = 0;
var if_front = document.getElementById('if_1');
var if_back = document.getElementById('if_2');
function loadIframe() {
var page = pages[p];
p = (p+1) % pages.length;
var a = document.createElement('a');
a.href = page;
if_front.src=a;
if_front.parentNode.classList.add('layerVisible');
if_front.parentNode.classList.remove('layerHidden');
if_back.parentNode.classList.add('layerHidden');
if_back.parentNode.classList.remove('layerVisible');
var temp = if_front;
if_front = if_back;
if_back = temp;
setTimeout(loadIframe, 10000); // 1/1000 seconds
}
loadIframe();
</script>
</html>"));Web( html );
TipOfTheDay.mp4
Video Player is loading.
Current Time 0:00
/
Duration 0:00
Loaded: 0%
0:00
Stream Type LIVE
Remaining Time -0:00
1x
Chapters
descriptions off, selected
captions settings, opens captions settings dialog
captions off, selected
This is a modal window.
Beginning of dialog window. Escape will cancel and close the window.
End of dialog window.
This is a modal window. This modal can be closed by pressing the Escape key or activating the close button.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.