From dee9d3a6e35e9106e19bd9139163ef62d34bb514 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Da=C3=B0i=20Sn=C3=A6r=20Sk=C3=BAlason?= Date: Mon, 3 Nov 2014 22:43:31 +0100 Subject: [PATCH 1/5] Import CSS classes and pre-input content MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit — Added “divClass” argument to the component, which can be used to pass CSS classes to the div containing the datepicker input — Added “inputClass” argument to the component, which can be used to pass CSS classes to the datepicker’s input element — Added option to input the datepicker tag’s content (i.e. @content) before the input. This can be used to add labels or Bootstrap add-ons to the input. --- views/index.html | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/views/index.html b/views/index.html index 93de1e7..45ebaa2 100644 --- a/views/index.html +++ b/views/index.html @@ -1,5 +1,5 @@ -
+
{{if inline}} {{if view === 'month'}} @@ -11,7 +11,8 @@ {{/if}} {{else}} - + {{@content}} +
From bc72078bf86935cf8268065889f4554de11fe4a6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Da=C3=B0i=20Sn=C3=A6r=20Sk=C3=BAlason?= Date: Mon, 3 Nov 2014 22:45:09 +0100 Subject: [PATCH 2/5] Added show, cancel and select events MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Added three events to the datepicker component: — show: Triggered when the datepicker is shown — cancel: Triggered when the datepicker is closed without selecting a date — select: Triggered when a new date has been selected --- src/datepicker.coffee | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/src/datepicker.coffee b/src/datepicker.coffee index e83940e..34913db 100644 --- a/src/datepicker.coffee +++ b/src/datepicker.coffee @@ -16,9 +16,13 @@ module.exports = class Datepicker extends ViewHelpers create: (model, dom) -> global.moment = moment dom.on "click", (e) => - model.set "show", true if @parent.contains(e.target) + if @parent.contains(e.target) + model.set "show", true, => + @emit "show" dom.on "mousedown", (e) => - model.set "show", false unless @parent.contains(e.target) + unless @parent.contains(e.target) + model.set "show", false, => + @emit "cancel" gotoMonthView: (date) -> @setCurrentDate date @@ -82,9 +86,10 @@ module.exports = class Datepicker extends ViewHelpers selectedMonth = date.month() currentDate = moment(@getCurrentDate()) currentMonth = currentDate.month() - @gotoMonthView date if selectedMonth isnt currentMonth - @model.set "active", selectedDate.fullDate - @model.set "show", false + @emitDelayable "select", => + @gotoMonthView date if selectedMonth isnt currentMonth + @model.set "active", selectedDate.fullDate + @model.set "show", false prevMonth: -> # get current month From 39851c831d8e2ee62299feaa1c009c28ebb709df Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Da=C3=B0i=20Sn=C3=A6r=20Sk=C3=BAlason?= Date: Thu, 6 Nov 2014 17:16:19 +0100 Subject: [PATCH 3/5] Don't use a emitDelayable for the select event This was a bad idea, rather just emit an event when select has finished running and provide the previous date as an argument. That way users can revert to the old date if needed for some reason. --- src/datepicker.coffee | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/datepicker.coffee b/src/datepicker.coffee index 34913db..9141b83 100644 --- a/src/datepicker.coffee +++ b/src/datepicker.coffee @@ -82,14 +82,15 @@ module.exports = class Datepicker extends ViewHelpers @gotoDecadeView nextDecadeDate select: (selectedDate) -> + previousDate = @model.get "active" date = moment(selectedDate.fullDate) selectedMonth = date.month() currentDate = moment(@getCurrentDate()) currentMonth = currentDate.month() - @emitDelayable "select", => - @gotoMonthView date if selectedMonth isnt currentMonth - @model.set "active", selectedDate.fullDate - @model.set "show", false + @gotoMonthView date if selectedMonth isnt currentMonth + @model.set "active", selectedDate.fullDate + @model.set "show", false + @emit "select", previousDate prevMonth: -> # get current month From bffe922dcc4bb19369d29c4b24844b293d4e0e04 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Da=C3=B0i=20Sn=C3=A6r=20Sk=C3=BAlason?= Date: Thu, 20 Aug 2015 15:54:04 +0000 Subject: [PATCH 4/5] Added a "preselect" event (delayable) that fires directly when a user selects a new date --- src/datepicker.coffee | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/src/datepicker.coffee b/src/datepicker.coffee index 9141b83..b3fbb35 100644 --- a/src/datepicker.coffee +++ b/src/datepicker.coffee @@ -82,15 +82,16 @@ module.exports = class Datepicker extends ViewHelpers @gotoDecadeView nextDecadeDate select: (selectedDate) -> - previousDate = @model.get "active" - date = moment(selectedDate.fullDate) - selectedMonth = date.month() - currentDate = moment(@getCurrentDate()) - currentMonth = currentDate.month() - @gotoMonthView date if selectedMonth isnt currentMonth - @model.set "active", selectedDate.fullDate - @model.set "show", false - @emit "select", previousDate + @emitDelayable "preselect", => + previousDate = @model.get "active" + date = moment(selectedDate.fullDate) + selectedMonth = date.month() + currentDate = moment(@getCurrentDate()) + currentMonth = currentDate.month() + @gotoMonthView date if selectedMonth isnt currentMonth + @model.set "active", selectedDate.fullDate + @model.set "show", false + @emit "select", previousDate prevMonth: -> # get current month From 64f4a2e7568f292be652a4aa4c7d2a146b2e53be Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Da=C3=B0i=20Sn=C3=A6r=20Sk=C3=BAlason?= Date: Thu, 20 Aug 2015 16:07:13 +0000 Subject: [PATCH 5/5] Only fire "cancel" event when the datepicker is shown MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This is to prevent datepickers from firing the “cancel” all the time --- src/datepicker.coffee | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/datepicker.coffee b/src/datepicker.coffee index b3fbb35..272cafb 100644 --- a/src/datepicker.coffee +++ b/src/datepicker.coffee @@ -20,7 +20,7 @@ module.exports = class Datepicker extends ViewHelpers model.set "show", true, => @emit "show" dom.on "mousedown", (e) => - unless @parent.contains(e.target) + unless @parent.contains(e.target) or not model.get "show" model.set "show", false, => @emit "cancel"