Skip to content

Instantly share code, notes, and snippets.

@pixelcort

pixelcort/index.html

Last active May 9, 2016 14:45
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pixelcort/2d4aeeba1f824b6ae0827f4e1dc3a9ed to your computer and use it in GitHub Desktop.
Save pixelcort/2d4aeeba1f824b6ae0827f4e1dc3a9ed to your computer and use it in GitHub Desktop.
Download ZIP
f5f5f5
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>f5f5f5</title>
<script>
window.addEventListener('load', function() {
var reloadCounterInitial = 10;
var reloadCounter = reloadCounterInitial;
document.body.addEventListener('input', function(event) {
if (event.target.type === 'range') {
var scrollId = event.target.id;
var scrollValue = event.target.value;
console.log(scrollId + ": " + scrollValue);
var frame = document.getElementById('frame');
var newFrameValue = '-' + scrollValue + 'px';
if (scrollId === 'y_range') {
frame.style.top = newFrameValue;
} else {
frame.style.left = newFrameValue;
}
}
});
var reloadCounterInitial = 60;
var reloadCounter = reloadCounterInitial;
function reloadFrame() {
if (reloadCounter === 0) {
document.getElementById('frame').src += '';
reloadCounter = reloadCounterInitial;
} else {
reloadCounter = reloadCounter - 1;
}
document.getElementById('reload_info').innerHTML = "Elapsed " + (reloadCounterInitial - reloadCounter) + " Remaining " + reloadCounter;
setTimeout(reloadFrame, 1000);
}
setTimeout(reloadFrame, 1000);
document.getElementById('interval').value = parseFloat(localStorage.f5f5f5interval || "10");
var newValue = parseFloat(localStorage.f5f5f5interval || "10");
reloadCounterInitial = newValue;
reloadCounter = Math.min(reloadCounter, newValue);
document.getElementById('interval').addEventListener('input', function(event) {
localStorage.f5f5f5interval = event.target.value;
var newValue = parseFloat(localStorage.f5f5f5interval || "10");
reloadCounterInitial = newValue;
reloadCounter = Math.min(reloadCounter, newValue);
});
document.getElementById('url').value = localStorage.f5f5f5url || "https://www.feelcycle.com/feelcycle_reserve/reserve.php";
document.getElementById('frame').src = document.getElementById('url').value;
document.getElementById('url').addEventListener('input', function(event) {
localStorage.f5f5f5url = event.target.value;
});
});
</script>
</head>
<body>
<div>
<div style="width:150px; height: 125px; overflow: hidden;">
<iframe style="position: relative;" src="" width="1000" height="2000" id="frame"></iframe>
</div>
</div>
<pre style="display:inline;">X: </pre><input type="range" id="x_range" value="0" min="0" max="1000" step="10" style="width: 200px;"><br/>
<pre style="display:inline;">Y: </pre><input type="range" id="y_range" value="0" min="0" max="2000" step="10" style="width: 200px;"><br/>
Interval: <input id="interval" /><br/>
URL: <input id="url" /><br/>
<br/>
<p id="reload_info"></p>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment