dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
164 lines (151 loc) • 8.15 kB
HTML
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>Carousel Tests</title>
<link href="../../../themes/common/domButtons/DomButtonRedBadge.css" rel="stylesheet"/>
<link href="../../../themes/common/domButtons/DomButtonGreenBadge.css" rel="stylesheet"/>
<link href="../../../themes/common/domButtons/DomButtonBlueBadge.css" rel="stylesheet"/>
<script type="text/javascript" src="../../../deviceTheme.js"></script>
<script type="text/javascript" src="../../../../../dojo/dojo.js" data-dojo-config="async: true, parseOnLoad: true"></script>
<script language="JavaScript" type="text/javascript">
var store1;
require([
"dojo/dom",
"dojo/dom-class", // dojo.hasClass
"dojo/dom-construct", // dojo.place
"dojo/ready", // dojo.ready
"dijit/registry", // dijit.byId
"doh/runner", //doh functions
"dojox/mobile/Badge",
"dojox/mobile/Pane",
"dojox/mobile", // This is a mobile app.
"dojox/mobile/View", // This mobile app uses mobile view
"dojox/mobile/compat", // This mobile app supports running on desktop browsers
"dojox/mobile/parser" // This mobile app uses declarative programming with fast mobile parser
], function(dom, domClass, domConst, ready, registry, runner, Badge){
var WIDGET_VALUE1 = "6";
var WIDGET_VALUE2 = "48";
var WIDGET_VALUE3 = "320";
var WIDGET_CLASSNAME1 = "mblBadge";
var WIDGET_CLASSNAME2 = "mblDomButton";
var WIDGET_CLASSNAME3 = "mblDomButtonRedBadge";
var WIDGET_CLASSNAME4 = "mblDomButtonBlueBadge";
var WIDGET_CLASSNAME5 = "mblDomButtonGreenBadge";
function _createBadgeDeclaratively(id) {
return registry.byId(id);
};
function _createBadgeProgrammatically(placeHolderIds, ids){
var widget1 = new Badge({value:WIDGET_VALUE1});
runner.assertNotEqual(null, widget1);
widget1.domNode.id = ids[0];
domConst.place(widget1.domNode, placeHolderIds[0], "replace");
var widget2 = new Badge({value:WIDGET_VALUE2, className:"mblDomButtonBlueBadge"});
runner.assertNotEqual(null, widget2);
widget2.domNode.id = ids[1];
domConst.place(widget2.domNode, placeHolderIds[1], "replace");
var widget3 = new Badge({value:WIDGET_VALUE3, className:"mblDomButtonGreenBadge", fontSize:11});
runner.assertNotEqual(null, widget3);
widget3.domNode.id = ids[2];
domConst.place(widget3.domNode, placeHolderIds[2], "replace");
return widget1;
};
function _createBadgeProgrammaticallyWithSourceNodeReference(ids){
var widget1 = new Badge({value:WIDGET_VALUE1}, dom.byId(ids[0]));
runner.assertNotEqual(null, widget1);
var widget2 = new Badge({value:WIDGET_VALUE2, className:"mblDomButtonBlueBadge"}, dom.byId(ids[1]));
runner.assertNotEqual(null, widget2);
var widget3 = new Badge({value:WIDGET_VALUE3, className:"mblDomButtonGreenBadge", fontSize:11}, dom.byId(ids[2]));
runner.assertNotEqual(null, widget3);
return widget1;
};
function _assertBadge(ids){
var widget1 = dom.byId(ids[0]);
runner.assertNotEqual(null, widget1, ids[0]);
runner.assertEqual(WIDGET_VALUE1, widget1.childNodes[0].innerHTML, widget1.id)
runner.assertTrue(domClass.contains(widget1, WIDGET_CLASSNAME1), WIDGET_CLASSNAME1 + " id=" + widget1.id + " value=" + widget1.className);
runner.assertTrue(domClass.contains(widget1, WIDGET_CLASSNAME2), WIDGET_CLASSNAME2 + " id=" + widget1.id + " value=" + widget1.className);
runner.assertTrue(domClass.contains(widget1, WIDGET_CLASSNAME3), WIDGET_CLASSNAME3 + " id=" + widget1.id + " value=" + widget1.className);
var widget2 = dom.byId(ids[1]);
runner.assertNotEqual(null, widget2, ids[1]);
runner.assertEqual(WIDGET_VALUE2, widget2.childNodes[0].innerHTML, widget2.id)
runner.assertTrue(domClass.contains(widget2, WIDGET_CLASSNAME1), WIDGET_CLASSNAME1 + " id=" + widget2.id + " value=" + widget2.className);
runner.assertTrue(domClass.contains(widget2, WIDGET_CLASSNAME2), WIDGET_CLASSNAME2 + " id=" + widget2.id + " value=" + widget2.className);
runner.assertTrue(domClass.contains(widget2, WIDGET_CLASSNAME4), WIDGET_CLASSNAME4 + " id=" + widget2.id + " value=" + widget2.className);
var widget3 = dom.byId(ids[2]);
runner.assertNotEqual(null, widget3, ids[2]);
runner.assertEqual(WIDGET_VALUE3, widget3.childNodes[0].innerHTML, widget3.id)
runner.assertTrue(domClass.contains(widget3, WIDGET_CLASSNAME1), WIDGET_CLASSNAME1 + " id=" + widget3.id + " value=" + widget3.className);
runner.assertTrue(domClass.contains(widget3, WIDGET_CLASSNAME2), WIDGET_CLASSNAME2 + " id=" + widget3.id + " value=" + widget3.className);
runner.assertTrue(domClass.contains(widget3, WIDGET_CLASSNAME5), WIDGET_CLASSNAME5 + " id=" + widget3.id + " value=" + widget3.className);
};
function _showView2(){
var view1 = registry.byId("view1");
view1.performTransition("view2", 1, "none");
};
ready(function(){
runner.register("dojox.mobile.test.doh.CarouselTests", [
{
name: "Carousel Verification1",
timeout: 4000,
runTest: function(){
var badge1 = _createBadgeDeclaratively("view1-Badge11");
var badge2 = _createBadgeProgrammatically(["view1-Badge21place", "view1-Badge22place", "view1-Badge23place"], ["view1-Badge21", "view1-Badge22", "view1-Badge23"]);
var badge3 = _createBadgeProgrammaticallyWithSourceNodeReference(["view1-Badge31", "view1-Badge32", "view1-Badge33"]);
_assertBadge(["view1-Badge11", "view1-Badge12", "view1-Badge13"]);
_assertBadge(["view1-Badge21", "view1-Badge22", "view1-Badge23"]);
_assertBadge(["view1-Badge31", "view1-Badge32", "view1-Badge33"]);
}
},
{
name: "Carousel Verification2",
timeout: 4000,
runTest: function(){
var badge1 = _createBadgeDeclaratively("view2-Badge11");
var badge2 = _createBadgeProgrammatically(["view2-Badge21place", "view2-Badge22place", "view2-Badge23place"], ["view2-Badge21", "view2-Badge22", "view2-Badge23"]);
var badge3 = _createBadgeProgrammaticallyWithSourceNodeReference(["view2-Badge31", "view2-Badge32", "view2-Badge33"]);
_showView2();
_assertBadge(["view2-Badge11", "view2-Badge12", "view2-Badge13"]);
_assertBadge(["view2-Badge21", "view2-Badge22", "view2-Badge23"]);
_assertBadge(["view2-Badge31", "view2-Badge32", "view2-Badge33"]);
}
}
]);
runner.run();
});
})
</script>
</head>
<body>
<div id="view1" data-dojo-type="dojox.mobile.View" selected="true">
<h1>View 1</h1>
<div data-dojo-type="dojox.mobile.Pane" style="padding:0px 30px 0px 30px;">
<div id="view1-Badge11" data-dojo-type="dojox.mobile.Badge" class="mblDomButtonRedBadge" data-dojo-props='value:"6"'></div>
<div id="view1-Badge12" data-dojo-type="dojox.mobile.Badge" class="mblDomButtonBlueBadge" data-dojo-props='value:"48"'></div>
<div id="view1-Badge13" data-dojo-type="dojox.mobile.Badge" class="mblDomButtonGreenBadge" data-dojo-props='value:"320",fontSize:11'></div>
<div id="view1-Badge21place"></div>
<div id="view1-Badge22place"></div>
<div id="view1-Badge23place"></div>
<div id="view1-Badge31"></div>
<div id="view1-Badge32"></div>
<div id="view1-Badge33"></div>
</div>
</div>
<div id="view2" data-dojo-type="dojox.mobile.View">
<h1>View 2</h1>
<div data-dojo-type="dojox.mobile.Pane" style="padding:0px 30px 0px 30px;">
<div id="view2-Badge11" data-dojo-type="dojox.mobile.Badge" class="mblDomButtonRedBadge" data-dojo-props='value:"6"'></div>
<div id="view2-Badge12" data-dojo-type="dojox.mobile.Badge" class="mblDomButtonBlueBadge" data-dojo-props='value:"48"'></div>
<div id="view2-Badge13" data-dojo-type="dojox.mobile.Badge" class="mblDomButtonGreenBadge" data-dojo-props='value:"320",fontSize:11'></div>
<div id="view2-Badge21place"></div>
<div id="view2-Badge22place"></div>
<div id="view2-Badge23place"></div>
<div id="view2-Badge31"></div>
<div id="view2-Badge32"></div>
<div id="view2-Badge33"></div>
</div>
</div>
</body>
</html>