r2647 - datepicker: added visual tests for all events and methods.
Author: pazu2k@gmail.com
Date: Wed Jun 3 22:03:59 2009
New Revision: 2647
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_beforeShow.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_beforeShowDay.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onChangeMonthYear.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onClose.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onSelect.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_destroy.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_dialog.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_disable.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_enable.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_getDate.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_hide.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_isDisabled.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_option.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_setDate.html
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_show.html
Log:
datepicker: added visual tests for all events and methods.
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_beforeShow.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_beforeShow.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker event beforeShow</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker({beforeShow: function(input, inst) {
+ $(inst.dpDiv).css('border','1px solid red');
+ return {
+ numberOfMonths: 2
+ };
+ }});
+ });
+ </script>
+</head>
+<body>
+
+<input id="datepicker">
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_beforeShowDay.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_beforeShowDay.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,56 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker event beforeShowDay</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <style type="text/css">
+ .holiday { background-color: red; }
+ .birthday { background-color: blue; }
+ .event { background-color: green; }
+ </style>
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ // format: specialDays.year.month.day
+ var specialDays = {
+ '2009': {
+ '1': {'1': {tooltip: "New Year's Day", className: "holiday"}},
+ '4': {
+ '10': {tooltip: "Good Friday", className: "holiday"},
+ '13': {tooltip: "Easter Monday", className: "holiday"}
+ },
+ '5': {
+ '4': {tooltip: "Early May Bank Holiday", className: "holiday"},
+ '15': {tooltip: "Spring Bank Holiday", className: "holiday"}
+ },
+ '8': {'31': {tooltip: "Summer Bank Holiday", className: "holiday"}},
+ '12': {
+ '25': {tooltip: "Christmas Day", className: "holiday"},
+ '28': {tooltip: "Boxing Day", className: "holiday"}
+ }
+ }
+ };
+
+ $('#datepicker').datepicker({beforeShowDay: function(date) {
+ var d = date.getDate(),
+ m = date.getMonth()+1,
+ y = date.getFullYear();
+
+ if (specialDays[y] && specialDays[y][m] && specialDays[y][m][d]) {
+ var s = specialDays[y][m][d];
+ return [true, s.className, s.tooltip];
+ }
+ return [true,'']; // no change
+ }});
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onChangeMonthYear.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onChangeMonthYear.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,30 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker event onChangeMonthYear</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker({onChangeMonthYear: function(year, month,
inst) {
+ $('#datepicker_year').val(year);
+ $('#datepicker_month').val(month);
+ $('#datepicker_day').val(inst.currentDay);
+ },
+ onSelect: function(dateText, inst) {
+ $('#datepicker_day').val(inst.currentDay);
+ }});
+ });
+ </script>
+</head>
+<body>
+
+Date: <input id="datepicker_day" type="text" size="2"
readonly="readonly"> / <input id="datepicker_month" type="text" size="2"
readonly="readonly"> / <input id="datepicker_year" type="text" size="4"
readonly="readonly">
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onClose.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onClose.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,34 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker event onClose</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker({onClose: function(dateString, inst) {
+ var today = new Date();
+ var dateObj = new Date(dateString
+ ' '+today.getHours()+':'+today.getMinutes()+':'+today.getSeconds());
+
+ if (dateObj > today) {
+ $('#msg').text('You chose a date in the future.');
+ } else if (dateObj < today) {
+ $('#msg').text('You chose a date in the past.');
+ } else {
+ $('#msg').text('Today is the day!');
+ }
+ }});
+ });
+ </script>
+</head>
+<body>
+
+<input id="datepicker">
+
+<p id="msg" style="color: red;">
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onSelect.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_event_onSelect.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,24 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker event onSelect</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker({onSelect: function(dateText, inst) {
+ $('#mydate').val(dateText);
+ }});
+ });
+ </script>
+</head>
+<body>
+
+<input type="text" id="mydate" readonly="readonly">
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_destroy.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_destroy.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method destroy</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('destroy');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_dialog.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_dialog.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method dialog</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('dialog');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_disable.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_disable.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method disable</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('disable');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_enable.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_enable.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method enable</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker().datepicker('disable');
+ $('#datepicker').datepicker('enable');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_getDate.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_getDate.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,23 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method getDate</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#msg').text($('#datepicker').datepicker('getDate'));
+ });
+ </script>
+</head>
+<body>
+
+<div id="msg"></div>
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_hide.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_hide.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method hide</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('hide');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_isDisabled.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_isDisabled.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method isDisabled</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('isDisabled');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_option.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_option.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method option</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('optipn');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_setDate.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_setDate.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method setDate</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('setDate','+1y');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>
Added:
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_show.html
==============================================================================
--- (empty file)
+++
branches/dev/datepicker/tests/visual/datepicker/datepicker_method_show.html
Wed Jun 3 22:03:59 2009
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Datepicker Visual Test : Datepicker method show</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css" />
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../../ui/ui.datepicker.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $('#datepicker').datepicker();
+ $('#datepicker').datepicker('show');
+ });
+ </script>
+</head>
+<body>
+
+<div id="datepicker"></div>
+
+</body>
+</html>