Skip to content

Commit

Permalink
Convert dijit/ to use new data-dojo-type syntax, with MID's.
Browse files Browse the repository at this point in the history
  • Loading branch information
wkeese committed Jan 12, 2012
1 parent 8d108f2 commit ca34477
Show file tree
Hide file tree
Showing 71 changed files with 415 additions and 415 deletions.
12 changes: 6 additions & 6 deletions dijit/Calendar.rst
Expand Up @@ -43,7 +43,7 @@ A plain Calendar widget with the formatted date below:
.. html ::
<div data-dojo-type="dijit.Calendar" data-dojo-props="onChange:function(){dojo.byId('formatted').innerHTML=dojo.date.locale.format(arguments[0], {formatLength: 'full', selector:'date'})}"></div>
<div data-dojo-type="dijit/Calendar" data-dojo-props="onChange:function(){dojo.byId('formatted').innerHTML=dojo.date.locale.format(arguments[0], {formatLength: 'full', selector:'date'})}"></div>
<p id="formatted"></p>
.. css ::
Expand All @@ -69,7 +69,7 @@ With an initial selection and weekends disabled:
.. html ::
<div id="mycal" data-dojo-type="dijit.Calendar" value="2009-08-07" data-dojo-props="isDisabledDate:dojo.date.locale.isWeekend"></div>
<div id="mycal" data-dojo-type="dijit/Calendar" value="2009-08-07" data-dojo-props="isDisabledDate:dojo.date.locale.isWeekend"></div>
.. css ::
Expand Down Expand Up @@ -131,7 +131,7 @@ Custom styling:
.. html ::
<input id="calendar5" data-dojo-type="dijit.Calendar" dayWidth="abbr" value="2008-03-13">
<input id="calendar5" data-dojo-type="dijit/Calendar" dayWidth="abbr" value="2008-03-13">
.. css ::
Expand Down Expand Up @@ -189,15 +189,15 @@ Custom styling:
<table class="container">
<tr>
<td>
<div id="hebrew" data-dojo-type="dijit.Calendar" data-dojo-props="datePackage:dojox.date.hebrew, onValueSelected:publishDate, onChange:formatDate"></div>
<div id="hebrew" data-dojo-type="dijit/Calendar" data-dojo-props="datePackage:dojox.date.hebrew, onValueSelected:publishDate, onChange:formatDate"></div>
<div id="hebrewFormatted"></div>
</td>
<td>
<div id="islamic" data-dojo-type="dijit.Calendar" data-dojo-props="datePackage:dojox.date.islamic, onValueSelected:publishDate, onChange:formatDate"></div>
<div id="islamic" data-dojo-type="dijit/Calendar" data-dojo-props="datePackage:dojox.date.islamic, onValueSelected:publishDate, onChange:formatDate"></div>
<div id="islamicFormatted"></div>
</td>
<td>
<div id="gregorian" data-dojo-type="dijit.Calendar" data-dojo-props="onValueSelected:publishDate, onChange:formatDate"></div>
<div id="gregorian" data-dojo-type="dijit/Calendar" data-dojo-props="onValueSelected:publishDate, onChange:formatDate"></div>
<div id="gregorianFormatted"></div>
</td>
</tr>
Expand Down
2 changes: 1 addition & 1 deletion dijit/CalendarLite.rst
Expand Up @@ -27,7 +27,7 @@ A plain Calendar widget with the formatted date below
.. html ::
<div data-dojo-type="dijit.CalendarLite" data-dojo-props="onChange:function(){dojo.byId('formatted').innerHTML=dojo.date.locale.format(arguments[0], {formatLength: 'full', selector:'date'})}"></div>
<div data-dojo-type="dijit/CalendarLite" data-dojo-props="onChange:function(){dojo.byId('formatted').innerHTML=dojo.date.locale.format(arguments[0], {formatLength: 'full', selector:'date'})}"></div>
<p id="formatted"></p>
Expand Down
2 changes: 1 addition & 1 deletion dijit/ColorPalette.rst
Expand Up @@ -70,7 +70,7 @@ Small color palette, created declaratively:
.. html ::
<div data-dojo-type="dijit.ColorPalette" data-dojo-props="onChange:function(){alert(this.value);}, palette:'3x4'"></div>
<div data-dojo-type="dijit/ColorPalette" data-dojo-props="onChange:function(){alert(this.value);}, palette:'3x4'"></div>
Accessibility
Expand Down
8 changes: 4 additions & 4 deletions dijit/Declaration.rst
Expand Up @@ -35,7 +35,7 @@ Here's an example defining a widget called Employee, and then creating two of th
.. html ::
<div data-dojo-type="dijit.Declaration" data-dojo-props="widgetClass:'Employee', defaults:{empid:123, name:''}">
<div data-dojo-type="dijit/Declaration" data-dojo-props="widgetClass:'Employee', defaults:{empid:123, name:''}">
<span>${name}</span>
<a href="update.php?id=${empid}">update</a>
<a href="delete.php?id=${empid}">delete</a>
Expand Down Expand Up @@ -74,7 +74,7 @@ The example below defines a widget named "HideButton" that will hide itself when

.. html ::
<div data-dojo-type="dijit.Declaration" data-dojo-props="widgetClass:'HideButton'">
<div data-dojo-type="dijit/Declaration" data-dojo-props="widgetClass:'HideButton'">
XXX<button data-dojo-attach-event="onclick: myClickHandler" data-dojo-attach-point="containerNode"></button>XXX
<script type='dojo/method' data-dojo-event='myClickHandler'>
this.domNode.style.display="none";
Expand All @@ -98,7 +98,7 @@ Here we define HideButton2 and then create two HideButton2's:

.. html ::
<span data-dojo-type="dijit.Declaration" data-dojo-props="widgetClass:'HideButton2', mixins:'HideButton'">
<span data-dojo-type="dijit/Declaration" data-dojo-props="widgetClass:'HideButton2', mixins:'HideButton'">
YYY<button data-dojo-attach-event="onclick: myClickHandler" data-dojo-attach-point="containerNode"></button>YYY
</span>
<button data-dojo-type="HideButton2">Hide me extended</button>
Expand All @@ -122,7 +122,7 @@ An example of dojo/connect is:

.. html ::
<div data-dojo-type="dijit.Declaration" data-dojo-props="widgetClass:'simpleConnectedWidget'">
<div data-dojo-type="dijit/Declaration" data-dojo-props="widgetClass:'simpleConnectedWidget'">
Just a plain ol' piece of text
<script type="dojo/connect" data-dojo-event="dblclick">
console.debug("Ouch! I've been double-clicked");
Expand Down
70 changes: 35 additions & 35 deletions dijit/Dialog.rst
Expand Up @@ -70,15 +70,15 @@ The first example creates a Dialog via markup from an existing DOM node:
.. html ::
<div id="dialogOne" data-dojo-type="dijit.Dialog" title="My Dialog Title">
<div data-dojo-type="dijit.layout.TabContainer" style="width: 200px; height: 300px;">
<div data-dojo-type="dijit.layout.ContentPane" title="foo">Content of Tab "foo"</div>
<div data-dojo-type="dijit.layout.ContentPane" title="boo">Hi, I'm Tab "boo"</div>
<div id="dialogOne" data-dojo-type="dijit/Dialog" title="My Dialog Title">
<div data-dojo-type="dijit/layout/TabContainer" style="width: 200px; height: 300px;">
<div data-dojo-type="dijit/layout/ContentPane" title="foo">Content of Tab "foo"</div>
<div data-dojo-type="dijit/layout/ContentPane" title="boo">Hi, I'm Tab "boo"</div>
</div>
</div>
<p>When pressing this button the dialog will popup:</p>
<button id="buttonOne" data-dojo-type="dijit.form.Button" type="button">Show me!
<button id="buttonOne" data-dojo-type="dijit/form/Button" type="button">Show me!
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="evt">
// Show the Dialog:
dijit.byId("dialogOne").show();
Expand Down Expand Up @@ -122,7 +122,7 @@ Now let's create a dialog programmatically, and change the dialog's content dyna
.. html ::
<p>When pressing this button the dialog will popup. Notice this time there is no DOM node with content for the dialog:</p>
<button id="buttonTwo" data-dojo-type="dijit.form.Button" data-dojo-props="onClick:showDialogTwo" type="button">Show me!</button>
<button id="buttonTwo" data-dojo-type="dijit/form/Button" data-dojo-props="onClick:showDialogTwo" type="button">Show me!</button>
Expand Down Expand Up @@ -154,12 +154,12 @@ The underlay receives an ID to match the Dialog, suffixed with :ref:``underlay``
.. html ::
<div id="dialogColor" title="Colorful" data-dojo-type="dijit.Dialog">
<div id="dialogColor" title="Colorful" data-dojo-type="dijit/Dialog">
My background color is Green
</div>
<p>When pressing this button the dialog will popup:</p>
<button id="button4" data-dojo-type="dijit.form.Button" type="button">Show me!
<button id="button4" data-dojo-type="dijit/form/Button" type="button">Show me!
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="evt">
dijit.byId("dialogColor").show();
</script>
Expand Down Expand Up @@ -204,46 +204,46 @@ To simply close the dialog, click the Cancel button, which calls the hide() func
.. html ::
<div data-dojo-type="dijit.Dialog" id="formDialog" title="Form Dialog"
<div data-dojo-type="dijit/Dialog" id="formDialog" title="Form Dialog"
execute="alert('submitted w/args:\n' + dojo.toJson(arguments[0], true));">
<table>
<tr>
<td><label for="name">Name: </label></td>
<td><input data-dojo-type="dijit.form.TextBox" type="text" name="name" id="name"></td>
<td><input data-dojo-type="dijit/form/TextBox" type="text" name="name" id="name"></td>
</tr>
<tr>
<td><label for="loc">Location: </label></td>
<td><input data-dojo-type="dijit.form.TextBox" type="text" name="loc" id="loc"></td>
<td><input data-dojo-type="dijit/form/TextBox" type="text" name="loc" id="loc"></td>
</tr>
<tr>
<td><label for="date">Start date: </label></td>
<td><input data-dojo-type="dijit.form.DateTextBox" type="text" name="sdate" id="sdate"></td>
<td><input data-dojo-type="dijit/form/DateTextBox" type="text" name="sdate" id="sdate"></td>
</tr>
<tr>
<td><label for="date">End date: </label></td>
<td><input data-dojo-type="dijit.form.DateTextBox" type="text" name="edate" id="edate"></td>
<td><input data-dojo-type="dijit/form/DateTextBox" type="text" name="edate" id="edate"></td>
</tr>
<tr>
<td><label for="date">Time: </label></td>
<td><input data-dojo-type="dijit.form.TimeTextBox" type="text" name="time" id="time"></td>
<td><input data-dojo-type="dijit/form/TimeTextBox" type="text" name="time" id="time"></td>
</tr>
<tr>
<td><label for="desc">Description: </label></td>
<td><input data-dojo-type="dijit.form.TextBox" type="text" name="desc" id="desc"></td>
<td><input data-dojo-type="dijit/form/TextBox" type="text" name="desc" id="desc"></td>
</tr>
<tr>
<td align="center" colspan="2">
<button data-dojo-type="dijit.form.Button" type="submit"
<button data-dojo-type="dijit/form/Button" type="submit"
data-dojo-props="onClick:function(){return dijit.byId('formDialog').isValid();}">OK</button>
<button data-dojo-type="dijit.form.Button" type="button"
<button data-dojo-type="dijit/form/Button" type="button"
data-dojo-props="onClick:function(){dijit.byId('formDialog').hide();}">Cancel</button>
</td>
</tr>
</table>
</div>
<p>When pressing this button the dialog will popup:</p>
<button id="buttonThree" data-dojo-type="dijit.form.Button" type="button">Show me!
<button id="buttonThree" data-dojo-type="dijit/form/Button" type="button">Show me!
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="evt">
dijit.byId("formDialog").show();
</script>
Expand All @@ -266,8 +266,8 @@ handles the onSubmit event, validation, and an xhrPost to the server.
.. html ::
<div data-dojo-type="dijit.Dialog" id="formDialog2" title="Form Dialog" style="display: none">
<form data-dojo-type="dijit.form.Form">
<div data-dojo-type="dijit/Dialog" id="formDialog2" title="Form Dialog" style="display: none">
<form data-dojo-type="dijit/form/Form">
<script type="dojo/event" data-dojo-event="onSubmit" data-dojo-args="e">
dojo.stopEvent(e); // prevent the default submit
if(!this.isValid()){ window.alert('Please fix fields'); return; }
Expand All @@ -283,18 +283,18 @@ handles the onSubmit event, validation, and an xhrPost to the server.
</script>
<div class="dijitDialogPaneContentArea">
<label for='foo'>Foo:</label><div data-dojo-type="dijit.form.ValidationTextBox" data-dojo-props="required:true"></div>
<label for='foo'>Foo:</label><div data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required:true"></div>
</div>
<div class="dijitDialogPaneActionBar">
<button data-dojo-type="dijit.form.Button" type="submit">OK</button>
<button data-dojo-type="dijit.form.Button" type="button"
<button data-dojo-type="dijit/form/Button" type="submit">OK</button>
<button data-dojo-type="dijit/form/Button" type="button"
data-dojo-props="onClick:function(){dijit.byId('formDialog2').hide();}">Cancel</button>
</div>
</form>
</div>
<p>When pressing this button the dialog will popup:</p>
<button id="buttonThree" data-dojo-type="dijit.form.Button" type="button">Show me!
<button id="buttonThree" data-dojo-type="dijit/form/Button" type="button">Show me!
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="evt">
dijit.byId("formDialog2").show();
</script>
Expand Down Expand Up @@ -329,26 +329,26 @@ This example shows a Dialog that will ask the user to accept or decline the term
.. html ::
<div data-dojo-type="dijit.Dialog" id="formDialog" title="Accept or decline agreement terms" execute="alert('submitted w/args:\n' + dojo.toJson(arguments[0], true));">
<div data-dojo-type="dijit/Dialog" id="formDialog" title="Accept or decline agreement terms" execute="alert('submitted w/args:\n' + dojo.toJson(arguments[0], true));">
<h1>Agreement Terms</h1>
<div data-dojo-type="dijit.layout.ContentPane" style="width:400px; border:1px solid #b7b7b7; background:#fff; padding:8px; margin:0 auto; height:150px; overflow:auto; ">
<div data-dojo-type="dijit/layout/ContentPane" style="width:400px; border:1px solid #b7b7b7; background:#fff; padding:8px; margin:0 auto; height:150px; overflow:auto; ">
Dojo is available under *either* the terms of the modified BSD license *or* the Academic Free License version 2.1. As a recipient of Dojo, you may choose which license to receive this code under (except as noted in per-module LICENSE files). Some modules may not be the copyright of the Dojo Foundation. These modules contain explicit declarations of copyright in both the LICENSE files in the directories in which they reside and in the code itself. No external contributions are allowed under licenses which are fundamentally incompatible with the AFL or BSD licenses that Dojo is distributed under. The text of the AFL and BSD licenses is reproduced below. ------------------------------------------------------------------------------- The "New" BSD License: ********************** Copyright (c) 2005-2010, The Dojo Foundation All rights reserved. Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met: * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer. * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
</div>
<br>
<table>
<tr>
<td>
<input type="radio" data-dojo-type="dijit.form.RadioButton" name="agreement" id="radioOne" value="accept" data-dojo-props="onClick:accept"/>
<input type="radio" data-dojo-type="dijit/form/RadioButton" name="agreement" id="radioOne" value="accept" data-dojo-props="onClick:accept"/>
<label for="radioOne">
I accept the terms of this agreement
</label>
</td>
</tr>
<tr>
<td>
<input type="radio" data-dojo-type="dijit.form.RadioButton" name="agreement" id="radioTwo" value="decline" data-dojo-props="onClick:decline"/>
<input type="radio" data-dojo-type="dijit/form/RadioButton" name="agreement" id="radioTwo" value="decline" data-dojo-props="onClick:decline"/>
<label for="radioTwo">
I decline
</label>
Expand All @@ -363,7 +363,7 @@ This example shows a Dialog that will ask the user to accept or decline the term
<label id="decision" style="color:#FF0000;">
Terms and conditions have not been accepted.
</label>
<button id="termsButton" data-dojo-type="dijit.form.Button" type="button">
<button id="termsButton" data-dojo-type="dijit/form/Button" type="button">
View terms and conditions to accept
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="evt">
dijit.byId("formDialog").show();
Expand Down Expand Up @@ -396,11 +396,11 @@ of :ref:`dojox.layout.ContentPane <dojox/layout/ContentPane>` into ``dijit.Dialo
.. html ::
<div id="external" data-dojo-type="dijit.Dialog" title="My external dialog" href="{{dataUrl}}dojo/resources/LICENSE" style="overflow:auto; width: 400px; height: 200px;">
<div id="external" data-dojo-type="dijit/Dialog" title="My external dialog" href="{{dataUrl}}dojo/resources/LICENSE" style="overflow:auto; width: 400px; height: 200px;">
</div>
<p>When pressing this button the dialog will popup loading the dialog content using an XHR call.</p>
<button data-dojo-type="dijit.form.Button" data-dojo-props="onClick:function(){dijit.byId('external').show();}" type="button">Show me!</button>
<button data-dojo-type="dijit/form/Button" data-dojo-props="onClick:function(){dijit.byId('external').show();}" type="button">Show me!</button>
Expand All @@ -419,7 +419,7 @@ If you want a scrollbar on a dialog, then you need to add width/height to a div
.. html ::
<div id="sized" data-dojo-type="dijit.Dialog" title="My scrolling dialog">
<div id="sized" data-dojo-type="dijit/Dialog" title="My scrolling dialog">
<div style="width: 200px; height: 100px; overflow: auto;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean
semper sagittis velit. Cras in mi. Duis porta mauris ut ligula. Proin
Expand All @@ -431,7 +431,7 @@ If you want a scrollbar on a dialog, then you need to add width/height to a div
</div>
<p>When pressing this button the dialog will popup (with a scrollbar):</p>
<button data-dojo-type="dijit.form.Button" data-dojo-props="onClick:function(){dijit.byId('sized').show();}" type="button">Show me!</button>
<button data-dojo-type="dijit/form/Button" data-dojo-props="onClick:function(){dijit.byId('sized').show();}" type="button">Show me!</button>
Accessibility
Expand Down Expand Up @@ -502,7 +502,7 @@ The value of the aria-describedby property is the id of the element containing t

.. js ::
<div data-dojo-type="dijit.Dialog" title="Example Dialog" aria-describedby="intro">
<div data-dojo-type="dijit/Dialog" title="Example Dialog" aria-describedby="intro">
<div id="intro">Text to describe dialog</div>
<div>Additional dialog contents....</div>
</div>
Expand All @@ -511,7 +511,7 @@ For earlier Dojo versions, you can add an onshow event handler that adds the ari

.. js ::
<div data-dojo-type="dijit.Dialog" title="Example Dialog" onShow="dojo.attr(this.domNode, 'aria-describedby', 'info');">
<div data-dojo-type="dijit/Dialog" title="Example Dialog" onShow="dojo.attr(this.domNode, 'aria-describedby', 'info');">
<div id="intro">Text to describe dialog</div>
<div>Additional dialog contents....</div>
</div>
Expand Down

0 comments on commit ca34477

Please sign in to comment.