anytime - npm Package Compare versions

Comparing version 0.3.1 to 0.4.0

anytime.js

 module.exports = AnytimePicker
 
-var moment = require('moment')
+var moment = require('moment-timezone')
   , months = [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ]
-  // , days = [ 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday' ]
   , Emitter = require('events').EventEmitter
@@ -21,2 +20,8 @@ , extend = require('lodash.assign')
 
+function createMoment(value) {
+  if (this.options.timezone) return moment.tz(value, this.options.timezone)
+
+  return moment(value)
+}
+
 function AnytimePicker(options) {
@@ -35,6 +40,6 @@
 
-  var initialValue = moment(this.options.initialValue)
+  var initialValue = createMoment.call(this, this.options.initialValue)
   this.currentView = { month: initialValue.month(), year: initialValue.year() }
 
-  this.value = moment(this.options.initialValue).seconds(0).milliseconds(0)
+  this.value = createMoment.call(this, this.options.initialValue).seconds(0).milliseconds(0)
 
@@ -54,4 +59,7 @@ this.el.addEventListener('click', function (e) {
   this.on('change', function (value) {
-    if (value) value = moment(value).format(this.options.format)
-    this.options.input.value = value
+    if (!value) return
+    value = createMoment.call(this, value)
+    this.value = value
+    this.options.input.value = value.format(this.options.format)
+    this.updateDisplay()
   }.bind(this))
@@ -147,3 +155,3 @@
   // Next month button
-  var nextBtn = createButton('>', [ 'anytime-picker__button', 'anytime-picker__button--prev' ])
+  var nextBtn = createButton('>', [ 'anytime-picker__button', 'anytime-picker__button--next' ])
   headerEl.appendChild(nextBtn)
@@ -194,6 +202,23 @@ nextBtn.addEventListener('click', this.showNextMonth.bind(this))
 
+  var currentDayOfMonth = +moment().format('D')
+    , isCurrentMonth = +moment().month() === this.currentView.month
+    , isCurrentYear = +moment().year() === this.currentView.year
+    , selectedDayOfMonth = +createMoment.call(this, this.value).format('D')
+    , isSelectedCurrentMonth = +createMoment.call(this, this.value).month() === this.currentView.month
+    , isSelectedCurrentYear = +createMoment.call(this, this.value).year() === this.currentView.year
+
   for (var y = 1; y <= monthDetails.length; y++) {
     var date = document.createElement('button')
     date.textContent = y
-    classList(date).add('anytime-picker__date', 'js-anytime-picker-day')
+    var cl = classList(date)
+    cl.add('anytime-picker__date', 'js-anytime-picker-day')
+
+    if (y === currentDayOfMonth && isCurrentMonth && isCurrentYear) {
+      cl.add('anytime-picker__date--current')
+    }
+
+    // Needs to add or remove because the current selected day can change
+    // within the current month and need to be cleared from others
+    cl[y === selectedDayOfMonth && isSelectedCurrentMonth && isSelectedCurrentYear ? 'add' : 'remove']('anytime-picker__date--selected')
+
     date.setAttribute('data-date', y)
@@ -283,3 +308,3 @@ date.setAttribute('data-month', this.currentView.month)
   var hourSelect = document.createElement('select')
-  classList(hourSelect).add('anytime-picker__dropdown')
+  classList(hourSelect).add('anytime-picker__dropdown', 'anytime-picker__dropdown--hours')
   for (var i = 0; i < 24; i++) {
@@ -289,3 +314,3 @@ var hour = document.createElement('option')
     hour.textContent = pad(i, 2)
-    if (moment(this.options.initialValue).hours() === i) hour.setAttribute('selected', true)
+    if (createMoment.call(this, this.options.initialValue).hours() === i) hour.setAttribute('selected', true)
     hourSelect.appendChild(hour)
@@ -312,3 +337,3 @@ }
     minute.textContent = pad(j, 2)
-    if (moment(this.options.initialValue).minutes() === j) minute.setAttribute('selected', true)
+    if (createMoment.call(this, this.options.initialValue).minutes() === j) minute.setAttribute('selected', true)
     minuteSelect.appendChild(minute)
@@ -315,0 +340,0 @@ }

lib/get-month-details.js

 module.exports = getMonthDetails
 
-var moment = require('moment')
+var moment = require('moment-timezone')
 
@@ -5,0 +5,0 @@ /*

package.json

 {
   "name": "anytime",
-  "version": "0.3.1",
+  "version": "0.4.0",
   "publishConfig": {
@@ -26,3 +26,3 @@ "registry": "http://registry.npmjs.org"
     "lodash.assign": "*",
-    "moment": "^2.8.4",
+    "moment-timezone": "^0.3.1",
     "pad-number": "^0.0.1"
@@ -32,3 +32,3 @@ },
     "istanbul": "^0.3.2",
-    "jsdom": "^1.0.1",
+    "jsdom": "^3.1.2",
     "jshint": "^2.5.6",
@@ -35,0 +35,0 @@ "jshint-full-path": "^1.1.1",

Readme.md

@@ -17,2 +17,27 @@ # anytime
 
+## Usage
+### `var picker = new AnyTime(options)`
+
+Options can be the following:
+
+- `minYear` - minimum year. Defaults to `1960`
+- `maxYear` - maximum year. Defaults to `2030`
+- `offset` - number of pixels to offset the element top. Defaults to `5`
+- `initialValue` - value to set the date picker to. Defaults to `new Date()`
+- `format` - [moment-style](http://momentjs.com/docs/#/displaying/format/) date format string. Defaults to `'h:mma on dddd D MMMM YYYY'`
+- `timezone` - [moment-style](http://momentjs.com/timezone/) timezone string (e.g. 'Europe/London'). Defaults to current timezone
+
+#### `picker.render()` - Renders the date picker
+#### `picker.show()` - Shows the date picker
+#### `picker.hide()` - Hides the date picker
+#### `picker.destroy()` - Destroys the date picker instance
+
+#### Internal API methods - you probably won't need these
+##### `picker.renderHeader()` - Renders the header
+##### `picker.renderFooter()` - Renders the footer
+##### `picker.renderTimeInput()` - Renders the time input
+##### `picker.updateDisplay()` - Updates the elements to reflect the internal date state
+##### `picker.showPrevMonth()` - Shows the previous month
+##### `picker.showNextMonth()` - Shows the next month
+
 ## Credits
@@ -19,0 +44,0 @@ * [Ben Gourley](https://github.com/bengourley/)

No alert changes

Improved metrics

Total package byte prevSize

172318

increased by1.38%

Lines of code

4335

increased by0.44%

Number of lines in readme file

51

increased by96.15%

Dependency changes

• + Addedmoment-timezone@^0.3.1

• + Addedmoment-timezone@0.3.1(transitive)

• - Removedmoment@^2.8.4