Fixed 3107 Dialog example does not return false when clicked

Demonstrate inline disabled datepicker
Demonstrate big previous/next links

6 files changed, 46 insertions, 27 deletions

diff --git a/demos/functional/index.html b/demos/functional/index.html
index 8ec565c72..65172a4c7 100644
--- a/demos/functional/index.html
+++ b/demos/functional/index.html
@@ -15,6 +15,7 @@
 			<link rel="stylesheet" href="css/base.css" type="text/css" media="screen">
 			<link rel="stylesheet" href="css/functional_demos.css" type="text/css" media="screen">
 			<link rel="stylesheet" href="css/chilli-recipes.css" type="text/css" media="screen">
+			<link rel="stylesheet" href="../../themes/flora/flora.all.css" type="text/css" media="screen" title="Flora (Default)" />
 			
 			<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
 		
@@ -107,7 +108,7 @@
 		<div id="content">
 
 		<div class="content-top"></div>
-		<div class="content"><link rel="stylesheet" href="../../themes/flora/flora.all.css" type="text/css" media="screen" title="Flora (Default)" />
+		<div class="content">
 
 <form id="components-fm" action="/actions/download_builder.php" method="post">
 <div class="content-head">
diff --git a/demos/functional/templates/ui.datepicker.dbd.html b/demos/functional/templates/ui.datepicker.dbd.html
index c77f7bac0..6b2573461 100644
--- a/demos/functional/templates/ui.datepicker.dbd.html
+++ b/demos/functional/templates/ui.datepicker.dbd.html
@@ -14,27 +14,27 @@
 .za_day { color: green !important; background: #eee url(templates/images/za.gif) no-repeat center !important; }

 </style>

 <script type="text/javascript">

-var natDays = [[1, 26, 'au'], [2, 6, 'nz'], [3, 17, 'ie'], [4, 27, 'za'], [5, 25, 'ar'], [6, 6, 'se'], 

-    [7, 4, 'us'], [8, 17, 'id'], [9, 7, 'br'], [10, 1, 'cn'], [11, 22, 'lb'], [12, 12, 'ke']]; 

+var natDays = [[1, 26, "au"], [2, 6, "nz"], [3, 17, "ie"], [4, 27, "za"], [5, 25, "ar"], [6, 6, "se"], 

+    [7, 4, "us"], [8, 17, "id"], [9, 7, "br"], [10, 1, "cn"], [11, 22, "lb"], [12, 12, "ke"]]; 

  

 function nationalDays(date) { 

     for (i = 0; i < natDays.length; i++) { 

         if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { 

-            return [false, natDays[i][2] + '_day']; 

+            return [false, natDays[i][2] + "_day"]; 

         } 

     } 

-    return [true, '']; 

+    return [true, ""]; 

 }

 

 function highlightToday(date, inst) { 

     var today = new Date(); 

     today = new Date(today.getFullYear(), today.getMonth(), today.getDate()); 

     return $.datepicker.dateStatus(date, inst) + 

-        (today.getTime() == date.getTime() ? ' (today)' : ''); 

+        (today.getTime() == date.getTime() ? " (today)" : ""); 

 } 

 

 function showDayOfYear(date) {

 	var lastYearEnd = new Date(date.getFullYear() - 1, 12 - 1, 31, 0, 0, 0, 0);

-	return [true, '', 'Day ' + ((date.getTime() - lastYearEnd.getTime()) / 86400000) + ' of  the year'];

+	return [true, "", "Day " + ((date.getTime() - lastYearEnd.getTime()) / 86400000) + " of  the year"];

 }

 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.datepicker.dlg.html b/demos/functional/templates/ui.datepicker.dlg.html
index d2875a925..4d5eaaa7f 100644
--- a/demos/functional/templates/ui.datepicker.dlg.html
+++ b/demos/functional/templates/ui.datepicker.dlg.html
@@ -1,6 +1,6 @@
 <input type="text" size="10" value="" id="dialog" readonly="readonly"/> <button id="dialogButton" type="button">Open dialog</button>

 <script type="text/javascript">

 function setDateFromDialog(date) { 

-    $('#dialog').val(date); 

+    $("#dialog").val(date); 

 }

 </script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.datepicker.html b/demos/functional/templates/ui.datepicker.html
index 112ef484f..2f1d5a817 100644
--- a/demos/functional/templates/ui.datepicker.html
+++ b/demos/functional/templates/ui.datepicker.html
@@ -89,6 +89,7 @@
 					'<li>MM - month name long</li>' +
 					'<li>y - year (two digit)</li>' +
 					'<li>yy - year (four digit)</li>' +
+					'<li>@ - Unix timestamp (ms since 01/01/1970)</li>' +
 					'<li>\'...\' - literal text</li>' +
 					'<li>\'\' - single quote</li></ul>',
 				html: '<input type="text" size="30" value="" id="formatted"/>',
@@ -158,15 +159,16 @@
 				title: 'Inline Datepicker',
 				desc: 'A datepicker can also be shown inline, rather than popping-up, by targetting a division instead of an input field. ' +
 					'Use the <i>onSelect</i> callback to be notified of date selections.',
-				html: '<div id="inline"></div>\n' +
-					'<p style="clear: both;"><!-- See day-by-day example for highlighting days code --></p>',
-				destroy: '$("#inline").datepicker("destroy");',
+				html: { url: 'templates/ui.datepicker.inl.html' },
+				destroy: '$("#inline").datepicker("destroy");$("#altInline").unbind("keyup");',
 
 				options: [
-					{	desc: 'Single month inline',	source: '$("#inline").datepicker({onSelect: function(date) { alert("The chosen date is " + date); }});' },
-					{	desc: 'Range select inline',	source: '$("#inline").datepicker({rangeSelect: true, onSelect: function(date) { alert("The chosen dates are " + date); }});' },
-					{	desc: 'Range select showing two months inline',	source: '$("#inline").datepicker({rangeSelect: true, numberOfMonths: 2}).children("div").css("width", "370px");' },
-					{	desc: 'Highlight some national days (via CSS)',	source: '$("#inline").datepicker({beforeShowDay: nationalDays});' }
+					{	desc: 'Single month inline',	source: '$("#inline").datepicker({onSelect: function(date) { alert("The chosen date is " + date); }});$("#altInline").hide();' },
+					{	desc: 'Range select inline',	source: '$("#inline").datepicker({rangeSelect: true, onSelect: function(date) { alert("The chosen dates are " + date); }});$("#altInline").hide();' },
+					{	desc: 'Range select showing two months inline',	source: '$("#inline").datepicker({rangeSelect: true, numberOfMonths: 2}).children("div").css("width", "370px");$("#altInline").hide();' },
+					{	desc: 'Highlight some national days (via CSS)',	source: '$("#inline").datepicker({beforeShowDay: nationalDays});$("#altInline").hide();' },
+					{	desc: 'Inline linked to an input field',	source: '$("#inline").datepicker({altField: "#altInline", altFormat: "mm/dd/yy"});$("#altInline").show().keyup(setInlineDate);' },
+					{	desc: 'Disabled inline',	source: '$("#inline").datepicker().datepicker("disable");$("#altInline").hide();' }
 				]
 			},
 
@@ -177,7 +179,7 @@
 				destroy: '',
 
 				options: [
-					{	desc: 'Open in a dialog',	source: '$("#dialogButton").click(function() { $(this).datepicker("dialog", $("#dialog").val(), setDateFromDialog, {prompt: "Choose a date", duration: ""}) });' }
+					{	desc: 'Open in a dialog',	source: '$("#dialogButton").click(function() { $(this).datepicker("dialog", $("#dialog").val(), setDateFromDialog, {prompt: "Choose a date", duration: ""}); return false; });' }
 				]
 			},
 
@@ -248,6 +250,8 @@
 					{	desc: 'Append text to the datepicker',	source: '$("#misc").datepicker({appendText: "(format mm/dd/yyyy)", showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
 					{	desc: 'Move Clear/Close controls to the bottom',	source: '$("#misc").datepicker({closeAtTop: false, showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
 					{	desc: 'Make the datepicker mandatory (no Clear)',	source: '$("#misc").datepicker({mandatory: true, showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
+					{	desc: 'Show big Prev/Next links',	source: '$("#misc").datepicker({showBigPrevNext: true, showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
+					{	desc: 'Show big Prev/Next links moving 6 months',	source: '$("#misc").datepicker({showBigPrevNext: true, stepBigMonths: 6, prevText: "&lt;", prevBigText: "&lt;6M", nextText: "&gt;", nextBigText: "6M&gt;", showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
 					{	desc: 'Hide Prev/Next links if not applicable',	source: '$("#misc").datepicker({hideIfNoPrevNext: true, minDate: new Date(2008, 1 - 1, 26), maxDate: new Date(2008, 3 - 1, 26), showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
 					{	desc: 'Prev/Today/Next links as date formats',	source: '$("#misc").datepicker({navigationAsDateFormat: true, prevText: "&lt;M", currentText: "M y", nextText: "M&gt;", showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true});' },
 					{	desc: 'Prev/Today/Next links as date formats in French',	source: '$("#misc").datepicker($.extend({}, $.datepicker.regional["fr"], {navigationAsDateFormat: true, prevText: "&lt;MM", currentText: "MM yy", nextText: "MM&gt;", numberOfMonths: 2, stepMonths: 2, showOn: "both", buttonImage: "templates/images/calendar.gif", buttonImageOnly: true}));' },
diff --git a/demos/functional/templates/ui.datepicker.inl.html b/demos/functional/templates/ui.datepicker.inl.html
new file mode 100644
index 000000000..9543a98eb
--- /dev/null
+++ b/demos/functional/templates/ui.datepicker.inl.html
@@ -0,0 +1,14 @@
+<input type="text" id="altInline" size="10"/>

+<div id="inline"></div>

+<p style="clear: both;"><!-- See day-by-day example for highlighting days code --></p>

+<script type="text/javascript">

+function setInlineDate() {

+	try {

+		var date = $.datepicker.parseDate("mm/dd/yy", $("#altInline").val());

+		$("#inline").datepicker("setDate", date);

+	}

+	catch (e) {

+		// Ignore

+	}

+}

+</script>
\ No newline at end of file
diff --git a/demos/functional/templates/ui.datepicker.sel.html b/demos/functional/templates/ui.datepicker.sel.html
index cc8ff25e3..3f8185af2 100644
--- a/demos/functional/templates/ui.datepicker.sel.html
+++ b/demos/functional/templates/ui.datepicker.sel.html
@@ -29,26 +29,26 @@
 <script type="text/javascript">

 // Prepare to show a date picker linked to three select controls

 function readLinked() {

-	$('#linkedDates').val($('#selectMonth').val() + '/' +

-		$('#selectDay').val() + '/' + $('#selectYear').val());

+	$("#linkedDates").val($("#selectMonth").val() + "/" +

+		$("#selectDay").val() + "/" + $("#selectYear").val());

 	return {};

 }

 

 // Update three select controls to match a date picker selection

 function updateLinked(date) {

-	$('#selectMonth').val(date.substring(0, 2));

-	$('#selectDay').val(date.substring(3, 5));

-	$('#selectYear').val(date.substring(6, 10));

+	$("#selectMonth").val(date.substring(0, 2));

+	$("#selectDay").val(date.substring(3, 5));

+	$("#selectYear").val(date.substring(6, 10));

 }

 

 // Prevent selection of invalid dates through the select controls

 function checkLinkedDays() {

-	var daysInMonth = 32 - new Date($('#selectYear').val(),

-		$('#selectMonth').val() - 1, 32).getDate();

-	$('#selectDay option').attr('disabled', '');

-	$('#selectDay option:gt(' + (daysInMonth - 1) +')').attr('disabled', 'disabled');

-	if ($('#selectDay').val() > daysInMonth) {

-		$('#selectDay').val(daysInMonth);

+	var daysInMonth = 32 - new Date($("#selectYear").val(),

+		$("#selectMonth").val() - 1, 32).getDate();

+	$("#selectDay option").attr("disabled", "");

+	$("#selectDay option:gt(" + (daysInMonth - 1) +")").attr("disabled", "disabled");

+	if ($("#selectDay").val() > daysInMonth) {

+		$("#selectDay").val(daysInMonth);

 	}

 }

 </script>