kea-rails 2.0.0.pre.alpha5 → 2.0.0.pre.alpha6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (31) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/kea/bindings/date_picker.js +33 -0
  3. data/app/assets/javascripts/kea/extenders/date.js +10 -0
  4. data/app/assets/javascripts/kea/kea_dependencies.js +1 -0
  5. data/app/assets/stylesheets/kea/kea.css.sass +1 -1
  6. data/lib/kea-rails/version.rb +1 -1
  7. data/vendor/assets/components/pikaday/CHANGELOG.md +68 -0
  8. data/vendor/assets/components/pikaday/LICENSE +36 -0
  9. data/vendor/assets/components/pikaday/README.md +321 -0
  10. data/vendor/assets/components/pikaday/bower.json +29 -0
  11. data/vendor/assets/components/pikaday/component.json +17 -0
  12. data/vendor/assets/{stylesheets → components/pikaday/css}/pikaday.css +39 -7
  13. data/vendor/assets/components/pikaday/css/site.css +42 -0
  14. data/vendor/assets/components/pikaday/examples/amd.html +50 -0
  15. data/vendor/assets/components/pikaday/examples/bound-container.html +52 -0
  16. data/vendor/assets/components/pikaday/examples/calendars.html +57 -0
  17. data/vendor/assets/components/pikaday/examples/container.html +52 -0
  18. data/vendor/assets/components/pikaday/examples/jquery-amd.html +54 -0
  19. data/vendor/assets/components/pikaday/examples/jquery.html +46 -0
  20. data/vendor/assets/components/pikaday/examples/moment.html +53 -0
  21. data/vendor/assets/components/pikaday/examples/positions.html +106 -0
  22. data/vendor/assets/components/pikaday/examples/trigger.html +46 -0
  23. data/vendor/assets/components/pikaday/examples/weeknumbers.html +41 -0
  24. data/vendor/assets/components/pikaday/index.html +43 -0
  25. data/vendor/assets/components/pikaday/package.json +45 -0
  26. data/vendor/assets/{javascripts → components/pikaday}/pikaday.js +185 -52
  27. data/vendor/assets/components/pikaday/plugins/pikaday.jquery.js +52 -0
  28. data/vendor/assets/components/pikaday/scss/pikaday.scss +199 -0
  29. data/vendor/assets/components/pikaday/tests/methods.js +26 -0
  30. data/vendor/assets/components/pikaday/tests/module.js +24 -0
  31. metadata +27 -4
@@ -0,0 +1,42 @@
1
+ html { margin: 0; padding: 0; }
2
+ body { font-size: 100%; margin: 0; padding: 1.75em; font-family: 'Helvetica Neue', Arial, sans-serif; }
3
+
4
+ h1 { font-size: 1.75em; margin: 0 0 0.6em 0; }
5
+ h2 { font-size: 1.25em; margin: 0 0 0.6em 0; }
6
+
7
+ a { color: #2996cc; }
8
+ a:hover { text-decoration: none; }
9
+
10
+ p { line-height: 1.5em; }
11
+ .small { color: #666; font-size: 0.875em; }
12
+ .large { font-size: 1.25em; }
13
+
14
+
15
+ label {
16
+ font-weight: bold;
17
+ }
18
+
19
+ input[type="text"] {
20
+ margin: 0.5em 0 3em 0;
21
+ padding: 0.5em;
22
+ }
23
+
24
+ button#datepicker-button {
25
+ margin-bottom: 3em;
26
+ }
27
+
28
+ .flow-element {
29
+ display: inline-block;
30
+ margin-right: 3em;
31
+ vertical-align: top;
32
+ }
33
+ .flow-element:last-child {
34
+ margin-right: 0;
35
+ }
36
+ .flow-element input {
37
+ margin-top: 0;
38
+ }
39
+
40
+ #container {
41
+ min-height: 15em;
42
+ }
@@ -0,0 +1,50 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - AMD example</title>
7
+ <meta name="author" content="Ramiro Rikkert">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday - AMD example</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <br>
20
+ <input type="text" id="datepicker">
21
+
22
+ <h2>What is this?</h2>
23
+
24
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
25
+
26
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
27
+
28
+ <script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.js"></script>
29
+ <script>
30
+
31
+ require.config({
32
+ baseUrl: '../',
33
+ // To get timely, correct error triggers in IE, force a define/shim exports check.
34
+ enforceDefine: true
35
+ });
36
+ require(['pikaday'], function(Pikaday)
37
+ {
38
+ var picker = new Pikaday(
39
+ {
40
+ field: document.getElementById('datepicker'),
41
+ firstDay: 1,
42
+ minDate: new Date('2000-01-01'),
43
+ maxDate: new Date('2020-12-31'),
44
+ yearRange: [2000,2020]
45
+ });
46
+ });
47
+
48
+ </script>
49
+ </body>
50
+ </html>
@@ -0,0 +1,52 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - Container example</title>
7
+ <meta name="author" content="Stuart McFarlane">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday - Container example</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <div>
19
+ <div class="flow-element">
20
+ <label for="datepicker">Date:</label>
21
+ <input type="text" id="datepicker">
22
+ </div>
23
+ <div class="flow-element">
24
+ <div id="container"></div>
25
+ </div>
26
+ </div>
27
+
28
+ <h2>What is this?</h2>
29
+
30
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
31
+
32
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
33
+
34
+
35
+ <!-- First load pikaday.js and then the jQuery plugin -->
36
+ <script src="../pikaday.js"></script>
37
+ <script>
38
+
39
+ var picker = new Pikaday(
40
+ {
41
+ field: document.getElementById('datepicker'),
42
+ firstDay: 1,
43
+ minDate: new Date('2000-01-01'),
44
+ maxDate: new Date('2020-12-31'),
45
+ yearRange: [2000, 2020],
46
+ bound: true,
47
+ container: document.getElementById('container'),
48
+ });
49
+
50
+ </script>
51
+ </body>
52
+ </html>
@@ -0,0 +1,57 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - ranges example</title>
7
+ <meta name="author" content="Maxime Thirouin">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <br />
20
+ 2 months <input type="text" id="datepicker-2months">
21
+ <br />
22
+ 3 months, main aligned to right <input type="text" id="datepicker-3months-right">
23
+
24
+ <h2>What is this?</h2>
25
+
26
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
27
+
28
+ <p class="small">Copyright © 2013 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/MoOx">MoOx</a></p>
29
+
30
+
31
+ <script src="../pikaday.js"></script>
32
+ <script>
33
+
34
+ var picker2months = new Pikaday(
35
+ {
36
+ numberOfMonths: 2,
37
+ field: document.getElementById('datepicker-2months'),
38
+ firstDay: 1,
39
+ minDate: new Date('2000-01-01'),
40
+ maxDate: new Date('2020-12-31'),
41
+ yearRange: [2000, 2020]
42
+ });
43
+
44
+ var picker3monthsRight = new Pikaday(
45
+ {
46
+ numberOfMonths: 3,
47
+ mainCalendar: 'right',
48
+ field: document.getElementById('datepicker-3months-right'),
49
+ firstDay: 1,
50
+ minDate: new Date('2000-01-01'),
51
+ maxDate: new Date('2020-12-31'),
52
+ yearRange: [2000, 2020]
53
+ });
54
+
55
+ </script>
56
+ </body>
57
+ </html>
@@ -0,0 +1,52 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - Container example</title>
7
+ <meta name="author" content="Stuart McFarlane">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday - Container example</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <div>
19
+ <div class="flow-element">
20
+ <label for="datepicker">Date:</label>
21
+ <input type="text" id="datepicker">
22
+ </div>
23
+ <div class="flow-element">
24
+ <div id="container"></div>
25
+ </div>
26
+ </div>
27
+
28
+ <h2>What is this?</h2>
29
+
30
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
31
+
32
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
33
+
34
+
35
+ <!-- First load pikaday.js and then the jQuery plugin -->
36
+ <script src="../pikaday.js"></script>
37
+ <script>
38
+
39
+ var picker = new Pikaday(
40
+ {
41
+ field: document.getElementById('datepicker'),
42
+ firstDay: 1,
43
+ minDate: new Date('2000-01-01'),
44
+ maxDate: new Date('2020-12-31'),
45
+ yearRange: [2000, 2020],
46
+ bound: false,
47
+ container: document.getElementById('container'),
48
+ });
49
+
50
+ </script>
51
+ </body>
52
+ </html>
@@ -0,0 +1,54 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - jQuery + AMD example</title>
7
+ <meta name="author" content="Ramiro Rikkert">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday - jQuery + AMD example</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <br>
20
+ <input type="text" id="datepicker">
21
+
22
+ <h2>What is this?</h2>
23
+
24
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
25
+
26
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
27
+
28
+
29
+ <script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.js"></script>
30
+ <script>
31
+
32
+ require.config({
33
+ baseUrl: '../',
34
+ // To get timely, correct error triggers in IE, force a define/shim exports check.
35
+ enforceDefine: true,
36
+ paths: {
37
+ jquery: '//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min'
38
+ }
39
+ });
40
+ require(['jquery', 'plugins/pikaday.jquery'], function($)
41
+ {
42
+ var $datepicker = $('#datepicker').pikaday({
43
+ firstDay: 1,
44
+ minDate: new Date('2000-01-01'),
45
+ maxDate: new Date('2020-12-31'),
46
+ yearRange: [2000,2020]
47
+ });
48
+ // chain a few methods for the first datepicker, jQuery style!
49
+ $datepicker.pikaday('show').pikaday('nextMonth');
50
+ });
51
+
52
+ </script>
53
+ </body>
54
+ </html>
@@ -0,0 +1,46 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - jQuery example</title>
7
+ <meta name="author" content="Ramiro Rikkert">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday - jQuery example</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <br>
20
+ <input type="text" id="datepicker">
21
+
22
+ <h2>What is this?</h2>
23
+
24
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
25
+
26
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
27
+
28
+
29
+ <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
30
+ <!-- First load pikaday.js and then the jQuery plugin -->
31
+ <script src="../pikaday.js"></script>
32
+ <script src="../plugins/pikaday.jquery.js"></script>
33
+ <script>
34
+
35
+ var $datepicker = $('#datepicker').pikaday({
36
+ firstDay: 1,
37
+ minDate: new Date('2000-01-01'),
38
+ maxDate: new Date('2020-12-31'),
39
+ yearRange: [2000,2020]
40
+ });
41
+ // chain a few methods for the first datepicker, jQuery style!
42
+ $datepicker.pikaday('show').pikaday('nextMonth');
43
+
44
+ </script>
45
+ </body>
46
+ </html>
@@ -0,0 +1,53 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - moment.js example</title>
7
+ <meta name="author" content="Ramiro Rikkert">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday + moment.js</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <br>
20
+ <input type="text" id="datepicker">
21
+ <div id="selected"></div>
22
+ <br>
23
+
24
+ <h2>What is this?</h2>
25
+
26
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
27
+
28
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
29
+
30
+
31
+ <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script>
32
+ <script src="../pikaday.js"></script>
33
+ <script>
34
+
35
+ // You can get and set dates with moment objects
36
+ var picker = new Pikaday(
37
+ {
38
+ field: document.getElementById('datepicker'),
39
+ firstDay: 1,
40
+ minDate: new Date('2000-01-01'),
41
+ maxDate: new Date('2020-12-31'),
42
+ yearRange: [2000,2020],
43
+ onSelect: function() {
44
+ var date = document.createTextNode(this.getMoment().format('Do MMMM YYYY') + ' ');
45
+ document.getElementById('selected').appendChild(date);
46
+ }
47
+ });
48
+
49
+ picker.setMoment(moment().dayOfYear(366));
50
+
51
+ </script>
52
+ </body>
53
+ </html>
@@ -0,0 +1,106 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday alignment example</title>
7
+ <meta name="author" content="Maxime Thirouin">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday alignement example</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Dates:</label>
19
+
20
+ <br />
21
+ <input type="text" id="datepicker" value="Default (bottom left)">
22
+ <br />
23
+ <input type="text" id="datepicker-topleft" value="Top left (waat?)"> <b>not really (too close from top)</b>
24
+ <br />
25
+ <input type="text" id="datepicker-topleft-forreal" value="Top left"> for real this time (same code as above)
26
+ <br />
27
+ <input type="text" id="datepicker-topright" value="Top right (waat?)"> <b>not really (too close from right)</b>
28
+ <br />
29
+ Here is the top right position with content before (no automatic adjustment used, same code as above) <input type="text" id="datepicker-topright-forreal" value="Top right">
30
+ <br />
31
+ <input type="text" id="datepicker-bottomright" value="Bottom right (waat?)">
32
+ <br />
33
+ <input type="text" id="datepicker-bottomright-forced" value="forced to position outside viewport">
34
+ <br />
35
+ Here is the bottom right position with content before (no automatic adjustment used, , same code as above) <input type="text" id="datepicker-bottomright-forreal" value="Bottom right">
36
+
37
+ <p><i>Also, take a look to the bottom right of this page to see an example with position automatically adjusted.</i></p>
38
+ <input type="text" id="datepicker-auto" style="position: absolute; bottom: 0; right: 0;" value="Automatic position">
39
+
40
+ <h2>What is this?</h2>
41
+
42
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
43
+
44
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/MoOx">MoOx</a></p>
45
+
46
+
47
+ <script src="../pikaday.js"></script>
48
+ <script>
49
+
50
+ // default: bottom left
51
+ new Pikaday(
52
+ {
53
+ field: document.getElementById('datepicker')
54
+ });
55
+
56
+ new Pikaday(
57
+ {
58
+ field: document.getElementById('datepicker-topleft'),
59
+ position: 'top left'
60
+ });
61
+
62
+ new Pikaday(
63
+ {
64
+ field: document.getElementById('datepicker-topleft-forreal'),
65
+ position: 'top left'
66
+ });
67
+
68
+ new Pikaday(
69
+ {
70
+ field: document.getElementById('datepicker-topright'),
71
+ position: 'top right'
72
+ });
73
+
74
+ new Pikaday(
75
+ {
76
+ field: document.getElementById('datepicker-topright-forreal'),
77
+ position: 'top right'
78
+ });
79
+
80
+ new Pikaday(
81
+ {
82
+ field: document.getElementById('datepicker-bottomright'),
83
+ position: 'bottom right'
84
+ });
85
+
86
+ new Pikaday(
87
+ {
88
+ field: document.getElementById('datepicker-bottomright-forced'),
89
+ position: 'bottom right',
90
+ reposition: false
91
+ });
92
+
93
+ new Pikaday(
94
+ {
95
+ field: document.getElementById('datepicker-bottomright-forreal'),
96
+ position: 'bottom right'
97
+ });
98
+
99
+ new Pikaday(
100
+ {
101
+ field: document.getElementById('datepicker-auto'),
102
+ });
103
+
104
+ </script>
105
+ </body>
106
+ </html>
@@ -0,0 +1,46 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - custom trigger element example</title>
7
+ <meta name="author" content="Ramiro Rikkert">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday - custom trigger example</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <br>
20
+ <input type="text" disabled id="datepicker">
21
+ <br>
22
+ <button id="datepicker-button">Choose Date</button>
23
+
24
+
25
+ <h2>What is this?</h2>
26
+
27
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
28
+
29
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
30
+
31
+
32
+ <script src="../pikaday.js"></script>
33
+ <script>
34
+
35
+ new Pikaday(
36
+ {
37
+ field: document.getElementById('datepicker'),
38
+ trigger: document.getElementById('datepicker-button'),
39
+ minDate: new Date('2000-01-01'),
40
+ maxDate: new Date('2020-12-31'),
41
+ yearRange: [2010,2020]
42
+ });
43
+
44
+ </script>
45
+ </body>
46
+ </html>
@@ -0,0 +1,41 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday - weeknumbers example</title>
7
+ <meta name="author" content="Maxime Thirouin">
8
+ <link rel="stylesheet" href="../css/pikaday.css">
9
+ <link rel="stylesheet" href="../css/site.css">
10
+ </head>
11
+ <body>
12
+ <a href="https://github.com/dbushell/Pikaday"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub"></a>
13
+
14
+ <h1>Pikaday - showing weeknumbers</h1>
15
+
16
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <input type="text" id="datepicker-week-numbers">
20
+
21
+ <h2>What is this?</h2>
22
+
23
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
24
+
25
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license | Example by <a href="https://github.com/rikkert">Ramiro Rikkert</a></p>
26
+
27
+ <script src="../pikaday.js"></script>
28
+ <script>
29
+
30
+ var pickerWeekNums = new Pikaday({
31
+ showWeekNumber: true,
32
+ field: document.getElementById('datepicker-week-numbers'),
33
+ firstDay: 1,
34
+ minDate: new Date('2000-01-01'),
35
+ maxDate: new Date('2020-12-31'),
36
+ yearRange: [2000, 2020]
37
+ });
38
+
39
+ </script>
40
+ </body>
41
+ </html>
@@ -0,0 +1,43 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
6
+ <title>Pikaday</title>
7
+ <meta name="author" content="David Bushell">
8
+ <link rel="stylesheet" href="css/pikaday.css">
9
+ <link rel="stylesheet" href="css/site.css">
10
+ </head>
11
+ <body>
12
+ <h1>Pikaday</h1>
13
+
14
+ <p class="large">A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.</p>
15
+
16
+ <p><a href="https://github.com/dbushell/Pikaday"><strong>Pikaday source on GitHub</strong></a></p>
17
+
18
+ <label for="datepicker">Date:</label>
19
+ <br>
20
+ <input type="text" id="datepicker">
21
+
22
+ <h2>What is this?</h2>
23
+
24
+ <p>Since version 1.0 Pikaday is a stable and battle tested date-picker. Feel free to use it however you like but please report any bugs or feature requests to the <a href="https://github.com/dbushell/Pikaday/issues">GitHub issue tracker</a>, thanks!</p>
25
+
26
+ <p class="small">Copyright © 2014 <a href="http://dbushell.com/">David Bushell</a> | BSD &amp; MIT license</p>
27
+
28
+
29
+ <script src="pikaday.js"></script>
30
+ <script>
31
+
32
+ var picker = new Pikaday(
33
+ {
34
+ field: document.getElementById('datepicker'),
35
+ firstDay: 1,
36
+ minDate: new Date('2000-01-01'),
37
+ maxDate: new Date('2020-12-31'),
38
+ yearRange: [2000,2020]
39
+ });
40
+
41
+ </script>
42
+ </body>
43
+ </html>