Updated
This commit is contained in:
Éric Lemoine
262
master/examples/Inher-ComplexMarkupContainers.html
Normal file
262
master/examples/Inher-ComplexMarkupContainers.html
Normal file
@@ -0,0 +1,262 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html data-dojo-textdir="rtl">
|
||||
<head>
|
||||
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
||||
<title>DOH complex inheritance test</title>
|
||||
|
||||
<style type="text/css">
|
||||
@import "../../../../dojo/resources/dojo.css";
|
||||
@import "../../../../dijit/themes/claro/claro.css";
|
||||
</style>
|
||||
|
||||
<!-- required: dojo.js -->
|
||||
<script type="text/javascript" src="../../../../dojo/dojo.js"
|
||||
data-dojo-config="isDebug: true">
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
dojo.require("dijit.dijit");
|
||||
dojo.require("dijit.layout.AccordionContainer");
|
||||
dojo.require("dijit.layout.ContentPane");
|
||||
dojo.require("dijit.layout.BorderContainer");
|
||||
dojo.require("dijit.layout.TabContainer");
|
||||
dojo.require("dojo.parser"); // scan page for widgets and instantiate them
|
||||
dojo.require("dijit.form.FilteringSelect");
|
||||
dojo.require("dijit.form.SimpleTextarea");
|
||||
dojo.require("dijit.form.Textarea");
|
||||
dojo.require("dijit.form.TextBox");
|
||||
dojo.require("doh.runner");
|
||||
|
||||
dojo.require("dijit._BidiSupport");
|
||||
|
||||
dojo.ready(function(){
|
||||
|
||||
doh.register("parse", function(){
|
||||
dojo.parser.parse();
|
||||
});
|
||||
|
||||
doh.register("before MarkupAccordion textBox", [
|
||||
{
|
||||
name: "text direction of 'beforeMarkupAccordion'",
|
||||
|
||||
setUp: function(){
|
||||
textBox = dijit.byId("beforeMarkupAccordion");
|
||||
},
|
||||
|
||||
runTest: function(){
|
||||
doh.is("rtl",textBox.focusNode.dir,"direction of :" + textBox.id);
|
||||
textBox.set('value','\u05e9\u05d9\u05de\u05d5\u05e9\u0020\u05d1\u05ea\u05d2\u05d9\u05d5\u05ea\u002e');
|
||||
doh.is("rtl",textBox.focusNode.dir,"direction of :" + textBox.id);
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
doh.register("test 'A Simple Pane'.", [
|
||||
{
|
||||
name:"check combo textDir.",
|
||||
|
||||
runTest:function(){
|
||||
combo = dijit.byId("selectInPane");
|
||||
doh.is("rtl", combo.textDir, combo.id);
|
||||
}
|
||||
},
|
||||
{
|
||||
name: "check input field text direction",
|
||||
|
||||
runTest: function(){
|
||||
var textBox = dijit.byId("simpleTextbox");
|
||||
|
||||
doh.is("rtl", textBox.textDir,textBox.id);
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
doh.register("test 'BorderContainer Pane'", [
|
||||
{
|
||||
name: "textDir of the panes",
|
||||
|
||||
runTest: function(){
|
||||
var bContainer = dijit.byId("borderContainerPane"),
|
||||
cPane1 = dijit.byId("contentPane1"),
|
||||
cPane2 = dijit.byId("contentPane2");
|
||||
|
||||
doh.is("auto",bContainer.textDir,"'borderContainerPane' textDir");
|
||||
doh.is("ltr",cPane1.textDir,"'contentPane1' textDir");
|
||||
doh.is("auto",cPane2.textDir,"'contentPane2' textDir");
|
||||
|
||||
}
|
||||
},
|
||||
{
|
||||
name: "textDir of textBoxes in the 'contentPane1' textDir='ltr'",
|
||||
|
||||
runTest: function(){
|
||||
var select = dijit.byId("selectL"),
|
||||
input1 = dijit.byId("inputLHeb"),
|
||||
input2 = dijit.byId("inputLEn");
|
||||
|
||||
doh.is("ltr",select.textDir,"'selectL' textDir");
|
||||
doh.is("ltr",input1.textDir,"'inputLHeb' textDir");
|
||||
doh.is("ltr",input2.textDir,"'inputLEn' textDir");
|
||||
}
|
||||
},
|
||||
{
|
||||
name: "textDir of textBoxes in the 'contentPane2' textDir='auto'",
|
||||
|
||||
runTest: function(){
|
||||
var selectA = dijit.byId("selectA"),
|
||||
input1 = dijit.byId("inputAHeb"),
|
||||
input2 = dijit.byId("inputAEn");
|
||||
|
||||
doh.is("auto",selectA.textDir,"'selectA' textDir");
|
||||
doh.is("auto",input1.textDir,"'inputAHeb' textDir");
|
||||
doh.is("auto",input2.textDir,"'inputAEn' textDir");
|
||||
|
||||
doh.is("",selectA.dir,"'selectA' dir");
|
||||
doh.is("rtl",input1.focusNode.dir,"'inputAHeb' textDir");
|
||||
doh.is("ltr",input2.focusNode.dir,"'inputAEn' textDir");
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
doh.register("test 'Tags & panes with TextBoxesAreas'", [
|
||||
{
|
||||
name: "textDir of the panes",
|
||||
|
||||
runTest: function(){
|
||||
doh.is("auto",dijit.byId("embeddedLayoutPane").textDir,"'embeddedLayoutPane' textDir");
|
||||
doh.is("ltr",dijit.byId("bContainer").textDir,"'bContainer' textDir");
|
||||
doh.is("ltr",dijit.byId("contentPane3").textDir,"'contentPane3' textDir");
|
||||
doh.is("auto",dijit.byId("contentPane4").textDir,"'contentPane4' textDir");
|
||||
doh.is("auto",dijit.byId("tContainer").textDir,"'tContainer' textDir");
|
||||
doh.is("rtl",dijit.byId("contentPane5").textDir,"'contentPane5' textDir");
|
||||
doh.is("auto",dijit.byId("contentPane6").textDir,"'contentPane6' textDir");
|
||||
}
|
||||
},
|
||||
{
|
||||
name: "textDir of textBoxes",
|
||||
|
||||
runTest: function(){
|
||||
doh.is("ltr",dijit.byId("ltrSimpleTexarea").textDir,"'ltrSimpleTexarea' textDir");
|
||||
doh.is("ltr",dijit.byId("ltrSimpleTexarea").focusNode.dir,"'ltrSimpleTexarea' dir");
|
||||
|
||||
doh.is("auto",dijit.byId("autoSimpleTexarea").textDir,"'autoSimpleTexarea' textDir");
|
||||
doh.is("rtl",dijit.byId("autoSimpleTexarea").focusNode.dir,"'autoSimpleTexarea' dir");
|
||||
|
||||
doh.is("rtl",dijit.byId("rtlSimpleTexarea").textDir,"'rtlSimpleTexarea' textDir");
|
||||
doh.is("rtl",dijit.byId("rtlSimpleTexarea").focusNode.dir,"'rtlSimpleTexarea' dir");
|
||||
|
||||
|
||||
|
||||
doh.is("auto",dijit.byId("texarea1").textDir,"'texarea1' textDir");
|
||||
doh.is("rtl",dijit.byId("texarea1").focusNode.dir,"'texarea1' dir");
|
||||
|
||||
doh.is("auto",dijit.byId("texarea2").textDir,"'texarea2' textDir");
|
||||
doh.is("ltr",dijit.byId("texarea2").focusNode.dir,"'texarea2' dir");
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
doh.run();
|
||||
});
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body class="claro" data-dojo-textdir="rtl">
|
||||
|
||||
<h1 class="testTitle">AccordionContainer Tests textDir="rtl" - defined in body tag.</h1>
|
||||
<h2>Accordion from markup:</h2>
|
||||
<input id="beforeMarkupAccordion" data-dojo-type="dijit.form.TextBox" data-dojo-props='name:"ltrMSimpleTexarea",
|
||||
value:"Markup Testing.", rows:"1", cols:"20"'/>
|
||||
|
||||
<div id="markupAccordion" data-dojo-type="dijit.layout.AccordionContainer" data-dojo-props='style:"width:500px; height:600px; overflow:hidden"' >
|
||||
<div id="pane1" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='selected:"true", title:"A Simple Pane"'>
|
||||
<select id= "selectInPane" data-dojo-type="dijit.form.FilteringSelect">
|
||||
<option value="1">foo.</option>
|
||||
<option value="2">בר.</option>
|
||||
<option value="3">baz.</option>
|
||||
</select>
|
||||
<p>
|
||||
<input id="simpleTextbox" data-dojo-type="dijit.form.TextBox" data-dojo-props='value:"שלום!"'/>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div data-dojo-textdir="auto">
|
||||
<div id="borderContainerPane" data-dojo-type="dijit.layout.BorderContainer" data-dojo-props='title:"BorderContainer Pane"'>
|
||||
<div id="contentPane1" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='region:"left", style:"width:50%", splitter:"true", textDir:"ltr"'>
|
||||
<p>
|
||||
This Pane ovverrides the body defined textDir="rtl" to textDir="ltr".
|
||||
See some examples:
|
||||
</p>
|
||||
<select id="selectL" data-dojo-type="dijit.form.FilteringSelect">
|
||||
<option value="1">foo.</option>
|
||||
<option value="2">בר.</option>
|
||||
<option value="3">baz.</option>
|
||||
</select>
|
||||
<p>
|
||||
<input id="inputLHeb" data-dojo-type="dijit.form.TextBox" data-dojo-props='value:"שלום!"'/>
|
||||
</p>
|
||||
<p>
|
||||
<input id="inputLEn" data-dojo-type="dijit.form.TextBox" data-dojo-props='value:"Hello!"'/>
|
||||
</p>
|
||||
</div>
|
||||
<div id="contentPane2" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='region:"center"'>
|
||||
<p>
|
||||
This Pane inherits its textDir from the dijit.layout.BorderContainer, and now textDir="auto".
|
||||
See some examples:
|
||||
</p>
|
||||
<select id="selectA" data-dojo-type="dijit.form.FilteringSelect">
|
||||
<option value="1">foo.</option>
|
||||
<option value="2">בר.</option>
|
||||
<option value="3">baz.</option>
|
||||
</select>
|
||||
<p>
|
||||
<input id="inputAHeb" data-dojo-type="dijit.form.TextBox" data-dojo-props='value:"שלום!"'/>
|
||||
</p>
|
||||
<p>
|
||||
<input id="inputAEn" data-dojo-type="dijit.form.TextBox" data-dojo-props='value:"Hello!"'/>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="embeddedLayoutPane" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='title:"Tags & panes with TextBoxesAreas",
|
||||
textDir:"auto"'>
|
||||
<p>
|
||||
Here's a BorderContainer: textDir= contextual
|
||||
</p>
|
||||
<div data-dojo-textdir="ltr">
|
||||
<div id="bContainer" data-dojo-type ="dijit.layout.BorderContainer" data-dojo-props='style:"height:200px; width:300px" '>
|
||||
<div id="contentPane3" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='region:"left", style:"width:125px", splitter:"true"'>
|
||||
Left Pane:
|
||||
<textarea id="ltrSimpleTexarea" data-dojo-type="dijit.form.SimpleTextarea" data-dojo-props='name:"ltrSimpleTexarea",
|
||||
rows:"8", cols:"13"'> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt.
|
||||
</textarea>
|
||||
</div>
|
||||
<div id="contentPane4" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='region:"center",textDir:"auto"'>
|
||||
Right Pane:
|
||||
<textarea id="autoSimpleTexarea" data-dojo-type="dijit.form.SimpleTextarea" data-dojo-props='name:"autoSimpleTexarea", rows:"8", cols:"13"
|
||||
'> לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית מוסן מנת.
|
||||
</textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
And a TabContainer:
|
||||
</p>
|
||||
<div id="tContainer" data-dojo-type="dijit.layout.TabContainer" data-dojo-props='style:"height:170px; width:450px"' >
|
||||
<div id="contentPane5" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='title:"Tab 1 textDir=rtl", textDir:"rtl"'>
|
||||
<textarea id="rtlSimpleTexarea" data-dojo-type="dijit.form.SimpleTextarea" data-dojo-props='name:"rtlSimpleTexarea",
|
||||
rows:"4", cols:"15" '>jhkjkh.</textarea>
|
||||
</div>
|
||||
<div id="contentPane6" data-dojo-type="dijit.layout.ContentPane" data-dojo-props='title:"Tab 2 textDir=inherited from ContentPane"' >
|
||||
<textarea id="texarea1" data-dojo-type="dijit.form.Textarea" data-dojo-props='name:"texarea1", rows:"4", cols:"14"
|
||||
'>מבחן.</textarea>
|
||||
<textarea id="texarea2" data-dojo-type="dijit.form.Textarea" data-dojo-props='name:"texarea2", rows:"4", cols:"14"
|
||||
'>Test.</textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user