0)),(j=c.months)[g]||(j[g]={name:a.format("MMMM YYYY"),weeks:[]}),(k=c.months[g].weeks)[i]||(k[i]=[]),c.months[g].weeks[i][e]={date:a,selected:h,disabled:f,start:c.start&&c.start.unix()===a.unix()}}),g=c.months,e=0,f=g.length;f>e;e++)a=g[e],a.weeks[0]||a.weeks.splice(0,1);return j()},c.show=function(){return c.selection=c.model,h(),l(),c.visible=!0},c.hide=function(a){return null!=a&&"function"==typeof a.stopPropagation&&a.stopPropagation(),c.visible=!1,c.start=null},c.prevent_select=function(a){return null!=a&&"function"==typeof a.stopPropagation?a.stopPropagation():void 0},c.ok=function(a){return null!=a&&"function"==typeof a.stopPropagation&&a.stopPropagation(),c.model=c.selection,b(function(){return c.callback?c.callback():void 0}),c.hide()},c.select=function(a,b){return null!=b&&"function"==typeof b.stopPropagation&&b.stopPropagation(),a.disabled?void 0:(c.showRanged?(c.selecting=!c.selecting,c.selecting?c.start=a.date:(c.selection=moment().range(c.start,a.date),c.start=null)):c.selection=moment(a.date),l())},c.move=function(a,b){return null!=b&&"function"==typeof b.stopPropagation&&b.stopPropagation(),c.showRanged?c.range=moment().range(c.range.start.add(a,"months").startOf("month").startOf("day"),c.range.start.clone().add(2,"months").endOf("month").startOf("day")):(c.date.add(a,"months"),c.range=moment().range(moment(c.date).startOf("month"),moment(c.date).endOf("month"))),l()},c.handlePickerClick=function(a){return null!=a&&"function"==typeof a.stopPropagation?a.stopPropagation():void 0},c.$watch("quick",function(a){return a&&a!==f?(c.selection=c.quick,c.selecting=!1,c.start=null,h(),l()):void 0}),c.$watch("customSelectOptions",function(a){return"undefined"!=typeof customSelectOptions&&null!==customSelectOptions?c.quickListDefinitions=a:void 0}),e=function(){return c.$apply(function(){return c.hide()}),!0},angular.element(document).bind("click",e),c.$on("$destroy",function(){return angular.element(document).unbind("click",e)}),k(),h(),l()}}}])}).call(this);
\ No newline at end of file
diff --git a/src/angular-date-range-picker.coffee b/src/angular-date-range-picker.coffee
index 88ed1d1..03154d1 100644
--- a/src/angular-date-range-picker.coffee
+++ b/src/angular-date-range-picker.coffee
@@ -1,6 +1,7 @@
angular.module "dateRangePicker", ['pasvaz.bindonce']
-angular.module("dateRangePicker").directive "dateRangePicker", ["$compile", "$timeout", ($compile, $timeout) ->
+angular.module("dateRangePicker").directive "dateRangePicker", ["$compile", "$timeout", '$http', '$templateCache', '$q', ($compile, $timeout, $http, $templateCache, $q) ->
+
# constants
pickerTemplate = """
@@ -40,11 +41,7 @@ angular.module("dateRangePicker").directive "dateRangePicker", ["$compile", "$ti
"""
- CUSTOM = "CUSTOM"
-
- restrict: "AE"
- replace: true
- template: """
+ inputTemplate = """
{{ model.start.format("ll") }} - {{ model.end.format("ll") }}
@@ -56,14 +53,53 @@ angular.module("dateRangePicker").directive "dateRangePicker", ["$compile", "$ti
"""
+ CUSTOM = "CUSTOM"
+
+ getTemplate = (templateUrl) ->
+ templateLoader = $q.defer()
+ if templateUrl
+ $http.get(templateUrl, {cache: $templateCache})
+ .success (response) ->
+ templateLoader.resolve(response)
+ .error (response) ->
+ templateLoader.reject(response)
+ new Error "Could not load angular-date-range-picker template, reason #{response}"
+ else
+ templateLoader.resolve(inputTemplate)
+
+ return templateLoader.promise
+
+ restrict: "AE"
+ replace: true
+
scope:
model: "=ngModel" # can't use ngModelController, we need isolated scope
customSelectOptions: "="
ranged: "="
pastDates: "@"
callback: "&"
+ pickerTemplateUrl: "="
+ inputTemplateUrl: "="
link: ($scope, element, attrs) ->
+ getTemplate($scope.inputTemplateUrl).then (html) ->
+ newEl = $compile(html)($scope);
+ element.replaceWith(newEl);
+ element = angular.element(newEl)
+ # create DOM and bind event
+ if $scope.pickerTemplateUrl
+ domEl = $compile(angular.element(''))($scope)
+ else
+ domEl = $compile(angular.element(pickerTemplate))($scope)
+
+ element.append(domEl)
+
+ # Any binding to element needs to be done here
+ element.bind "click", (e) ->
+ e?.stopPropagation?()
+ $scope.$apply ->
+ if $scope.visible then $scope.hide() else $scope.show()
+
$scope.quickListDefinitions = $scope.customSelectOptions
$scope.quickListDefinitions ?= [
{
@@ -259,15 +295,6 @@ angular.module("dateRangePicker").directive "dateRangePicker", ["$compile", "$ti
return unless customSelectOptions?
$scope.quickListDefinitions = value
- # create DOM and bind event
- domEl = $compile(angular.element(pickerTemplate))($scope)
- element.append(domEl)
-
- element.bind "click", (e) ->
- e?.stopPropagation?()
- $scope.$apply ->
- if $scope.visible then $scope.hide() else $scope.show()
-
documentClickFn = (e) ->
$scope.$apply -> $scope.hide()
true
diff --git a/test/index.html b/test/index.html
index 3d9d4bb..020655d 100644
--- a/test/index.html
+++ b/test/index.html
@@ -22,6 +22,11 @@
$scope.date = null
})
+ angular.module("testapp").run(function($templateCache){
+ $templateCache.put('custom_picker.html', 'Greetings from custom picker template
');
+ $templateCache.put('custom_input.html', 'Custom picker {{ model.start.format("ll") }} - {{ model.end.format("ll") }}');
+
+ });