Birthday as Facebook registration page (3 drop downs)

birthday.coffee

'use strict';

angular.module('appName')
    .directive 'birthday', () ->
        return {
            restrict: 'E'
            scope:
                date: '='
                yearBegin: '='
                yearEnd: '='
            template: """<div class="birthday">
                            <select ng-model="day" ng-options="d.value for d in days">
                                <option value="">Day</option>
                            </select>
        
                            <select ng-model="month" ng-options="m.value for m in months">
                                <option value="">Month</option>
                            </select>
        
                            <select ng-model="year" ng-options="y.value for y in years">
                                <option value="">Year</option>
                            </select>
                        </div>"""
            replace: true

            link: (scope, element, attrs) ->
                scope.day = null
                scope.days = []
                for i in [1..32]
                    scope.days.push
                        key: i
                        value: i
            
                scope.month = null
                scope.months = []
                months = ["Jan", "Feb", "March", "April",
                          "May", "June", "July", "Aug",
                          "Sept", "Oct", "Nov", "Dec"]
                for mon, i in months
                    scope.months.push
                        key: i + 1
                        value: mon

                scope.year = null
                scope.years = []
                yearBegin = 1905
                if parseInt(scope.yearBegin)
                    yearBegin = scope.yearBegin
                yearEnd = new Date().getFullYear()
                if parseInt(scope.yearEnd)
                    yearEnd = scope.yearEnd
                for year in [yearBegin..yearEnd]
                    scope.years.unshift
                        key: year
                        value: year

                scope.date = ''
                compileBirthday = () ->
                    if scope.day and scope.month and scope.year
                        scope.date = scope.year.key + '-' + scope.month.key + '-' + scope.day.key

                scope.$watch 'day', compileBirthday
                scope.$watch 'month', compileBirthday
                scope.$watch 'year', compileBirthday
        }

usage.html

<script type="text/javascript" src="birthday.js"></script>

<birthday date="user.birthday" year-begin="1988" year-end="2015"></birthday>