Created
December 7, 2014 16:58
-
-
Save Berkmann18/1cab963b160bf4fc7fc2 to your computer and use it in GitHub Desktop.
A great tool for having statistical informations about a range of time
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Time Stats by B.Max</title> | |
<meta charset="utf-8" /> | |
<meta name="author" content="Berkmann Maximilian" /> | |
<style type="text/css"> | |
* { | |
font-family: Calibrie, Verdana, Segoe UI; | |
} | |
body { | |
text-align: center; | |
} | |
input, button, select, textarea { | |
padding: .5%; | |
border-radius: 5px; | |
-webkit-border-radius: 5px; | |
-moz-border-radius: 5px; | |
-ms-border-radius: 5px; | |
-o-border-radius: 5px; | |
} | |
input:focus, button:active, select:focus, textarea:focus, input:active { | |
border-color: #00D; | |
border-width: 2px; | |
} | |
input[type="button"], input[type="reset"], input[type="submit"], button, input[type="button"], input[type="file"]{ | |
background-image: linear-gradient(bottom, rgb(0,55,140) 9%, rgb(0,83,168) 55%, rgb(0,117,202) 78%); | |
background-image: -o-linear-gradient(bottom, rgb(0,55,140) 9%, rgb(0,83,168) 55%, rgb(0,117,202) 78%); | |
background-image: -moz-linear-gradient(bottom, rgb(0,55,140) 9%, rgb(0,83,168) 55%, rgb(0,117,202) 78%); | |
background-image: -webkit-linear-gradient(bottom, rgb(0,55,140) 9%, rgb(0,83,168) 55%, rgb(0,117,202) 78%); | |
background-image: -ms-linear-gradient(bottom, rgb(0,55,140) 9%, rgb(0,83,168) 55%, rgb(0,117,202) 78%); | |
background-image: -webkit-gradient( | |
linear, | |
left bottom, | |
left top, | |
color-stop(0.09, rgb(0,55,140)), | |
color-stop(0.55, rgb(0,83,168)), | |
color-stop(0.78, rgb(0,117,202)) | |
); | |
} | |
input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active, button:active, input[type="button"]:active, input[type="file"]:active{ | |
background-image: linear-gradient(bottom, rgb(0,117,202) 9%, rgb(0,83,168) 55%, rgb(0,55,140) 78%); | |
background-image: -o-linear-gradient(bottom, rgb(0,117,202) 9%, rgb(0,83,168) 55%, rgb(0,55,140) 78%); | |
background-image: -moz-linear-gradient(bottom, rgb(0,117,202) 9%, rgb(0,83,168) 55%, rgb(0,55,140) 78%); | |
background-image: -webkit-linear-gradient(bottom, rgb(0,117,202) 9%, rgb(0,83,168) 55%, rgb(0,55,140) 78%); | |
background-image: -ms-linear-gradient(bottom, rgb(0,117,202) 9%, rgb(0,83,168) 55%, rgb(0,55,140) 78%); | |
background-image: -webkit-gradient( | |
linear, | |
left bottom, | |
left top, | |
color-stop(0.09, rgb(0,117,202)), | |
color-stop(0.55, rgb(0,83,168)), | |
color-stop(0.78, rgb(0,55,140)) | |
); | |
border-style: outset; | |
} | |
input[sure] { border-color: #0F0; } | |
input[nearly] { border-color: #FC0; } | |
aside{ | |
position: fixed; | |
top: 20%; | |
left: 65%; | |
} | |
/* Smartphones (portrait and landscape) ----------- */ | |
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { | |
} | |
/* Smartphones (landscape) ----------- */ | |
@media only screen and (min-width : 321px) { | |
} | |
/* Smartphones (portrait) ----------- */ | |
@media only screen and (max-width : 320px) { | |
} | |
/* iPads (portrait and landscape) ----------- */ | |
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { | |
} | |
/* iPads (landscape) ----------- */ | |
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { | |
} | |
/* iPads (portrait) ----------- */ | |
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { | |
} | |
/* Desktops and laptops ----------- */ | |
@media only screen and (min-width : 1224px) { | |
} | |
/* Large screens ----------- */ | |
@media only screen and (min-width : 1824px) { | |
} | |
/* iPhone 4 ----------- */ | |
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), | |
only screen and (min-device-pixel-ratio : 1.5) { | |
} | |
</style> | |
<script type="text/javascript"> | |
window.onerror = function (msg, url, line) { | |
alert("An error has occurred.\n\nMessage: "+msg+"\nURL: "+url+"\nLine number: "+line); | |
} | |
function writeTo(id, nval, query, parseToHTML){ //assign #nval as the value of the element within #id has id | |
if(query){ //if the query are choisen | |
if(document.querySelector("#"+id).value != null && !parseToHTML){ | |
document.querySelector("#"+id).value = nval; | |
} else if(document.querySelector("#"+id).innerHTML != null && parseToHTML){ | |
document.querySelector("#"+id).innerHTML = nval; | |
} else if(document.querySelector("#"+id).innerText != null && !parseToHTML){ | |
document.querySelector("#"+id).innerText = nval; | |
} else writeTo(id, nval, true); | |
} else { //otherwise it's the common getId method of an element | |
if(document.getElementById(id).value != null && !parseToHTML){ | |
document.getElementById(id).value = nval; | |
} else if(document.getElementById(id).innerHTML != null && parseToHTML){ | |
document.getElementById(id).innerHTML = nval; | |
} else if(document.getElementById(id).innerText != null && !parseToHTML){ | |
document.getElementById(id).innerText = nval; | |
} else writeTo(id, nval, true); | |
} | |
/*if(jquery || jQuery){ //if jQuery is present | |
if($("#"+id).val() || $("#"+id).val){ | |
$("#"+id).val(nval); | |
} else if($("#"+id).innerHTML && parseToHTML){ | |
$("#"+id).innerHTML = nval; | |
} else if($("#"+id).innerText && !parseToHTML){ | |
$("#"+id).innerText = nval; | |
} else if($("#"+id).html() || $("#"+id).html){ | |
$("#"+id).html(nval); | |
} else if($("#"+id).text() || $("#"+id).text){ | |
$("#"+id).text(nval); | |
} | |
}*/ | |
console.log("wrote "+nval+" at #"+id); | |
} | |
function checkItem(id){ | |
console.log("#"+id); | |
if(document.getElementById(id)){ | |
console.log("gEBI"); | |
if(document.getElementById(id).value != null) console.log("+ value"); | |
if(document.getElementById(id).innerHTML != null) console.log("+ innerHTML"); | |
if(document.getElementById(id).innerText != null) console.log("+ innerText"); | |
} | |
if(document.querySelector("#"+id)){ | |
console.log("query"); | |
if(document.querySelector("#"+id).value != null) console.log("+ value"); | |
if(document.querySelector("#"+id).innerHTML != null) console.log("+ innerHTML"); | |
if(document.querySelector("#"+id).innerText != null) console.log("+ innerText"); | |
} | |
} | |
var isArray = function(obj){ | |
return Object.prototype.toString.call(obj) === "[object Array]"; | |
}, | |
getNumWithSetDec = function(num, numOfDec){ | |
var pow10s = Math.pow(10, numOfDec || 0); | |
return (numOfDec)? Math.round(pow10s*num)/pow10s: num; | |
}, | |
getSumOfArr = function(arr, numOfDec){ | |
var sum=0; | |
for(i=0; i<arr.length;i++) sum+=arr[i]; | |
return getNumWithSetDec(sum, numOfDec); | |
}, | |
getMean = function(numArr, numOfDec){ | |
if(!isArray(numArr)) return false; | |
var /*i = numArr.length, */sum = getSumOfArr(numArr, numOfDec); | |
//while(i--) sum += numArr[i]; replaced by getSumOfArr() | |
return getNumWithSetDec( (sum/numArr.length), numOfDec); | |
}, | |
getAvg = function(numArr, numOfDec){ | |
if(!isArray(numArr)) return false; | |
var sum = getSumOfArr(numArr, numOfDec), worst=0, best=0; | |
for(i=0; i<numArr.length; i++){ | |
if(!numArr[i] || numArr[i]=="undefined") alert("numArr "+i+" undefined"); | |
worst = (i>0)? Math.max(worst, numArr[i]): numArr[i]; | |
best = (i>0)? Math.min(best, numArr[i]): numArr[i]; | |
} | |
sum-=(worst+best); | |
return getNumWithSetDec((sum/(numArr.length-2)), numOfDec); | |
}, | |
getVariance = function(numArr, numOfDec){ | |
if(!isArray(numArr)) return false; | |
var mean = getMean(numArr, numOfDec), i = numArr.length, v = 0; | |
while(i--) v += Math.pow((numArr[i]-mean), 2); | |
v /= numArr.length-1; | |
return getNumWithSetDec(v, numOfDec); | |
}, | |
getStandardDeviation = function(numArr, numOfDec){ | |
if(!isArray(numArr)) return false; | |
var stdDev = Math.sqrt(getVariance(numArr, numOfDec)); | |
return getNumWithSetDec(stdDev, numOfDec); | |
}; | |
function getMedian(values){ | |
values.sort(function(a,b){return a - b;}); | |
var half = Math.floor(values.length/2); | |
if(values.length%2) return values[half]; | |
else return (values[half-1]+values[half])/2.0; | |
} | |
function getMeanOf(values, n){ | |
var nvals = new Array(n); | |
for(i=0; i<n; i++) nvals[i] = values[values.length-(i+1)]; | |
return getMean(nvals, 2); | |
} | |
function getAvgOf(values, n){ | |
var nvals = new Array(n); | |
for(i=0; i<n; i++) nvals[i] = values[values.length-(i+1)]; | |
return getAvg(nvals, 2); | |
} | |
function getBestMeanOf(values, n){ | |
if(values.length-(n-1)<0) return false; | |
var means = new Array(n), bestmean = new Array(values.length-(n-1));//MeanOfN.len = arr.len-(N-1) | |
for(i=0; i<n; i++){console.log("i="+i+"\n"+times.slice(i, n+i));means[i] = getMeanOf(times.slice(i, n+i), n);console.log(means[i]);} | |
for(i=0; i<bestmean.length; i++) bestmean = (i>0)? Math.min(means[i], means[i-1]): means[i]; | |
return bestmean; | |
} | |
var times = new Array(), best = 0.00, median = 0.00, worst = 0.00, mean = 0.00, avg = 0.00, stddev = 0.00, mo3 = 0, bmo3 = 0, ao5 = 0; bao5 = 0, mo10 = 0, bmo10 = 0, ao12 = 0, bao12 = 0; | |
function update(){ | |
console.log("times: "+times+"\nbest: "+best+"\nmedian: "+median+"\nworst: "+worst+"\nmean: "+mean+"\navg: "+avg+"\nstd-dev: "+stddev); | |
//writeTo("times", times); | |
//checkItem("best"); | |
writeTo("best", best); | |
//checkItem("median"); | |
writeTo("median", median); | |
//checkItem("worst"); | |
writeTo("worst", worst); | |
//checkItem("mean"); | |
writeTo("mean", mean); | |
//checkItem("avg"); | |
writeTo("avg", avg); | |
//checkItem("stddev"); | |
writeTo("stddev", stddev); | |
writeTo("mo3", mo3); | |
writeTo("bmo3", bmo3); | |
writeTo("ao5", ao5); | |
writeTo("bao5", bao5); | |
writeTo("mo10", mo10); | |
writeTo("bmo10", bmo10); | |
writeTo("ao12", ao12); | |
writeTo("bao12", bao12); | |
} | |
function calc(){ | |
times = document.getElementById("times").value; | |
times = times.split(", ")||times.split(","); | |
var len=times.length; | |
for(i=0; i<len; i++) times[i] = getNumWithSetDec(times[i], 2);//parseInt(times[i]*100)/100; | |
var m=0, a=0; | |
for(i=0; i<len; i++){ | |
if(!times[i] || times[i]=="undefined") alert("time "+i+" undefined"); | |
worst = (i>0)? Math.max(worst, times[i]): times[i]; | |
best = (i>0)? Math.min(best, times[i]): times[i]; | |
if(i<3) mo3 += times[times.length-(i+1)]; | |
if(i<10) mo10 += times[times.length-(i+1)]; | |
//mean += times[times.length-(i+1)]; | |
m += times[len-(i+1)]; | |
if(times[times.length-(i+1)]!=worst && times[times.length-(i+1)]!=best){ | |
if(i<5) ao5 += times[times.length-(i+1)]; | |
if(i<12) ao12 += times[times.length-(i+1)]; | |
} | |
} | |
for(i=0; i<len; i++){ | |
if(times[len-(i+1)]!=worst && times[len-(i+1)]!=best) a += times[len-(i+1)]; | |
} | |
ao5 /= 3; | |
mo3 /= 3; | |
ao12 /= 10; | |
mo10 /= 10; | |
//mean /= len; | |
m /= len; | |
a = getNumWithSetDec(a/(len-2), 2); | |
mean = getMean(times, 2); | |
avg = getAvg(times, 2); | |
if(mean=="NaN"){alert("no mean");mean=m;} | |
if(avg=="NaN"){alert("no average");avg=a;} | |
median = getNumWithSetDec(getMedian(times), 2); | |
stddev = getStandardDeviation(times, 2); | |
bmo3 = getBestMeanOf( times, 3); | |
bmo10 = getBestMeanOf( times, 10); | |
ao5 = getNumWithSetDec( ao5, 2); | |
mo3 = getNumWithSetDec( mo3, 2); | |
ao12 = getNumWithSetDec( ao12, 2); | |
mo10 = getNumWithSetDec( mo10, 2); | |
bao5 = getNumWithSetDec( bao5, 2); | |
bmo3 = getNumWithSetDec( bmo3, 2); | |
bao12 = getNumWithSetDec( bao12, 2); | |
bmo10 = getNumWithSetDec( bmo10, 2); | |
if(mo3!=getMeanOf(times, 3)) alert("mo3 (?) l.289"); | |
if(mo10!=getMeanOf(times, 10)) alert("mo10 (?) l.290"); | |
if(ao5!=getAvgOf(times, 5)) alert("ao5 (?) l.291"); | |
if(ao12!=getAvgOf(times, 12)) alert("ao12 (?) l.292"); | |
update(); | |
} | |
function min2dec(min){ | |
return (50*min)/30; | |
} | |
function dec2min(dec){ | |
return (30*dec)/50; | |
} | |
function time2sec(time){ | |
//time: hh:mm:ss.ms | |
var t=time.split(":"), sec; | |
if(t.length==3){ | |
var h=parseInt(t[0]), min=parseInt(t[1]), s=parseInt(t[2]*1000)/1000; | |
}else{ | |
var min=parseInt(t[0]), s=parseInt(t[1]*1000)/1000; | |
} | |
sec = h*3600+min*60+s; | |
return sec; | |
} | |
function sec2time(sec){ | |
var h=0, m=0, s=sec; | |
while(s>=60){ | |
s-=60; //(s.ms) | |
m++;//(min) | |
} | |
while(m>=60){ | |
m-=60; | |
h++; | |
} | |
return to2DigitNumbers(h)+":"+to2DigitNumbers(m)+":"+to2DigitNumbers(s);//h:min:s.ms | |
} | |
function to2DigitNumbers(i){ | |
i=(i<10 && i[0]!=0)? "0"+i: i; | |
return i; | |
} | |
</script> | |
</head> | |
<body> | |
<b>Times: </b><input type="text" id="times" placeholder="3.74, 3.37, 2.93, 7.23, 3.22" onChange="calc()" onSubmit="calc()" onBlur="calc()" /><!--value="52.05, 38.08, 40.35, 48.22, 36.74, 31.67, 51.51, 48.54, 47.66, 62.91, 54.21, 54.00, 51.33, 38.56, 69.24, 42.23, 37.57, 39.05, 54.86, 53.02, 35.86, 44.80, 46.02"--><br /> | |
<b>Best: </b><input type="text" id="best" sure /><br /> | |
<b>Median: </b><input type="text" id="median" sure /><br /> | |
<b>Worst: </b><input type="text" id="worst" sure /><br /> | |
<b>Mean: </b><input type="text" id="mean" sure /><br /> | |
<b>Average: </b><input type="text" id="avg" sure /><br /> | |
<b>Standard Deviation: </b><input type="text" id="stddev" nearly /><br /> | |
<b>Mean of 3: </b><input type="text" id="mo3" /><br /> | |
<b>Best Mean of 3: </b><input type="text" id="bmo3" /><br /> | |
<b>Average of 5: </b><input type="text" id="ao5" /><br /> | |
<b>Best Average of 5: </b><input type="text" id="bao5" /><br /> | |
<b>Mean of 10: </b><input type="text" id="mo10" /><br /> | |
<b>Best Mean of 10: </b><input type="text" id="bmo10" /><br /> | |
<b>Average of 12: </b><input type="text" id="ao12" /><br /> | |
<b>Best Average of 12: </b><input type="text" id="bao12" /><br /> | |
<aside> | |
<p>n.b: the fields bordered in <span style="color:#0F0;">light green</span> are 100% sure, the fields in <span style="color:#FC0;">orange</span> are ~50% sure or nearly sure | |
and all the others except the "Times" field are wrong or not precice.</p> | |
<p>If you encounter a problem or a wrong estimation of the validity of a field, please contact <a href="mailto: maxieberkmann@gmail.com" target="_blank">him</a> | |
</aside> | |
<footer> | |
<small style="position:absolute;top:98%;left:85%;">created by <a href="https://plus.google.com/+MaximilianBerkmann" target="_blank">Berkmann Maximilian</a></small> | |
</footer> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment