Added new auto parameter testbox to all tests
Michael Zinsmaier
12 years ago
parent
3db2c2ee2f
commit
aa0883073c
@ -0,0 +1,12 @@
|
||||
.parameterInput {
|
||||
margin-left: 30px;
|
||||
margin-right: 5px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.parameterBox {
|
||||
background-color: #BBBBBB;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
@ -0,0 +1,146 @@
|
||||
!function() {
|
||||
|
||||
var TestSetup = function(div, lineParameter, replotFunctions) {
|
||||
div.append("<div id='normalParameters' class='parameterBox'></div>");
|
||||
$("#normalParameters").append("<input class='parameterInput' id='apply' type='checkbox' onchange='TestSetup.applyChanged()'>apply</input>");
|
||||
|
||||
div.append("<div id='legacyParameters' class='parameterBox'></div>");
|
||||
$("#legacyParameters").append("<input class='parameterInput' id='useLegacy' type='checkbox' onchange='TestSetup.useLegacyChanged()'>use legacy options</input>");
|
||||
$("#legacyParameters").append("<input class='parameterInput' id='legacyFit' type='checkbox' onchange='TestSetup.legacyFitChanged()'>fit</input>");
|
||||
$("#legacyParameters").append("<input class='parameterInput' id='legacyPointFactor' type='text' onchange='TestSetup.legacyPointFactorChanged()'>point factor</input>");
|
||||
$("#legacyParameters").append("<input class='parameterInput' id='legacyFitPointDist' type='text' onchange='TestSetup.legacyFitPointDistChanged()'>fit point dist</input>");
|
||||
|
||||
|
||||
var parameter = lineParameter;
|
||||
var changing = false;
|
||||
|
||||
function replotAll(parameter, replotFunctions) {
|
||||
for (var i = 0; i < replotFunctions.length; i++) {
|
||||
replotFunctions[i](parameter);
|
||||
}
|
||||
}
|
||||
|
||||
function init(parameter) {
|
||||
if (changing) return;
|
||||
changing = true;
|
||||
{
|
||||
var defaultParam = {
|
||||
active : false,
|
||||
apply : false,
|
||||
monotonicFit : false,
|
||||
tension : 0.0,
|
||||
legacyOverride : undefined
|
||||
};
|
||||
|
||||
var combinedParam = jQuery.extend(defaultParam, parameter);
|
||||
|
||||
if (combinedParam.legacyOverride == true) {
|
||||
combinedParam.legacyOverride = {
|
||||
fit : false,
|
||||
curvePointFactor : 20,
|
||||
fitPointDist : undefined
|
||||
};
|
||||
parameter.legacyOverride = {
|
||||
fit : false,
|
||||
curvePointFactor : 20,
|
||||
fitPointDist : undefined
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
$("#apply").prop("checked", combinedParam.apply);
|
||||
|
||||
var withLegacy = (typeof combinedParam.legacyOverride != 'undefined' && combinedParam.legacyOverride != false);
|
||||
var fit = withLegacy ? combinedParam.legacyOverride.fit : false;
|
||||
var pointFactor = withLegacy ? combinedParam.legacyOverride.curvePointFactor : '20';
|
||||
var fitDist = withLegacy ? combinedParam.legacyOverride.fitPointDist : '';
|
||||
|
||||
$("#useLegacy").prop("checked", withLegacy);
|
||||
$("#legacyFit").prop("checked", fit);
|
||||
$("#legacyPointFactor").val(pointFactor);
|
||||
$("#legacyFitPointDist").val(fitDist);
|
||||
|
||||
replotAll(parameter, replotFunctions);
|
||||
}
|
||||
changing = false;
|
||||
}
|
||||
|
||||
TestSetup.applyChanged = function() {
|
||||
if (changing) return;
|
||||
changing = true;
|
||||
{
|
||||
parameter.apply = $("#apply").prop("checked");
|
||||
replotAll(parameter, replotFunctions);
|
||||
}
|
||||
changing = false;
|
||||
};
|
||||
|
||||
TestSetup.useLegacyChanged = function() {
|
||||
if (changing) return;
|
||||
changing = true;
|
||||
{
|
||||
if ($("#useLegacy").prop("checked")) {
|
||||
parameter.legacyOverride = {
|
||||
fit : false,
|
||||
curvePointFactor : 20,
|
||||
fitPointDist : undefined
|
||||
};
|
||||
} else {
|
||||
parameter.legacyOverride = undefined;
|
||||
}
|
||||
|
||||
$("#legacyFit").prop("checked", false);
|
||||
$("#legacyPointFactor").val(20);
|
||||
$("#legacyFitPointDist").val('');
|
||||
replotAll(parameter, replotFunctions);
|
||||
}
|
||||
changing = false;
|
||||
};
|
||||
|
||||
TestSetup.legacyFitChanged = function() {
|
||||
if (changing) return;
|
||||
changing = true;
|
||||
{
|
||||
if ($("#useLegacy").prop("checked")) {
|
||||
parameter.legacyOverride.fit = $("#legacyFit").prop("checked");
|
||||
replotAll(parameter, replotFunctions);
|
||||
}
|
||||
}
|
||||
changing = false;
|
||||
};
|
||||
|
||||
TestSetup.legacyPointFactorChanged = function() {
|
||||
if (changing) return;
|
||||
changing = true;
|
||||
{
|
||||
if ($("#useLegacy").prop("checked")) {
|
||||
parameter.legacyOverride.curvePointFactor = $("#legacyPointFactor").val();
|
||||
replotAll(parameter, replotFunctions);
|
||||
}
|
||||
}
|
||||
changing = false;
|
||||
};
|
||||
|
||||
TestSetup.legacyFitPointDistChanged = function() {
|
||||
if (changing) return;
|
||||
changing = true;
|
||||
{
|
||||
if ($("#useLegacy").prop("checked")) {
|
||||
var text = $("#legacyFitPointDist").val();
|
||||
if (text == '') {
|
||||
parameter.legacyOverride.fitPointDist = undefined;
|
||||
} else {
|
||||
parameter.legacyOverride.fitPointDist = text;
|
||||
}
|
||||
|
||||
replotAll(parameter, replotFunctions);
|
||||
}
|
||||
}
|
||||
changing = false;
|
||||
};
|
||||
|
||||
init(parameter);
|
||||
};
|
||||
|
||||
this.TestSetup = TestSetup;
|
||||
}();
|
||||
@ -1,103 +1,101 @@
|
||||
<hmtl>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
||||
<title>CurvedLines Plugin for flot</title>
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
||||
<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../flot/excanvas.min.js"></script><![endif]-->
|
||||
<script language="javascript" type="text/javascript" src="../flot/jquery.flot.js"></script>
|
||||
<script language="javascript" type="text/javascript" src="../flot/jquery.flot.time.js"></script>
|
||||
<script language="JavaScript" type="text/javascript" src="../curvedLines.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="placeholder" style="width: 800;height: 400;"></div>
|
||||
<div id="placeholder2" style="width: 800;height: 400;"></div>
|
||||
|
||||
<script id="source" language="javascript" type="text/javascript">
|
||||
var d1 = [[new Date(1360735200000), 2], [new Date(1360648800000), 21], [new Date(1360562400000), 3], [new Date(1360303200000), 3], [new Date(1360216800000), 3], [new Date(1360130400000), 5], [new Date(1360044000000), 0], [new Date(1359957600000), 0], [new Date(1359698400000), 0], [new Date(1359612000000), 1], [new Date(1359525600000), 2], [new Date(1359439200000), 3], [new Date(1359352800000), 1], [new Date(1359093600000), 2], [new Date(1359007200000), 1], [new Date(1358920800000), 5], [new Date(1358834400000), 13], [new Date(1358748000000), 12], [new Date(1358488800000), 10], [new Date(1358402400000), 11], [new Date(1358316000000), 5], [new Date(1358229600000), 4], [new Date(1358143200000), 3]];
|
||||
|
||||
d1.sort(sortfunction)
|
||||
|
||||
function sortfunction(a, b){
|
||||
if (a[0] < b[0]) {
|
||||
return -1;
|
||||
}
|
||||
if (a[0] > b[0]) {
|
||||
return 1;
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
var options = {
|
||||
series : {
|
||||
curvedLines : {
|
||||
active : true
|
||||
}
|
||||
},
|
||||
xaxis : {
|
||||
mode : "time",
|
||||
minTickSize : [1, "hour"]
|
||||
},
|
||||
yaxis : {
|
||||
min : -10,
|
||||
max : 60
|
||||
}
|
||||
};
|
||||
|
||||
$.plot($("#placeholder"), [{
|
||||
data : d1,
|
||||
lines : {
|
||||
show : true
|
||||
},
|
||||
curvedLines : {
|
||||
apply : true,
|
||||
legacyOverride: true
|
||||
}
|
||||
}, {
|
||||
data : d1,
|
||||
points : {
|
||||
show : true
|
||||
}
|
||||
}], options);
|
||||
</script>
|
||||
|
||||
<script id="source" language="javascript" type="text/javascript">
|
||||
var d1 = [[20, new Date(2000, 1, 1, 10)], [30, new Date(2000, 1, 1, 8)], [50, new Date(2000, 1, 1, 14)], [80, new Date(2000, 1, 1, 22)]];
|
||||
|
||||
var options = {
|
||||
series : {
|
||||
curvedLines : {
|
||||
active : true
|
||||
}
|
||||
},
|
||||
yaxis : {
|
||||
mode : "time",
|
||||
minTickSize : [1, "hour"],
|
||||
min : (new Date(2000, 1, 1)),
|
||||
max : (new Date(2000, 1, 2))
|
||||
},
|
||||
xaxis : {
|
||||
min : 10,
|
||||
max : 90
|
||||
}
|
||||
};
|
||||
|
||||
$.plot($("#placeholder2"), [{
|
||||
data : d1,
|
||||
lines : {
|
||||
show : true
|
||||
},
|
||||
curvedLines : {
|
||||
apply : true,
|
||||
legacyOverride: true
|
||||
}
|
||||
}, {
|
||||
data : d1,
|
||||
points : {
|
||||
show : true
|
||||
}
|
||||
}], options);
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
<hmtl>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
||||
<title>CurvedLines Plugin for flot</title>
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
||||
<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../flot/excanvas.min.js"></script><![endif]-->
|
||||
<script language="javascript" type="text/javascript" src="../flot/jquery.flot.js"></script>
|
||||
<script language="javascript" type="text/javascript" src="../flot/jquery.flot.time.js"></script>
|
||||
<script language="JavaScript" type="text/javascript" src="../curvedLines.js"></script>
|
||||
<script language="JavaScript" type="text/javascript" src="_TestSetup.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="_TestSetup.css">
|
||||
</link>
|
||||
</head>
|
||||
<body>
|
||||
<div id="placeholder" style="width: 800;height: 300;"></div>
|
||||
<div id="placeholder2" style="width: 800;height: 300;"></div>
|
||||
<div id="parameters" style="width: 800"></div>
|
||||
|
||||
<script id="source" language="javascript" type="text/javascript">
|
||||
//data
|
||||
var d1 = [[new Date(1358143200000), 3], [new Date(1358229600000), 4], [new Date(1358316000000), 5], [new Date(1358402400000), 11], [new Date(1358488800000), 10], [new Date(1358748000000), 12], [new Date(1358834400000), 13], [new Date(1358920800000), 5], [new Date(1359007200000), 1], [new Date(1359093600000), 2], [new Date(1359352800000), 1], [new Date(1359439200000), 3], [new Date(1359525600000), 2], [new Date(1359612000000), 1], [new Date(1359698400000), 0], [new Date(1359957600000), 0], [new Date(1360044000000), 0], [new Date(1360130400000), 5], [new Date(1360216800000), 3], [new Date(1360303200000), 3], [new Date(1360562400000), 3], [new Date(1360648800000), 21], [new Date(1360735200000), 2]];
|
||||
var d2 = [[20, new Date(2000, 1, 1, 10)], [30, new Date(2000, 1, 1, 8)], [50, new Date(2000, 1, 1, 14)], [80, new Date(2000, 1, 1, 22)]];
|
||||
|
||||
//general plot options
|
||||
var options = {
|
||||
series : {
|
||||
curvedLines : {
|
||||
active : true
|
||||
}
|
||||
},
|
||||
xaxis : {
|
||||
mode : "time",
|
||||
minTickSize : [1, "hour"]
|
||||
},
|
||||
yaxis : {
|
||||
min : -10,
|
||||
max : 60
|
||||
}
|
||||
};
|
||||
var options2 = {
|
||||
series : {
|
||||
curvedLines : {
|
||||
active : true
|
||||
}
|
||||
},
|
||||
yaxis : {
|
||||
mode : "time",
|
||||
minTickSize : [1, "hour"],
|
||||
min : (new Date(2000, 1, 1)),
|
||||
max : (new Date(2000, 1, 2))
|
||||
},
|
||||
xaxis : {
|
||||
min : 10,
|
||||
max : 90
|
||||
}
|
||||
};
|
||||
|
||||
//curved line paramters
|
||||
var defaultParameters = {
|
||||
apply : true,
|
||||
legacyOverride : true
|
||||
}
|
||||
|
||||
|
||||
//plot function
|
||||
function replot(parameters) {
|
||||
$.plot($("#placeholder"), [{
|
||||
data : d1,
|
||||
lines : {
|
||||
show : true
|
||||
},
|
||||
curvedLines : parameters
|
||||
}, {
|
||||
data : d1,
|
||||
points : {
|
||||
show : true
|
||||
}
|
||||
}], options);
|
||||
}
|
||||
|
||||
function replot2(parameters) {
|
||||
$.plot($("#placeholder2"), [{
|
||||
data : d2,
|
||||
lines : {
|
||||
show : true,
|
||||
lineWidth : 3
|
||||
},
|
||||
curvedLines : parameters
|
||||
}, {
|
||||
data : d2,
|
||||
points : {
|
||||
show : true
|
||||
}
|
||||
}], options2);
|
||||
}
|
||||
|
||||
//combine everything
|
||||
TestSetup($("#parameters"), defaultParameters, [replot, replot2])
|
||||
</script>
|
||||
</body>
|
||||
</hmtl>
|
||||
Loading…
Reference in New Issue