diff --git a/myproject/template/helloworld.html b/myproject/template/helloworld.html index 554d004e1533bd4151dae062e93a18a925390bef..f8f2715854aec4bf510a8d0e0e45deb8c009251a 100644 --- a/myproject/template/helloworld.html +++ b/myproject/template/helloworld.html @@ -4,7 +4,8 @@ <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap demo</title> - <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"> + <!-- <link rel="image" href="image/python.png"> --> + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/viewerjs/1.11.7/viewer.css" integrity="sha512-9NawOLzuLE2GD22PJ6IPWXEjPalb/FpdH1qMpgXdaDM+0OfxEV75ZCle6KhZi0vM6ZWvMrNnIZv6YnsL+keVmA==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <style> img { @@ -15,10 +16,15 @@ </head> <body> <div class="container"> + <!-- <div> + + { % if data.username == "justinmass2001" % } + </div> --> + <div class="alert alert-success" role="alert"> Welcome {{ data.username }} , you are in {{ data.env }} </div> - + <ul id="images"> <li><img src="https://th.bing.com/th/id/OIP.d7XoYXNNdLcexb9E1xehCAHaEK?w=278&h=180&c=7&r=0&o=5&dpr=1.3&pid=1.7" alt="Picture 1"></li> <br> @@ -28,7 +34,11 @@ <li><img src="{{ data.avater }}" alt="Picture 1"></li> </ul> - </div> + <!-- { % elif data.username == "root" % } --> + <div class="alert alert-danger" role="alert"> + You should not run as {{ data.username }} , you are in {{ data.env }} + </div> + <!-- { % endif % } --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script> @@ -38,10 +48,25 @@ <script> // View an image. - const viewer = new Viewer(document.getElementById('images'), { - viewed() { - // viewer.hide(); - }, + // const viewer = new Viewer(document.getElementById('images'), { + // loop: false, + // interval: 500, + // shown: function(event){ + // console.log(event); + // console.log("shown") + // }, + // show: function(event){ + // console.log(event); + // console.log("began to show"); + // } + // }); + const images = document.getElementById('images'); + const viewer = new Viewer(images, { + loop: true, + interval: 500, + view: function(event){ + console.log((event.detail.index + 1 ) + " / " + viewer.length); + } }); </script>