Date Picker component

Very basic date picker to test components

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.3.0/handlebars.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/ember.js/1.3.1/ember.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/ember-data.js/1.0.0-beta.6/ember-data.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script>
<script type="text/x-handlebars" data-template-name="components/date-picker">
    <input type="date" class="form-control" {{bind-attr value=value}}/>
</script>

<script type="text/x-handlebars" data-template-name="application">
<div class="container">
  <div class="panel panel-primary">
    <div class="panel-heading">
      <div class="panel-title">
Test Ember stuff !
      </div>
    </div>

    <div class="panel-body">
        {{date-picker date=myDate}}
    </div>
   
    <div class="panel-footer">
        Control : {{myDate}}
    </div>
  </div>
</div>
</script>

CSS

body {
    padding-top: 50px;
}

JavaScript

App = Ember.Application.create();

App.ApplicationController = Em.Controller.extend({
    myDate: null; //moment().toISOString()
});

App.DatePickerComponent = Em.Component.extend({
    attributeBindings: ['value'],
    
    value: function(key, value) {
        
        console.log(key);
        console.log(value);
        
        var date = this.get('date'),
            format = this.get('format') || 'YYYY-MM-DD';
        
        if ( value ) {
            console.log('setting date :', moment(value).toISOString());
            this.set('date', moment(value).toISOString());
            
            return value;
        } else {
            
            alert(date);
            console.log('getting value :', moment(date).format(format));
            return moment(date).format(format);
        }
    }.property('date'),
    
    onValueUpdated: function(){
        
        console.debug('value updated');
    
        var utc = moment.utc(this.get('value'));
        if (utc.isValid()) {
            this.set('date', utc);
        }
        else {
            this.set('date', null);
        }

    }.observes('value')
});