Skip to content

Calendar rebase (2) #1351

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
fnagel wants to merge 53 commits into from
Closed

Calendar rebase (2) #1351

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
53 commits
Select commit Hold shift + click to select a range
7817898
Datepicker: Initial commit of widget rewrite work from old branch
tjvantoll Aug 26, 2013
f83580c
Datepicker: Update tests and demos for new structure
tjvantoll Aug 30, 2013
7a8de82
Datepicker: Fix the `eachDay` option
jzaefferer Sep 11, 2013
a6e1586
Datepicker: Only apply the `ui-state-focus` class name to one cell
tjvantoll Oct 30, 2013
3ec7d0e
Datepicker: Clean up tests
tjvantoll Nov 2, 2013
059f277
Datepicker: Support changing the `appendTo` option after init
tjvantoll Nov 15, 2013
0f66c9a
Datepicker: Various changes for the `showWeek` option
tjvantoll Nov 15, 2013
0b5703e
Datepicker: Support `position` option changes after init
tjvantoll Nov 18, 2013
33c48bd
Datepicker: Support changing `eachDay` after initialization
tjvantoll Nov 19, 2013
acf329d
Datepicker: Allow `dateFormat` to be changed after init
tjvantoll Nov 20, 2013
6458bab
Datepicker: Add test to ensure the `<input>`'s value is preselected
tjvantoll Nov 20, 2013
c8c44d4
Datepicker: Support destroying inline datepickers
tjvantoll Nov 22, 2013
ae29574
Datepicker: Add `value()` and `valueAsDate()` methods
tjvantoll Nov 21, 2013
e143e5b
Datepicker: Fix key handling implementation and tests
tjvantoll Nov 22, 2013
7e39bc1
Datepicker: Use Globalize 1.0.0
rxaviers Nov 30, 2013
4d51220
Datepicker: Update key handling implementation and tests
tjvantoll Dec 27, 2013
4db03f4
Datepicker: Re-adding mouse tests
tjvantoll Jan 2, 2014
07a5814
Datepicker: Add an `isValid()` method
tjvantoll Jan 3, 2014
3a38e81
Datepicker: Handle invalid values in `value()` and `valueAsDate()`
tjvantoll Jan 3, 2014
6c0a1c3
Datepicker: Update the picker as the user types valid dates
tjvantoll Jan 3, 2014
24110f2
Date: Update test suite to coding standards
tjvantoll Jan 9, 2014
8a115dc
Date: Make `$.date()` a constructor function
tjvantoll Jan 9, 2014
50447d2
Datepicker: Fix code style issues
fnagel Apr 23, 2014
88f4a15
Datepicker: Rename `select()` method to `_select()`
fnagel Apr 26, 2014
e8ea5f4
Datepicker: Use `short` instead of `abbreviated` format for table header
fnagel Apr 26, 2014
fb8d50d
Datepicker: Properly define default for `dateFormat` option
fnagel Apr 26, 2014
38f9989
Datepicker: Fix populate alternate field demo
fnagel Apr 26, 2014
4009361
Datepicker: Fix icon trigger demo
fnagel Apr 26, 2014
62922fe
Datepicker: Introduce value option
fnagel May 15, 2014
cf055ed
Calendar: Add calendar widget
fnagel Jun 3, 2014
daded42
Calendar: Add min and max option.
fnagel Jun 4, 2014
217bdc8
Calendar: Remove select callback reference
fnagel Jun 4, 2014
12090f3
Datepicker: Code clean up for events
fnagel Jun 5, 2014
31f9bd7
Datepicker: Remove unwanted keyboard shortcut
fnagel Jun 5, 2014
9b53f07
Datepicker: Simplify usage of calendar options and avoid duplications
fnagel Jun 12, 2014
088b7a4
Datepicker tests: Add open and close unit tests
fnagel Jun 16, 2014
7a9f5f4
Datepicker: Improve document click event
fnagel Jun 17, 2014
54d6f50
Calendar: Fix broken day table cell attributes
fnagel Jun 17, 2014
2b2871b
Datepicker tests: Rewrite event unit tests
fnagel Jun 17, 2014
d743e21
Calendar: Fix multiple calendar styles
fnagel Jun 17, 2014
e71122c
Calendar: Fix German localization
fnagel Jun 17, 2014
84c1a87
Datepicker: Fix localization demo
fnagel Jun 18, 2014
2407e59
Datepicker: Several minor code improvements
fnagel Jun 18, 2014
fc87a82
Calendar: Fix hover event setting and removing
fnagel Jun 18, 2014
7edd77b
Calendar: Focus class is not removed when using arrow keys
fnagel Jun 19, 2014
a86d5b0
Datepicker: Remove unwanted CTRL+HOME shortcut
fnagel Jun 19, 2014
7a4fa37
Datepicker: Remove support for enter key on input
fnagel Jun 19, 2014
1b27113
Datepicker: Improve localization handling, code style
fnagel Jun 19, 2014
b0877b1
Calendar: Add buttons option
fnagel Jun 19, 2014
2cbd500
Calendar: Adjust files to match reorganization of external directory
fnagel Jul 2, 2014
a4c2033
Datepicker tests: Remove pass-through options unit tests
fnagel Aug 29, 2014
97ce362
Calendar: Use _on for link hover events
fnagel Aug 30, 2014
d364a89
Datepicker: Add missing handling for disabled option
fnagel Sep 1, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Calendar: Add calendar widget 
Add calendar widget by copying and renaming datepicker widget files.
Remove datepicker functionality, options and methods from Calendar.
Remove calendar functionality, options and methods from Datepicker.
Adjust tests due to split and changed specification. Remove duplicated
demo files and fix some demos. Simplify calendar generation, use CSS
instead of inline styles. Fix destroy method. Make use of uniqueId
method. Fix focus highlighting when month is changed. Add version
property. Add common unit tests. Fix input keyboard handling.
  • Loading branch information
@fnagel
fnagel committed Sep 29, 2014
commit cf055edd00fa049c581988da16cd625de9da95d1
1 change: 1 addition & 0 deletions Gruntfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ var
"core",
"accordion",
"autocomplete",
"calendar",
"button",
"datepicker",
"dialog",
Expand Down
1 change: 1 addition & 0 deletions build/tasks/testswarm.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ var versions = {
"Accordion": "accordion/accordion.html",
"Autocomplete": "autocomplete/autocomplete.html",
"Button": "button/button.html",
"Calendar": "calendar/calendar.html",
"Core": "core/core.html",
"Core_deprecated": "core/core_deprecated.html",
"Datepicker": "datepicker/datepicker.html",
Expand Down
8 changes: 4 additions & 4 deletions demos/datepicker/buttonbar.html → demos/calendar/buttonbar.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Display button bar</title>
<title>jQuery UI Calendar - Display button bar</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
Expand All @@ -11,20 +11,20 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker({
$( "#calendar" ).calendar({
showButtonPanel: true
});
});
</script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>
<div id="calendar"></div>

<div class="demo-description">
<p>Display a button for selecting Today's date and a Done button for closing the calendar with the boolean <code>showButtonPanel</code> option. Each button is enabled by default when the bar is displayed, but can be turned off with additional options. Button text is customizable.</p>
Expand Down
10 changes: 5 additions & 5 deletions demos/datepicker/inline.html → demos/calendar/default.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Display inline</title>
<title>jQuery UI Calendar - Default functionality</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
Expand All @@ -11,21 +11,21 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker();
$( "#calendar" ).calendar();
});
</script>
</head>
<body>

Date: <div id="datepicker"></div>
<div id="calendar"></div>

<div class="demo-description">
<p>Display the datepicker embedded in the page instead of in an overlay. Simply call .datepicker() on a div instead of an input.</p>
<p>The calendar is a widget for selecting a date using a visual calendar representation.</p>
</div>
</body>
</html>
8 changes: 4 additions & 4 deletions demos/datepicker/dropdown-month-year.html → demos/calendar/dropdown-month-year.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Display month &amp; year menus</title>
<title>jQuery UI Calendar - Display month &amp; year menus</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
Expand All @@ -11,12 +11,12 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker({
$( "#calendar" ).calendar({
changeMonth: true,
changeYear: true
});
Expand All @@ -25,7 +25,7 @@
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>
<div id="calendar"></div>

<div class="demo-description">
<p>Show month and year dropdowns in place of the static month/year header to facilitate navigation through large timeframes. Add the boolean <code>changeMonth</code> and <code>changeYear</code> options.</p>
Expand Down
22 changes: 22 additions & 0 deletions demos/calendar/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Calendar Demos</title>
</head>
<body>

<ul>
<li><a href="default.html">Default functionality</a></li>
<li><a href="buttonbar.html">Display button bar</a></li>
<li><a href="dropdown-month-year.html">Display month &amp; year menus</a></li>
<li><a href="localization.html">Localize calendar</a></li>
<li><a href="min-max.html">Restrict date range</a></li>
<li><a href="multiple-months.html">Display multiple months</a></li>
<li><a href="other-months.html">Dates in other months</a></li>
<li><a href="show-week.html">Show week of the year</a></li>
</ul>

</body>
</html>
41 changes: 41 additions & 0 deletions demos/calendar/localization.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Calendar - Localize calendar</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
<script src="../../external/date.js"></script>
<script src="../../external/localization.js"></script>
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
var calendar = $( "#calendar" ).calendar(),
date = calendar.calendar( "valueAsDate" );

$( "#locale" ).change( function() {
Globalize.locale( $( this ).val() );
calendar.calendar( "valueAsDate", date );
});
});
</script>
</head>
<body>

<div id="calendar"></div>
<select id="locale">
<option value="de-DE" selected>German (Deutsch)</option>
<option value="en">English</option>
</select>

<div class="demo-description">
<p>Localize the calendar calendar language and format (English / Western formatting is the default). The calendar includes built-in support for languages that read right-to-left, such as Arabic and Hebrew.</p>
</div>
</body>
</html>
8 changes: 4 additions & 4 deletions demos/datepicker/min-max.html → demos/calendar/min-max.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Restrict date range</title>
<title>jQuery UI Calendar - Restrict date range</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
Expand All @@ -11,18 +11,18 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker({ minDate: -20, maxDate: "+1M +10D" });
$( "#calendar" ).calendar({ minDate: -20, maxDate: "+1M +10D" });
});
</script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>
<div id="calendar"></div>

<div class="demo-description">
<p>Restrict the range of selectable dates with the <code>minDate</code> and <code>maxDate</code> options. Set the beginning and end dates as actual dates (new Date(2009, 1 - 1, 26)), as a numeric offset from today (-20), or as a string of periods and units ('+1M +10D'). For the last, use 'D' for days, 'W' for weeks, 'M' for months, or 'Y' for years.</p>
Expand Down
10 changes: 5 additions & 5 deletions demos/datepicker/multiple-calendars.html → demos/calendar/multiple-calendars.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Display multiple months</title>
<title>jQuery UI Calendar - Display multiple months</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
Expand All @@ -11,12 +11,12 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker({
$( "#calendar" ).calendar({
numberOfMonths: 3,
showButtonPanel: true
});
Expand All @@ -25,10 +25,10 @@
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>
<div id="calendar"></div>

<div class="demo-description">
<p>Set the <code>numberOfMonths</code> option to an integer of 2 or more to show multiple months in a single datepicker.</p>
<p>Set the <code>numberOfMonths</code> option to an integer of 2 or more to show multiple months in a single calendar.</p>
</div>
</body>
</html>
33 changes: 33 additions & 0 deletions demos/calendar/multiple-months.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Calendar - Display multiple months</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
<script src="../../external/date.js"></script>
<script src="../../external/localization.js"></script>
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#calendar" ).calendar({
numberOfMonths: 3
});
});
</script>
</head>
<body>

<div id="calendar"></div>

<div class="demo-description">
<p>Set the <code>numberOfMonths</code> option to an integer of 2 or more to show multiple months in a single calendar.</p>
</div>
</body>
</html>
10 changes: 5 additions & 5 deletions demos/datepicker/other-months.html → demos/calendar/other-months.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Dates in other months</title>
<title>jQuery UI Calendar - Dates in other months</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
Expand All @@ -11,12 +11,12 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker({
$( "#calendar" ).calendar({
eachDay: function( day ) {
if ( day.lead ) {
day.render = true;
Expand All @@ -30,10 +30,10 @@
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>
<div id="calendar"></div>

<div class="demo-description">
<p>The datepicker can show dates that come from other than the main month
<p>The calendar can show dates that come from other than the main month
being displayed. These other dates can also be made selectable.</p>
</div>
</body>
Expand Down
10 changes: 5 additions & 5 deletions demos/datepicker/show-week.html → demos/calendar/show-week.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Datepicker - Show week of the year</title>
<title>jQuery UI Calendar - Show week of the year</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="../../external/jquery/jquery.js"></script>
<script src="../../external/globalize/globalize.js"></script>
Expand All @@ -11,23 +11,23 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker({
$( "#calendar" ).calendar({
showWeek: true
});
});
</script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>
<div id="calendar"></div>

<div class="demo-description">
<p>The datepicker can show the week of the year. The calculation follows
<p>The calendar can show the week of the year. The calculation follows
<a href="http://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table">Unicode CLDR specification</a>.
This means that some days from one year may be placed into weeks 'belonging' to another year.</p>
</div>
Expand Down
5 changes: 3 additions & 2 deletions demos/datepicker/alt-field.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,15 @@
<script src="../../ui/core.js"></script>
<script src="../../ui/widget.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#datepicker" ).datepicker({
select: function( event, ui ) {
var date = Globalize.parseDate( ui.date, { date: "short" } );
select: function( event ) {
var date = $( "#datepicker" ).datepicker( "valueAsDate" );
$( "#alternate" ).val( Globalize.format( date, { date: "long" } ) );
}
});
Expand Down
1 change: 1 addition & 0 deletions demos/datepicker/animation.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
<script src="../../ui/effect-fold.js"></script>
<script src="../../ui/effect-slide.js"></script>
<script src="../../ui/button.js"></script>
<script src="../../ui/calendar.js"></script>
<script src="../../ui/position.js"></script>
<script src="../../ui/datepicker.js"></script>
<link rel="stylesheet" href="../demos.css">
Expand Down
Loading