From 738f65ee58eada087ee9d9303e9fb8341c9e6d53 Mon Sep 17 00:00:00 2001
From: YannLeComte <yann.le-comte@laposte.net>
Date: Fri, 15 Jun 2018 15:14:55 +0200
Subject: [PATCH 1/5] Feature/ Don't reset the range to set a new one (Google
 flights way)

---
 src/md-date-range-picker.js | 28 +++++++++++++++++++++++++---
 1 file changed, 25 insertions(+), 3 deletions(-)

diff --git a/src/md-date-range-picker.js b/src/md-date-range-picker.js
index 2069f6f..2a86d9f 100644
--- a/src/md-date-range-picker.js
+++ b/src/md-date-range-picker.js
@@ -434,9 +434,31 @@
                 }
             } else {
                 if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
-                    $scope.dateStart = date;
-                    $scope.dateEnd = date;
-                    changed = true;
+                    if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
+
+                        if (moment(date).isBefore(moment($scope.dateStart), 'day')) {
+                            $scope.dateStart = date;
+                            startModified = true;
+
+                        } else if (moment(date).isAfter(moment($scope.dateEnd), 'day')) {
+                            $scope.dateEnd = date;
+                            startModified = false;
+
+                        } else if (moment(date).isBefore(moment($scope.dateEnd), 'day') && moment(date).isAfter(moment($scope.dateStart), 'day')) {
+                            if (!startModified) {
+                                $scope.dateStart = date;
+                                startModified = true;
+                            } else {
+                                $scope.dateEnd = date;
+                                startModified = false;
+                            }
+                        } else if (moment(date).isSame(moment($scope.dateEnd), 'day') || moment(date).isSame(moment($scope.dateStart), 'day')) {
+                            $scope.dateStart = date;
+                            $scope.dateEnd = date;
+                        }
+
+                        changed = true;
+                    }
                 }
             }
             if (changed) {

From adf2a0310450ffe733dc43d15ec16d126e504830 Mon Sep 17 00:00:00 2001
From: YannLeComte <yann.le-comte@laposte.net>
Date: Fri, 15 Jun 2018 16:14:15 +0200
Subject: [PATCH 2/5] cleanup

---
 src/md-date-range-picker.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/md-date-range-picker.js b/src/md-date-range-picker.js
index 2a86d9f..1e822af 100644
--- a/src/md-date-range-picker.js
+++ b/src/md-date-range-picker.js
@@ -407,6 +407,8 @@
             return ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange);
         }
 
+        var startModified = true;
+
         function handleClickDate($event, date) {
             var changed = false;
             var shouldConfirm = false;

From d67ec068e19c35bc677d1612e3b1547c0624eaee Mon Sep 17 00:00:00 2001
From: YannLeComte <yann.le-comte@laposte.net>
Date: Fri, 15 Jun 2018 16:20:00 +0200
Subject: [PATCH 3/5] Dist update

---
 dist/md-date-range-picker.js | 66 ++++++++++++++++++++++++------------
 1 file changed, 45 insertions(+), 21 deletions(-)

diff --git a/dist/md-date-range-picker.js b/dist/md-date-range-picker.js
index 441f75a..064f1ae 100644
--- a/dist/md-date-range-picker.js
+++ b/dist/md-date-range-picker.js
@@ -1,7 +1,7 @@
 /*
 * Name: md-date-range-picker
-* Version: 0.8.3
-* Build Date: 2018-5-8
+* Version: ${version}
+* Build Date: ${builddate}
 * Author: roel barreto <greatcodeideas@gmail.com>
 */
 (function (window, angular) {
@@ -35,7 +35,7 @@
                 isDisabledDate: '&?',
                 format: '=?',
             },
-            template: '<div class="md-date-range-picker md-whiteframe-1dp" ng-class="{\'md-date-range-picker__one-panel\':onePanel}"><div layout="column"><div layout="row" layout-margin><div class="md-date-range-picker__calendar-wrapper"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeMonth" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeYear" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center" class="hide-gt-sm show-sm show-xs"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="!onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" ng-disabled="true" aria-hidden="true" class="md-icon-button md-button"><md-icon></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date),\'md-date-range-picker__calendar__start\':isSelectedStartDate(date),\'md-date-range-picker__calendar__end\':isSelectedEndDate(date),\'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date),\'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date})}" event-key="date1" event-param="{{$index}}"><span event-key="date1" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div><div ng-show="!onePanel" class="md-date-range-picker__calendar-wrapper hide-sm hide-xs show-gt-sm"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center" style="visibility: hidden"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeMonth2" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeYear2" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0" ng-if="!onePanel"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates2" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date), \'md-date-range-picker__calendar__start\':isSelectedStartDate(date), \'md-date-range-picker__calendar__end\':isSelectedEndDate(date), \'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date, true), \'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date}) }" event-key="date2" event-param="{{$index}}"><span event-key="date2" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div></div><div class="md-date-range-picker__templates" ng-if="showTemplate"><div ng-if="!onePanel && !maxRange" class="hide-xs hide-sm show-gt-sm" layout="row" layout-align="center center" layout-wrap><div ng-repeat="(tmpltKey,tmpltName) in selectionTemplate" class="md-button" aria-label="{{::tmpltName}}" ng-class="selectedTemplate === tmpltKey ? \'md-primary md-raised\' : \'\'" event-key="{{tmpltKey}}" ng-bind="::tmpltName" flex="20"></div><div ng-repeat="tmplt in customTemplates" class="md-button" aria-label="{{::tmplt.name}}" ng-class="selectedTemplate === tmplt.name ? \'md-primary md-raised\' : \'\'" ng-click="selectCustomRange(tmplt.name,tmplt)" event-key="Custom Template" ng-bind="::tmplt.name" flex="20"></div></div><div ng-if="!maxRange" ng-class="{\'hide-gt-sm\':!onePanel}" layout="column" layout-padding><md-input-container><label>{{::getLocalizationVal(\'Date Range Template\')}}</label><md-select md-container-class="md-date-range-picker__select" class="md-block" placeholder="{{::getLocalizationVal(\'Custom Date Range\')}}" ng-model="selectedTemplate"><md-option value=""></md-option><md-option ng-repeat="(tmpltKey,tmpltName) in selectionTemplate track by tmpltKey" aria-label="{{::tmpltName}}" ng-click="actionByKey(tmpltKey,null)" ng-bind="::tmpltName" value="{{tmpltKey}}"></md-option><md-option ng-repeat="tmplt in customTemplates" aria-label="{{::tmplt.name}}" ng-click="selectCustomRange(tmplt.name,tmplt)" ng-bind="::tmplt.name" value="{{::tmplt.name}}"></md-option></md-select></md-input-container></div></div></div></div>',
+            templateUrl: './md-date-range-picker.html',
             controller: 'mdDateRangePickerCtrl',
             link: function (scope, element, attributes, ctrl) {
                 scope.actionByKey = function (eventKey, eventParam, e) {
@@ -113,7 +113,7 @@
                 element.on('click', function (e) {
                     var eventKey = e.target.getAttribute('event-key'),
                         eventParam = e.target.getAttribute('event-param');
-                        scope.actionByKey(eventKey, eventParam, e);
+                    scope.actionByKey(eventKey, eventParam, e);
                 });
 
                 scope.triggerChange = function triggerChange(e) {
@@ -141,7 +141,7 @@
                 'LY': getLocalizationVal('Last Year')
             }, START_OF_WEEK = 1
         SELECTION_TEMPLATES_CUSTOM = {}
-            ;
+        ;
         $scope.isMenuContainer = false;
         $scope.days = [];
         $scope.label = 'Date range picker';
@@ -196,9 +196,9 @@
             var mctr = 0;
             var currTmpl;
 
-            /** 
-             * add custom template to local custom template array 
-            */
+            /**
+             * add custom template to local custom template array
+             */
             if ($scope.customTemplates != null) {
                 for (var i = 0; i < $scope.customTemplates.length; i++) {
                     currTmpl = $scope.customTemplates[i];
@@ -264,13 +264,13 @@
             var w = new Date(2017, 0, 1);
             $scope.days = [];
             for (mctr = 0; mctr < 7; mctr++) {
-                //add $scope.firstDayOfWeek to set the first Day of week e.g. -1 = Sunday, 0 = Monday 
+                //add $scope.firstDayOfWeek to set the first Day of week e.g. -1 = Sunday, 0 = Monday
                 w.setDate(mctr + 1 + getFirstDayOfWeek());
                 $scope.days.push({ id: mctr, name: getLocalizationVal($filter('date')(w, 'EEE')) });
             }
             /**
              * Generate Month Names, Might depend on localization
-            */
+             */
             var m = null;
             $scope.months = [];
             for (mctr = 0; mctr < 12; mctr++) {
@@ -279,7 +279,7 @@
             }
             /**
              * Generate Year Selection
-            */
+             */
             var y = $scope.activeYear, yctr = 0;
             $scope.years = [];
             for (yctr = y - 10; yctr < y + 10; yctr++) {
@@ -287,11 +287,11 @@
             }
 
             /**
-             * get the templates to use 
-            */
+             * get the templates to use
+             */
             for (var tmplKey in SELECTION_TEMPLATES) {
                 if (SELECTION_TEMPLATES.hasOwnProperty(tmplKey)) {
-                    //check if we have disable templates property 
+                    //check if we have disable templates property
                     if ($scope.disableTemplates != null && $scope.disableTemplates != '') {
                         //if key is not exist in disableTemplates property add it
                         if ($scope.disableTemplates.indexOf(tmplKey) < 0) {
@@ -407,6 +407,8 @@
             return ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange);
         }
 
+        var startModified = true;
+
         function handleClickDate($event, date) {
             var changed = false;
             var shouldConfirm = false;
@@ -434,9 +436,31 @@
                 }
             } else {
                 if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
-                    $scope.dateStart = date;
-                    $scope.dateEnd = date;
-                    changed = true;
+                    if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
+
+                        if (moment(date).isBefore(moment($scope.dateStart), 'day')) {
+                            $scope.dateStart = date;
+                            startModified = true;
+
+                        } else if (moment(date).isAfter(moment($scope.dateEnd), 'day')) {
+                            $scope.dateEnd = date;
+                            startModified = false;
+
+                        } else if (moment(date).isBefore(moment($scope.dateEnd), 'day') && moment(date).isAfter(moment($scope.dateStart), 'day')) {
+                            if (!startModified) {
+                                $scope.dateStart = date;
+                                startModified = true;
+                            } else {
+                                $scope.dateEnd = date;
+                                startModified = false;
+                            }
+                        } else if (moment(date).isSame(moment($scope.dateEnd), 'day') || moment(date).isSame(moment($scope.dateStart), 'day')) {
+                            $scope.dateStart = date;
+                            $scope.dateEnd = date;
+                        }
+
+                        changed = true;
+                    }
                 }
             }
             if (changed) {
@@ -598,7 +622,7 @@
                     return $filter('date')(
                         $scope.dateStart,
                         'dd' + ($scope.dateStart.getMonth() !== $scope.dateEnd.getMonth() || $scope.dateStart.getFullYear() !== $scope.dateEnd.getFullYear() ? ' MMM' : '') + ($scope.dateStart.getFullYear() !== $scope.dateEnd.getFullYear() ? ' yyyy' : '')
-                    ) + ' - ' +
+                        ) + ' - ' +
                         $filter('date')(
                             $scope.dateEnd,
                             'dd MMM yyyy'
@@ -704,9 +728,9 @@
 
         /**
          * @description returns all seleced date based on mmodel, filters and max range
-         * @param {*} model 
-         * @param {*} isDisabledDateCallback 
-         * @param {*} maxRange 
+         * @param {*} model
+         * @param {*} isDisabledDateCallback
+         * @param {*} maxRange
          */
         function getSelectedDate(dateStart, dateEnd, isDisabledDateCallback, maxRange) {
             var dates = [];

From c1c7eff1208a7e7aa58511c92a14217ea00c3054 Mon Sep 17 00:00:00 2001
From: YannLeComte <yann.le-comte@laposte.net>
Date: Fri, 15 Jun 2018 16:21:19 +0200
Subject: [PATCH 4/5] Delete dist

---
 dist/md-date-range-picker.css     | 138 -----
 dist/md-date-range-picker.js      | 845 ------------------------------
 dist/md-date-range-picker.min.css |   1 -
 dist/md-date-range-picker.min.js  |   1 -
 4 files changed, 985 deletions(-)
 delete mode 100644 dist/md-date-range-picker.css
 delete mode 100644 dist/md-date-range-picker.js
 delete mode 100644 dist/md-date-range-picker.min.css
 delete mode 100644 dist/md-date-range-picker.min.js

diff --git a/dist/md-date-range-picker.css b/dist/md-date-range-picker.css
deleted file mode 100644
index 99ae753..0000000
--- a/dist/md-date-range-picker.css
+++ /dev/null
@@ -1,138 +0,0 @@
-/*
-* Name: md-date-range-picker
-* Version: 0.8.3
-* Build Date: 2018-5-8
-* Author: roel barreto <greatcodeideas@gmail.com>
-*/
-md-date-range {
-    cursor: pointer;
-}
-md-date-range-picker {
-    display: block;
-    max-width: 664px;
-}
-md-date-range-picker .md-date-range-picker__one-panel {
-    display: block;
-    max-width: 340px;
-}
-.md-date-range-picker [event-key] *{
-    pointer-events: none;
-}
-.md-date-range-picker {
-    position: relative;
-    background: #FFF;
-}
-
-.md-date-range-picker__title {
-    text-align: center;
-    font-size: 1rem;
-    background: rgb(16, 108, 200);
-    color: #FFF;
-    margin: 0;
-    padding: 16px 0;
-}
-
-.md-date-range-picker__month-year {
-    text-align: center;
-    font-size: 1rem;
-    background: #eee;
-    margin: 0;
-    padding: 0 0;
-}
-
-.md-date-range-picker__month-year .md-select-icon {
-    display: none;
-}
-
-.md-date-range-picker__month-year md-select {
-    margin: 10px 0;
-}
-
-.md-date-range-picker__templates {
-    background: #EEE;
-}
-
-.md-date-range-picker__calendar-wrapper {
-    padding: 0 0;
-    width: 308px;
-    min-width: 308px;
-}
-
-.md-date-range-picker__week {
-    background: #e0e0e0;
-}
-
-.md-date-range-picker__calendar__grid {
-    font-size: 13px;
-    color: #222;
-    padding: 0;
-    display: inline-block;
-    width: 44px;
-    height: 44px;
-    line-height: 44px;
-    text-align: center;
-    position: relative;
-    outline: none;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    border-radius: 50%;
-    background: rgba(2550, 255, 255, 0);
-}
-
-.md-date-range-picker__calendar .md-date-range-picker__calendar__grid {
-    cursor: pointer;
-}
-
-.md-date-range-picker__calendar__not-in-active-month {
-    color: rgba(0,0,0,0.5);
-}
-
-.md-date-range-picker__calendar 
-.md-date-range-picker__calendar__grid:hover:not(.md-date-range-picker__calendar__selected):not(.md-date-range-picker__calendar__disabled) {
-    transition: background 300ms ease-out;
-    background: rgba(0, 0, 0, 0.1);
-}
-
-.md-date-range-picker__calendar__selected {
-    background: rgb(16, 108, 200);
-    color: #FFF;
-    border-radius: 0;
-}
-.md-date-range-picker__calendar__selected.md-date-range-picker__calendar__disabled {
-    background: rgba(0, 0, 0, 0.2);
-}
-.md-date-range-picker__calendar__not-in-active-month.md-date-range-picker__calendar__selected {
-    color: rgba(255,255,255,0.2);
-}
-
-.md-date-range-picker__calendar__today {
-    font-weight: bold;
-}
-
-.md-date-range-picker__calendar 
-.md-date-range-picker__calendar__grid.md-date-range-picker__calendar__disabled {
-    opacity: 0.3;
-    cursor: not-allowed;
-}
-
-.md-date-range-picker__calendar__start {
-    border-top-left-radius: 50%;
-    border-bottom-left-radius: 50%;
-}
-
-.md-date-range-picker__calendar__end {
-    border-top-right-radius: 50%;
-    border-bottom-right-radius: 50%;
-}
-
-.md-date-range-picker__select {
-    z-index: 100;
-}
-
-.md-date-range-picker__calendar__selection {
-    pointer-events: none;
-}
\ No newline at end of file
diff --git a/dist/md-date-range-picker.js b/dist/md-date-range-picker.js
deleted file mode 100644
index 064f1ae..0000000
--- a/dist/md-date-range-picker.js
+++ /dev/null
@@ -1,845 +0,0 @@
-/*
-* Name: md-date-range-picker
-* Version: ${version}
-* Build Date: ${builddate}
-* Author: roel barreto <greatcodeideas@gmail.com>
-*/
-(function (window, angular) {
-
-    angular
-        .module('ngMaterialDateRangePicker', ['ngMaterial'])
-        .directive('mdDateRangePicker', mdDateRangePickerDirective)
-        .directive('mdDateRange', mdDateRangeDirective)
-        .controller('mdDateRangePickerCtrl', mdDateRangePickerCtrl)
-        .service('$mdDateRangePicker', mdDateRangePickerService);
-
-    /**
-     * scope here is non-bi-directional
-     */
-    mdDateRangePickerDirective.$inject = ['$mdDateRangePicker'];
-    function mdDateRangePickerDirective($mdDateRangePicker) {
-        var directive = {
-            scope: {
-                selectedTemplate: '=',
-                selectedTemplateName: '=',
-                dateStart: '=?',
-                dateEnd: '=?',
-                firstDayOfWeek: '=?',
-                showTemplate: '=?',
-                mdOnSelect: '&',
-                localizationMap: '=?',
-                customTemplates: '=?',
-                disableTemplates: '@',
-                maxRange: '=?',
-                onePanel: '=?',
-                isDisabledDate: '&?',
-                format: '=?',
-            },
-            templateUrl: './md-date-range-picker.html',
-            controller: 'mdDateRangePickerCtrl',
-            link: function (scope, element, attributes, ctrl) {
-                scope.actionByKey = function (eventKey, eventParam, e) {
-                    switch (eventKey) {
-                        case 'prev':
-                            scope.handleClickPrevMonth(e);
-                            scope.runIfNotInDigest();
-                            break;
-                        case 'next':
-                            scope.handleClickNextMonth(e);
-                            scope.runIfNotInDigest();
-                            break;
-                        case 'date1':
-                            if (scope.handleClickDate(e, scope.dates[eventParam])) {
-                                scope.runIfNotInDigest(scope.triggerChange);
-                            } else {
-                                scope.runIfNotInDigest();
-                            }
-                            break;
-                        case 'date2':
-                            if (scope.handleClickDate(e, scope.dates2[eventParam])) {
-                                scope.runIfNotInDigest(scope.triggerChange);
-                            } else {
-                                scope.runIfNotInDigest();
-                            }
-                            break;
-                        case 'TD':
-                            scope.handleClickSelectToday();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'YD':
-                            scope.handleClickSelectYesterday();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'TW':
-                            scope.handleClickSelectThisWeek();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'LW':
-                            scope.handleClickSelectLastWeek();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'TM':
-                            scope.handleClickSelectThisMonth();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'LM':
-                            scope.handleClickSelectLastMonth();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'TY':
-                            scope.handleClickSelectThisYear();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'LY':
-                            scope.handleClickSelectLastYear();
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        case 'Custom Template':
-                            scope.runIfNotInDigest(scope.triggerChange);
-                            break;
-                        default:
-                            break;
-                    }
-                }
-
-                scope.runIfNotInDigest = function (operation) {
-                    if (scope.$root != null && !scope.$root.$$phase) { // check if digest already in progress
-                        scope.$apply(); // launch digest;
-                        if (operation && typeof operation === 'function') {
-                            operation();
-                        }
-                    }
-                };
-                element.on('click', function (e) {
-                    var eventKey = e.target.getAttribute('event-key'),
-                        eventParam = e.target.getAttribute('event-param');
-                    scope.actionByKey(eventKey, eventParam, e);
-                });
-
-                scope.triggerChange = function triggerChange(e) {
-                    var $dates = $mdDateRangePicker.getSelectedDate(scope.dateStart, scope.dateEnd, scope.isDisabledDate, scope.maxRange); // All selected enabled dates
-                    if (scope.mdOnSelect) {
-                        scope.mdOnSelect({ $dates: $dates });
-                    }
-                };
-            }
-        };
-        return directive
-    }
-
-    mdDateRangePickerCtrl.$inject = ['$scope', '$filter'];
-    function mdDateRangePickerCtrl($scope, $filter) {
-        var ctrl = $scope, NUMBER_OF_MONTH_TO_DISPLAY = 2,
-            SELECTION_TEMPLATES = {
-                'TD': getLocalizationVal('Today'),
-                'YD': getLocalizationVal('Yesterday'),
-                'TW': getLocalizationVal('This Week'),
-                'LW': getLocalizationVal('Last Week'),
-                'TM': getLocalizationVal('This Month'),
-                'LM': getLocalizationVal('Last Month'),
-                'TY': getLocalizationVal('This Year'),
-                'LY': getLocalizationVal('Last Year')
-            }, START_OF_WEEK = 1
-        SELECTION_TEMPLATES_CUSTOM = {}
-        ;
-        $scope.isMenuContainer = false;
-        $scope.days = [];
-        $scope.label = 'Date range picker';
-        $scope.dates = [];
-        $scope.dates2 = [];
-        $scope.numberOfMonthToDisplay = 2;
-        $scope.today = new Date();
-        $scope.dateStart && $scope.dateStart.setHours(0, 0, 0, 0);
-        $scope.dateEnd && $scope.dateEnd.setHours(23, 59, 59, 999);
-        $scope.firstDayOfMonth = $scope.dateStart ? new Date($scope.dateStart.getFullYear(), $scope.dateStart.getMonth(), 1) : Date($scope.today.getFullYear(), $scope.today.getMonth(), 1);
-        $scope.lastDayOfMonth = $scope.dateStart ? new Date($scope.dateStart.getFullYear(), $scope.dateStart.getMonth() + 1, 0) : Date($scope.today.getFullYear(), $scope.today.getMonth() + 1, 0);
-        $scope.activeDate = $scope.dateStart || $scope.today;
-        $scope.activeDate2 = new Date($scope.activeDate.getFullYear(), $scope.activeDate.getMonth() + 1, 1);
-        $scope.activeMonth = $scope.activeDate.getMonth();
-        $scope.activeYear = $scope.activeDate.getFullYear();
-        $scope.activeMonth2 = $scope.activeDate2.getMonth();
-        $scope.activeYear2 = $scope.activeDate2.getFullYear();
-        $scope.months = [];
-        $scope.years = [];
-
-        $scope.inCurrentMonth = inCurrentMonth;
-        $scope.isToday = isToday;
-        $scope.handleClickDate = handleClickDate;
-        $scope.inSelectedDateRange = inSelectedDateRange;
-        $scope.isSelectedStartDate = isSelectedStartDate;
-        $scope.isSelectedEndDate = isSelectedEndDate;
-
-        $scope.updateActiveDate = updateActiveDate;
-        $scope.selectedDateText = selectedDateText;
-        $scope.focusToDate = focusToDate;
-
-        $scope.handleClickNextMonth = handleClickNextMonth;
-        $scope.handleClickPrevMonth = handleClickPrevMonth;
-
-        $scope.handleClickSelectToday = handleClickSelectToday;
-        $scope.handleClickSelectYesterday = handleClickSelectYesterday;
-        $scope.handleClickSelectThisWeek = handleClickSelectThisWeek;
-        $scope.handleClickSelectLastWeek = handleClickSelectLastWeek;
-        $scope.handleClickSelectThisMonth = handleClickSelectThisMonth;
-        $scope.handleClickSelectLastMonth = handleClickSelectLastMonth;
-        $scope.handleClickSelectThisYear = handleClickSelectThisYear;
-        $scope.handleClickSelectLastYear = handleClickSelectLastYear;
-
-        $scope.getLocalizationVal = getLocalizationVal;
-        $scope.selectCustomRange = selectCustomRange;
-        $scope.isInMaxRange = isInMaxRange;
-        $scope.selectionTemplate = {};
-
-        init();
-
-        function init() {
-            var mctr = 0;
-            var currTmpl;
-
-            /**
-             * add custom template to local custom template array
-             */
-            if ($scope.customTemplates != null) {
-                for (var i = 0; i < $scope.customTemplates.length; i++) {
-                    currTmpl = $scope.customTemplates[i];
-                    SELECTION_TEMPLATES_CUSTOM[currTmpl.name] = currTmpl;
-                }
-            }
-            if ($scope.selectedTemplate) {
-                switch ($scope.selectedTemplate) {
-                    case 'TD':
-                        $scope.handleClickSelectToday();
-                        break;
-                    case 'YD':
-                        $scope.handleClickSelectYesterday();
-                        break;
-                    case 'TW':
-                        $scope.handleClickSelectThisWeek();
-                        break;
-                    case 'LW':
-                        $scope.handleClickSelectLastWeek();
-                        break;
-                    case 'TM':
-                        $scope.handleClickSelectThisMonth();
-                        break;
-                    case 'LM':
-                        $scope.handleClickSelectLastMonth();
-                        break;
-                    case 'TY':
-                        $scope.handleClickSelectThisYear();
-                        break;
-                    case 'LY':
-                        $scope.handleClickSelectLastYear();
-                        break;
-                    default:
-                        if (SELECTION_TEMPLATES_CUSTOM && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate] && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateStart && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateEnd) {
-                            $scope.dateStart = SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateStart;
-                            $scope.dateEnd = SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateEnd;
-                        }
-                        $scope.selectedTemplateName = $scope.selectedDateText();
-                        break;
-                }
-                $scope.updateActiveDate();
-            } else {
-                $scope.selectedTemplate = '';
-                $scope.selectedTemplateName = $scope.selectedDateText();
-                $scope.updateActiveDate();
-            }
-
-            $scope.$watch('selectedTemplate', function (next, prev) {
-                if (next !== prev && $scope.dateStart && !$scope.inCurrentMonth($scope.dateStart) && !$scope.inCurrentMonth($scope.dateStart, true)) {
-                    $scope.focusToDate($scope.dateStart);
-                }
-            });
-            $scope.$watch('dateStart', function (next, prev) {
-                if (next !== prev && $scope.dateStart && !$scope.inCurrentMonth($scope.dateStart) && !$scope.inCurrentMonth($scope.dateStart, true)) {
-                    $scope.focusToDate($scope.dateStart);
-                }
-            });
-
-            /**
-             * Generate Days of Week Names
-             * Fact: January 1st of 2017 is Sunday
-             */
-            var w = new Date(2017, 0, 1);
-            $scope.days = [];
-            for (mctr = 0; mctr < 7; mctr++) {
-                //add $scope.firstDayOfWeek to set the first Day of week e.g. -1 = Sunday, 0 = Monday
-                w.setDate(mctr + 1 + getFirstDayOfWeek());
-                $scope.days.push({ id: mctr, name: getLocalizationVal($filter('date')(w, 'EEE')) });
-            }
-            /**
-             * Generate Month Names, Might depend on localization
-             */
-            var m = null;
-            $scope.months = [];
-            for (mctr = 0; mctr < 12; mctr++) {
-                m = new Date(2017, mctr, 1);
-                $scope.months.push({ id: mctr, name: getLocalizationVal($filter('date')(m, 'MMMM')) });
-            }
-            /**
-             * Generate Year Selection
-             */
-            var y = $scope.activeYear, yctr = 0;
-            $scope.years = [];
-            for (yctr = y - 10; yctr < y + 10; yctr++) {
-                $scope.years.push({ id: yctr, name: getLocalizationVal(yctr) })
-            }
-
-            /**
-             * get the templates to use
-             */
-            for (var tmplKey in SELECTION_TEMPLATES) {
-                if (SELECTION_TEMPLATES.hasOwnProperty(tmplKey)) {
-                    //check if we have disable templates property
-                    if ($scope.disableTemplates != null && $scope.disableTemplates != '') {
-                        //if key is not exist in disableTemplates property add it
-                        if ($scope.disableTemplates.indexOf(tmplKey) < 0) {
-                            $scope.selectionTemplate[tmplKey] = SELECTION_TEMPLATES[tmplKey];
-                        }
-                    } else {
-                        $scope.selectionTemplate[tmplKey] = SELECTION_TEMPLATES[tmplKey];
-                    }
-
-                }
-            }
-
-
-        }
-
-        function selectCustomRange(tmpltKey, tmpltObj) {
-            $scope.dateStart = tmpltObj.dateStart;
-            $scope.dateEnd = tmpltObj.dateEnd;
-            $scope.selectedTemplate = tmpltKey;
-            $scope.selectedTemplateName = $scope.selectedDateText();
-        }
-        function getLocalizationVal(val) {
-            var ret = null;
-            if ($scope.localizationMap != null && $scope.localizationMap[val] != null) {
-                ret = $scope.localizationMap[val];
-            } else {
-                ret = val;
-            }
-            return ret;
-        }
-
-        function getFirstDayOfWeek() {
-            if ([undefined, null, '', NaN].indexOf($scope.firstDayOfWeek) !== -1) {
-                return START_OF_WEEK;
-            }
-            return $scope.firstDayOfWeek;
-        }
-        /**
-         * Fill the Calendar Dates
-         */
-        function fillDateGrid(currentDate) {
-
-            var dates = [],
-                monthStartDate = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1),
-                monthEndDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0),
-                firstDay = getFirstDayOfWeek(),
-                ctr, day;
-
-            for (ctr = 1; ctr <= monthEndDate.getDate(); ctr++) {
-                dates.push(new Date(currentDate.getFullYear(), currentDate.getMonth(), ctr));
-            }
-
-            day = dates[0].getDay();
-            ctr = 0;
-            while (day !== firstDay) {
-                dates.unshift(new Date(currentDate.getFullYear(), currentDate.getMonth(), ctr));
-                day = day <= 0 ? 6 : day - 1;
-                ctr--;
-            }
-
-            day = (dates[dates.length - 1].getDay() + 1) % 7;
-            ctr = 1;
-            while (day !== firstDay) {
-                dates.push(new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, ctr));
-                day = (day + 1) % 7;
-                ctr++
-            }
-            return dates;
-        }
-
-        /**
-         * Diff 2 Dates by Day Differences
-         * date1 < date2 return positive integer
-         * date1 = date2 return 0
-         * date1 > date2 return negative integer
-         */
-        function getDateDiff(date1, date2) {
-            if (!date1 || !date2) return;
-            var _d1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate()),
-                _d2 = new Date(date2.getFullYear(), date2.getMonth(), date2.getDate());
-            return _d2 - _d1;
-        }
-
-        /**
-         * return Day Name in a week
-         */
-        function getDayName(day) {
-            var weekday = new Array(7), div = getFirstDayOfWeek();
-            weekday[0] = "Sun";
-            weekday[1] = "Mon";
-            weekday[2] = "Tue";
-            weekday[3] = "Wed";
-            weekday[4] = "Thu";
-            weekday[5] = "Fri";
-            weekday[6] = "Sat";
-            return weekday[day + div % 7];
-        }
-
-        /**
-         * Events
-         */
-
-        function inCurrentMonth(date, isSecondMonth) {
-            return !isSecondMonth ?
-                date.getMonth() === $scope.activeMonth && date.getFullYear() === $scope.activeYear :
-                date.getMonth() === $scope.activeMonth2 && date.getFullYear() === $scope.activeYear2;
-        }
-
-        function isInMaxRange(date) {
-            if (!$scope.dateStart) return true;
-            if (getDateDiff($scope.dateStart, $scope.dateEnd) !== 0) return true;
-            var diff = getDateDiff($scope.dateStart, date);
-            return ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange);
-        }
-
-        var startModified = true;
-
-        function handleClickDate($event, date) {
-            var changed = false;
-            var shouldConfirm = false;
-            if (getDateDiff($scope.dateStart, $scope.dateEnd) === 0) {
-                if (getDateDiff($scope.dateStart, date) === 0) {
-                    shouldConfirm = true;
-                    changed = true;
-                } else if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
-                    var diff = getDateDiff($scope.dateStart, date);
-                    if (diff > 0) {
-                        // Check if maxRange
-                        if ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange) {
-                            $scope.dateEnd = date;
-                            shouldConfirm = true;
-                            changed = true;
-                        }
-                    } else {
-                        // Check if maxRange
-                        if ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange) {
-                            $scope.dateStart = date;
-                            shouldConfirm = true;
-                            changed = true;
-                        }
-                    }
-                }
-            } else {
-                if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
-                    if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
-
-                        if (moment(date).isBefore(moment($scope.dateStart), 'day')) {
-                            $scope.dateStart = date;
-                            startModified = true;
-
-                        } else if (moment(date).isAfter(moment($scope.dateEnd), 'day')) {
-                            $scope.dateEnd = date;
-                            startModified = false;
-
-                        } else if (moment(date).isBefore(moment($scope.dateEnd), 'day') && moment(date).isAfter(moment($scope.dateStart), 'day')) {
-                            if (!startModified) {
-                                $scope.dateStart = date;
-                                startModified = true;
-                            } else {
-                                $scope.dateEnd = date;
-                                startModified = false;
-                            }
-                        } else if (moment(date).isSame(moment($scope.dateEnd), 'day') || moment(date).isSame(moment($scope.dateStart), 'day')) {
-                            $scope.dateStart = date;
-                            $scope.dateEnd = date;
-                        }
-
-                        changed = true;
-                    }
-                }
-            }
-            if (changed) {
-                $scope.selectedTemplate = false;
-                $scope.selectedTemplateName = $scope.selectedDateText();
-            }
-            return shouldConfirm;
-        }
-
-        function inSelectedDateRange(date) {
-            return $scope.dateStart && $scope.dateEnd
-                ? getDateDiff($scope.dateStart, date) >= 0 && 0 <= getDateDiff(date, $scope.dateEnd)
-                : false;
-        }
-
-        function updateActiveDate(isSecondMonth) {
-            var d = new Date($scope.activeYear, $scope.activeMonth, 1),
-                d2 = new Date($scope.activeYear2, $scope.activeMonth2, 1);
-            if (isSecondMonth) {
-                d = new Date($scope.activeYear2, $scope.activeMonth2 - 1, 1);
-                $scope.activeYear = d.getFullYear();
-                $scope.activeMonth = d.getMonth();
-            } else {
-                d2 = new Date($scope.activeYear, $scope.activeMonth + 1, 1);
-                $scope.activeYear2 = d2.getFullYear();
-                $scope.activeMonth2 = d2.getMonth();
-            }
-            $scope.focusToDate(d);
-        }
-
-        function handleClickNextMonth($event) {
-            var d = new Date($scope.activeDate.getFullYear(), $scope.activeDate.getMonth() + 1, 1);
-            $scope.focusToDate(d);
-        }
-
-        function handleClickPrevMonth($event) {
-            var d = new Date($scope.activeDate.getFullYear(), $scope.activeDate.getMonth() - 1, 1);
-            $scope.focusToDate(d);
-        }
-
-        function handleClickSelectToday() {
-            var d = new Date(), d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate());
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d1;
-            $scope.selectedTemplate = 'TD';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d);
-        }
-
-        function handleClickSelectYesterday() {
-            var d = new Date(), d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate() - 1);
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d1;
-            $scope.selectedTemplate = 'YD';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d);
-        }
-
-
-        function handleClickSelectThisWeek() {
-            var p = new Date(),
-                d = new Date(p.getFullYear(), p.getMonth(), p.getDate()),
-                d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate() - (d.getDay() - getFirstDayOfWeek())),
-                d2 = new Date(d.getFullYear(), d.getMonth(), d.getDate() + (6 - d.getDay() + getFirstDayOfWeek()));
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d2;
-            $scope.selectedTemplate = 'TW';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d);
-        }
-
-        function handleClickSelectLastWeek() {
-            var p = new Date(),
-                d = new Date(p.getFullYear(), p.getMonth(), p.getDate() - 7),
-                d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate() - (d.getDay() - getFirstDayOfWeek())),
-                d2 = new Date(d.getFullYear(), d.getMonth(), d.getDate() + (6 - d.getDay() + getFirstDayOfWeek()));
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d2;
-            $scope.selectedTemplate = 'LW';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d);
-        }
-
-
-        function handleClickSelectThisMonth() {
-            var d = new Date(),
-                d1 = new Date(d.getFullYear(), d.getMonth(), 1),
-                d2 = new Date(d.getFullYear(), d.getMonth() + 1, 0);
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d2;
-            $scope.selectedTemplate = 'TM';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d);
-        }
-
-        function handleClickSelectLastMonth() {
-            var p = new Date(),
-                d = new Date(p.getFullYear(), p.getMonth(), 0),
-                d1 = new Date(d.getFullYear(), d.getMonth(), 1),
-                d2 = new Date(d.getFullYear(), d.getMonth() + 1, 0);
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d2;
-            $scope.selectedTemplate = 'LM';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d);
-        }
-
-        function handleClickSelectThisYear() {
-            var d = new Date(),
-                d1 = new Date(d.getFullYear(), 0, 1),
-                d2 = new Date(d.getFullYear(), 11, 31);
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d2;
-            $scope.selectedTemplate = 'TY';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d1);
-        }
-
-        function handleClickSelectLastYear() {
-            var d = new Date(),
-                d1 = new Date(d.getFullYear() - 1, 0, 1),
-                d2 = new Date(d.getFullYear() - 1, 11, 31);
-
-            $scope.dateStart = d1;
-            $scope.dateEnd = d2;
-            $scope.selectedTemplate = 'LY';
-            $scope.selectedTemplateName = $scope.selectedDateText();
-            //$scope.focusToDate(d1);
-        }
-
-        function isSelectedStartDate(date) {
-            return getDateDiff($scope.dateStart, date) === 0;
-        }
-
-        function isSelectedEndDate(date) {
-            return getDateDiff($scope.dateEnd, date) === 0;
-        }
-
-        function isToday(date) {
-            return getDateDiff(date, new Date()) === 0;
-        }
-
-        function selectedDateText() {
-            if ($scope.format && typeof $scope.format === 'function') {
-                return $scope.format($scope.dateStart, $scope.dateEnd, $scope.selectedTemplate, $scope.selectedTemplateName);
-            } else if (!$scope.dateStart || !$scope.dateEnd) {
-                return '';
-            } else if (!$scope.selectedTemplate) {
-                if (getDateDiff($scope.dateStart, $scope.dateEnd) === 0) {
-                    return $filter('date')($scope.dateStart, 'dd MMM yyyy');
-                } else {
-                    return $filter('date')(
-                        $scope.dateStart,
-                        'dd' + ($scope.dateStart.getMonth() !== $scope.dateEnd.getMonth() || $scope.dateStart.getFullYear() !== $scope.dateEnd.getFullYear() ? ' MMM' : '') + ($scope.dateStart.getFullYear() !== $scope.dateEnd.getFullYear() ? ' yyyy' : '')
-                        ) + ' - ' +
-                        $filter('date')(
-                            $scope.dateEnd,
-                            'dd MMM yyyy'
-                        );
-                }
-            } else if (SELECTION_TEMPLATES_CUSTOM != null && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate] != null) {
-                return SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].name;
-            } else {
-                return SELECTION_TEMPLATES[$scope.selectedTemplate];
-            }
-        }
-
-        function focusToDate(d) {
-            var d2 = new Date(d.getFullYear(), d.getMonth() + 1, 1);
-            $scope.activeDate = d;
-            $scope.activeMonth = d.getMonth();
-            $scope.activeYear = d.getFullYear();
-
-            $scope.activeDate2 = d2;
-            $scope.activeMonth2 = d2.getMonth();
-            $scope.activeYear2 = d2.getFullYear();
-
-            $scope.dates = fillDateGrid(d);
-            $scope.dates2 = fillDateGrid(d2);
-        }
-    }
-
-    function mdDateRangeDirective() {
-        return {
-            scope: {
-                ngModel: '=ngModel',
-                autoConfirm: '=autoConfirm',
-                ngDisabled: '=ngDisabled',
-                showTemplate: '=',
-                placeholder: '@',
-                isDisabledDate: '&',
-                localizationMap: '=?',
-                customTemplates: '=?',
-                disableTemplates: '@',
-                mdOnSelect: '&',
-                onePanel: '=?',
-                format: '=?',
-                maxRange: '=?',
-                firstDayOfWeek: '@'
-            },
-            template: ['<md-menu ng-disabled="ngDisabled">',
-                '<span class="md-select-value" ng-click="!ngDisabled && (($mdMenu && $mdMenu.open) ? $mdMenu.open($event) : $mdOpenMenu($event))">',
-                '  <span>{{ngModel.selectedTemplateName || placeholder}}</span>',
-                '  <span class="md-select-icon" aria-hidden="true"></span>',
-                '</span>',
-                '<md-menu-content class="md-custom-menu-content" style="max-height: none!important; height: auto!important; padding: 0!important;">',
-                '    <span style="text-align: left; padding: 12px 20px 0 20px" disabled>{{ngModel.selectedTemplateName || placeholder}}</span>',
-                '    <md-date-range-picker first-day-of-week="firstDayOfWeek" ',
-                '     md-on-select="autoConfirm && ok($dates)" ',
-                '     date-start="ngModel.dateStart" ',
-                '     date-end="ngModel.dateEnd" ',
-                '     selected-template="ngModel.selectedTemplate" ',
-                '     show-template="showTemplate" ',
-                '     localization-map="localizationMap" ',
-                '     custom-templates="customTemplates" ',
-                '     disable-templates="{{disableTemplates}}" ',
-                '     is-disabled-date="isDisabledDate({ $date: $date })" ',
-                '     max-range="maxRange" ',
-                '     one-panel="onePanel" ',
-                '     format="format" ',
-                '     selected-template-name="ngModel.selectedTemplateName"></md-date-range-picker>',
-                '<p ng-if="!autoConfirm" layout="row" layout-align="end center">',
-                '<md-button ng-if="ngModel.showClear" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>',
-                '<md-button class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',
-                '</p>',
-                '</md-menu-content>',
-                '</md-menu>'].join(''),
-            controller: ['$scope', '$mdMenu', function ($scope, $mdMenu) {
-                $scope.ok = function ok($dates) {
-                    $scope.mdOnSelect({ $dates: $dates });
-                    $mdMenu.hide();
-                }
-                $scope.clear = function clear() {
-                    $scope.ngModel.selectedTemplateName = '';
-                    $scope.ngModel.selectedTemplate = null;
-                    $scope.ngModel.dateStart = null;
-                    $scope.ngModel.dateEnd = null;
-                }
-                $scope.getLocalizationVal = function getLocalizationVal(val) {
-                    var ret = null;
-                    if ($scope.ngModel && $scope.ngModel.localizationMap != null && $scope.ngModel.localizationMap[val] != null) {
-                        ret = $scope.ngModel.localizationMap[val];
-                    } else {
-                        ret = val;
-                    }
-                    return ret;
-                }
-            }]
-        };
-    }
-
-    mdDateRangePickerService.$inject = ['$mdDialog'];
-    function mdDateRangePickerService($mdDialog) {
-        var service = this;
-
-        service.show = show;
-        service.getSelectedDate = getSelectedDate;
-
-        /**
-         * @description returns all seleced date based on mmodel, filters and max range
-         * @param {*} model
-         * @param {*} isDisabledDateCallback
-         * @param {*} maxRange
-         */
-        function getSelectedDate(dateStart, dateEnd, isDisabledDateCallback, maxRange) {
-            var dates = [];
-            var limit = dateEnd.getTime();
-            var date = dateStart;
-            var ctr = 0;
-            var y = dateStart.getFullYear();
-            var m = dateStart.getMonth();
-            var d = dateStart.getDate();
-            while (date.getTime() <= limit) {
-                if (isDisabledDateCallback && !isDisabledDateCallback({ $date: date })) {
-                    dates.push(date);
-                }
-                ctr++;
-                date = new Date(y, m, d + ctr);
-                if (ctr > (maxRange || 10000)) break; // break on 10,000
-            }
-            return dates;
-        }
-
-        function show(config) {
-            return $mdDialog.show({
-                locals: {
-                    mdDateRangePickerServiceModel: angular.copy(config.model),
-                    mdDateRangePickerServiceConfig: angular.copy(config),
-                },
-                controller: ['$scope', 'mdDateRangePickerServiceModel', 'mdDateRangePickerServiceConfig', function ($scope, mdDateRangePickerServiceModel, mdDateRangePickerServiceConfig) {
-                    $scope.model = mdDateRangePickerServiceModel || {};
-                    $scope.config = mdDateRangePickerServiceConfig || {};
-                    $scope.model.selectedTemplateName = $scope.model.selectedTemplateName || '';
-                    $scope.ok = function () {
-                        $scope.model.dateStart && $scope.model.dateStart.setHours(0, 0, 0, 0);
-                        $scope.model.dateEnd && $scope.model.dateEnd.setHours(23, 59, 59, 999);
-                        $mdDialog.hide($scope.model);
-                    }
-                    $scope.cancel = function () {
-                        $mdDialog.cancel();
-                    }
-                    $scope.clear = function clear() {
-                        $scope.model.selectedTemplateName = '';
-                        $scope.model.selectedTemplate = null;
-                        $scope.model.dateStart = null;
-                        $scope.model.dateEnd = null;
-                    }
-                    $scope.handleOnSelect = function ($dates) {
-                        if (typeof $scope.config.mdOnSelect === 'function') {
-                            $scope.config.mdOnSelect($dates);
-                        }
-                        if ($scope.config.autoConfirm) {
-                            $scope.ok();
-                        }
-                    }
-                    $scope.getLocalizationVal = function getLocalizationVal(val) {
-                        var ret = null;
-                        if ($scope.model && $scope.model.localizationMap != null && $scope.model.localizationMap[val] != null) {
-                            ret = $scope.model.localizationMap[val];
-                        } else {
-                            ret = val;
-                        }
-                        return ret;
-                    }
-                    if ($scope.model.customTemplates) console.warn('model.customTemplates will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({customTemplates}) instead');
-                    if ($scope.model.localizationMap) console.warn('model.localizationMap will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({localizationMap}) instead');
-                    if ($scope.model.firstDayOfWeek) console.warn('model.firstDayOfWeek will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({firstDayOfWeek}) instead');
-                    if ($scope.model.showTemplate) console.warn('model.showTemplate will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({showTemplate}) instead');
-                    if ($scope.model.maxRange) console.warn('model.maxRange will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({maxRange}) instead');
-                    if ($scope.model.onePanel) console.warn('model.onePanel will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({onePanel}) instead');
-                    if ($scope.model.isDisabledDate) console.warn('model.isDisabledDate({ $date: $date }) will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({isDisabledDate:($date)=>{}}) instead');
-
-                }],
-                template: ['<md-dialog aria-label="Date Range Picker">',
-                    '<md-toolbar class="md-primary" layout="row" layout-align="start center">',
-                    '<md-button aria-label="Date Range Picker" class="md-icon-button" aria-hidden="true" ng-disabled="true">',
-                    '<md-icon md-svg-icon="data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik05IDExSDd2Mmgydi0yem00IDBoLTJ2Mmgydi0yem00IDBoLTJ2Mmgydi0yem0yLTdoLTFWMmgtMnYySDhWMkg2djJINWMtMS4xMSAwLTEuOTkuOS0xLjk5IDJMMyAyMGMwIDEuMS44OSAyIDIgMmgxNGMxLjEgMCAyLS45IDItMlY2YzAtMS4xLS45LTItMi0yem0wIDE2SDVWOWgxNHYxMXoiLz4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+"></md-icon>',
-                    '</md-button>',
-                    '<span md-truncate class="md-toolbar-tools">{{model.selectedTemplateName}}</span>',
-                    '</md-toolbar>',
-                    '<md-dialog-content>',
-                    '<md-date-range-picker ',
-                    'date-start="model.dateStart" ',
-                    'date-end="model.dateEnd" ',
-                    'show-template="config.showTemplate || model.showTemplate" ',
-                    'selected-template="model.selectedTemplate" ',
-                    'selected-template-name="model.selectedTemplateName" ',
-                    'first-day-of-week="config.firstDayOfWeek || model.firstDayOfWeek" ',
-                    'localization-map="config.localizationMap || model.localizationMap" ',
-                    'custom-templates="config.customTemplates || model.customTemplates" ',
-                    'format="config.format" ',
-                    'disable-templates="{{model.disableTemplates}}" ',
-                    'md-on-select="handleOnSelect($dates)" ',
-                    'is-disabled-date="config.isDisabledDate ? config.isDisabledDate($date) : model.isDisabledDate({ $date: $date })" ',
-                    'max-range="config.maxRange || model.maxRange" ',
-                    'one-panel="config.onePanel || model.onePanel" ',
-                    '>',
-                    '</md-date-range-picker>',
-                    '</md-dialog-content>',
-                    '<md-dialog-actions layout="row" layout-align="end center">',
-                    '<md-button ng-click="cancel()">{{getLocalizationVal("Cancel")}}</md-button>',
-                    '<md-button ng-if="!config.autoConfirm" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>',
-                    '<md-button ng-if="!config.autoConfirm" class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',
-                    '</md-dialog-actions>',
-                    '</md-dialog>'].join(''),
-                parent: angular.element(document.body),
-                multiple: config.multiple,
-                targetEvent: config.targetEvent || document.body,
-                clickOutsideToClose: true,
-                fullscreen: config.model.fullscreen
-            });
-        }
-    }
-
-}(window, angular));
diff --git a/dist/md-date-range-picker.min.css b/dist/md-date-range-picker.min.css
deleted file mode 100644
index 70cb8da..0000000
--- a/dist/md-date-range-picker.min.css
+++ /dev/null
@@ -1 +0,0 @@
-.md-date-range-picker__calendar .md-date-range-picker__calendar__grid,md-date-range{cursor:pointer}.md-date-range-picker [event-key] *,.md-date-range-picker__calendar__selection{pointer-events:none}md-date-range-picker{display:block;max-width:664px}md-date-range-picker .md-date-range-picker__one-panel{display:block;max-width:340px}.md-date-range-picker{position:relative;background:#FFF}.md-date-range-picker__title{text-align:center;font-size:1rem;background:#106cc8;color:#FFF;margin:0;padding:16px 0}.md-date-range-picker__month-year{text-align:center;font-size:1rem;background:#eee;margin:0;padding:0}.md-date-range-picker__month-year .md-select-icon{display:none}.md-date-range-picker__month-year md-select{margin:10px 0}.md-date-range-picker__templates{background:#EEE}.md-date-range-picker__calendar-wrapper{padding:0;width:308px;min-width:308px}.md-date-range-picker__week{background:#e0e0e0}.md-date-range-picker__calendar__grid{font-size:13px;color:#222;padding:0;display:inline-block;width:44px;height:44px;line-height:44px;text-align:center;position:relative;outline:0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:50%;background:rgba(2550,255,255,0)}.md-date-range-picker__calendar__not-in-active-month{color:rgba(0,0,0,.5)}.md-date-range-picker__calendar .md-date-range-picker__calendar__grid:hover:not(.md-date-range-picker__calendar__selected):not(.md-date-range-picker__calendar__disabled){transition:background .3s ease-out;background:rgba(0,0,0,.1)}.md-date-range-picker__calendar__selected{background:#106cc8;color:#FFF;border-radius:0}.md-date-range-picker__calendar__selected.md-date-range-picker__calendar__disabled{background:rgba(0,0,0,.2)}.md-date-range-picker__calendar__not-in-active-month.md-date-range-picker__calendar__selected{color:rgba(255,255,255,.2)}.md-date-range-picker__calendar__today{font-weight:700}.md-date-range-picker__calendar .md-date-range-picker__calendar__grid.md-date-range-picker__calendar__disabled{opacity:.3;cursor:not-allowed}.md-date-range-picker__calendar__start{border-top-left-radius:50%;border-bottom-left-radius:50%}.md-date-range-picker__calendar__end{border-top-right-radius:50%;border-bottom-right-radius:50%}.md-date-range-picker__select{z-index:100}
\ No newline at end of file
diff --git a/dist/md-date-range-picker.min.js b/dist/md-date-range-picker.min.js
deleted file mode 100644
index 3e4ef1a..0000000
--- a/dist/md-date-range-picker.min.js
+++ /dev/null
@@ -1 +0,0 @@
-(function(e,t){function n(e){var t={scope:{selectedTemplate:"=",selectedTemplateName:"=",dateStart:"=?",dateEnd:"=?",firstDayOfWeek:"=?",showTemplate:"=?",mdOnSelect:"&",localizationMap:"=?",customTemplates:"=?",disableTemplates:"@",maxRange:"=?",onePanel:"=?",isDisabledDate:"&?",format:"=?"},template:'<div class="md-date-range-picker md-whiteframe-1dp" ng-class="{\'md-date-range-picker__one-panel\':onePanel}"><div layout="column"><div layout="row" layout-margin><div class="md-date-range-picker__calendar-wrapper"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeMonth" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeYear" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center" class="hide-gt-sm show-sm show-xs"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="!onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" ng-disabled="true" aria-hidden="true" class="md-icon-button md-button"><md-icon></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date),\'md-date-range-picker__calendar__start\':isSelectedStartDate(date),\'md-date-range-picker__calendar__end\':isSelectedEndDate(date),\'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date),\'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date})}" event-key="date1" event-param="{{$index}}"><span event-key="date1" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div><div ng-show="!onePanel" class="md-date-range-picker__calendar-wrapper hide-sm hide-xs show-gt-sm"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center" style="visibility: hidden"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeMonth2" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeYear2" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0" ng-if="!onePanel"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates2" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date), \'md-date-range-picker__calendar__start\':isSelectedStartDate(date), \'md-date-range-picker__calendar__end\':isSelectedEndDate(date), \'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date, true), \'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date}) }" event-key="date2" event-param="{{$index}}"><span event-key="date2" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div></div><div class="md-date-range-picker__templates" ng-if="showTemplate"><div ng-if="!onePanel && !maxRange" class="hide-xs hide-sm show-gt-sm" layout="row" layout-align="center center" layout-wrap><div ng-repeat="(tmpltKey,tmpltName) in selectionTemplate" class="md-button" aria-label="{{::tmpltName}}" ng-class="selectedTemplate === tmpltKey ? \'md-primary md-raised\' : \'\'" event-key="{{tmpltKey}}" ng-bind="::tmpltName" flex="20"></div><div ng-repeat="tmplt in customTemplates" class="md-button" aria-label="{{::tmplt.name}}" ng-class="selectedTemplate === tmplt.name ? \'md-primary md-raised\' : \'\'" ng-click="selectCustomRange(tmplt.name,tmplt)" event-key="Custom Template" ng-bind="::tmplt.name" flex="20"></div></div><div ng-if="!maxRange" ng-class="{\'hide-gt-sm\':!onePanel}" layout="column" layout-padding><md-input-container><label>{{::getLocalizationVal(\'Date Range Template\')}}</label><md-select md-container-class="md-date-range-picker__select" class="md-block" placeholder="{{::getLocalizationVal(\'Custom Date Range\')}}" ng-model="selectedTemplate"><md-option value=""></md-option><md-option ng-repeat="(tmpltKey,tmpltName) in selectionTemplate track by tmpltKey" aria-label="{{::tmpltName}}" ng-click="actionByKey(tmpltKey,null)" ng-bind="::tmpltName" value="{{tmpltKey}}"></md-option><md-option ng-repeat="tmplt in customTemplates" aria-label="{{::tmplt.name}}" ng-click="selectCustomRange(tmplt.name,tmplt)" ng-bind="::tmplt.name" value="{{::tmplt.name}}"></md-option></md-select></md-input-container></div></div></div></div>',controller:"mdDateRangePickerCtrl",link:function(t,n,r,i){t.actionByKey=function(e,n,r){switch(e){case"prev":t.handleClickPrevMonth(r),t.runIfNotInDigest();break;case"next":t.handleClickNextMonth(r),t.runIfNotInDigest();break;case"date1":t.handleClickDate(r,t.dates[n])?t.runIfNotInDigest(t.triggerChange):t.runIfNotInDigest();break;case"date2":t.handleClickDate(r,t.dates2[n])?t.runIfNotInDigest(t.triggerChange):t.runIfNotInDigest();break;case"TD":t.handleClickSelectToday(),t.runIfNotInDigest(t.triggerChange);break;case"YD":t.handleClickSelectYesterday(),t.runIfNotInDigest(t.triggerChange);break;case"TW":t.handleClickSelectThisWeek(),t.runIfNotInDigest(t.triggerChange);break;case"LW":t.handleClickSelectLastWeek(),t.runIfNotInDigest(t.triggerChange);break;case"TM":t.handleClickSelectThisMonth(),t.runIfNotInDigest(t.triggerChange);break;case"LM":t.handleClickSelectLastMonth(),t.runIfNotInDigest(t.triggerChange);break;case"TY":t.handleClickSelectThisYear(),t.runIfNotInDigest(t.triggerChange);break;case"LY":t.handleClickSelectLastYear(),t.runIfNotInDigest(t.triggerChange);break;case"Custom Template":t.runIfNotInDigest(t.triggerChange);break;default:}},t.runIfNotInDigest=function(e){t.$root!=null&&!t.$root.$$phase&&(t.$apply(),e&&typeof e=="function"&&e())},n.on("click",function(e){var n=e.target.getAttribute("event-key"),r=e.target.getAttribute("event-param");t.actionByKey(n,r,e)}),t.triggerChange=function(r){var i=e.getSelectedDate(t.dateStart,t.dateEnd,t.isDisabledDate,t.maxRange);t.mdOnSelect&&t.mdOnSelect({$dates:i})}}};return t}function r(e,t){function o(){var n=0,r;if(e.customTemplates!=null)for(var s=0;s<e.customTemplates.length;s++)r=e.customTemplates[s],SELECTION_TEMPLATES_CUSTOM[r.name]=r;if(e.selectedTemplate){switch(e.selectedTemplate){case"TD":e.handleClickSelectToday();break;case"YD":e.handleClickSelectYesterday();break;case"TW":e.handleClickSelectThisWeek();break;case"LW":e.handleClickSelectLastWeek();break;case"TM":e.handleClickSelectThisMonth();break;case"LM":e.handleClickSelectLastMonth();break;case"TY":e.handleClickSelectThisYear();break;case"LY":e.handleClickSelectLastYear();break;default:SELECTION_TEMPLATES_CUSTOM&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate]&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateStart&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateEnd&&(e.dateStart=SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateStart,e.dateEnd=SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateEnd),e.selectedTemplateName=e.selectedDateText()}e.updateActiveDate()}else e.selectedTemplate="",e.selectedTemplateName=e.selectedDateText(),e.updateActiveDate();e.$watch("selectedTemplate",function(t,n){t!==n&&e.dateStart&&!e.inCurrentMonth(e.dateStart)&&!e.inCurrentMonth(e.dateStart,!0)&&e.focusToDate(e.dateStart)}),e.$watch("dateStart",function(t,n){t!==n&&e.dateStart&&!e.inCurrentMonth(e.dateStart)&&!e.inCurrentMonth(e.dateStart,!0)&&e.focusToDate(e.dateStart)});var o=new Date(2017,0,1);e.days=[];for(n=0;n<7;n++)o.setDate(n+1+f()),e.days.push({id:n,name:a(t("date")(o,"EEE"))});var u=null;e.months=[];for(n=0;n<12;n++)u=new Date(2017,n,1),e.months.push({id:n,name:a(t("date")(u,"MMMM"))});var l=e.activeYear,c=0;e.years=[];for(c=l-10;c<l+10;c++)e.years.push({id:c,name:a(c)});for(var h in i)i.hasOwnProperty(h)&&(e.disableTemplates!=null&&e.disableTemplates!=""?e.disableTemplates.indexOf(h)<0&&(e.selectionTemplate[h]=i[h]):e.selectionTemplate[h]=i[h])}function u(t,n){e.dateStart=n.dateStart,e.dateEnd=n.dateEnd,e.selectedTemplate=t,e.selectedTemplateName=e.selectedDateText()}function a(t){var n=null;return e.localizationMap!=null&&e.localizationMap[t]!=null?n=e.localizationMap[t]:n=t,n}function f(){return[undefined,null,"",NaN].indexOf(e.firstDayOfWeek)!==-1?s:e.firstDayOfWeek}function l(e){var t=[],n=new Date(e.getFullYear(),e.getMonth(),1),r=new Date(e.getFullYear(),e.getMonth()+1,0),i=f(),s,o;for(s=1;s<=r.getDate();s++)t.push(new Date(e.getFullYear(),e.getMonth(),s));o=t[0].getDay(),s=0;while(o!==i)t.unshift(new Date(e.getFullYear(),e.getMonth(),s)),o=o<=0?6:o-1,s--;o=(t[t.length-1].getDay()+1)%7,s=1;while(o!==i)t.push(new Date(e.getFullYear(),e.getMonth()+1,s)),o=(o+1)%7,s++;return t}function c(e,t){if(!e||!t)return;var n=new Date(e.getFullYear(),e.getMonth(),e.getDate()),r=new Date(t.getFullYear(),t.getMonth(),t.getDate());return r-n}function h(e){var t=new Array(7),n=f();return t[0]="Sun",t[1]="Mon",t[2]="Tue",t[3]="Wed",t[4]="Thu",t[5]="Fri",t[6]="Sat",t[e+n%7]}function p(t,n){return n?t.getMonth()===e.activeMonth2&&t.getFullYear()===e.activeYear2:t.getMonth()===e.activeMonth&&t.getFullYear()===e.activeYear}function d(t){if(!e.dateStart)return!0;if(c(e.dateStart,e.dateEnd)!==0)return!0;var n=c(e.dateStart,t);return e.maxRange&&Math.abs(Math.ceil(n/864e5))+1<=e.maxRange||!e.maxRange}function v(t,n){var r=!1,i=!1;if(c(e.dateStart,e.dateEnd)===0){if(c(e.dateStart,n)===0)i=!0,r=!0;else if(!e.isDisabledDate||!e.isDisabledDate({$date:n})){var s=c(e.dateStart,n);if(s>0){if(e.maxRange&&Math.abs(Math.ceil(s/864e5))+1<=e.maxRange||!e.maxRange)e.dateEnd=n,i=!0,r=!0}else if(e.maxRange&&Math.abs(Math.ceil(s/864e5))+1<=e.maxRange||!e.maxRange)e.dateStart=n,i=!0,r=!0}}else if(!e.isDisabledDate||!e.isDisabledDate({$date:n}))e.dateStart=n,e.dateEnd=n,r=!0;return r&&(e.selectedTemplate=!1,e.selectedTemplateName=e.selectedDateText()),i}function m(t){return e.dateStart&&e.dateEnd?c(e.dateStart,t)>=0&&0<=c(t,e.dateEnd):!1}function g(t){var n=new Date(e.activeYear,e.activeMonth,1),r=new Date(e.activeYear2,e.activeMonth2,1);t?(n=new Date(e.activeYear2,e.activeMonth2-1,1),e.activeYear=n.getFullYear(),e.activeMonth=n.getMonth()):(r=new Date(e.activeYear,e.activeMonth+1,1),e.activeYear2=r.getFullYear(),e.activeMonth2=r.getMonth()),e.focusToDate(n)}function y(t){var n=new Date(e.activeDate.getFullYear(),e.activeDate.getMonth()+1,1);e.focusToDate(n)}function b(t){var n=new Date(e.activeDate.getFullYear(),e.activeDate.getMonth()-1,1);e.focusToDate(n)}function w(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate());e.dateStart=n,e.dateEnd=n,e.selectedTemplate="TD",e.selectedTemplateName=e.selectedDateText()}function E(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate()-1);e.dateStart=n,e.dateEnd=n,e.selectedTemplate="YD",e.selectedTemplateName=e.selectedDateText()}function S(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate()),r=new Date(n.getFullYear(),n.getMonth(),n.getDate()-(n.getDay()-f())),i=new Date(n.getFullYear(),n.getMonth(),n.getDate()+(6-n.getDay()+f()));e.dateStart=r,e.dateEnd=i,e.selectedTemplate="TW",e.selectedTemplateName=e.selectedDateText()}function x(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate()-7),r=new Date(n.getFullYear(),n.getMonth(),n.getDate()-(n.getDay()-f())),i=new Date(n.getFullYear(),n.getMonth(),n.getDate()+(6-n.getDay()+f()));e.dateStart=r,e.dateEnd=i,e.selectedTemplate="LW",e.selectedTemplateName=e.selectedDateText()}function T(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),1),r=new Date(t.getFullYear(),t.getMonth()+1,0);e.dateStart=n,e.dateEnd=r,e.selectedTemplate="TM",e.selectedTemplateName=e.selectedDateText()}function N(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),0),r=new Date(n.getFullYear(),n.getMonth(),1),i=new Date(n.getFullYear(),n.getMonth()+1,0);e.dateStart=r,e.dateEnd=i,e.selectedTemplate="LM",e.selectedTemplateName=e.selectedDateText()}function C(){var t=new Date,n=new Date(t.getFullYear(),0,1),r=new Date(t.getFullYear(),11,31);e.dateStart=n,e.dateEnd=r,e.selectedTemplate="TY",e.selectedTemplateName=e.selectedDateText()}function k(){var t=new Date,n=new Date(t.getFullYear()-1,0,1),r=new Date(t.getFullYear()-1,11,31);e.dateStart=n,e.dateEnd=r,e.selectedTemplate="LY",e.selectedTemplateName=e.selectedDateText()}function L(t){return c(e.dateStart,t)===0}function A(t){return c(e.dateEnd,t)===0}function O(e){return c(e,new Date)===0}function M(){return e.format&&typeof e.format=="function"?e.format(e.dateStart,e.dateEnd,e.selectedTemplate,e.selectedTemplateName):!e.dateStart||!e.dateEnd?"":e.selectedTemplate?SELECTION_TEMPLATES_CUSTOM!=null&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate]!=null?SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].name:i[e.selectedTemplate]:c(e.dateStart,e.dateEnd)===0?t("date")(e.dateStart,"dd MMM yyyy"):t("date")(e.dateStart,"dd"+(e.dateStart.getMonth()!==e.dateEnd.getMonth()||e.dateStart.getFullYear()!==e.dateEnd.getFullYear()?" MMM":"")+(e.dateStart.getFullYear()!==e.dateEnd.getFullYear()?" yyyy":""))+" - "+t("date")(e.dateEnd,"dd MMM yyyy")}function _(t){var n=new Date(t.getFullYear(),t.getMonth()+1,1);e.activeDate=t,e.activeMonth=t.getMonth(),e.activeYear=t.getFullYear(),e.activeDate2=n,e.activeMonth2=n.getMonth(),e.activeYear2=n.getFullYear(),e.dates=l(t),e.dates2=l(n)}var n=e,r=2,i={TD:a("Today"),YD:a("Yesterday"),TW:a("This Week"),LW:a("Last Week"),TM:a("This Month"),LM:a("Last Month"),TY:a("This Year"),LY:a("Last Year")},s=1;SELECTION_TEMPLATES_CUSTOM={},e.isMenuContainer=!1,e.days=[],e.label="Date range picker",e.dates=[],e.dates2=[],e.numberOfMonthToDisplay=2,e.today=new Date,e.dateStart&&e.dateStart.setHours(0,0,0,0),e.dateEnd&&e.dateEnd.setHours(23,59,59,999),e.firstDayOfMonth=e.dateStart?new Date(e.dateStart.getFullYear(),e.dateStart.getMonth(),1):Date(e.today.getFullYear(),e.today.getMonth(),1),e.lastDayOfMonth=e.dateStart?new Date(e.dateStart.getFullYear(),e.dateStart.getMonth()+1,0):Date(e.today.getFullYear(),e.today.getMonth()+1,0),e.activeDate=e.dateStart||e.today,e.activeDate2=new Date(e.activeDate.getFullYear(),e.activeDate.getMonth()+1,1),e.activeMonth=e.activeDate.getMonth(),e.activeYear=e.activeDate.getFullYear(),e.activeMonth2=e.activeDate2.getMonth(),e.activeYear2=e.activeDate2.getFullYear(),e.months=[],e.years=[],e.inCurrentMonth=p,e.isToday=O,e.handleClickDate=v,e.inSelectedDateRange=m,e.isSelectedStartDate=L,e.isSelectedEndDate=A,e.updateActiveDate=g,e.selectedDateText=M,e.focusToDate=_,e.handleClickNextMonth=y,e.handleClickPrevMonth=b,e.handleClickSelectToday=w,e.handleClickSelectYesterday=E,e.handleClickSelectThisWeek=S,e.handleClickSelectLastWeek=x,e.handleClickSelectThisMonth=T,e.handleClickSelectLastMonth=N,e.handleClickSelectThisYear=C,e.handleClickSelectLastYear=k,e.getLocalizationVal=a,e.selectCustomRange=u,e.isInMaxRange=d,e.selectionTemplate={},o()}function i(){return{scope:{ngModel:"=ngModel",autoConfirm:"=autoConfirm",ngDisabled:"=ngDisabled",showTemplate:"=",placeholder:"@",isDisabledDate:"&",localizationMap:"=?",customTemplates:"=?",disableTemplates:"@",mdOnSelect:"&",onePanel:"=?",format:"=?",maxRange:"=?",firstDayOfWeek:"@"},template:['<md-menu ng-disabled="ngDisabled">','<span class="md-select-value" ng-click="!ngDisabled && (($mdMenu && $mdMenu.open) ? $mdMenu.open($event) : $mdOpenMenu($event))">',"  <span>{{ngModel.selectedTemplateName || placeholder}}</span>",'  <span class="md-select-icon" aria-hidden="true"></span>',"</span>",'<md-menu-content class="md-custom-menu-content" style="max-height: none!important; height: auto!important; padding: 0!important;">','    <span style="text-align: left; padding: 12px 20px 0 20px" disabled>{{ngModel.selectedTemplateName || placeholder}}</span>','    <md-date-range-picker first-day-of-week="firstDayOfWeek" ','     md-on-select="autoConfirm && ok($dates)" ','     date-start="ngModel.dateStart" ','     date-end="ngModel.dateEnd" ','     selected-template="ngModel.selectedTemplate" ','     show-template="showTemplate" ','     localization-map="localizationMap" ','     custom-templates="customTemplates" ','     disable-templates="{{disableTemplates}}" ','     is-disabled-date="isDisabledDate({ $date: $date })" ','     max-range="maxRange" ','     one-panel="onePanel" ','     format="format" ','     selected-template-name="ngModel.selectedTemplateName"></md-date-range-picker>','<p ng-if="!autoConfirm" layout="row" layout-align="end center">','<md-button ng-if="ngModel.showClear" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>','<md-button class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',"</p>","</md-menu-content>","</md-menu>"].join(""),controller:["$scope","$mdMenu",function(e,t){e.ok=function(r){e.mdOnSelect({$dates:r}),t.hide()},e.clear=function(){e.ngModel.selectedTemplateName="",e.ngModel.selectedTemplate=null,e.ngModel.dateStart=null,e.ngModel.dateEnd=null},e.getLocalizationVal=function(n){var r=null;return e.ngModel&&e.ngModel.localizationMap!=null&&e.ngModel.localizationMap[n]!=null?r=e.ngModel.localizationMap[n]:r=n,r}}]}}function s(e){function r(e,t,n,r){var i=[],s=t.getTime(),o=e,u=0,a=e.getFullYear(),f=e.getMonth(),l=e.getDate();while(o.getTime()<=s){n&&!n({$date:o})&&i.push(o),u++,o=new Date(a,f,l+u);if(u>(r||1e4))break}return i}function i(n){return e.show({locals:{mdDateRangePickerServiceModel:t.copy(n.model),mdDateRangePickerServiceConfig:t.copy(n)},controller:["$scope","mdDateRangePickerServiceModel","mdDateRangePickerServiceConfig",function(t,n,r){t.model=n||{},t.config=r||{},t.model.selectedTemplateName=t.model.selectedTemplateName||"",t.ok=function(){t.model.dateStart&&t.model.dateStart.setHours(0,0,0,0),t.model.dateEnd&&t.model.dateEnd.setHours(23,59,59,999),e.hide(t.model)},t.cancel=function(){e.cancel()},t.clear=function(){t.model.selectedTemplateName="",t.model.selectedTemplate=null,t.model.dateStart=null,t.model.dateEnd=null},t.handleOnSelect=function(e){typeof t.config.mdOnSelect=="function"&&t.config.mdOnSelect(e),t.config.autoConfirm&&t.ok()},t.getLocalizationVal=function(n){var r=null;return t.model&&t.model.localizationMap!=null&&t.model.localizationMap[n]!=null?r=t.model.localizationMap[n]:r=n,r},t.model.customTemplates&&console.warn("model.customTemplates will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({customTemplates}) instead"),t.model.localizationMap&&console.warn("model.localizationMap will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({localizationMap}) instead"),t.model.firstDayOfWeek&&console.warn("model.firstDayOfWeek will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({firstDayOfWeek}) instead"),t.model.showTemplate&&console.warn("model.showTemplate will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({showTemplate}) instead"),t.model.maxRange&&console.warn("model.maxRange will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({maxRange}) instead"),t.model.onePanel&&console.warn("model.onePanel will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({onePanel}) instead"),t.model.isDisabledDate&&console.warn("model.isDisabledDate({ $date: $date }) will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({isDisabledDate:($date)=>{}}) instead")}],template:['<md-dialog aria-label="Date Range Picker">','<md-toolbar class="md-primary" layout="row" layout-align="start center">','<md-button aria-label="Date Range Picker" class="md-icon-button" aria-hidden="true" ng-disabled="true">','<md-icon md-svg-icon="data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik05IDExSDd2Mmgydi0yem00IDBoLTJ2Mmgydi0yem00IDBoLTJ2Mmgydi0yem0yLTdoLTFWMmgtMnYySDhWMkg2djJINWMtMS4xMSAwLTEuOTkuOS0xLjk5IDJMMyAyMGMwIDEuMS44OSAyIDIgMmgxNGMxLjEgMCAyLS45IDItMlY2YzAtMS4xLS45LTItMi0yem0wIDE2SDVWOWgxNHYxMXoiLz4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+"></md-icon>',"</md-button>",'<span md-truncate class="md-toolbar-tools">{{model.selectedTemplateName}}</span>',"</md-toolbar>","<md-dialog-content>","<md-date-range-picker ",'date-start="model.dateStart" ','date-end="model.dateEnd" ','show-template="config.showTemplate || model.showTemplate" ','selected-template="model.selectedTemplate" ','selected-template-name="model.selectedTemplateName" ','first-day-of-week="config.firstDayOfWeek || model.firstDayOfWeek" ','localization-map="config.localizationMap || model.localizationMap" ','custom-templates="config.customTemplates || model.customTemplates" ','format="config.format" ','disable-templates="{{model.disableTemplates}}" ','md-on-select="handleOnSelect($dates)" ','is-disabled-date="config.isDisabledDate ? config.isDisabledDate($date) : model.isDisabledDate({ $date: $date })" ','max-range="config.maxRange || model.maxRange" ','one-panel="config.onePanel || model.onePanel" ',">","</md-date-range-picker>","</md-dialog-content>",'<md-dialog-actions layout="row" layout-align="end center">','<md-button ng-click="cancel()">{{getLocalizationVal("Cancel")}}</md-button>','<md-button ng-if="!config.autoConfirm" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>','<md-button ng-if="!config.autoConfirm" class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',"</md-dialog-actions>","</md-dialog>"].join(""),parent:t.element(document.body),multiple:n.multiple,targetEvent:n.targetEvent||document.body,clickOutsideToClose:!0,fullscreen:n.model.fullscreen})}var n=this;n.show=i,n.getSelectedDate=r}t.module("ngMaterialDateRangePicker",["ngMaterial"]).directive("mdDateRangePicker",n).directive("mdDateRange",i).controller("mdDateRangePickerCtrl",r).service("$mdDateRangePicker",s),n.$inject=["$mdDateRangePicker"],r.$inject=["$scope","$filter"],s.$inject=["$mdDialog"]})(window,angular)
\ No newline at end of file

From 378bfdc4e72d3cf6d39ea354c4c58ab92f3f0bab Mon Sep 17 00:00:00 2001
From: YannLeComte <yann.le-comte@laposte.net>
Date: Fri, 15 Jun 2018 16:34:19 +0200
Subject: [PATCH 5/5] Rebuild with modification

---
 dist/md-date-range-picker.css     | 138 +++++
 dist/md-date-range-picker.js      | 845 ++++++++++++++++++++++++++++++
 dist/md-date-range-picker.min.css |   1 +
 dist/md-date-range-picker.min.js  |   1 +
 4 files changed, 985 insertions(+)
 create mode 100644 dist/md-date-range-picker.css
 create mode 100644 dist/md-date-range-picker.js
 create mode 100644 dist/md-date-range-picker.min.css
 create mode 100644 dist/md-date-range-picker.min.js

diff --git a/dist/md-date-range-picker.css b/dist/md-date-range-picker.css
new file mode 100644
index 0000000..e61aa93
--- /dev/null
+++ b/dist/md-date-range-picker.css
@@ -0,0 +1,138 @@
+/*
+* Name: md-date-range-picker
+* Version: 0.8.3
+* Build Date: 6/15/2018
+* Author: roel barreto <greatcodeideas@gmail.com>
+*/
+md-date-range {
+    cursor: pointer;
+}
+md-date-range-picker {
+    display: block;
+    max-width: 664px;
+}
+md-date-range-picker .md-date-range-picker__one-panel {
+    display: block;
+    max-width: 340px;
+}
+.md-date-range-picker [event-key] *{
+    pointer-events: none;
+}
+.md-date-range-picker {
+    position: relative;
+    background: #FFF;
+}
+
+.md-date-range-picker__title {
+    text-align: center;
+    font-size: 1rem;
+    background: rgb(16, 108, 200);
+    color: #FFF;
+    margin: 0;
+    padding: 16px 0;
+}
+
+.md-date-range-picker__month-year {
+    text-align: center;
+    font-size: 1rem;
+    background: #eee;
+    margin: 0;
+    padding: 0 0;
+}
+
+.md-date-range-picker__month-year .md-select-icon {
+    display: none;
+}
+
+.md-date-range-picker__month-year md-select {
+    margin: 10px 0;
+}
+
+.md-date-range-picker__templates {
+    background: #EEE;
+}
+
+.md-date-range-picker__calendar-wrapper {
+    padding: 0 0;
+    width: 308px;
+    min-width: 308px;
+}
+
+.md-date-range-picker__week {
+    background: #e0e0e0;
+}
+
+.md-date-range-picker__calendar__grid {
+    font-size: 13px;
+    color: #222;
+    padding: 0;
+    display: inline-block;
+    width: 44px;
+    height: 44px;
+    line-height: 44px;
+    text-align: center;
+    position: relative;
+    outline: none;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    border-radius: 50%;
+    background: rgba(2550, 255, 255, 0);
+}
+
+.md-date-range-picker__calendar .md-date-range-picker__calendar__grid {
+    cursor: pointer;
+}
+
+.md-date-range-picker__calendar__not-in-active-month {
+    color: rgba(0,0,0,0.5);
+}
+
+.md-date-range-picker__calendar 
+.md-date-range-picker__calendar__grid:hover:not(.md-date-range-picker__calendar__selected):not(.md-date-range-picker__calendar__disabled) {
+    transition: background 300ms ease-out;
+    background: rgba(0, 0, 0, 0.1);
+}
+
+.md-date-range-picker__calendar__selected {
+    background: rgb(16, 108, 200);
+    color: #FFF;
+    border-radius: 0;
+}
+.md-date-range-picker__calendar__selected.md-date-range-picker__calendar__disabled {
+    background: rgba(0, 0, 0, 0.2);
+}
+.md-date-range-picker__calendar__not-in-active-month.md-date-range-picker__calendar__selected {
+    color: rgba(255,255,255,0.2);
+}
+
+.md-date-range-picker__calendar__today {
+    font-weight: bold;
+}
+
+.md-date-range-picker__calendar 
+.md-date-range-picker__calendar__grid.md-date-range-picker__calendar__disabled {
+    opacity: 0.3;
+    cursor: not-allowed;
+}
+
+.md-date-range-picker__calendar__start {
+    border-top-left-radius: 50%;
+    border-bottom-left-radius: 50%;
+}
+
+.md-date-range-picker__calendar__end {
+    border-top-right-radius: 50%;
+    border-bottom-right-radius: 50%;
+}
+
+.md-date-range-picker__select {
+    z-index: 100;
+}
+
+.md-date-range-picker__calendar__selection {
+    pointer-events: none;
+}
\ No newline at end of file
diff --git a/dist/md-date-range-picker.js b/dist/md-date-range-picker.js
new file mode 100644
index 0000000..0f1ded0
--- /dev/null
+++ b/dist/md-date-range-picker.js
@@ -0,0 +1,845 @@
+/*
+* Name: md-date-range-picker
+* Version: 0.8.3
+* Build Date: 6/15/2018
+* Author: roel barreto <greatcodeideas@gmail.com>
+*/
+(function (window, angular) {
+
+    angular
+        .module('ngMaterialDateRangePicker', ['ngMaterial'])
+        .directive('mdDateRangePicker', mdDateRangePickerDirective)
+        .directive('mdDateRange', mdDateRangeDirective)
+        .controller('mdDateRangePickerCtrl', mdDateRangePickerCtrl)
+        .service('$mdDateRangePicker', mdDateRangePickerService);
+
+    /**
+     * scope here is non-bi-directional
+     */
+    mdDateRangePickerDirective.$inject = ['$mdDateRangePicker'];
+    function mdDateRangePickerDirective($mdDateRangePicker) {
+        var directive = {
+            scope: {
+                selectedTemplate: '=',
+                selectedTemplateName: '=',
+                dateStart: '=?',
+                dateEnd: '=?',
+                firstDayOfWeek: '=?',
+                showTemplate: '=?',
+                mdOnSelect: '&',
+                localizationMap: '=?',
+                customTemplates: '=?',
+                disableTemplates: '@',
+                maxRange: '=?',
+                onePanel: '=?',
+                isDisabledDate: '&?',
+                format: '=?',
+            },
+            template: '<div class="md-date-range-picker md-whiteframe-1dp" ng-class="{\'md-date-range-picker__one-panel\':onePanel}"><div layout="column"><div layout="row" layout-margin><div class="md-date-range-picker__calendar-wrapper"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeMonth" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeYear" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center" class="hide-gt-sm show-sm show-xs"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="!onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" ng-disabled="true" aria-hidden="true" class="md-icon-button md-button"><md-icon></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date),\'md-date-range-picker__calendar__start\':isSelectedStartDate(date),\'md-date-range-picker__calendar__end\':isSelectedEndDate(date),\'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date),\'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date})}" event-key="date1" event-param="{{$index}}"><span event-key="date1" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div><div ng-show="!onePanel" class="md-date-range-picker__calendar-wrapper hide-sm hide-xs show-gt-sm"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center" style="visibility: hidden"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeMonth2" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeYear2" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0" ng-if="!onePanel"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates2" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date), \'md-date-range-picker__calendar__start\':isSelectedStartDate(date), \'md-date-range-picker__calendar__end\':isSelectedEndDate(date), \'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date, true), \'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date}) }" event-key="date2" event-param="{{$index}}"><span event-key="date2" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div></div><div class="md-date-range-picker__templates" ng-if="showTemplate"><div ng-if="!onePanel && !maxRange" class="hide-xs hide-sm show-gt-sm" layout="row" layout-align="center center" layout-wrap><div ng-repeat="(tmpltKey,tmpltName) in selectionTemplate" class="md-button" aria-label="{{::tmpltName}}" ng-class="selectedTemplate === tmpltKey ? \'md-primary md-raised\' : \'\'" event-key="{{tmpltKey}}" ng-bind="::tmpltName" flex="20"></div><div ng-repeat="tmplt in customTemplates" class="md-button" aria-label="{{::tmplt.name}}" ng-class="selectedTemplate === tmplt.name ? \'md-primary md-raised\' : \'\'" ng-click="selectCustomRange(tmplt.name,tmplt)" event-key="Custom Template" ng-bind="::tmplt.name" flex="20"></div></div><div ng-if="!maxRange" ng-class="{\'hide-gt-sm\':!onePanel}" layout="column" layout-padding><md-input-container><label>{{::getLocalizationVal(\'Date Range Template\')}}</label><md-select md-container-class="md-date-range-picker__select" class="md-block" placeholder="{{::getLocalizationVal(\'Custom Date Range\')}}" ng-model="selectedTemplate"><md-option value=""></md-option><md-option ng-repeat="(tmpltKey,tmpltName) in selectionTemplate track by tmpltKey" aria-label="{{::tmpltName}}" ng-click="actionByKey(tmpltKey,null)" ng-bind="::tmpltName" value="{{tmpltKey}}"></md-option><md-option ng-repeat="tmplt in customTemplates" aria-label="{{::tmplt.name}}" ng-click="selectCustomRange(tmplt.name,tmplt)" ng-bind="::tmplt.name" value="{{::tmplt.name}}"></md-option></md-select></md-input-container></div></div></div></div>',
+            controller: 'mdDateRangePickerCtrl',
+            link: function (scope, element, attributes, ctrl) {
+                scope.actionByKey = function (eventKey, eventParam, e) {
+                    switch (eventKey) {
+                        case 'prev':
+                            scope.handleClickPrevMonth(e);
+                            scope.runIfNotInDigest();
+                            break;
+                        case 'next':
+                            scope.handleClickNextMonth(e);
+                            scope.runIfNotInDigest();
+                            break;
+                        case 'date1':
+                            if (scope.handleClickDate(e, scope.dates[eventParam])) {
+                                scope.runIfNotInDigest(scope.triggerChange);
+                            } else {
+                                scope.runIfNotInDigest();
+                            }
+                            break;
+                        case 'date2':
+                            if (scope.handleClickDate(e, scope.dates2[eventParam])) {
+                                scope.runIfNotInDigest(scope.triggerChange);
+                            } else {
+                                scope.runIfNotInDigest();
+                            }
+                            break;
+                        case 'TD':
+                            scope.handleClickSelectToday();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'YD':
+                            scope.handleClickSelectYesterday();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'TW':
+                            scope.handleClickSelectThisWeek();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'LW':
+                            scope.handleClickSelectLastWeek();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'TM':
+                            scope.handleClickSelectThisMonth();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'LM':
+                            scope.handleClickSelectLastMonth();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'TY':
+                            scope.handleClickSelectThisYear();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'LY':
+                            scope.handleClickSelectLastYear();
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        case 'Custom Template':
+                            scope.runIfNotInDigest(scope.triggerChange);
+                            break;
+                        default:
+                            break;
+                    }
+                }
+
+                scope.runIfNotInDigest = function (operation) {
+                    if (scope.$root != null && !scope.$root.$$phase) { // check if digest already in progress
+                        scope.$apply(); // launch digest;
+                        if (operation && typeof operation === 'function') {
+                            operation();
+                        }
+                    }
+                };
+                element.on('click', function (e) {
+                    var eventKey = e.target.getAttribute('event-key'),
+                        eventParam = e.target.getAttribute('event-param');
+                        scope.actionByKey(eventKey, eventParam, e);
+                });
+
+                scope.triggerChange = function triggerChange(e) {
+                    var $dates = $mdDateRangePicker.getSelectedDate(scope.dateStart, scope.dateEnd, scope.isDisabledDate, scope.maxRange); // All selected enabled dates
+                    if (scope.mdOnSelect) {
+                        scope.mdOnSelect({ $dates: $dates });
+                    }
+                };
+            }
+        };
+        return directive
+    }
+
+    mdDateRangePickerCtrl.$inject = ['$scope', '$filter'];
+    function mdDateRangePickerCtrl($scope, $filter) {
+        var ctrl = $scope, NUMBER_OF_MONTH_TO_DISPLAY = 2,
+            SELECTION_TEMPLATES = {
+                'TD': getLocalizationVal('Today'),
+                'YD': getLocalizationVal('Yesterday'),
+                'TW': getLocalizationVal('This Week'),
+                'LW': getLocalizationVal('Last Week'),
+                'TM': getLocalizationVal('This Month'),
+                'LM': getLocalizationVal('Last Month'),
+                'TY': getLocalizationVal('This Year'),
+                'LY': getLocalizationVal('Last Year')
+            }, START_OF_WEEK = 1
+        SELECTION_TEMPLATES_CUSTOM = {}
+            ;
+        $scope.isMenuContainer = false;
+        $scope.days = [];
+        $scope.label = 'Date range picker';
+        $scope.dates = [];
+        $scope.dates2 = [];
+        $scope.numberOfMonthToDisplay = 2;
+        $scope.today = new Date();
+        $scope.dateStart && $scope.dateStart.setHours(0, 0, 0, 0);
+        $scope.dateEnd && $scope.dateEnd.setHours(23, 59, 59, 999);
+        $scope.firstDayOfMonth = $scope.dateStart ? new Date($scope.dateStart.getFullYear(), $scope.dateStart.getMonth(), 1) : Date($scope.today.getFullYear(), $scope.today.getMonth(), 1);
+        $scope.lastDayOfMonth = $scope.dateStart ? new Date($scope.dateStart.getFullYear(), $scope.dateStart.getMonth() + 1, 0) : Date($scope.today.getFullYear(), $scope.today.getMonth() + 1, 0);
+        $scope.activeDate = $scope.dateStart || $scope.today;
+        $scope.activeDate2 = new Date($scope.activeDate.getFullYear(), $scope.activeDate.getMonth() + 1, 1);
+        $scope.activeMonth = $scope.activeDate.getMonth();
+        $scope.activeYear = $scope.activeDate.getFullYear();
+        $scope.activeMonth2 = $scope.activeDate2.getMonth();
+        $scope.activeYear2 = $scope.activeDate2.getFullYear();
+        $scope.months = [];
+        $scope.years = [];
+
+        $scope.inCurrentMonth = inCurrentMonth;
+        $scope.isToday = isToday;
+        $scope.handleClickDate = handleClickDate;
+        $scope.inSelectedDateRange = inSelectedDateRange;
+        $scope.isSelectedStartDate = isSelectedStartDate;
+        $scope.isSelectedEndDate = isSelectedEndDate;
+
+        $scope.updateActiveDate = updateActiveDate;
+        $scope.selectedDateText = selectedDateText;
+        $scope.focusToDate = focusToDate;
+
+        $scope.handleClickNextMonth = handleClickNextMonth;
+        $scope.handleClickPrevMonth = handleClickPrevMonth;
+
+        $scope.handleClickSelectToday = handleClickSelectToday;
+        $scope.handleClickSelectYesterday = handleClickSelectYesterday;
+        $scope.handleClickSelectThisWeek = handleClickSelectThisWeek;
+        $scope.handleClickSelectLastWeek = handleClickSelectLastWeek;
+        $scope.handleClickSelectThisMonth = handleClickSelectThisMonth;
+        $scope.handleClickSelectLastMonth = handleClickSelectLastMonth;
+        $scope.handleClickSelectThisYear = handleClickSelectThisYear;
+        $scope.handleClickSelectLastYear = handleClickSelectLastYear;
+
+        $scope.getLocalizationVal = getLocalizationVal;
+        $scope.selectCustomRange = selectCustomRange;
+        $scope.isInMaxRange = isInMaxRange;
+        $scope.selectionTemplate = {};
+
+        init();
+
+        function init() {
+            var mctr = 0;
+            var currTmpl;
+
+            /** 
+             * add custom template to local custom template array 
+            */
+            if ($scope.customTemplates != null) {
+                for (var i = 0; i < $scope.customTemplates.length; i++) {
+                    currTmpl = $scope.customTemplates[i];
+                    SELECTION_TEMPLATES_CUSTOM[currTmpl.name] = currTmpl;
+                }
+            }
+            if ($scope.selectedTemplate) {
+                switch ($scope.selectedTemplate) {
+                    case 'TD':
+                        $scope.handleClickSelectToday();
+                        break;
+                    case 'YD':
+                        $scope.handleClickSelectYesterday();
+                        break;
+                    case 'TW':
+                        $scope.handleClickSelectThisWeek();
+                        break;
+                    case 'LW':
+                        $scope.handleClickSelectLastWeek();
+                        break;
+                    case 'TM':
+                        $scope.handleClickSelectThisMonth();
+                        break;
+                    case 'LM':
+                        $scope.handleClickSelectLastMonth();
+                        break;
+                    case 'TY':
+                        $scope.handleClickSelectThisYear();
+                        break;
+                    case 'LY':
+                        $scope.handleClickSelectLastYear();
+                        break;
+                    default:
+                        if (SELECTION_TEMPLATES_CUSTOM && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate] && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateStart && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateEnd) {
+                            $scope.dateStart = SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateStart;
+                            $scope.dateEnd = SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].dateEnd;
+                        }
+                        $scope.selectedTemplateName = $scope.selectedDateText();
+                        break;
+                }
+                $scope.updateActiveDate();
+            } else {
+                $scope.selectedTemplate = '';
+                $scope.selectedTemplateName = $scope.selectedDateText();
+                $scope.updateActiveDate();
+            }
+
+            $scope.$watch('selectedTemplate', function (next, prev) {
+                if (next !== prev && $scope.dateStart && !$scope.inCurrentMonth($scope.dateStart) && !$scope.inCurrentMonth($scope.dateStart, true)) {
+                    $scope.focusToDate($scope.dateStart);
+                }
+            });
+            $scope.$watch('dateStart', function (next, prev) {
+                if (next !== prev && $scope.dateStart && !$scope.inCurrentMonth($scope.dateStart) && !$scope.inCurrentMonth($scope.dateStart, true)) {
+                    $scope.focusToDate($scope.dateStart);
+                }
+            });
+
+            /**
+             * Generate Days of Week Names
+             * Fact: January 1st of 2017 is Sunday
+             */
+            var w = new Date(2017, 0, 1);
+            $scope.days = [];
+            for (mctr = 0; mctr < 7; mctr++) {
+                //add $scope.firstDayOfWeek to set the first Day of week e.g. -1 = Sunday, 0 = Monday 
+                w.setDate(mctr + 1 + getFirstDayOfWeek());
+                $scope.days.push({ id: mctr, name: getLocalizationVal($filter('date')(w, 'EEE')) });
+            }
+            /**
+             * Generate Month Names, Might depend on localization
+            */
+            var m = null;
+            $scope.months = [];
+            for (mctr = 0; mctr < 12; mctr++) {
+                m = new Date(2017, mctr, 1);
+                $scope.months.push({ id: mctr, name: getLocalizationVal($filter('date')(m, 'MMMM')) });
+            }
+            /**
+             * Generate Year Selection
+            */
+            var y = $scope.activeYear, yctr = 0;
+            $scope.years = [];
+            for (yctr = y - 10; yctr < y + 10; yctr++) {
+                $scope.years.push({ id: yctr, name: getLocalizationVal(yctr) })
+            }
+
+            /**
+             * get the templates to use 
+            */
+            for (var tmplKey in SELECTION_TEMPLATES) {
+                if (SELECTION_TEMPLATES.hasOwnProperty(tmplKey)) {
+                    //check if we have disable templates property 
+                    if ($scope.disableTemplates != null && $scope.disableTemplates != '') {
+                        //if key is not exist in disableTemplates property add it
+                        if ($scope.disableTemplates.indexOf(tmplKey) < 0) {
+                            $scope.selectionTemplate[tmplKey] = SELECTION_TEMPLATES[tmplKey];
+                        }
+                    } else {
+                        $scope.selectionTemplate[tmplKey] = SELECTION_TEMPLATES[tmplKey];
+                    }
+
+                }
+            }
+
+
+        }
+
+        function selectCustomRange(tmpltKey, tmpltObj) {
+            $scope.dateStart = tmpltObj.dateStart;
+            $scope.dateEnd = tmpltObj.dateEnd;
+            $scope.selectedTemplate = tmpltKey;
+            $scope.selectedTemplateName = $scope.selectedDateText();
+        }
+        function getLocalizationVal(val) {
+            var ret = null;
+            if ($scope.localizationMap != null && $scope.localizationMap[val] != null) {
+                ret = $scope.localizationMap[val];
+            } else {
+                ret = val;
+            }
+            return ret;
+        }
+
+        function getFirstDayOfWeek() {
+            if ([undefined, null, '', NaN].indexOf($scope.firstDayOfWeek) !== -1) {
+                return START_OF_WEEK;
+            }
+            return $scope.firstDayOfWeek;
+        }
+        /**
+         * Fill the Calendar Dates
+         */
+        function fillDateGrid(currentDate) {
+
+            var dates = [],
+                monthStartDate = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1),
+                monthEndDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0),
+                firstDay = getFirstDayOfWeek(),
+                ctr, day;
+
+            for (ctr = 1; ctr <= monthEndDate.getDate(); ctr++) {
+                dates.push(new Date(currentDate.getFullYear(), currentDate.getMonth(), ctr));
+            }
+
+            day = dates[0].getDay();
+            ctr = 0;
+            while (day !== firstDay) {
+                dates.unshift(new Date(currentDate.getFullYear(), currentDate.getMonth(), ctr));
+                day = day <= 0 ? 6 : day - 1;
+                ctr--;
+            }
+
+            day = (dates[dates.length - 1].getDay() + 1) % 7;
+            ctr = 1;
+            while (day !== firstDay) {
+                dates.push(new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, ctr));
+                day = (day + 1) % 7;
+                ctr++
+            }
+            return dates;
+        }
+
+        /**
+         * Diff 2 Dates by Day Differences
+         * date1 < date2 return positive integer
+         * date1 = date2 return 0
+         * date1 > date2 return negative integer
+         */
+        function getDateDiff(date1, date2) {
+            if (!date1 || !date2) return;
+            var _d1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate()),
+                _d2 = new Date(date2.getFullYear(), date2.getMonth(), date2.getDate());
+            return _d2 - _d1;
+        }
+
+        /**
+         * return Day Name in a week
+         */
+        function getDayName(day) {
+            var weekday = new Array(7), div = getFirstDayOfWeek();
+            weekday[0] = "Sun";
+            weekday[1] = "Mon";
+            weekday[2] = "Tue";
+            weekday[3] = "Wed";
+            weekday[4] = "Thu";
+            weekday[5] = "Fri";
+            weekday[6] = "Sat";
+            return weekday[day + div % 7];
+        }
+
+        /**
+         * Events
+         */
+
+        function inCurrentMonth(date, isSecondMonth) {
+            return !isSecondMonth ?
+                date.getMonth() === $scope.activeMonth && date.getFullYear() === $scope.activeYear :
+                date.getMonth() === $scope.activeMonth2 && date.getFullYear() === $scope.activeYear2;
+        }
+
+        function isInMaxRange(date) {
+            if (!$scope.dateStart) return true;
+            if (getDateDiff($scope.dateStart, $scope.dateEnd) !== 0) return true;
+            var diff = getDateDiff($scope.dateStart, date);
+            return ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange);
+        }
+
+        var startModified = true;
+
+        function handleClickDate($event, date) {
+            var changed = false;
+            var shouldConfirm = false;
+            if (getDateDiff($scope.dateStart, $scope.dateEnd) === 0) {
+                if (getDateDiff($scope.dateStart, date) === 0) {
+                    shouldConfirm = true;
+                    changed = true;
+                } else if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
+                    var diff = getDateDiff($scope.dateStart, date);
+                    if (diff > 0) {
+                        // Check if maxRange
+                        if ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange) {
+                            $scope.dateEnd = date;
+                            shouldConfirm = true;
+                            changed = true;
+                        }
+                    } else {
+                        // Check if maxRange
+                        if ($scope.maxRange && Math.abs(Math.ceil(diff / (1000 * 3600 * 24))) + 1 <= $scope.maxRange || !$scope.maxRange) {
+                            $scope.dateStart = date;
+                            shouldConfirm = true;
+                            changed = true;
+                        }
+                    }
+                }
+            } else {
+                if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
+                    if (!$scope.isDisabledDate || !$scope.isDisabledDate({ $date: date })) {
+
+                        if (moment(date).isBefore(moment($scope.dateStart), 'day')) {
+                            $scope.dateStart = date;
+                            startModified = true;
+
+                        } else if (moment(date).isAfter(moment($scope.dateEnd), 'day')) {
+                            $scope.dateEnd = date;
+                            startModified = false;
+
+                        } else if (moment(date).isBefore(moment($scope.dateEnd), 'day') && moment(date).isAfter(moment($scope.dateStart), 'day')) {
+                            if (!startModified) {
+                                $scope.dateStart = date;
+                                startModified = true;
+                            } else {
+                                $scope.dateEnd = date;
+                                startModified = false;
+                            }
+                        } else if (moment(date).isSame(moment($scope.dateEnd), 'day') || moment(date).isSame(moment($scope.dateStart), 'day')) {
+                            $scope.dateStart = date;
+                            $scope.dateEnd = date;
+                        }
+
+                        changed = true;
+                    }
+                }
+            }
+            if (changed) {
+                $scope.selectedTemplate = false;
+                $scope.selectedTemplateName = $scope.selectedDateText();
+            }
+            return shouldConfirm;
+        }
+
+        function inSelectedDateRange(date) {
+            return $scope.dateStart && $scope.dateEnd
+                ? getDateDiff($scope.dateStart, date) >= 0 && 0 <= getDateDiff(date, $scope.dateEnd)
+                : false;
+        }
+
+        function updateActiveDate(isSecondMonth) {
+            var d = new Date($scope.activeYear, $scope.activeMonth, 1),
+                d2 = new Date($scope.activeYear2, $scope.activeMonth2, 1);
+            if (isSecondMonth) {
+                d = new Date($scope.activeYear2, $scope.activeMonth2 - 1, 1);
+                $scope.activeYear = d.getFullYear();
+                $scope.activeMonth = d.getMonth();
+            } else {
+                d2 = new Date($scope.activeYear, $scope.activeMonth + 1, 1);
+                $scope.activeYear2 = d2.getFullYear();
+                $scope.activeMonth2 = d2.getMonth();
+            }
+            $scope.focusToDate(d);
+        }
+
+        function handleClickNextMonth($event) {
+            var d = new Date($scope.activeDate.getFullYear(), $scope.activeDate.getMonth() + 1, 1);
+            $scope.focusToDate(d);
+        }
+
+        function handleClickPrevMonth($event) {
+            var d = new Date($scope.activeDate.getFullYear(), $scope.activeDate.getMonth() - 1, 1);
+            $scope.focusToDate(d);
+        }
+
+        function handleClickSelectToday() {
+            var d = new Date(), d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate());
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d1;
+            $scope.selectedTemplate = 'TD';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d);
+        }
+
+        function handleClickSelectYesterday() {
+            var d = new Date(), d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate() - 1);
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d1;
+            $scope.selectedTemplate = 'YD';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d);
+        }
+
+
+        function handleClickSelectThisWeek() {
+            var p = new Date(),
+                d = new Date(p.getFullYear(), p.getMonth(), p.getDate()),
+                d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate() - (d.getDay() - getFirstDayOfWeek())),
+                d2 = new Date(d.getFullYear(), d.getMonth(), d.getDate() + (6 - d.getDay() + getFirstDayOfWeek()));
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d2;
+            $scope.selectedTemplate = 'TW';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d);
+        }
+
+        function handleClickSelectLastWeek() {
+            var p = new Date(),
+                d = new Date(p.getFullYear(), p.getMonth(), p.getDate() - 7),
+                d1 = new Date(d.getFullYear(), d.getMonth(), d.getDate() - (d.getDay() - getFirstDayOfWeek())),
+                d2 = new Date(d.getFullYear(), d.getMonth(), d.getDate() + (6 - d.getDay() + getFirstDayOfWeek()));
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d2;
+            $scope.selectedTemplate = 'LW';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d);
+        }
+
+
+        function handleClickSelectThisMonth() {
+            var d = new Date(),
+                d1 = new Date(d.getFullYear(), d.getMonth(), 1),
+                d2 = new Date(d.getFullYear(), d.getMonth() + 1, 0);
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d2;
+            $scope.selectedTemplate = 'TM';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d);
+        }
+
+        function handleClickSelectLastMonth() {
+            var p = new Date(),
+                d = new Date(p.getFullYear(), p.getMonth(), 0),
+                d1 = new Date(d.getFullYear(), d.getMonth(), 1),
+                d2 = new Date(d.getFullYear(), d.getMonth() + 1, 0);
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d2;
+            $scope.selectedTemplate = 'LM';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d);
+        }
+
+        function handleClickSelectThisYear() {
+            var d = new Date(),
+                d1 = new Date(d.getFullYear(), 0, 1),
+                d2 = new Date(d.getFullYear(), 11, 31);
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d2;
+            $scope.selectedTemplate = 'TY';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d1);
+        }
+
+        function handleClickSelectLastYear() {
+            var d = new Date(),
+                d1 = new Date(d.getFullYear() - 1, 0, 1),
+                d2 = new Date(d.getFullYear() - 1, 11, 31);
+
+            $scope.dateStart = d1;
+            $scope.dateEnd = d2;
+            $scope.selectedTemplate = 'LY';
+            $scope.selectedTemplateName = $scope.selectedDateText();
+            //$scope.focusToDate(d1);
+        }
+
+        function isSelectedStartDate(date) {
+            return getDateDiff($scope.dateStart, date) === 0;
+        }
+
+        function isSelectedEndDate(date) {
+            return getDateDiff($scope.dateEnd, date) === 0;
+        }
+
+        function isToday(date) {
+            return getDateDiff(date, new Date()) === 0;
+        }
+
+        function selectedDateText() {
+            if ($scope.format && typeof $scope.format === 'function') {
+                return $scope.format($scope.dateStart, $scope.dateEnd, $scope.selectedTemplate, $scope.selectedTemplateName);
+            } else if (!$scope.dateStart || !$scope.dateEnd) {
+                return '';
+            } else if (!$scope.selectedTemplate) {
+                if (getDateDiff($scope.dateStart, $scope.dateEnd) === 0) {
+                    return $filter('date')($scope.dateStart, 'dd MMM yyyy');
+                } else {
+                    return $filter('date')(
+                        $scope.dateStart,
+                        'dd' + ($scope.dateStart.getMonth() !== $scope.dateEnd.getMonth() || $scope.dateStart.getFullYear() !== $scope.dateEnd.getFullYear() ? ' MMM' : '') + ($scope.dateStart.getFullYear() !== $scope.dateEnd.getFullYear() ? ' yyyy' : '')
+                    ) + ' - ' +
+                        $filter('date')(
+                            $scope.dateEnd,
+                            'dd MMM yyyy'
+                        );
+                }
+            } else if (SELECTION_TEMPLATES_CUSTOM != null && SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate] != null) {
+                return SELECTION_TEMPLATES_CUSTOM[$scope.selectedTemplate].name;
+            } else {
+                return SELECTION_TEMPLATES[$scope.selectedTemplate];
+            }
+        }
+
+        function focusToDate(d) {
+            var d2 = new Date(d.getFullYear(), d.getMonth() + 1, 1);
+            $scope.activeDate = d;
+            $scope.activeMonth = d.getMonth();
+            $scope.activeYear = d.getFullYear();
+
+            $scope.activeDate2 = d2;
+            $scope.activeMonth2 = d2.getMonth();
+            $scope.activeYear2 = d2.getFullYear();
+
+            $scope.dates = fillDateGrid(d);
+            $scope.dates2 = fillDateGrid(d2);
+        }
+    }
+
+    function mdDateRangeDirective() {
+        return {
+            scope: {
+                ngModel: '=ngModel',
+                autoConfirm: '=autoConfirm',
+                ngDisabled: '=ngDisabled',
+                showTemplate: '=',
+                placeholder: '@',
+                isDisabledDate: '&',
+                localizationMap: '=?',
+                customTemplates: '=?',
+                disableTemplates: '@',
+                mdOnSelect: '&',
+                onePanel: '=?',
+                format: '=?',
+                maxRange: '=?',
+                firstDayOfWeek: '@'
+            },
+            template: ['<md-menu ng-disabled="ngDisabled">',
+                '<span class="md-select-value" ng-click="!ngDisabled && (($mdMenu && $mdMenu.open) ? $mdMenu.open($event) : $mdOpenMenu($event))">',
+                '  <span>{{ngModel.selectedTemplateName || placeholder}}</span>',
+                '  <span class="md-select-icon" aria-hidden="true"></span>',
+                '</span>',
+                '<md-menu-content class="md-custom-menu-content" style="max-height: none!important; height: auto!important; padding: 0!important;">',
+                '    <span style="text-align: left; padding: 12px 20px 0 20px" disabled>{{ngModel.selectedTemplateName || placeholder}}</span>',
+                '    <md-date-range-picker first-day-of-week="firstDayOfWeek" ',
+                '     md-on-select="autoConfirm && ok($dates)" ',
+                '     date-start="ngModel.dateStart" ',
+                '     date-end="ngModel.dateEnd" ',
+                '     selected-template="ngModel.selectedTemplate" ',
+                '     show-template="showTemplate" ',
+                '     localization-map="localizationMap" ',
+                '     custom-templates="customTemplates" ',
+                '     disable-templates="{{disableTemplates}}" ',
+                '     is-disabled-date="isDisabledDate({ $date: $date })" ',
+                '     max-range="maxRange" ',
+                '     one-panel="onePanel" ',
+                '     format="format" ',
+                '     selected-template-name="ngModel.selectedTemplateName"></md-date-range-picker>',
+                '<p ng-if="!autoConfirm" layout="row" layout-align="end center">',
+                '<md-button ng-if="ngModel.showClear" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>',
+                '<md-button class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',
+                '</p>',
+                '</md-menu-content>',
+                '</md-menu>'].join(''),
+            controller: ['$scope', '$mdMenu', function ($scope, $mdMenu) {
+                $scope.ok = function ok($dates) {
+                    $scope.mdOnSelect({ $dates: $dates });
+                    $mdMenu.hide();
+                }
+                $scope.clear = function clear() {
+                    $scope.ngModel.selectedTemplateName = '';
+                    $scope.ngModel.selectedTemplate = null;
+                    $scope.ngModel.dateStart = null;
+                    $scope.ngModel.dateEnd = null;
+                }
+                $scope.getLocalizationVal = function getLocalizationVal(val) {
+                    var ret = null;
+                    if ($scope.ngModel && $scope.ngModel.localizationMap != null && $scope.ngModel.localizationMap[val] != null) {
+                        ret = $scope.ngModel.localizationMap[val];
+                    } else {
+                        ret = val;
+                    }
+                    return ret;
+                }
+            }]
+        };
+    }
+
+    mdDateRangePickerService.$inject = ['$mdDialog'];
+    function mdDateRangePickerService($mdDialog) {
+        var service = this;
+
+        service.show = show;
+        service.getSelectedDate = getSelectedDate;
+
+        /**
+         * @description returns all seleced date based on mmodel, filters and max range
+         * @param {*} model 
+         * @param {*} isDisabledDateCallback 
+         * @param {*} maxRange 
+         */
+        function getSelectedDate(dateStart, dateEnd, isDisabledDateCallback, maxRange) {
+            var dates = [];
+            var limit = dateEnd.getTime();
+            var date = dateStart;
+            var ctr = 0;
+            var y = dateStart.getFullYear();
+            var m = dateStart.getMonth();
+            var d = dateStart.getDate();
+            while (date.getTime() <= limit) {
+                if (isDisabledDateCallback && !isDisabledDateCallback({ $date: date })) {
+                    dates.push(date);
+                }
+                ctr++;
+                date = new Date(y, m, d + ctr);
+                if (ctr > (maxRange || 10000)) break; // break on 10,000
+            }
+            return dates;
+        }
+
+        function show(config) {
+            return $mdDialog.show({
+                locals: {
+                    mdDateRangePickerServiceModel: angular.copy(config.model),
+                    mdDateRangePickerServiceConfig: angular.copy(config),
+                },
+                controller: ['$scope', 'mdDateRangePickerServiceModel', 'mdDateRangePickerServiceConfig', function ($scope, mdDateRangePickerServiceModel, mdDateRangePickerServiceConfig) {
+                    $scope.model = mdDateRangePickerServiceModel || {};
+                    $scope.config = mdDateRangePickerServiceConfig || {};
+                    $scope.model.selectedTemplateName = $scope.model.selectedTemplateName || '';
+                    $scope.ok = function () {
+                        $scope.model.dateStart && $scope.model.dateStart.setHours(0, 0, 0, 0);
+                        $scope.model.dateEnd && $scope.model.dateEnd.setHours(23, 59, 59, 999);
+                        $mdDialog.hide($scope.model);
+                    }
+                    $scope.cancel = function () {
+                        $mdDialog.cancel();
+                    }
+                    $scope.clear = function clear() {
+                        $scope.model.selectedTemplateName = '';
+                        $scope.model.selectedTemplate = null;
+                        $scope.model.dateStart = null;
+                        $scope.model.dateEnd = null;
+                    }
+                    $scope.handleOnSelect = function ($dates) {
+                        if (typeof $scope.config.mdOnSelect === 'function') {
+                            $scope.config.mdOnSelect($dates);
+                        }
+                        if ($scope.config.autoConfirm) {
+                            $scope.ok();
+                        }
+                    }
+                    $scope.getLocalizationVal = function getLocalizationVal(val) {
+                        var ret = null;
+                        if ($scope.model && $scope.model.localizationMap != null && $scope.model.localizationMap[val] != null) {
+                            ret = $scope.model.localizationMap[val];
+                        } else {
+                            ret = val;
+                        }
+                        return ret;
+                    }
+                    if ($scope.model.customTemplates) console.warn('model.customTemplates will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({customTemplates}) instead');
+                    if ($scope.model.localizationMap) console.warn('model.localizationMap will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({localizationMap}) instead');
+                    if ($scope.model.firstDayOfWeek) console.warn('model.firstDayOfWeek will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({firstDayOfWeek}) instead');
+                    if ($scope.model.showTemplate) console.warn('model.showTemplate will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({showTemplate}) instead');
+                    if ($scope.model.maxRange) console.warn('model.maxRange will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({maxRange}) instead');
+                    if ($scope.model.onePanel) console.warn('model.onePanel will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({onePanel}) instead');
+                    if ($scope.model.isDisabledDate) console.warn('model.isDisabledDate({ $date: $date }) will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({isDisabledDate:($date)=>{}}) instead');
+
+                }],
+                template: ['<md-dialog aria-label="Date Range Picker">',
+                    '<md-toolbar class="md-primary" layout="row" layout-align="start center">',
+                    '<md-button aria-label="Date Range Picker" class="md-icon-button" aria-hidden="true" ng-disabled="true">',
+                    '<md-icon md-svg-icon="data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik05IDExSDd2Mmgydi0yem00IDBoLTJ2Mmgydi0yem00IDBoLTJ2Mmgydi0yem0yLTdoLTFWMmgtMnYySDhWMkg2djJINWMtMS4xMSAwLTEuOTkuOS0xLjk5IDJMMyAyMGMwIDEuMS44OSAyIDIgMmgxNGMxLjEgMCAyLS45IDItMlY2YzAtMS4xLS45LTItMi0yem0wIDE2SDVWOWgxNHYxMXoiLz4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+"></md-icon>',
+                    '</md-button>',
+                    '<span md-truncate class="md-toolbar-tools">{{model.selectedTemplateName}}</span>',
+                    '</md-toolbar>',
+                    '<md-dialog-content>',
+                    '<md-date-range-picker ',
+                    'date-start="model.dateStart" ',
+                    'date-end="model.dateEnd" ',
+                    'show-template="config.showTemplate || model.showTemplate" ',
+                    'selected-template="model.selectedTemplate" ',
+                    'selected-template-name="model.selectedTemplateName" ',
+                    'first-day-of-week="config.firstDayOfWeek || model.firstDayOfWeek" ',
+                    'localization-map="config.localizationMap || model.localizationMap" ',
+                    'custom-templates="config.customTemplates || model.customTemplates" ',
+                    'format="config.format" ',
+                    'disable-templates="{{model.disableTemplates}}" ',
+                    'md-on-select="handleOnSelect($dates)" ',
+                    'is-disabled-date="config.isDisabledDate ? config.isDisabledDate($date) : model.isDisabledDate({ $date: $date })" ',
+                    'max-range="config.maxRange || model.maxRange" ',
+                    'one-panel="config.onePanel || model.onePanel" ',
+                    '>',
+                    '</md-date-range-picker>',
+                    '</md-dialog-content>',
+                    '<md-dialog-actions layout="row" layout-align="end center">',
+                    '<md-button ng-click="cancel()">{{getLocalizationVal("Cancel")}}</md-button>',
+                    '<md-button ng-if="!config.autoConfirm" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>',
+                    '<md-button ng-if="!config.autoConfirm" class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',
+                    '</md-dialog-actions>',
+                    '</md-dialog>'].join(''),
+                parent: angular.element(document.body),
+                multiple: config.multiple,
+                targetEvent: config.targetEvent || document.body,
+                clickOutsideToClose: true,
+                fullscreen: config.model.fullscreen
+            });
+        }
+    }
+
+}(window, angular));
diff --git a/dist/md-date-range-picker.min.css b/dist/md-date-range-picker.min.css
new file mode 100644
index 0000000..70cb8da
--- /dev/null
+++ b/dist/md-date-range-picker.min.css
@@ -0,0 +1 @@
+.md-date-range-picker__calendar .md-date-range-picker__calendar__grid,md-date-range{cursor:pointer}.md-date-range-picker [event-key] *,.md-date-range-picker__calendar__selection{pointer-events:none}md-date-range-picker{display:block;max-width:664px}md-date-range-picker .md-date-range-picker__one-panel{display:block;max-width:340px}.md-date-range-picker{position:relative;background:#FFF}.md-date-range-picker__title{text-align:center;font-size:1rem;background:#106cc8;color:#FFF;margin:0;padding:16px 0}.md-date-range-picker__month-year{text-align:center;font-size:1rem;background:#eee;margin:0;padding:0}.md-date-range-picker__month-year .md-select-icon{display:none}.md-date-range-picker__month-year md-select{margin:10px 0}.md-date-range-picker__templates{background:#EEE}.md-date-range-picker__calendar-wrapper{padding:0;width:308px;min-width:308px}.md-date-range-picker__week{background:#e0e0e0}.md-date-range-picker__calendar__grid{font-size:13px;color:#222;padding:0;display:inline-block;width:44px;height:44px;line-height:44px;text-align:center;position:relative;outline:0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:50%;background:rgba(2550,255,255,0)}.md-date-range-picker__calendar__not-in-active-month{color:rgba(0,0,0,.5)}.md-date-range-picker__calendar .md-date-range-picker__calendar__grid:hover:not(.md-date-range-picker__calendar__selected):not(.md-date-range-picker__calendar__disabled){transition:background .3s ease-out;background:rgba(0,0,0,.1)}.md-date-range-picker__calendar__selected{background:#106cc8;color:#FFF;border-radius:0}.md-date-range-picker__calendar__selected.md-date-range-picker__calendar__disabled{background:rgba(0,0,0,.2)}.md-date-range-picker__calendar__not-in-active-month.md-date-range-picker__calendar__selected{color:rgba(255,255,255,.2)}.md-date-range-picker__calendar__today{font-weight:700}.md-date-range-picker__calendar .md-date-range-picker__calendar__grid.md-date-range-picker__calendar__disabled{opacity:.3;cursor:not-allowed}.md-date-range-picker__calendar__start{border-top-left-radius:50%;border-bottom-left-radius:50%}.md-date-range-picker__calendar__end{border-top-right-radius:50%;border-bottom-right-radius:50%}.md-date-range-picker__select{z-index:100}
\ No newline at end of file
diff --git a/dist/md-date-range-picker.min.js b/dist/md-date-range-picker.min.js
new file mode 100644
index 0000000..f4e944f
--- /dev/null
+++ b/dist/md-date-range-picker.min.js
@@ -0,0 +1 @@
+(function(e,t){function n(e){var t={scope:{selectedTemplate:"=",selectedTemplateName:"=",dateStart:"=?",dateEnd:"=?",firstDayOfWeek:"=?",showTemplate:"=?",mdOnSelect:"&",localizationMap:"=?",customTemplates:"=?",disableTemplates:"@",maxRange:"=?",onePanel:"=?",isDisabledDate:"&?",format:"=?"},template:'<div class="md-date-range-picker md-whiteframe-1dp" ng-class="{\'md-date-range-picker__one-panel\':onePanel}"><div layout="column"><div layout="row" layout-margin><div class="md-date-range-picker__calendar-wrapper"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeMonth" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate()" ng-model="activeYear" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center" class="hide-gt-sm show-sm show-xs"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><div flex ng-if="!onePanel" layout="column" layout-align="center center" class="hide-sm hide-xs show-gt-sm"><span aria-label="Next Month" ng-disabled="true" aria-hidden="true" class="md-icon-button md-button"><md-icon></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date),\'md-date-range-picker__calendar__start\':isSelectedStartDate(date),\'md-date-range-picker__calendar__end\':isSelectedEndDate(date),\'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date),\'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date})}" event-key="date1" event-param="{{$index}}"><span event-key="date1" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div><div ng-show="!onePanel" class="md-date-range-picker__calendar-wrapper hide-sm hide-xs show-gt-sm"><div class="md-date-range-picker__month-year" layout="row" layout-align="center center"><div flex layout="column" layout-align="center center" style="visibility: hidden"><span aria-label="Previous Month" class="md-button md-icon-button" event-key="prev"><md-icon md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeMonth2" placeholder="{{::getLocalizationVal(\'Month\')}}" class="md-no-underline"><md-option ng-value="::month.id" ng-repeat="month in months" ng-bind="::month.name"></md-option></md-select><md-select md-container-class="md-date-range-picker__select" md-on-close="updateActiveDate(true)" ng-model="activeYear2" placeholder="{{::getLocalizationVal(\'Year\')}}" class="md-no-underline"><md-option ng-value="::year.id" ng-repeat="year in years" ng-bind="::year.name"></md-option></md-select><div flex layout="column" layout-align="center center"><span aria-label="Next Month" class="md-icon-button md-button" event-key="next"><md-icon style="transform: rotate(-180deg)" md-svg-src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyICIvPjwvZz48L3N2Zz4="></md-icon></span></div></div><div class="md-date-range-picker__week" style="font-size: 0" ng-if="!onePanel"><span class="md-date-range-picker__calendar__grid" ng-repeat="day in days">{{::day.name}}</span></div><div class="md-date-range-picker__calendar"><span ng-repeat="date in dates2" class="md-date-range-picker__calendar__grid" ng-class="{\'md-date-range-picker__calendar__selected\':inSelectedDateRange(date), \'md-date-range-picker__calendar__start\':isSelectedStartDate(date), \'md-date-range-picker__calendar__end\':isSelectedEndDate(date), \'md-date-range-picker__calendar__not-in-active-month\': !inCurrentMonth(date, true), \'md-date-range-picker__calendar__today\' : isToday(date),\'md-date-range-picker__calendar__disabled\': !isInMaxRange(date) || isDisabledDate({$date:date}) }" event-key="date2" event-param="{{$index}}"><span event-key="date2" event-param="{{$index}}" class="md-date-range-picker__calendar__selection" ng-bind="{{::date.getDate()}}"></span></span></div></div></div><div class="md-date-range-picker__templates" ng-if="showTemplate"><div ng-if="!onePanel && !maxRange" class="hide-xs hide-sm show-gt-sm" layout="row" layout-align="center center" layout-wrap><div ng-repeat="(tmpltKey,tmpltName) in selectionTemplate" class="md-button" aria-label="{{::tmpltName}}" ng-class="selectedTemplate === tmpltKey ? \'md-primary md-raised\' : \'\'" event-key="{{tmpltKey}}" ng-bind="::tmpltName" flex="20"></div><div ng-repeat="tmplt in customTemplates" class="md-button" aria-label="{{::tmplt.name}}" ng-class="selectedTemplate === tmplt.name ? \'md-primary md-raised\' : \'\'" ng-click="selectCustomRange(tmplt.name,tmplt)" event-key="Custom Template" ng-bind="::tmplt.name" flex="20"></div></div><div ng-if="!maxRange" ng-class="{\'hide-gt-sm\':!onePanel}" layout="column" layout-padding><md-input-container><label>{{::getLocalizationVal(\'Date Range Template\')}}</label><md-select md-container-class="md-date-range-picker__select" class="md-block" placeholder="{{::getLocalizationVal(\'Custom Date Range\')}}" ng-model="selectedTemplate"><md-option value=""></md-option><md-option ng-repeat="(tmpltKey,tmpltName) in selectionTemplate track by tmpltKey" aria-label="{{::tmpltName}}" ng-click="actionByKey(tmpltKey,null)" ng-bind="::tmpltName" value="{{tmpltKey}}"></md-option><md-option ng-repeat="tmplt in customTemplates" aria-label="{{::tmplt.name}}" ng-click="selectCustomRange(tmplt.name,tmplt)" ng-bind="::tmplt.name" value="{{::tmplt.name}}"></md-option></md-select></md-input-container></div></div></div></div>',controller:"mdDateRangePickerCtrl",link:function(t,n,r,i){t.actionByKey=function(e,n,r){switch(e){case"prev":t.handleClickPrevMonth(r),t.runIfNotInDigest();break;case"next":t.handleClickNextMonth(r),t.runIfNotInDigest();break;case"date1":t.handleClickDate(r,t.dates[n])?t.runIfNotInDigest(t.triggerChange):t.runIfNotInDigest();break;case"date2":t.handleClickDate(r,t.dates2[n])?t.runIfNotInDigest(t.triggerChange):t.runIfNotInDigest();break;case"TD":t.handleClickSelectToday(),t.runIfNotInDigest(t.triggerChange);break;case"YD":t.handleClickSelectYesterday(),t.runIfNotInDigest(t.triggerChange);break;case"TW":t.handleClickSelectThisWeek(),t.runIfNotInDigest(t.triggerChange);break;case"LW":t.handleClickSelectLastWeek(),t.runIfNotInDigest(t.triggerChange);break;case"TM":t.handleClickSelectThisMonth(),t.runIfNotInDigest(t.triggerChange);break;case"LM":t.handleClickSelectLastMonth(),t.runIfNotInDigest(t.triggerChange);break;case"TY":t.handleClickSelectThisYear(),t.runIfNotInDigest(t.triggerChange);break;case"LY":t.handleClickSelectLastYear(),t.runIfNotInDigest(t.triggerChange);break;case"Custom Template":t.runIfNotInDigest(t.triggerChange);break;default:}},t.runIfNotInDigest=function(e){t.$root!=null&&!t.$root.$$phase&&(t.$apply(),e&&typeof e=="function"&&e())},n.on("click",function(e){var n=e.target.getAttribute("event-key"),r=e.target.getAttribute("event-param");t.actionByKey(n,r,e)}),t.triggerChange=function(r){var i=e.getSelectedDate(t.dateStart,t.dateEnd,t.isDisabledDate,t.maxRange);t.mdOnSelect&&t.mdOnSelect({$dates:i})}}};return t}function r(e,t){function o(){var n=0,r;if(e.customTemplates!=null)for(var s=0;s<e.customTemplates.length;s++)r=e.customTemplates[s],SELECTION_TEMPLATES_CUSTOM[r.name]=r;if(e.selectedTemplate){switch(e.selectedTemplate){case"TD":e.handleClickSelectToday();break;case"YD":e.handleClickSelectYesterday();break;case"TW":e.handleClickSelectThisWeek();break;case"LW":e.handleClickSelectLastWeek();break;case"TM":e.handleClickSelectThisMonth();break;case"LM":e.handleClickSelectLastMonth();break;case"TY":e.handleClickSelectThisYear();break;case"LY":e.handleClickSelectLastYear();break;default:SELECTION_TEMPLATES_CUSTOM&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate]&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateStart&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateEnd&&(e.dateStart=SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateStart,e.dateEnd=SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].dateEnd),e.selectedTemplateName=e.selectedDateText()}e.updateActiveDate()}else e.selectedTemplate="",e.selectedTemplateName=e.selectedDateText(),e.updateActiveDate();e.$watch("selectedTemplate",function(t,n){t!==n&&e.dateStart&&!e.inCurrentMonth(e.dateStart)&&!e.inCurrentMonth(e.dateStart,!0)&&e.focusToDate(e.dateStart)}),e.$watch("dateStart",function(t,n){t!==n&&e.dateStart&&!e.inCurrentMonth(e.dateStart)&&!e.inCurrentMonth(e.dateStart,!0)&&e.focusToDate(e.dateStart)});var o=new Date(2017,0,1);e.days=[];for(n=0;n<7;n++)o.setDate(n+1+f()),e.days.push({id:n,name:a(t("date")(o,"EEE"))});var u=null;e.months=[];for(n=0;n<12;n++)u=new Date(2017,n,1),e.months.push({id:n,name:a(t("date")(u,"MMMM"))});var l=e.activeYear,c=0;e.years=[];for(c=l-10;c<l+10;c++)e.years.push({id:c,name:a(c)});for(var h in i)i.hasOwnProperty(h)&&(e.disableTemplates!=null&&e.disableTemplates!=""?e.disableTemplates.indexOf(h)<0&&(e.selectionTemplate[h]=i[h]):e.selectionTemplate[h]=i[h])}function u(t,n){e.dateStart=n.dateStart,e.dateEnd=n.dateEnd,e.selectedTemplate=t,e.selectedTemplateName=e.selectedDateText()}function a(t){var n=null;return e.localizationMap!=null&&e.localizationMap[t]!=null?n=e.localizationMap[t]:n=t,n}function f(){return[undefined,null,"",NaN].indexOf(e.firstDayOfWeek)!==-1?s:e.firstDayOfWeek}function l(e){var t=[],n=new Date(e.getFullYear(),e.getMonth(),1),r=new Date(e.getFullYear(),e.getMonth()+1,0),i=f(),s,o;for(s=1;s<=r.getDate();s++)t.push(new Date(e.getFullYear(),e.getMonth(),s));o=t[0].getDay(),s=0;while(o!==i)t.unshift(new Date(e.getFullYear(),e.getMonth(),s)),o=o<=0?6:o-1,s--;o=(t[t.length-1].getDay()+1)%7,s=1;while(o!==i)t.push(new Date(e.getFullYear(),e.getMonth()+1,s)),o=(o+1)%7,s++;return t}function c(e,t){if(!e||!t)return;var n=new Date(e.getFullYear(),e.getMonth(),e.getDate()),r=new Date(t.getFullYear(),t.getMonth(),t.getDate());return r-n}function h(e){var t=new Array(7),n=f();return t[0]="Sun",t[1]="Mon",t[2]="Tue",t[3]="Wed",t[4]="Thu",t[5]="Fri",t[6]="Sat",t[e+n%7]}function p(t,n){return n?t.getMonth()===e.activeMonth2&&t.getFullYear()===e.activeYear2:t.getMonth()===e.activeMonth&&t.getFullYear()===e.activeYear}function d(t){if(!e.dateStart)return!0;if(c(e.dateStart,e.dateEnd)!==0)return!0;var n=c(e.dateStart,t);return e.maxRange&&Math.abs(Math.ceil(n/864e5))+1<=e.maxRange||!e.maxRange}function m(t,n){var r=!1,i=!1;if(c(e.dateStart,e.dateEnd)===0){if(c(e.dateStart,n)===0)i=!0,r=!0;else if(!e.isDisabledDate||!e.isDisabledDate({$date:n})){var s=c(e.dateStart,n);if(s>0){if(e.maxRange&&Math.abs(Math.ceil(s/864e5))+1<=e.maxRange||!e.maxRange)e.dateEnd=n,i=!0,r=!0}else if(e.maxRange&&Math.abs(Math.ceil(s/864e5))+1<=e.maxRange||!e.maxRange)e.dateStart=n,i=!0,r=!0}}else if(!e.isDisabledDate||!e.isDisabledDate({$date:n}))if(!e.isDisabledDate||!e.isDisabledDate({$date:n})){if(moment(n).isBefore(moment(e.dateStart),"day"))e.dateStart=n,v=!0;else if(moment(n).isAfter(moment(e.dateEnd),"day"))e.dateEnd=n,v=!1;else if(moment(n).isBefore(moment(e.dateEnd),"day")&&moment(n).isAfter(moment(e.dateStart),"day"))v?(e.dateEnd=n,v=!1):(e.dateStart=n,v=!0);else if(moment(n).isSame(moment(e.dateEnd),"day")||moment(n).isSame(moment(e.dateStart),"day"))e.dateStart=n,e.dateEnd=n;r=!0}return r&&(e.selectedTemplate=!1,e.selectedTemplateName=e.selectedDateText()),i}function g(t){return e.dateStart&&e.dateEnd?c(e.dateStart,t)>=0&&0<=c(t,e.dateEnd):!1}function y(t){var n=new Date(e.activeYear,e.activeMonth,1),r=new Date(e.activeYear2,e.activeMonth2,1);t?(n=new Date(e.activeYear2,e.activeMonth2-1,1),e.activeYear=n.getFullYear(),e.activeMonth=n.getMonth()):(r=new Date(e.activeYear,e.activeMonth+1,1),e.activeYear2=r.getFullYear(),e.activeMonth2=r.getMonth()),e.focusToDate(n)}function b(t){var n=new Date(e.activeDate.getFullYear(),e.activeDate.getMonth()+1,1);e.focusToDate(n)}function w(t){var n=new Date(e.activeDate.getFullYear(),e.activeDate.getMonth()-1,1);e.focusToDate(n)}function E(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate());e.dateStart=n,e.dateEnd=n,e.selectedTemplate="TD",e.selectedTemplateName=e.selectedDateText()}function S(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate()-1);e.dateStart=n,e.dateEnd=n,e.selectedTemplate="YD",e.selectedTemplateName=e.selectedDateText()}function x(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate()),r=new Date(n.getFullYear(),n.getMonth(),n.getDate()-(n.getDay()-f())),i=new Date(n.getFullYear(),n.getMonth(),n.getDate()+(6-n.getDay()+f()));e.dateStart=r,e.dateEnd=i,e.selectedTemplate="TW",e.selectedTemplateName=e.selectedDateText()}function T(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),t.getDate()-7),r=new Date(n.getFullYear(),n.getMonth(),n.getDate()-(n.getDay()-f())),i=new Date(n.getFullYear(),n.getMonth(),n.getDate()+(6-n.getDay()+f()));e.dateStart=r,e.dateEnd=i,e.selectedTemplate="LW",e.selectedTemplateName=e.selectedDateText()}function N(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),1),r=new Date(t.getFullYear(),t.getMonth()+1,0);e.dateStart=n,e.dateEnd=r,e.selectedTemplate="TM",e.selectedTemplateName=e.selectedDateText()}function C(){var t=new Date,n=new Date(t.getFullYear(),t.getMonth(),0),r=new Date(n.getFullYear(),n.getMonth(),1),i=new Date(n.getFullYear(),n.getMonth()+1,0);e.dateStart=r,e.dateEnd=i,e.selectedTemplate="LM",e.selectedTemplateName=e.selectedDateText()}function k(){var t=new Date,n=new Date(t.getFullYear(),0,1),r=new Date(t.getFullYear(),11,31);e.dateStart=n,e.dateEnd=r,e.selectedTemplate="TY",e.selectedTemplateName=e.selectedDateText()}function L(){var t=new Date,n=new Date(t.getFullYear()-1,0,1),r=new Date(t.getFullYear()-1,11,31);e.dateStart=n,e.dateEnd=r,e.selectedTemplate="LY",e.selectedTemplateName=e.selectedDateText()}function A(t){return c(e.dateStart,t)===0}function O(t){return c(e.dateEnd,t)===0}function M(e){return c(e,new Date)===0}function _(){return e.format&&typeof e.format=="function"?e.format(e.dateStart,e.dateEnd,e.selectedTemplate,e.selectedTemplateName):!e.dateStart||!e.dateEnd?"":e.selectedTemplate?SELECTION_TEMPLATES_CUSTOM!=null&&SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate]!=null?SELECTION_TEMPLATES_CUSTOM[e.selectedTemplate].name:i[e.selectedTemplate]:c(e.dateStart,e.dateEnd)===0?t("date")(e.dateStart,"dd MMM yyyy"):t("date")(e.dateStart,"dd"+(e.dateStart.getMonth()!==e.dateEnd.getMonth()||e.dateStart.getFullYear()!==e.dateEnd.getFullYear()?" MMM":"")+(e.dateStart.getFullYear()!==e.dateEnd.getFullYear()?" yyyy":""))+" - "+t("date")(e.dateEnd,"dd MMM yyyy")}function D(t){var n=new Date(t.getFullYear(),t.getMonth()+1,1);e.activeDate=t,e.activeMonth=t.getMonth(),e.activeYear=t.getFullYear(),e.activeDate2=n,e.activeMonth2=n.getMonth(),e.activeYear2=n.getFullYear(),e.dates=l(t),e.dates2=l(n)}var n=e,r=2,i={TD:a("Today"),YD:a("Yesterday"),TW:a("This Week"),LW:a("Last Week"),TM:a("This Month"),LM:a("Last Month"),TY:a("This Year"),LY:a("Last Year")},s=1;SELECTION_TEMPLATES_CUSTOM={},e.isMenuContainer=!1,e.days=[],e.label="Date range picker",e.dates=[],e.dates2=[],e.numberOfMonthToDisplay=2,e.today=new Date,e.dateStart&&e.dateStart.setHours(0,0,0,0),e.dateEnd&&e.dateEnd.setHours(23,59,59,999),e.firstDayOfMonth=e.dateStart?new Date(e.dateStart.getFullYear(),e.dateStart.getMonth(),1):Date(e.today.getFullYear(),e.today.getMonth(),1),e.lastDayOfMonth=e.dateStart?new Date(e.dateStart.getFullYear(),e.dateStart.getMonth()+1,0):Date(e.today.getFullYear(),e.today.getMonth()+1,0),e.activeDate=e.dateStart||e.today,e.activeDate2=new Date(e.activeDate.getFullYear(),e.activeDate.getMonth()+1,1),e.activeMonth=e.activeDate.getMonth(),e.activeYear=e.activeDate.getFullYear(),e.activeMonth2=e.activeDate2.getMonth(),e.activeYear2=e.activeDate2.getFullYear(),e.months=[],e.years=[],e.inCurrentMonth=p,e.isToday=M,e.handleClickDate=m,e.inSelectedDateRange=g,e.isSelectedStartDate=A,e.isSelectedEndDate=O,e.updateActiveDate=y,e.selectedDateText=_,e.focusToDate=D,e.handleClickNextMonth=b,e.handleClickPrevMonth=w,e.handleClickSelectToday=E,e.handleClickSelectYesterday=S,e.handleClickSelectThisWeek=x,e.handleClickSelectLastWeek=T,e.handleClickSelectThisMonth=N,e.handleClickSelectLastMonth=C,e.handleClickSelectThisYear=k,e.handleClickSelectLastYear=L,e.getLocalizationVal=a,e.selectCustomRange=u,e.isInMaxRange=d,e.selectionTemplate={},o();var v=!0}function i(){return{scope:{ngModel:"=ngModel",autoConfirm:"=autoConfirm",ngDisabled:"=ngDisabled",showTemplate:"=",placeholder:"@",isDisabledDate:"&",localizationMap:"=?",customTemplates:"=?",disableTemplates:"@",mdOnSelect:"&",onePanel:"=?",format:"=?",maxRange:"=?",firstDayOfWeek:"@"},template:['<md-menu ng-disabled="ngDisabled">','<span class="md-select-value" ng-click="!ngDisabled && (($mdMenu && $mdMenu.open) ? $mdMenu.open($event) : $mdOpenMenu($event))">',"  <span>{{ngModel.selectedTemplateName || placeholder}}</span>",'  <span class="md-select-icon" aria-hidden="true"></span>',"</span>",'<md-menu-content class="md-custom-menu-content" style="max-height: none!important; height: auto!important; padding: 0!important;">','    <span style="text-align: left; padding: 12px 20px 0 20px" disabled>{{ngModel.selectedTemplateName || placeholder}}</span>','    <md-date-range-picker first-day-of-week="firstDayOfWeek" ','     md-on-select="autoConfirm && ok($dates)" ','     date-start="ngModel.dateStart" ','     date-end="ngModel.dateEnd" ','     selected-template="ngModel.selectedTemplate" ','     show-template="showTemplate" ','     localization-map="localizationMap" ','     custom-templates="customTemplates" ','     disable-templates="{{disableTemplates}}" ','     is-disabled-date="isDisabledDate({ $date: $date })" ','     max-range="maxRange" ','     one-panel="onePanel" ','     format="format" ','     selected-template-name="ngModel.selectedTemplateName"></md-date-range-picker>','<p ng-if="!autoConfirm" layout="row" layout-align="end center">','<md-button ng-if="ngModel.showClear" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>','<md-button class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',"</p>","</md-menu-content>","</md-menu>"].join(""),controller:["$scope","$mdMenu",function(e,t){e.ok=function(r){e.mdOnSelect({$dates:r}),t.hide()},e.clear=function(){e.ngModel.selectedTemplateName="",e.ngModel.selectedTemplate=null,e.ngModel.dateStart=null,e.ngModel.dateEnd=null},e.getLocalizationVal=function(n){var r=null;return e.ngModel&&e.ngModel.localizationMap!=null&&e.ngModel.localizationMap[n]!=null?r=e.ngModel.localizationMap[n]:r=n,r}}]}}function s(e){function r(e,t,n,r){var i=[],s=t.getTime(),o=e,u=0,a=e.getFullYear(),f=e.getMonth(),l=e.getDate();while(o.getTime()<=s){n&&!n({$date:o})&&i.push(o),u++,o=new Date(a,f,l+u);if(u>(r||1e4))break}return i}function i(n){return e.show({locals:{mdDateRangePickerServiceModel:t.copy(n.model),mdDateRangePickerServiceConfig:t.copy(n)},controller:["$scope","mdDateRangePickerServiceModel","mdDateRangePickerServiceConfig",function(t,n,r){t.model=n||{},t.config=r||{},t.model.selectedTemplateName=t.model.selectedTemplateName||"",t.ok=function(){t.model.dateStart&&t.model.dateStart.setHours(0,0,0,0),t.model.dateEnd&&t.model.dateEnd.setHours(23,59,59,999),e.hide(t.model)},t.cancel=function(){e.cancel()},t.clear=function(){t.model.selectedTemplateName="",t.model.selectedTemplate=null,t.model.dateStart=null,t.model.dateEnd=null},t.handleOnSelect=function(e){typeof t.config.mdOnSelect=="function"&&t.config.mdOnSelect(e),t.config.autoConfirm&&t.ok()},t.getLocalizationVal=function(n){var r=null;return t.model&&t.model.localizationMap!=null&&t.model.localizationMap[n]!=null?r=t.model.localizationMap[n]:r=n,r},t.model.customTemplates&&console.warn("model.customTemplates will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({customTemplates}) instead"),t.model.localizationMap&&console.warn("model.localizationMap will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({localizationMap}) instead"),t.model.firstDayOfWeek&&console.warn("model.firstDayOfWeek will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({firstDayOfWeek}) instead"),t.model.showTemplate&&console.warn("model.showTemplate will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({showTemplate}) instead"),t.model.maxRange&&console.warn("model.maxRange will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({maxRange}) instead"),t.model.onePanel&&console.warn("model.onePanel will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({onePanel}) instead"),t.model.isDisabledDate&&console.warn("model.isDisabledDate({ $date: $date }) will be removed from model on next rlease, please use root config e.g. $mdDateRangePicker.show({isDisabledDate:($date)=>{}}) instead")}],template:['<md-dialog aria-label="Date Range Picker">','<md-toolbar class="md-primary" layout="row" layout-align="start center">','<md-button aria-label="Date Range Picker" class="md-icon-button" aria-hidden="true" ng-disabled="true">','<md-icon md-svg-icon="data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik05IDExSDd2Mmgydi0yem00IDBoLTJ2Mmgydi0yem00IDBoLTJ2Mmgydi0yem0yLTdoLTFWMmgtMnYySDhWMkg2djJINWMtMS4xMSAwLTEuOTkuOS0xLjk5IDJMMyAyMGMwIDEuMS44OSAyIDIgMmgxNGMxLjEgMCAyLS45IDItMlY2YzAtMS4xLS45LTItMi0yem0wIDE2SDVWOWgxNHYxMXoiLz4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KPC9zdmc+"></md-icon>',"</md-button>",'<span md-truncate class="md-toolbar-tools">{{model.selectedTemplateName}}</span>',"</md-toolbar>","<md-dialog-content>","<md-date-range-picker ",'date-start="model.dateStart" ','date-end="model.dateEnd" ','show-template="config.showTemplate || model.showTemplate" ','selected-template="model.selectedTemplate" ','selected-template-name="model.selectedTemplateName" ','first-day-of-week="config.firstDayOfWeek || model.firstDayOfWeek" ','localization-map="config.localizationMap || model.localizationMap" ','custom-templates="config.customTemplates || model.customTemplates" ','format="config.format" ','disable-templates="{{model.disableTemplates}}" ','md-on-select="handleOnSelect($dates)" ','is-disabled-date="config.isDisabledDate ? config.isDisabledDate($date) : model.isDisabledDate({ $date: $date })" ','max-range="config.maxRange || model.maxRange" ','one-panel="config.onePanel || model.onePanel" ',">","</md-date-range-picker>","</md-dialog-content>",'<md-dialog-actions layout="row" layout-align="end center">','<md-button ng-click="cancel()">{{getLocalizationVal("Cancel")}}</md-button>','<md-button ng-if="!config.autoConfirm" class="md-raised" ng-click="clear()">{{getLocalizationVal("Clear")}}</md-button>','<md-button ng-if="!config.autoConfirm" class="md-raised md-primary" ng-click="ok()">{{getLocalizationVal("Ok")}}</md-button>',"</md-dialog-actions>","</md-dialog>"].join(""),parent:t.element(document.body),multiple:n.multiple,targetEvent:n.targetEvent||document.body,clickOutsideToClose:!0,fullscreen:n.model.fullscreen})}var n=this;n.show=i,n.getSelectedDate=r}t.module("ngMaterialDateRangePicker",["ngMaterial"]).directive("mdDateRangePicker",n).directive("mdDateRange",i).controller("mdDateRangePickerCtrl",r).service("$mdDateRangePicker",s),n.$inject=["$mdDateRangePicker"],r.$inject=["$scope","$filter"],s.$inject=["$mdDialog"]})(window,angular)
\ No newline at end of file