1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768 |
- <!doctype html>
- <title>Teamspeak Server Status</title>
- <style>
- body {
- margin: 0px 0px 0px 0px;
- padding: 0px 0px 0px 0px;
- font-family: verdana, arial, helvetica, sans-serif;
- color: #ccc;
- background-color: #333;
- }
- #bounceBox {
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- }
- #bouncer {
- position: absolute;
- }
- </style>
- <script>
- // JS adapted from
- // https://stackoverflow.com/questions/6152522/how-can-i-make-a-paragraph-bounce-around-in-a-div
- let vx = 3;
- let vy = 2;
- const buffer = 5;
- const hitLR = (el, bounding) => {
- if (el.offsetLeft <= buffer && vx < 0) {
- vx = -1 * vx;
- }
- if ((el.offsetLeft + el.offsetWidth) >= (bounding.offsetWidth - buffer)) {
- vx = -1 * vx;
- }
- if (el.offsetTop <= buffer && vy < 0) {
- vy = -1 * vy;
- }
- if ((el.offsetTop + el.offsetHeight) >= (bounding.offsetHeight - buffer)) {
- vy = -1 * vy;
- }
- }
- const mover = (el, bounding) => {
- hitLR(el, bounding);
- el.style.left = el.offsetLeft + vx + 'px';
- el.style.top = el.offsetTop + vy + 'px';
- setTimeout(function() {
- mover(el, bounding);
- }, 30);
- }
- setTimeout(() => mover(
- document.getElementById("bouncer"),
- document.getElementById("bounceBox")
- ), 30);
- // makes the iframe have the appropriate height
- const resizeIframe = (obj) => {
- obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
- obj.style.width = obj.contentWindow.document.body.scrollWidth + 'px';
- }
- </script>
- <body>
- <div id="bounceBox">
- <iframe id="bouncer" frameborder="0" src="{{ url_for('get_page_body') }}" scrolling="no" onload="resizeIframe(this)"></iframe>
- </div>
- </body>
|