-
Notifications
You must be signed in to change notification settings - Fork 1
/
reloader.html
109 lines (94 loc) · 2.36 KB
/
reloader.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>reloader</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
!window.jQuery && document.write(unescape('%3Cscript src="js/jquery.min.js"%3E%3C/script%3E'))
</script>
<style type="text/css">
body {
padding: 0;
margin: 0;
}
.controlls {
background-color: black;
color: white;
padding: 10px;
}
</style>
<script>
var timer;
function newTimer(milliseconds) {
clearTimeout(timer);
timer = setTimeout(function() {
animateReload(milliseconds);
changeIFrameURL(getInputURL());
newTimer(milliseconds);
}, milliseconds);
}
function stopTimer() {
clearTimeout(timer);
}
function animateReload(milliseconds) {
var intervalInput = $("input[name='interval']")
intervalInput.css({
"background-color" : "#ff0000"
});
intervalInput.animate({
"background-color" : "#ffffff"
}, milliseconds);
}
function changeIFrameURL(newURL) {
$('iframe').attr("src", newURL);
document.title = "reloader - " + newURL;
}
function getInputURL() {
return $("input[name='url']").val();
}
function getIntervalMilliseconds() {
return $("input[name='interval']").val();
}
function init() {
$("input[name='url']").keyup(function() {
var newURL = getInputURL();
changeIFrameURL(newURL);
});
$("button[name='start']").click(function() {
newTimer(getIntervalMilliseconds())
});
$("button[name='stop']").click(function() {
stopTimer();
});
$("input[name='interval']").keyup(function() {
var newIntervalMilliseconds = getIntervalMilliseconds();
if (newIntervalMilliseconds >= 500) {
newTimer(newIntervalMilliseconds)
}
});
}
$(document).ready(function() {
init();
})
</script>
</head>
<body>
<div class="controlls">
url:
<input type="text" name="url"size="35">
refresh interval (ms):
<input type="text" name="interval" value="1000" size="5">
<button type="button" name="start">
start
</button>
<button type="button" name="stop">
stop
</button>
</div>
<iframe src="about:blank" width="1024" height="768">
iframes not supported
</iframe>
</body>
</html>