Add support for more options

* multidate
* multidateSeparator

Thanks @jelhan.

Author: soulim

addon/components/datepicker-support.js

@@ -20,6 +20,8 @@ export default Ember.Mixin.create({
         keyboardNavigation: this.get('keyboardNavigation'),
         language: this.get('language'),
         minViewMode: this.get('minViewMode'),
+        multidate: this.get('multidate'),
+        multidateSeparator: this.get('multidateSeparator'),
         orientation: this.get('orientation'),
         startDate: this.get('startDate'),
         startView: this.get('startView'),
@@ -34,7 +36,22 @@ export default Ember.Mixin.create({
       });
 
     if (value) {
-      element.datepicker('update', new Date(value));
+      if (this.get('multidate')) {
+        // split datesIsoString by multidate separator
+        var multidateSeparator = this.get('multidateSeparator') || ',';
+        var dateIsoStrings = value.split( multidateSeparator );
+        // generate array of date objecs
+        var dateObjects = dateIsoStrings.map( function(dateIsoString) {
+          return new Date(dateIsoString);
+        });
+        // set datepickers internal date
+        element.datepicker('setDates', dateObjects);
+        // update datepicker view
+        element.datepicker('update');
+      }
+      else {
+        element.datepicker('update', new Date(value));
+      }
     }
   }.on('didInsertElement'),
 
@@ -46,7 +63,15 @@ export default Ember.Mixin.create({
     var isoDate = null;
 
     if (event.date) {
-      isoDate = this.$().datepicker('getUTCDate').toISOString();
+      if (this.get('multidate')) {
+         // set value to array if multidate
+         isoDate = this.$().datepicker('getUTCDates').map(function(date) {
+           return date.toISOString();
+         });
+      }
+      else {
+         isoDate = this.$().datepicker('getUTCDate').toISOString();
+      }
     }
 
     this.set('value', isoDate);

tests/dummy/app/templates/index.hbs

@@ -248,6 +248,46 @@ ember generate bootstrap-datepicker</pre>
     </div>
   </div>
 
+  <h3>multidate</h3>
+  <div class="panel panel-default">
+    <div class="panel-heading">
+      <pre><code>&#123;&#123;bootstrap-datepicker multidate=true placeholder="Click to play" class="form-control"&#125;&#125;</code></pre>
+    </div>
+    <div class="panel-body">
+      <p>
+        Type: <code>Boolean</code> or <code>Number</code><br>
+        Default: <code>false</code></code>
+      </p>
+      <p>If multidate is <code>true</code>, <code>value</code> is an array.</p>
+      <p>Please, read more about possible values <a href="http://bootstrap-datepicker.readthedocs.org/en/release/options.html#multidate">here</a>.</p>
+    </div>
+    <div class="panel-footer">
+      {{bootstrap-datepicker multidate=true
+                             placeholder="Click to play"
+                             class="form-control"}}
+    </div>
+  </div>
+
+  <h3>multidateSeparator</h3>
+  <div class="panel panel-default">
+    <div class="panel-heading">
+      <pre><code>&#123;&#123;bootstrap-datepicker multidate=true multidateSeparator=";" placeholder="Click to play" class="form-control"&#125;&#125;</code></pre>
+    </div>
+    <div class="panel-body">
+      <p>
+        Type: <code>String</code><br>
+        Default: <code>,</code></code>
+      </p>
+      <p>Please, read more about possible values <a href="https://bootstrap-datepicker.readthedocs.org/en/release/options.html#multidateseparator">here</a>.</p>
+    </div>
+    <div class="panel-footer">
+      {{bootstrap-datepicker multidate=true
+                             multidateSeparator=";"
+                             placeholder="Click to play"
+                             class="form-control"}}
+    </div>
+  </div>
+
   <h3>orientation</h3>
   <div class="panel panel-default">
     <div class="panel-heading">

tests/unit/components/bootstrap-datepicker-test.js

@@ -40,3 +40,28 @@ test('should display date with custom format when format is set', function(){
 
   equal(this.$().val(), '31.Dec.14');
 });
+
+test('should set dates provided by value (multidate, default multidateSeparator)', function(){
+  expect(2);
+  
+  var component = this.subject({
+    value: '2015-01-13T00:00:00.000Z,2015-01-07T00:00:00.000Z,2015-01-15T00:00:00.000Z',
+    multidate: true
+  });
+
+  equal(this.$().val(), '01/13/2015,01/07/2015,01/15/2015', 'should set value as input field value');
+  equal(this.$().datepicker('getDates').length, 3, 'should set internal datepicker dates by value');
+});
+
+test('should set dates provided by value (multidate, multidateSeparator provided)', function(){
+  expect(2);
+
+  var component = this.subject({
+    value: '2015-01-13T00:00:00.000Z;2015-01-07T00:00:00.000Z;2015-01-15T00:00:00.000Z',
+    multidate: true,
+    multidateSeparator: ';'
+  });
+
+  equal(this.$().val(), '01/13/2015;01/07/2015;01/15/2015', 'should set value as input field value using multidate separator');
+  equal(this.$().datepicker('getDates').length, 3, 'should set internal datepicker dates by value');
+});