You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
153 lines
4.3 KiB
153 lines
4.3 KiB
<!DOCTYPE html> |
|
<html lang="en"> |
|
<head> |
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> |
|
<title>Dojo Slider Widget Test (non-robot)</title> |
|
|
|
<script type="text/javascript" src="../boilerplate.js"></script> |
|
|
|
<script type="text/javascript"> |
|
var registry, dom; |
|
require([ |
|
"doh/runner", |
|
"dojo/dom", |
|
"dojo/dom-construct", |
|
"dojo/parser", |
|
"dojo/query", |
|
"dijit/registry", |
|
"dijit/form/HorizontalSlider", |
|
"dijit/form/VerticalSlider", |
|
"dijit/form/HorizontalRule", |
|
"dijit/form/VerticalRule", |
|
"dijit/form/HorizontalRuleLabels", |
|
"dijit/form/VerticalRuleLabels", |
|
"dojo/domReady!" |
|
], function(doh, dom, domConstruct, parser, query, registry, |
|
HorizontalSlider, VerticalSlider, HorizontalRule, |
|
VerticalRule, HorizontalRuleLabels, VerticalRuleLabels) { |
|
|
|
var slider1, slider2; |
|
|
|
doh.register("create", { |
|
|
|
one: function () { |
|
// Create a slider w/out a root node. Note: tests #13815. |
|
slider1 = new HorizontalSlider({ |
|
value: 10, |
|
showButtons: false, |
|
minimum: 0, |
|
maximum: 50, |
|
discreteValues: 51 |
|
}); |
|
|
|
var hrLabels1 = new HorizontalRuleLabels({ |
|
container: "topDecoration", |
|
style: "height: 12px", |
|
minimum: 0, |
|
maximum: 0.5, |
|
count: 6 |
|
}); |
|
slider1.addChild(hrLabels1); |
|
|
|
var hrRule1 = new HorizontalRule({ |
|
container: "topDecoration", |
|
style: "height: 5px", |
|
count: 11 |
|
}); |
|
slider1.addChild(hrRule1); |
|
|
|
slider1.placeAt(document.body); |
|
|
|
doh.is(10, slider1.get("value"), "value"); |
|
}, |
|
|
|
two: function () { |
|
// Create a second slider. |
|
slider2 = new HorizontalSlider({ |
|
value: 0, |
|
showButtons: false, |
|
minimum: 0, |
|
maximum: 90, |
|
discreteValues: 91 |
|
}); |
|
|
|
var hrLabels3 = new HorizontalRuleLabels({ |
|
container: "topDecoration", |
|
style: "height: 12px", |
|
minimum: 0, |
|
maximum: 0.9, |
|
count: 10 |
|
}); |
|
slider2.addChild(hrLabels3); |
|
|
|
var hrRule3 = new HorizontalRule({ |
|
container: "topDecoration", |
|
style: "height: 5px", |
|
count: 21 |
|
}); |
|
slider2.addChild(hrRule3); |
|
|
|
slider2.placeAt(document.body); |
|
|
|
// Should get ten labels, not five (#18113) |
|
doh.is(10, query(".dijitRuleLabelContainer", slider2.domNode).length, "# of labels"); |
|
} |
|
}); |
|
|
|
// aria role and properties tests. |
|
doh.register("aria", function() { |
|
doh.is("slider", slider1.focusNode.getAttribute("role"), "aria role (slider)"); |
|
doh.is(slider1.minimum, slider1.focusNode.getAttribute("aria-valuemin"), "aria-valuemin"); |
|
doh.is(slider1.maximum, slider1.focusNode.getAttribute("aria-valuemax"), "aria-valuemax"); |
|
doh.is(slider1.get('value'), slider1.focusNode.getAttribute("aria-valuenow"), "initial aria-valuenow"); |
|
var half = (slider1.maximum + slider1.minimum) >> 1; |
|
slider1.set('value', half, true); |
|
doh.is(half, slider1.focusNode.getAttribute("aria-valuenow"), "half aria-valuenow"); |
|
}); |
|
|
|
doh.register("API", [ |
|
function increment() { |
|
var v = slider1.get('value'); |
|
slider1._bumpValue(1, true); |
|
var v2 = slider1.get('value'); |
|
doh.t(v2 > v, "increment"); |
|
slider1.maximum = v2; |
|
slider1._bumpValue(1, true); |
|
var v3 = slider1.get('value'); |
|
doh.is(v2, v3, "no increment"); |
|
}, |
|
function decrement() { |
|
var v = slider1.get('value'); |
|
slider1._bumpValue(-1, true); |
|
var v2 = slider1.get('value'); |
|
doh.t(v2 < v, "decrement"); |
|
slider1.minimum = v2; |
|
slider1._bumpValue(-1, true); |
|
var v3 = slider1.get('value'); |
|
doh.is(v2, v3, "no decrement"); |
|
}, |
|
function locked() { |
|
var v = slider1.get('value'); |
|
slider1.maximum = slider1.minimum; |
|
slider1._bumpValue(-1, true); |
|
var v2 = slider1.get('value'); |
|
doh.is(v, v2, "no decrement"); |
|
slider1._bumpValue(1, true); |
|
var v2 = slider1.get('value'); |
|
doh.is(v, v2, "no increment"); |
|
this.slideDuration = 0; |
|
slider1.set('value', v, true); |
|
slider1.progressBar.style.width = "0%"; |
|
slider1.remainingBar.style.width = "100%"; |
|
} |
|
]); |
|
|
|
doh.run(); |
|
}); |
|
</script> |
|
</head> |
|
|
|
<body role="main"> |
|
<h1 class="testTitle">Slider Non-Robot Test</h1> |
|
</body> |
|
</html>
|
|
|