-
Notifications
You must be signed in to change notification settings - Fork 4
/
tz-test.html
executable file
·100 lines (94 loc) · 5.92 KB
/
tz-test.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
<html>
<head>
<script language="javascript" type="text/javascript" src="flot/jquery.js"></script>
<script language="javascript" type="text/javascript" src="flot/jquery.flot.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var fakeData = [[1327543724569, 0.0], [1327543754569, 0.0], [1327543784569, 0.0], [1327543814569, 0.0], [1327543844569, 0.0], [1327543874569, 0.0], [1327543904569, 0.0], [1327543934569, 0.0], [1327543964569, 0.0], [1327543994569, 0.0], [1327544024569, 0.0], [1327544054569, 0.0], [1327544084569, 0.0], [1327544114569, 1.0325110950562493], [1327544144569, 2.0], [1327544174569, 2.0], [1327544204569, 2.0], [1327544234569, 2.0], [1327544264569, 2.0], [1327544294569, 2.0], [1327544324569, 2.0], [1327544354569, 2.0], [1327544384569, 2.0], [1327544414569, 2.0], [1327544444569, 2.0], [1327544474569, 1.501438030900943], [1327544504569, 1.0], [1327544534569, 0.502346636487701], [1327544564569, 0.0], [1327544594569, 0.0], [1327544624569, 0.0], [1327544654569, 0.0], [1327544684569, 0.0], [1327544714569, 0.0], [1327544744569, 0.0], [1327544774569, 0.0], [1327544804569, 0.0], [1327544834569, 0.0], [1327544864569, 0.0], [1327544894569, 0.0], [1327544924569, 0.0], [1327544954569, 0.0], [1327544984569, 0.0], [1327545014569, 0.0], [1327545044569, 0.0], [1327545074569, 0.0], [1327545104569, 0.0], [1327545134569, 0.0], [1327545164569, 0.0], [1327545194569, 0.0], [1327545224569, 0.0], [1327545254569, 0.0], [1327545284569, 0.0], [1327545314569, 0.0], [1327545344569, 0.0], [1327545374569, 0.0], [1327545404569, 0.0], [1327545434569, 0.0], [1327545464569, 0.0], [1327545494569, 0.0], [1327545524569, 0.0], [1327545554569, 0.0], [1327545584569, 0.0], [1327545614569, 0.0], [1327545644569, 0.0], [1327545674569, 0.0], [1327545704569, 0.0], [1327545734569, 0.0], [1327545764569, 0.0], [1327545794569, 0.9839651622050434], [1327545824569, 2.0], [1327545854569, 2.0], [1327545884569, 2.0], [1327545914569, 2.0], [1327545944569, 2.0], [1327545974569, 2.0], [1327546004569, 2.0], [1327546034569, 2.0], [1327546064569, 2.0], [1327546094569, 2.0], [1327546124569, 2.0], [1327546154569, 1.0318739757182516], [1327546184569, 0.0], [1327546214569, 0.0], [1327546244569, 0.0], [1327546274569, 0.0], [1327546304569, 0.0], [1327546334569, 0.0], [1327546364569, 0.0], [1327546394569, 0.0], [1327546424569, 0.0], [1327546454569, 0.0], [1327546484569, 0.0], [1327546514569, 0.0], [1327546544569, 0.0], [1327546574569, 0.0], [1327546604569, 0.0], [1327546634569, 0.0], [1327546664569, 0.0], [1327546694569, 0.0], [1327546724569, 0.0], [1327546754569, 0.0], [1327546784569, 0.0], [1327546814569, 0.0], [1327546844569, 0.0], [1327546874569, 0.0], [1327546904569, 0.0], [1327546934569, 0.0], [1327546964569, 0.0], [1327546994569, 0.0], [1327547024569, 0.0], [1327547054569, 0.0], [1327547084569, 0.0], [1327547114569, 0.0], [1327547144569, 0.0], [1327547174569, 0.0], [1327547204569, 0.0], [1327547234569, 0.4784697030767163], [1327547264569, 1.0], [1327547294569, 1.0]];
$.plot($("#UTC"), [fakeData], {
xaxis: { mode: "time" },
yaxis: { min: 0 }
});
var localData = new Array(fakeData.length);
var timeZoneOffsetMs = new Date().getTimezoneOffset() * 60 * 1000; //convert from minutes to ms
for(var i = 0; i < fakeData.length;i++){
localData[i] = fakeData[i];
localData[i][0] += timeZoneOffsetMs;
}
$.plot($("#localTZ"), [localData], {
xaxis: { mode: "time" },
yaxis: { min: 0 }
});
// DST handling demo
var d1 = new Date("March 11, 2012"); //day DST starts this year
var oneHourInMs = 60 * 60 *1000;
var times = new Array();
//create some fake data that crosses the DST boundary
for(i = 0;i < 24; i++){
times[i] = [d1.getTime() + (i * oneHourInMs),i%4];
}
var dataStartOffset = new Date(times[0][0]).getTimezoneOffset();
var dataEndOffset = new Date(times[times.length-1][0]).getTimezoneOffset();
var boundaryIndex = null;
if(dataStartOffset !== dataEndOffset){
$('#dst').text('DST boundary detected').after('<div id="DST-pre" class="trace"></div><div id="DST-post" class="trace"></div>');
//naive implementation: check getTimezoneOffset on each time point until we find the boundary
// issues: there are more clever ways to find the boundary
// creating a new Date object is wasteful (especially since some of these were already created)
// if creating an object at each check is necessary, we will create n objects that we don't need in the worst case -- not an issue for this test, but larger data sets would be a problem
var preDST = new Array(), postDST = new Array();
for(i = 0;i < times.length;i++){
if(new Date(times[i][0]).getTimezoneOffset() !== dataStartOffset){
boundaryIndex = i;
break;
}
else{
preDST[i] = times[i];
preDST[i][0] += dataStartOffset * 60 * 1000; //convert offset to ms
}
}
for(i = boundaryIndex;i < times.length;i++){
postDST[i-boundaryIndex] = times[i];
postDST[i-boundaryIndex][0] += dataEndOffset * 60 * 1000; //convert offset to ms
}
if(boundaryIndex !== null){
//$('#DST-pre').append('index: ' + boundaryIndex);
console.log(preDST);
console.log(postDST);
//size the divs appropriately
var preDSTPercentage = preDST.length / times.length * 100;
$('#DST-pre').width(preDSTPercentage + 10 + '%') ;
$('#DST-post').width((90 - preDSTPercentage) + '%');
$.plot($("#DST-pre"), [preDST], {
xaxis: { mode: "time" },
yaxis: { min: 0 }
});
$.plot($("#DST-post"), [postDST], {
xaxis: { mode: "time" },
yaxis: { min: 0 }
});
}
else{
console.log("Could not find the boundary");
}
}
});
</script>
<style>
div.trace {
/*float: right;*/
width:76%;
height:120px;
margin: auto;
display:inline-block;
}
</style>
</head>
<body>
<p>UTC</p>
<div id="UTC" class="trace"></div>
<p>local</p>
<div id="localTZ" class="trace"></div>
<p id="dst"></p>
</body>
</html>