upgraded yui to 2.2.2 and yui-ext to 1.0.1a
This commit is contained in:
JT Smith
parent
4d9af2c691
commit
547ced6500
1992 changed files with 645731 additions and 0 deletions
106
www/extras/yui/examples/calendar/quickstart/1.html
Normal file
106
www/extras/yui/examples/calendar/quickstart/1.html
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
|
||||
<title>YUI Calendar - Quickstart Tutorial (YUI Library)</title>
|
||||
|
||||
<link type="text/css" rel="stylesheet" href="../../../build/reset-fonts-grids/reset-fonts-grids.css">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="../../assets/dpSyntaxHighlighter.css">
|
||||
<link type="text/css" rel="stylesheet" href="../assets/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="doc3" class="yui-t4">
|
||||
<div id="hd">
|
||||
<a href="http://developer.yahoo.com/yui" id="logo"><div></div></a>
|
||||
<h1>YUI Calendar: Quickstart Tutorial</h1>
|
||||
</div>
|
||||
|
||||
<div id="bd">
|
||||
|
||||
<div id="toc" class="yui-b">
|
||||
<ul>
|
||||
<li class="sect"><a href="../index.html">YUI Calendar: Tutorials</a></li>
|
||||
|
||||
<li class="item selected"><a href="1.html">Quickstart Tutorial</a></li>
|
||||
<li class="child active"><a href="1.html">Setting up the Calendar</a></li>
|
||||
<li class="child"><a href="2.html">Functional Example</a></li>
|
||||
<li class="item"><a href="../multi/1.html">Multi-Select Calendar</a></li>
|
||||
<li class="item"><a href="../dual/1.html">Dual Calendars</a></li>
|
||||
<li class="item"><a href="../minmax/1.html">Minimum / Maximum Dates</a></li>
|
||||
<li class="item"><a href="../events/1.html">Handling Events</a></li>
|
||||
<li class="item"><a href="../formtxt/1.html">Calendar & Text Fields</a></li>
|
||||
<li class="item"><a href="../formsel/1.html">Calendar & Select Fields</a></li>
|
||||
<li class="item"><a href="../render/1.html">Using the Render Stack</a></li>
|
||||
<li class="item"><a href="../germany/1.html">Localization: Germany</a></li>
|
||||
<li class="item"><a href="../japan/1.html">Localization: Japan</a></li>
|
||||
<li class="item"><a href="../popup/1.html">Popup Calendar</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="yui-main">
|
||||
<div class="yui-b">
|
||||
<h1 class="first">Setting up the Calendar</h1>
|
||||
|
||||
|
||||
<p>Calendar has three required dependencies: the <a href="http://developer.yahoo.com/yui/yahoo/">YAHOO Global object</a>, the <a href="http://developer.yahoo.com/yui/event/">Event Utility</a>, and the <a href="http://developer.yahoo.com/yui/dom/">DOM Collection</a>.</p>
|
||||
|
||||
<p>In addition, the JavaScript and CSS files for Calendar must be included. You can see what the full list of included files looks like below. Please note that your file paths may vary depending on the location in which you installed the YUI libraries.</p>
|
||||
|
||||
<textarea name="code" class="HTML" cols="60" rows="1">
|
||||
<script type="text/javascript" src="yahoo.js"></script>
|
||||
<script type="text/javascript" src="event.js" ></script>
|
||||
<script type="text/javascript" src="dom.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="calendar.js"></script>
|
||||
<link type="text/css" rel="stylesheet" href="yui/calendar.css">
|
||||
</textarea>
|
||||
|
||||
<p>The only markup required by Calendar is an initial empty DIV into which the Calendar will be rendered. The DIV should have a unique id specified in the markup, which will match the id passed to the Calendar's constructor.</p>
|
||||
|
||||
<p>The markup for our simple Calendar example looks like this:</p>
|
||||
|
||||
<textarea name="code" class="HTML" cols="60" rows="1">
|
||||
|
||||
<div id="cal1Container"></div>
|
||||
|
||||
</textarea>
|
||||
|
||||
|
||||
<p>Finally, the Calendar can be instantiated in a script block, like this:</p>
|
||||
|
||||
<textarea name="code" class="JScript" cols="60" rows="1">
|
||||
<script>
|
||||
YAHOO.namespace("example.calendar");
|
||||
|
||||
function init() {
|
||||
YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1","cal1Container");
|
||||
YAHOO.example.calendar.cal1.render();
|
||||
}
|
||||
|
||||
YAHOO.util.Event.addListener(window, "load", init);
|
||||
</script>
|
||||
</textarea>
|
||||
|
||||
<p>Note that to avoid using the global variable space, we are placing our example Calendar's variable into the YAHOO.example.calendar namespace (see line 2 above). For more information about namespacing, see the <a href="http://developer.yahoo.com/yui/yahoo/">YAHOO Global object</a>.</p>
|
||||
|
||||
<p>The constructor in our example (line 5) takes two arguments: the id to be used for our new Calendar's inner container DIV ("cal1" in this example) and the id of the inital container where we want to render the Calendar ("cal1Container" in this case).</p>
|
||||
|
||||
<p>We are also specifying that the init() function should not be executed until the window has loaded, using the <a href="http://developer.yahoo.com/yui/event/">Event Utility</a>.</p>
|
||||
<div id="stepnav">
|
||||
<a class="next" href="2.html">Continue to <em>Functional Example</em> ></a> </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="ft"> </div>
|
||||
</div>
|
||||
|
||||
<script src="../../assets/dpSyntaxHighlighter.js"></script>
|
||||
<script language="javascript">
|
||||
dp.SyntaxHighlighter.HighlightAll('code');
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
67
www/extras/yui/examples/calendar/quickstart/2.html
Normal file
67
www/extras/yui/examples/calendar/quickstart/2.html
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
|
||||
<title>YUI Calendar - Quickstart Tutorial (YUI Library)</title>
|
||||
|
||||
<link type="text/css" rel="stylesheet" href="../../../build/reset-fonts-grids/reset-fonts-grids.css">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="../../assets/dpSyntaxHighlighter.css">
|
||||
<link type="text/css" rel="stylesheet" href="../assets/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="doc3" class="yui-t4">
|
||||
<div id="hd">
|
||||
<a href="http://developer.yahoo.com/yui" id="logo"><div></div></a>
|
||||
<h1>YUI Calendar: Quickstart Tutorial</h1>
|
||||
</div>
|
||||
|
||||
<div id="bd">
|
||||
|
||||
<div id="toc" class="yui-b">
|
||||
<ul>
|
||||
<li class="sect"><a href="../index.html">YUI Calendar: Tutorials</a></li>
|
||||
|
||||
<li class="item selected"><a href="1.html">Quickstart Tutorial</a></li>
|
||||
<li class="child"><a href="1.html">Setting up the Calendar</a></li>
|
||||
<li class="child active"><a href="2.html">Functional Example</a></li>
|
||||
<li class="item"><a href="../multi/1.html">Multi-Select Calendar</a></li>
|
||||
<li class="item"><a href="../dual/1.html">Dual Calendars</a></li>
|
||||
<li class="item"><a href="../minmax/1.html">Minimum / Maximum Dates</a></li>
|
||||
<li class="item"><a href="../events/1.html">Handling Events</a></li>
|
||||
<li class="item"><a href="../formtxt/1.html">Calendar & Text Fields</a></li>
|
||||
<li class="item"><a href="../formsel/1.html">Calendar & Select Fields</a></li>
|
||||
<li class="item"><a href="../render/1.html">Using the Render Stack</a></li>
|
||||
<li class="item"><a href="../germany/1.html">Localization: Germany</a></li>
|
||||
<li class="item"><a href="../japan/1.html">Localization: Japan</a></li>
|
||||
<li class="item"><a href="../popup/1.html">Popup Calendar</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="yui-main">
|
||||
<div class="yui-b">
|
||||
<h1 class="first">Functional Example</h1>
|
||||
|
||||
<p>You can see the full example in action below:</p>
|
||||
|
||||
<div id="solution" style="">
|
||||
<iframe src="solution.html" style="width:225px;height:225px"></iframe>
|
||||
<a href="solution.html" target="_blank">Open this example in a new window</a>
|
||||
</div>
|
||||
<div id="stepnav">
|
||||
<a class="back" href="1.html">< Back to <em>Setting up the Calendar</em></a> </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="ft"> </div>
|
||||
</div>
|
||||
|
||||
<script src="../../assets/dpSyntaxHighlighter.js"></script>
|
||||
<script language="javascript">
|
||||
dp.SyntaxHighlighter.HighlightAll('code');
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
31
www/extras/yui/examples/calendar/quickstart/solution.html
Normal file
31
www/extras/yui/examples/calendar/quickstart/solution.html
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
|
||||
|
||||
<link type="text/css" rel="stylesheet" href="../../../build/fonts/fonts.css">
|
||||
<link type="text/css" rel="stylesheet" href="../../../build/reset/reset.css">
|
||||
|
||||
<script type="text/javascript" src="../../../build/yahoo/yahoo.js"></script>
|
||||
<script type="text/javascript" src="../../../build/event/event.js" ></script>
|
||||
<script type="text/javascript" src="../../../build/dom/dom.js" ></script>
|
||||
|
||||
<script type="text/javascript" src="../../../build/calendar/calendar.js"></script>
|
||||
<link type="text/css" rel="stylesheet" href="../../../build/calendar/assets/calendar.css">
|
||||
|
||||
<script>
|
||||
YAHOO.namespace("example.calendar");
|
||||
|
||||
function init() {
|
||||
YAHOO.example.calendar.cal1 = new YAHOO.widget.Calendar("cal1","cal1Container");
|
||||
YAHOO.example.calendar.cal1.render();
|
||||
}
|
||||
|
||||
YAHOO.util.Event.addListener(window, "load", init);
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="cal1Container"></div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue