From cd210efd2a5f0cce32b3b2d94bb1df2ff86e3507 Mon Sep 17 00:00:00 2001
From: stidiovip <stidiovip@yahoo.fr>
Date: Wed, 13 Apr 2016 16:47:07 +0200
Subject: [PATCH] Customizable javascript event to bind

One would like to show the datepicker on a specific javascrip event
(lick focus).
This changes add an optional attribute to specify this. The default
event is 'Click'.
---
 README.md                    | 6 +++---
 angularjs-datetime-picker.js | 8 ++++++--
 index.html                   | 8 ++++----
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index 44c799b..c5b52b5 100644
--- a/README.md
+++ b/README.md
@@ -32,11 +32,12 @@ Attributes
   -  date-format: optional, date format e.g. 'yyyy-MM-dd'
   -  year: optional, year selected, e.g. 2015
   -  month: optional, month selected, e.g. 5
-  -  day: optiona, day selected, e.g. 31
+  -  day: optional, day selected, e.g. 31
   -  hour: optional, hour selected, 23
   -  minute: optional, minute selected, 59
   -  date-only: optional, if set, timepicker will be hidden
   -  future-only: optional, if set, forces validation errors on dates earlier than now
+  -  bind-event: optional, if set, the picket will show when that javascript event occurs, default is 'click' event.
 
 Examples
 --------
@@ -45,11 +46,10 @@ Examples
 
     <input ng-model="date1" datetime-picker date-only future-only />
 
-    <input ng-model="date2" datetime-picker date-format="yyyy-MM-dd" date-only />
+    <input ng-model="date2" bind-event="focus" datetime-picker date-format="yyyy-MM-dd" date-only />
 
     <input ng-model="date3" datetime-picker date-format="yyyy-MM-dd HH:mm:ss" />
 
     <input ng-model="date4" datetime-picker hour="23" minute='59'/>
 
     <input ng-model="date5" datetime-picker date-format="yyyy-MM-dd HH:mm:ss" year="2014" month="12" day="31" />
-
diff --git a/angularjs-datetime-picker.js b/angularjs-datetime-picker.js
index e86247d..901f1df 100644
--- a/angularjs-datetime-picker.js
+++ b/angularjs-datetime-picker.js
@@ -295,7 +295,8 @@
         hour: '=',
         minute: '=',
         dateOnly: '=',
-        closeOnSelect: '='
+        closeOnSelect: '=',
+        bindEvent: '='
       },
       link: linkFunc
     };
@@ -322,7 +323,10 @@
           }
         });
 
-        element[0].addEventListener('click', function() {
+        // Checking the bindEvent attr, click event is the default
+        var bEvent = (attrs.bindEvent && attrs.bindEvent != undefined) ? attrs.bindEvent : 'click';
+
+        element[0].addEventListener(bEvent, function() {
           DatetimePicker.open({
             triggerEl: element[0],
             dateFormat: attrs.dateFormat,
diff --git a/index.html b/index.html
index 338c59e..4f46443 100644
--- a/index.html
+++ b/index.html
@@ -21,11 +21,11 @@ <h1>Datetime Picker</h1>
   &lt;input ng-model="date4" datetime-picker date-only /> <br/>
   <input ng-model="date1" datetime-picker date-only size="30" /> <br/> <br/>
 
-  &lt;input ng-model="date2" datetime-picker date-format="yyyy-MM-dd" date-only /> <br/>
-  <input ng-model="date2" datetime-picker date-format="yyyy-MM-dd" size="30"  date-only /> <br/> <br/> <br/>
+  &lt;input ng-model="date2" datetime-picker bind-event="focus" date-format="yyyy-MM-dd" date-only /> <br/>
+  <input ng-model="date2" datetime-picker bind-event="focus" date-format="yyyy-MM-dd" size="30"  date-only /> <br/> <br/> <br/>
 
-  &lt;input ng-model="date3" datetime-picker date-format="yyyy-MM-dd HH:mm:ss" close-on-select="false" /> <br/>
-  <input ng-model="date3" datetime-picker date-format="yyyy-MM-dd HH:mm:ss" close-on-select="false" size="30" /> <br/> <br/>
+  &lt;input ng-model="date3" datetime-picker bind-event="dblclick" date-format="yyyy-MM-dd HH:mm:ss" close-on-select="false" /> <br/>
+  <input ng-model="date3" datetime-picker bind-event="dblclick" date-format="yyyy-MM-dd HH:mm:ss" close-on-select="false" size="30" /> <br/> <br/>
 
   &lt;input ng-model="date4" datetime-picker hour="23" minute='59'/><br/>
   <input ng-model="date4" datetime-picker hour="23" minute='59' size="30" /> <br/> <br/>