{"_id":"one.com-pikaday","_rev":"3-96d110eaaa29cfbcddc78442c9b523ea","name":"one.com-pikaday","description":"A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS","dist-tags":{"latest":"1.2.0"},"versions":{"1.2.0":{"name":"one.com-pikaday","version":"1.2.0","description":"A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS","keywords":["datepicker","calendar","date"],"homepage":"http://dbushell.github.io/Pikaday/","bugs":{"url":"https://github.com/dbushell/Pikaday/issues"},"licenses":[{"type":"BSD","url":"http://opensource.org/licenses/BSD-3-Clause"},{"type":"MIT","url":"http://opensource.org/licenses/MIT"}],"main":"pikaday.js","repository":{"type":"git","url":"git+https://github.com/dbushell/Pikaday.git"},"optionalDependencies":{"moment":"2.x"},"devDependencies":{"mocha":"~1.18.2","expect.js":"^0.3.1"},"testling":{"harness":"mocha","files":"tests/*.js","browsers":["ie/7..latest","chrome/latest","firefox/3.6","firefox/latest","safari/latest","opera/latest"]},"gitHead":"81413a2296c95185ab8e2972a51be8455b7349db","dependencies":{"moment":"2.x"},"_id":"one.com-pikaday@1.2.0","scripts":{},"_shasum":"6e130ea000be876cb9ec3177d0e11aa30a1fb39e","_from":".","_npmVersion":"2.13.2","_nodeVersion":"0.10.38","_npmUser":{"name":"gustavnikolaj","email":"gustavnikolaj@gmail.com"},"dist":{"shasum":"6e130ea000be876cb9ec3177d0e11aa30a1fb39e","tarball":"https://registry.npmjs.org/one.com-pikaday/-/one.com-pikaday-1.2.0.tgz","integrity":"sha512-hqwOxx4K7stZb/MbTzI6ZqHVEtWdE5+zrOwfHQiVwSt2D6poEqv+82GSRw5rHLXnJomdZGjUeTbVjT7fobpqMg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGL259XAvyCZNSCg8xqjXcApnevg9cj6sFtAwCUzt1JxAiEA5JOJWJcMVXgpP0LuyRsbbwgE9evj9BSOnD9RDLxEUD0="}]},"maintainers":[{"name":"gustavnikolaj","email":"gustavnikolaj@gmail.com"}]}},"readme":"Pikaday\n========\n\n### A refreshing JavaScript Datepicker\n\n* Lightweight (less than 5kb minified and gzipped)\n* No dependencies (but plays well with [Moment.js][moment]\n* Modular CSS classes for easy styling\n\n[**Try Pikaday Demo →**][Pikaday]\n\n![Pikaday Screenshot][screenshot]\n\n**Production ready?** Since version 1.0.0 Pikaday is stable and used in production. If you do however find bugs or have feature requests please submit them to the [GitHub issue tracker][issues].  \nAlso see the [changelog](CHANGELOG.md)\n\n\n## Usage\n\n**Pikaday** can be bound to an input field:\n\n```html\n<input type=\"text\" id=\"datepicker\">\n```\n\nAdd the JavaScript to the end of your document:\n\n```html\n<script src=\"pikaday.js\"></script>\n<script>\n    var picker = new Pikaday({ field: document.getElementById('datepicker') });\n</script>\n```\n\nIf you're using **jQuery** make sure to pass only the first element:\n\n```javascript\nvar picker = new Pikaday({ field: $('#datepicker')[0] });\n```\n\nIf the Pikaday instance is not bound to a field you can append the element anywhere:\n\n```javascript\nvar field = document.getElementById('datepicker');\nvar picker = new Pikaday({\n    onSelect: function(date) {\n        field.value = picker.toString();\n    }\n});\nfield.parentNode.insertBefore(picker.el, field.nextSibling);\n```\n\nFor advanced formatting load [Moment.js][moment] prior to Pikaday:  \nSee the [moment.js example][] for a full version.\n\n```html\n<input type=\"text\" id=\"datepicker\" value=\"9 Oct 2014\">\n\n<script src=\"moment.js\"></script>\n<script src=\"pikaday.js\"></script>\n<script>\n    var picker = new Pikaday({\n        field: document.getElementById('datepicker'),\n        format: 'D MMM YYYY',\n        onSelect: function() {\n            console.log(this.getMoment().format('Do MMMM YYYY'));\n        }\n    });\n</script>\n```\n\n### Configuration\n\nAs the examples demonstrate above\nPikaday has many useful options:\n\n* `field` bind the datepicker to a form field\n* `trigger` use a different element to trigger opening the datepicker, see [trigger example][] (default to `field`)\n* `bound` automatically show/hide the datepicker on `field` focus (default `true` if `field` is set)\n* `position` preferred position of the datepicker relative to the form field, e.g.: `top right`, `bottom right` **Note:** automatic adjustment may occur to avoid datepicker from being displayed outside the viewport, see [positions example][] (default to 'bottom left')\n* `container` DOM node to render calendar into, see [container example][] (default: undefined) \n* `format` the default output format for `.toString()` and `field` value (requires [Moment.js][moment] for custom formatting)\n* `defaultDate` the initial date to view when first opened\n* `setDefaultDate` make the `defaultDate` the initial selected value\n* `firstDay` first day of the week (0: Sunday, 1: Monday, etc)\n* `minDate` the minimum/earliest date that can be selected (this should be a native Date object - e.g. `new Date()` or `moment().toDate()`)\n* `maxDate` the maximum/latest date that can be selected (this should be a native Date object - e.g. `new Date()` or `moment().toDate()`)\n* `yearRange` number of years either side (e.g. `10`) or array of upper/lower range (e.g. `[1900,2015]`)\n* `showWeekNumber` show the ISO week number at the head of the row (default `false`)\n* `isRTL` reverse the calendar for right-to-left languages\n* `i18n` language defaults for month and weekday names (see internationalization below)\n* `yearSuffix` additional text to append to the year in the title\n* `showMonthAfterYear` render the month after year in the title (default `false`)\n* `numberOfMonths` number of visible calendars\n* `mainCalendar` when `numberOfMonths` is used, this will help you to choose where the main calendar will be (default `left`, can be set to `right`). Only used for the first display or when a selected date is not already visible\n* `onSelect` callback function for when a date is selected\n* `onOpen` callback function for when the picker becomes visible\n* `onClose` callback function for when the picker is hidden\n* `onDraw` callback function for when the picker draws a new month\n\n## jQuery Plugin\n\nThe normal version of Pikaday does not require jQuery, however there is a jQuery plugin if that floats your boat (see `plugins/pikaday.jquery.js` in the repository). This version requires jQuery, naturally, and can be used like other plugins:  \nSee the [jQuery example][] for a full version.\n\n```html\n<script src=\"//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js\"></script>\n<script src=\"pikaday.js\"></script>\n<script src=\"plugins/pikaday.jquery.js\"></script>\n<script>\n\n// activate datepickers for all elements with a class of `datepicker`\n$('.datepicker').pikaday({ firstDay: 1 });\n\n// chain a few methods for the first datepicker, jQuery style!\n$('.datepicker').eq(0).pikaday('show').pikaday('gotoYear', 2042);\n\n</script>\n```\n\n## AMD support\n\nIf you use a modular script loader than Pikaday is not bound to the global object and will fit nicely in your build process. You can require Pikaday just like any other module.  \nSee the [AMD example][] for a full version.\n\n```javascript\nrequire(['pikaday'], function(Pikaday) {\n    var picker = new Pikaday({ field: document.getElementById('datepicker') });\n});\n```\nThe same applies for the jQuery plugin mentioned above.  \nSee the [jQuery AMD example][] for a full version.\n\n```javascript\nrequire(['jquery', 'pikaday.jquery'], function($) {\n    $('#datepicker').pikaday();\n});\n```\n\n## CommonJS module support\n\nIf you use a CommonJS compatible environment you can use the require function to import Pikaday.\n\n\n```javascript\nvar pikaday = require('pikaday');\n```\n\nWhen you bundle all your required modules with [Browserify][browserify] and you don't use [Moment.js][moment] specify the ignore option:\n\n`browserify main.js -o bundle.js -i moment`\n\n## Ruby on Rails\n\nIf you're using **Ruby on Rails**, make sure to check out the [Pikaday gem][gem].\n\n## Methods\n\nYou can control the date picker after creation:\n\n```javascript\nvar picker = new Pikaday({ field: document.getElementById('datepicker') });\n```\n\n### Get and set date\n\n`picker.toString('YYYY-MM-DD')`\n\nReturns the selected date in a string format. If [Moment.js][moment] exists (recommended) then Pikaday can return any format that Moment understands, otherwise you're stuck with JavaScript's default.\n\n`picker.getDate()`\n\nReturns a basic JavaScript `Date` object of the selected day, or `null` if no selection.\n\n`picker.setDate('2015-01-01')`\n\nSet the current selection. This will be restricted within the bounds of `minDate` and `maxDate` options if they're specified. You can optionally pass a boolean as the second parameter to prevent triggering of the onSelect callback (true), allowing the date to be set silently.\n\n`picker.getMoment()`\n\nReturns a [Moment.js][moment] object for the selected date (Moment must be loaded before Pikaday).\n\n`picker.setMoment(moment('14th February 2014', 'DDo MMMM YYYY'))`\n\nSet the current selection with a [Moment.js][moment] object (see `setDate` for details).\n\n### Change current view\n\n`picker.gotoDate(new Date(2014, 1))`\n\nChange the current view to see a specific date. This example will jump to February 2014 ([month is a zero-based index][mdn_date]).\n\n`picker.gotoToday()`\n\nShortcut for `picker.gotoDate(new Date())`\n\n`picker.gotoMonth(2)`\n\nChange the current view by month (0: January, 1: Februrary, etc).\n\n`picker.nextMonth()`\n`picker.prevMonth()`\n\nGo to the next or previous month (this will change year if necessary).\n\n`picker.gotoYear()`\n\nChange the year being viewed.\n\n`picker.setMinDate()`\n\nUpdate the minimum/earliest date that can be selected.\n\n`picker.setMaxDate()`\n\nUpdate the maximum/latest date that can be selected.\n\n### Show and hide datepicker\n\n`picker.isVisible()`\n\nReturns `true` or `false`.\n\n`picker.show()`\n\nMake the picker visible.\n\n`picker.adjustPosition()`\n\nRecalculate and change the position of the picker.\n\n`picker.hide()`\n\nHide the picker making it invisible.\n\n`picker.destroy()`\n\nHide the picker and remove all event listeners — no going back!\n\n### Internationalization\n\nThe default `i18n` configuration format looks like this:\n\n```javascript\ni18n: {\n    previousMonth : 'Previous Month',\n    nextMonth     : 'Next Month',\n    months        : ['January','February','March','April','May','June','July','August','September','October','November','December'],\n    weekdays      : ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'],\n    weekdaysShort : ['Sun','Mon','Tue','Wed','Thu','Fri','Sat']\n}\n```\n\nYou must provide 12 months and 7 weekdays (with abbreviations). Always specify weekdays in this order with Sunday first. You can change the `firstDay` option to reorder if necessary (0: Sunday, 1: Monday, etc). You can also set `isRTL` to `true` for languages that are read right-to-left.\n\n\n## Extensions\n\n### Timepicker\n\nPikaday is a pure datepicker. It will not support picking a time of day. However, there have been efforts to add time support to Pikaday.  \nSee [#1][issue1] and [#18][issue18]. These reside in their own fork.\n\nYou can use the work [@owenmead][owenmead] did most recently at [owenmead/Pikaday][owen Pika]  \nA more simple time selection approach done by [@xeeali][xeeali] at [xeeali/Pikaday][xeeali Pika] is based on version 1.2.0.  \nAlso [@stas][stas] has a fork [stas/Pikaday][stas Pika], but is now quite old\n\n\n## Browser Compatibility\n\n* IE 7+\n* Chrome 8+\n* Firefox 3.5+\n* Safari 3+\n* Opera 10.6+\n\n[![browser compatibility](https://ci.testling.com/rikkert/pikaday.png)\n](https://ci.testling.com/rikkert/pikaday)\n\n\n* * *\n\n## Authors\n\n* David Bushell [http://dbushell.com][Bushell] [@dbushell][Bushell Twitter]\n* Ramiro Rikkert [GitHub][Rikkert] [@RamRik][Rikkert Twitter]\n\nThanks to [@shoogledesigns][shoogledesigns] for the name.\n\nCopyright © 2014 David Bushell | BSD & MIT license\n\n  [Pikaday]:     http://dbushell.github.com/Pikaday/                              \"Pikaday\"\n  [moment]:      http://momentjs.com/                                             \"moment.js\"\n  [browserify]:  http://browserify.org/                                           \"browserify\"\n  [screenshot]:  https://raw.github.com/dbushell/Pikaday/gh-pages/screenshot.png  \"Screenshot\"\n  [issues]:      https://github.com/dbushell/Pikaday/issues                       \"Issue tracker\"\n  [gem]:         https://rubygems.org/gems/pikaday-gem                            \"RoR gem\"\n  [mdn_date]:    https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date  \"Date\"\n  [Bushell]:     http://dbushell.com/                                             \"dbushell.com\"\n  [Bushell Twitter]: https://twitter.com/dbushell                                 \"@dbushell\"\n  [Rikkert]:     https://github.com/rikkert                                       \"Rikkert GitHub\"\n  [Rikkert Twitter]: https://twitter.com/ramrik                                   \"@ramrik\"\n  [shoogledesigns]:  https://twitter.com/shoogledesigns/status/255209384261586944 \"@shoogledesigns\"\n  [issue1]:      https://github.com/dbushell/Pikaday/issues/1                     \"Issue 1\"\n  [issue18]:     https://github.com/dbushell/Pikaday/issues/18                    \"Issue 18\"\n  [stas]:        https://github.com/stas                                          \"@stas\"\n  [stas Pika]:   https://github.com/stas/Pikaday                                  \"Pikaday\"\n  [owenmead]:    https://github.com/owenmead                                      \"@owenmead\"\n  [owen Pika]:   https://github.com/owenmead/Pikaday                              \"Pikaday\"\n  [xeeali]:      https://github.com/xeeali                                        \"@xeeali\"\n  [xeeali Pika]: https://github.com/xeeali/Pikaday                                \"Pikaday\"\n  [moment.js example]: http://dbushell.github.com/Pikaday/examples/moment.html    \"Pikaday w/ moment.js\"\n  [jQuery example]: http://dbushell.github.com/Pikaday/examples/jquery.html       \"Pikaday w/ jQuery\"\n  [AMD example]: http://dbushell.github.com/Pikaday/examples/amd.html             \"Pikaday w/ AMD\"\n  [jQuery AMD example]: http://dbushell.github.com/Pikaday/examples/jquery-amd.html \"Pikaday w/ jQuery + AMD\"\n  [trigger example]: http://dbushell.github.com/Pikaday/examples/trigger.html     \"Pikaday using custom trigger\"\n  [positions example]: http://dbushell.github.com/Pikaday/examples/positions.html \"Pikaday using different position options\"\n  [container example]: http://dbushell.github.com/Pikaday/examples/container.html \"Pikaday using custom calendar container\"\n","maintainers":[{"name":"gustavnikolaj","email":"gustavnikolaj@gmail.com"}],"time":{"modified":"2022-06-22T21:53:21.591Z","created":"2015-08-07T14:18:02.829Z","1.2.0":"2015-08-07T14:18:02.829Z"},"homepage":"http://dbushell.github.io/Pikaday/","keywords":["datepicker","calendar","date"],"repository":{"type":"git","url":"git+https://github.com/dbushell/Pikaday.git"},"bugs":{"url":"https://github.com/dbushell/Pikaday/issues"},"readmeFilename":"README.md"}