From 69a5b4fbd4e7f1d2663c69705c1a0f8b59a7815f Mon Sep 17 00:00:00 2001 From: Gillardo Date: Wed, 27 May 2015 20:28:02 +0100 Subject: [PATCH] appendToBody Error Issue #20 pull request causing error with $document.width() which is undefined, unless you have jquery. Removed this and applied left positioning --- bower.json | 2 +- datetime-picker.js | 60 +++++--------------------------- dist/datetime-picker.js | 64 ++++++----------------------------- dist/datetime-picker.min.js | 6 ++-- dist/datetime-picker.tpls.js | 2 +- package.json | 2 +- template/datetime-picker.html | 2 +- 7 files changed, 27 insertions(+), 111 deletions(-) diff --git a/bower.json b/bower.json index 1a101e2..577e4f4 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "bootstrap-ui-datetime-picker", - "version": "1.0.21", + "version": "1.0.22", "homepage": "https://github.com/Gillardo/bootstrap-ui-datetime-picker", "authors": [ "Gillardo " diff --git a/datetime-picker.js b/datetime-picker.js index 72eaa4a..e55d72f 100644 --- a/datetime-picker.js +++ b/datetime-picker.js @@ -1,21 +1,4 @@ -/** - * Add parents() to jqLite. - */ -if (!angular.element.prototype.parents) { - angular.element.prototype.parents = function() { - var res = []; - for (var i = 0; i < this.length; i++) { - var el = this[i]; - while (el.parentNode && el.parentNode.nodeType == 1) { - res.push(el.parentNode); - el = el.parentNode; - } - } - return angular.element(res); - }; -} - -angular.module('ui.bootstrap.datetimepicker', ['ui.bootstrap.dateparser', 'ui.bootstrap.position']) +angular.module('ui.bootstrap.datetimepicker', ['ui.bootstrap.dateparser', 'ui.bootstrap.position']) .directive('datetimePicker', ['$compile', '$parse', '$document', '$timeout', '$position', 'dateFilter', 'dateParser', 'datepickerPopupConfig', function ($compile, $parse, $document, $timeout, $position, dateFilter, dateParser, datepickerPopupConfig) { return { @@ -143,18 +126,6 @@ angular.module('ui.bootstrap.datetimepicker', ['ui.bootstrap.dateparser', 'ui.bo } else if (angular.isString(viewValue)) { var date = dateParser.parse(viewValue, dateFormat) || new Date(viewValue); - // has problem parsing a time only, so create a date - // with the time added on the end, and a dummy formatter - // and use this to see if the time is valid - if (scope.enableTime && !scope.enableDate) { - if (viewValue.length == dateFormat.length) { - var timeFormat = 'EEE MMM dd yyyy ' + dateFormat; - var newTime = 'Fri Mar 12 2015 ' + viewValue; - - date = dateParser.parse(newTime, timeFormat) || new Date(newTime); - } - } - if (isNaN(date)) { ngModel.$setValidity('date', false); return undefined; @@ -248,39 +219,26 @@ angular.module('ui.bootstrap.datetimepicker', ['ui.bootstrap.dateparser', 'ui.bo scope.keydown = function (evt) { if (evt.which === 27) { evt.preventDefault(); - evt.stopPropagation(); + + if (scope.isOpen) { + evt.stopPropagation(); + } scope.close(); } else if (evt.which === 40 && !scope.isOpen) { scope.isOpen = true; } }; - var reposition = function() { - scope.position = appendToBody ? $position.offset(element) : $position.position(element); - scope.position.top = scope.position.top + element.prop('offsetHeight'); - if (appendToBody) { - scope.position.right = $document.width() - scope.position.left - element.parent().width(); - } - }; - - var repositionScrollHandler = function() { - console.log('reposition'); - scope.$apply(reposition); - }; - scope.$watch('isOpen', function (value) { if (value) { scope.$broadcast('datepicker.focus'); - reposition(); - if (appendToBody) { - element.parents().on('scroll', repositionScrollHandler); - } + + scope.position = appendToBody ? $position.offset(element) : $position.position(element); + scope.position.top = scope.position.top + element.prop('offsetHeight'); + $document.bind('mousedown', documentClickBind); } else { $document.unbind('mousedown', documentClickBind); - if (appendToBody) { - element.parents().off('scroll', repositionScrollHandler); - } } }); diff --git a/dist/datetime-picker.js b/dist/datetime-picker.js index 49dcec0..6c811a8 100644 --- a/dist/datetime-picker.js +++ b/dist/datetime-picker.js @@ -1,23 +1,6 @@ // https://github.com/Gillardo/bootstrap-ui-datetime-picker -// Version: 1.0.21 -// Released: 2015-05-22 -/** - * Add parents() to jqLite. - */ -if (!angular.element.prototype.parents) { - angular.element.prototype.parents = function() { - var res = []; - for (var i = 0; i < this.length; i++) { - var el = this[i]; - while (el.parentNode && el.parentNode.nodeType == 1) { - res.push(el.parentNode); - el = el.parentNode; - } - } - return angular.element(res); - }; -} - +// Version: 1.0.22 +// Released: 2015-05-27 angular.module('ui.bootstrap.datetimepicker', ['ui.bootstrap.dateparser', 'ui.bootstrap.position']) .directive('datetimePicker', ['$compile', '$parse', '$document', '$timeout', '$position', 'dateFilter', 'dateParser', 'datepickerPopupConfig', function ($compile, $parse, $document, $timeout, $position, dateFilter, dateParser, datepickerPopupConfig) { @@ -146,18 +129,6 @@ angular.module('ui.bootstrap.datetimepicker', ['ui.bootstrap.dateparser', 'ui.bo } else if (angular.isString(viewValue)) { var date = dateParser.parse(viewValue, dateFormat) || new Date(viewValue); - // has problem parsing a time only, so create a date - // with the time added on the end, and a dummy formatter - // and use this to see if the time is valid - if (scope.enableTime && !scope.enableDate) { - if (viewValue.length == dateFormat.length) { - var timeFormat = 'EEE MMM dd yyyy ' + dateFormat; - var newTime = 'Fri Mar 12 2015 ' + viewValue; - - date = dateParser.parse(newTime, timeFormat) || new Date(newTime); - } - } - if (isNaN(date)) { ngModel.$setValidity('date', false); return undefined; @@ -251,39 +222,26 @@ angular.module('ui.bootstrap.datetimepicker', ['ui.bootstrap.dateparser', 'ui.bo scope.keydown = function (evt) { if (evt.which === 27) { evt.preventDefault(); - evt.stopPropagation(); + + if (scope.isOpen) { + evt.stopPropagation(); + } scope.close(); } else if (evt.which === 40 && !scope.isOpen) { scope.isOpen = true; } }; - var reposition = function() { - scope.position = appendToBody ? $position.offset(element) : $position.position(element); - scope.position.top = scope.position.top + element.prop('offsetHeight'); - if (appendToBody) { - scope.position.right = $document.width() - scope.position.left - element.parent().width(); - } - }; - - var repositionScrollHandler = function() { - console.log('reposition'); - scope.$apply(reposition); - }; - scope.$watch('isOpen', function (value) { if (value) { scope.$broadcast('datepicker.focus'); - reposition(); - if (appendToBody) { - element.parents().on('scroll', repositionScrollHandler); - } + + scope.position = appendToBody ? $position.offset(element) : $position.position(element); + scope.position.top = scope.position.top + element.prop('offsetHeight'); + $document.bind('mousedown', documentClickBind); } else { $document.unbind('mousedown', documentClickBind); - if (appendToBody) { - element.parents().off('scroll', repositionScrollHandler); - } } }); @@ -368,7 +326,7 @@ angular.module('ui.bootstrap.datetimepicker').run(['$templateCache', function($t 'use strict'; $templateCache.put('template/datetime-picker.html', - "" + "" ); }]); diff --git a/dist/datetime-picker.min.js b/dist/datetime-picker.min.js index d13c71a..b429a7c 100644 --- a/dist/datetime-picker.min.js +++ b/dist/datetime-picker.min.js @@ -1,4 +1,4 @@ // https://github.com/Gillardo/bootstrap-ui-datetime-picker -// Version: 1.0.21 -// Released: 2015-05-22 -angular.element.prototype.parents||(angular.element.prototype.parents=function(){for(var a=[],b=0;b
');s.attr({"ng-model":"date","ng-change":"dateSelection()"});var t=angular.element(s.children()[0]);j.datepickerOptions&&angular.forEach(d.$parent.$eval(j.datepickerOptions),function(a,b){t.attr(l(b),a)});var u=angular.element(s.children()[1]);j.timepickerOptions&&angular.forEach(d.$parent.$eval(j.timepickerOptions),function(a,b){u.attr(l(b),a)}),j.datepickerMode||(j.datepickerMode="day"),d.watchData={},angular.forEach(["minDate","maxDate","datepickerMode"],function(a){if(j[a]){var c=b(j[a]);if(d.$parent.$watch(c,function(b){d.watchData[a]=b}),t.attr(l(a),"watchData."+a),"datepickerMode"===a){var e=c.assign;d.$watch("watchData."+a,function(a,b){a!==b&&e(d.$parent,a)})}}}),j.dateDisabled&&t.attr("date-disabled","dateDisabled({ date: date, mode: mode })"),k.$parsers.unshift(n),d.dateSelection=function(a){d.enableDate&&d.enableTime&&"time"===d.showPicker&&o&&null!==o&&(null!==d.date||a||null!=a)&&(a&&null!=a?(o.setHours(a.getHours()),o.setMinutes(a.getMinutes()),o.setSeconds(a.getSeconds()),o.setMilliseconds(a.getMilliseconds()),a=new Date(o)):(o.setHours(d.date.getHours()),o.setMinutes(d.date.getMinutes()),o.setSeconds(d.date.getSeconds()),o.setMilliseconds(d.date.getMilliseconds()))),angular.isDefined(a)&&(d.date=a),o=d.date,k.$setViewValue(d.date),k.$render(),q&&"time"!=d.showPicker&&(d.enableTime?d.showPicker="time":(d.isOpen=!1,i[0].focus()))},i.bind("input change keyup",function(){d.$apply(function(){d.date=k.$modelValue})}),k.$render=function(){var a=k.$viewValue?n(k.$viewValue):null,b=a?f(a,p):"";i.val(b),d.date=a};var v=function(a){d.isOpen&&a.target!==i[0]&&d.$apply(function(){d.isOpen=!1})},w=function(a){d.keydown(a)};i.bind("keydown",w),d.keydown=function(a){27===a.which?(a.preventDefault(),a.stopPropagation(),d.close()):40!==a.which||d.isOpen||(d.isOpen=!0)};var x=function(){d.position=r?e.offset(i):e.position(i),d.position.top=d.position.top+i.prop("offsetHeight"),r&&(d.position.right=c.width()-d.position.left-i.parent().width())},y=function(){console.log("reposition"),d.$apply(x)};d.$watch("isOpen",function(a){a?(d.$broadcast("datepicker.focus"),x(),r&&i.parents().on("scroll",y),c.bind("mousedown",v)):(c.unbind("mousedown",v),r&&i.parents().off("scroll",y))}),d.isTodayDisabled=function(){return m(new Date)},d.select=function(a){if("today"===a||"now"==a){var b=new Date;angular.isDate(k.$modelValue)?(a=new Date(k.$modelValue),a.setFullYear(b.getFullYear(),b.getMonth(),b.getDate()),a.setHours(b.getHours(),b.getMinutes(),b.getSeconds(),b.getMilliseconds())):a=b}d.dateSelection(a)},d.close=function(){d.isOpen=!1,i[0].focus()},d.changePicker=function(a){d.showPicker=a};var z=a(s)(d);s.remove(),r?c.find("body").append(z):i.after(z),d.$on("$destroy",function(){z.remove(),i.unbind("keydown",w),c.unbind("mousedown",v)})}}}]).directive("datePickerWrap",function(){return{restrict:"EA",replace:!0,transclude:!0,templateUrl:"template/datetime-picker.html",link:function(a,b){b.bind("mousedown",function(a){a.preventDefault(),a.stopPropagation()})}}}).directive("timePickerWrap",function(){return{restrict:"EA",replace:!0,transclude:!0,templateUrl:"template/datetime-picker.html",link:function(a,b){b.bind("mousedown",function(a){a.preventDefault(),a.stopPropagation()})}}}),angular.module("ui.bootstrap.datetimepicker").run(["$templateCache",function(a){"use strict";a.put("template/datetime-picker.html",'
')}]); \ No newline at end of file +// Version: 1.0.22 +// Released: 2015-05-27 +angular.module("ui.bootstrap.datetimepicker",["ui.bootstrap.dateparser","ui.bootstrap.position"]).directive("datetimePicker",["$compile","$parse","$document","$timeout","$position","dateFilter","dateParser","datepickerPopupConfig",function(a,b,c,d,e,f,g,h){return{restrict:"A",require:"ngModel",scope:{isOpen:"=?",enableDate:"=?",enableTime:"=?",todayText:"@",nowText:"@",dateText:"@",timeText:"@",clearText:"@",closeText:"@",dateDisabled:"&"},link:function(d,i,j,k){function l(a){return a.replace(/([A-Z])/g,function(a){return"-"+a.toLowerCase()})}function m(a){return j.dateDisabled&&angular.isDefined(a)&&d.dateDisabled({date:a,mode:d.watchData.datepickerMode})}function n(a){if(a){if(angular.isDate(a)&&!isNaN(a))return k.$setValidity("date",!0),a;if(angular.isString(a)){var b=g.parse(a,p)||new Date(a);return isNaN(b)?void k.$setValidity("date",!1):(k.$setValidity("date",!0),b)}return void k.$setValidity("date",!1)}return k.$setValidity("date",!0),null}var o,p="dd MMM yyyy HH:mm:ss",q=angular.isDefined(j.closeOnDateSelection)?d.$parent.$eval(j.closeOnDateSelection):h.closeOnDateSelection,r=angular.isDefined(j.datepickerAppendToBody)?d.$parent.$eval(j.datepickerAppendToBody):h.appendToBody;d.showButtonBar=angular.isDefined(j.showButtonBar)?d.$parent.$eval(j.showButtonBar):h.showButtonBar,d.enableDate=!(0==d.enableDate),d.enableTime=!(0==d.enableTime),d.showPicker=d.enableDate?"date":"time",d.todayText=d.todayText||"Today",d.nowText=d.nowText||"Now",d.clearText=d.clearText||"Clear",d.closeText=d.closeText||"Close",d.dateText=d.dateText||"Date",d.timeText=d.timeText||"Time",d.getText=function(a){return d[a+"Text"]||h[a+"Text"]},j.$observe("datetimePicker",function(a){p=a||h.datepickerPopup,k.$render()});var s=angular.element('
');s.attr({"ng-model":"date","ng-change":"dateSelection()"});var t=angular.element(s.children()[0]);j.datepickerOptions&&angular.forEach(d.$parent.$eval(j.datepickerOptions),function(a,b){t.attr(l(b),a)});var u=angular.element(s.children()[1]);j.timepickerOptions&&angular.forEach(d.$parent.$eval(j.timepickerOptions),function(a,b){u.attr(l(b),a)}),j.datepickerMode||(j.datepickerMode="day"),d.watchData={},angular.forEach(["minDate","maxDate","datepickerMode"],function(a){if(j[a]){var c=b(j[a]);if(d.$parent.$watch(c,function(b){d.watchData[a]=b}),t.attr(l(a),"watchData."+a),"datepickerMode"===a){var e=c.assign;d.$watch("watchData."+a,function(a,b){a!==b&&e(d.$parent,a)})}}}),j.dateDisabled&&t.attr("date-disabled","dateDisabled({ date: date, mode: mode })"),k.$parsers.unshift(n),d.dateSelection=function(a){d.enableDate&&d.enableTime&&"time"===d.showPicker&&o&&null!==o&&(null!==d.date||a||null!=a)&&(a&&null!=a?(o.setHours(a.getHours()),o.setMinutes(a.getMinutes()),o.setSeconds(a.getSeconds()),o.setMilliseconds(a.getMilliseconds()),a=new Date(o)):(o.setHours(d.date.getHours()),o.setMinutes(d.date.getMinutes()),o.setSeconds(d.date.getSeconds()),o.setMilliseconds(d.date.getMilliseconds()))),angular.isDefined(a)&&(d.date=a),o=d.date,k.$setViewValue(d.date),k.$render(),q&&"time"!=d.showPicker&&(d.enableTime?d.showPicker="time":(d.isOpen=!1,i[0].focus()))},i.bind("input change keyup",function(){d.$apply(function(){d.date=k.$modelValue})}),k.$render=function(){var a=k.$viewValue?n(k.$viewValue):null,b=a?f(a,p):"";i.val(b),d.date=a};var v=function(a){d.isOpen&&a.target!==i[0]&&d.$apply(function(){d.isOpen=!1})},w=function(a){d.keydown(a)};i.bind("keydown",w),d.keydown=function(a){27===a.which?(a.preventDefault(),d.isOpen&&a.stopPropagation(),d.close()):40!==a.which||d.isOpen||(d.isOpen=!0)},d.$watch("isOpen",function(a){a?(d.$broadcast("datepicker.focus"),d.position=r?e.offset(i):e.position(i),d.position.top=d.position.top+i.prop("offsetHeight"),c.bind("mousedown",v)):c.unbind("mousedown",v)}),d.isTodayDisabled=function(){return m(new Date)},d.select=function(a){if("today"===a||"now"==a){var b=new Date;angular.isDate(k.$modelValue)?(a=new Date(k.$modelValue),a.setFullYear(b.getFullYear(),b.getMonth(),b.getDate()),a.setHours(b.getHours(),b.getMinutes(),b.getSeconds(),b.getMilliseconds())):a=b}d.dateSelection(a)},d.close=function(){d.isOpen=!1,i[0].focus()},d.changePicker=function(a){d.showPicker=a};var x=a(s)(d);s.remove(),r?c.find("body").append(x):i.after(x),d.$on("$destroy",function(){x.remove(),i.unbind("keydown",w),c.unbind("mousedown",v)})}}}]).directive("datePickerWrap",function(){return{restrict:"EA",replace:!0,transclude:!0,templateUrl:"template/datetime-picker.html",link:function(a,b){b.bind("mousedown",function(a){a.preventDefault(),a.stopPropagation()})}}}).directive("timePickerWrap",function(){return{restrict:"EA",replace:!0,transclude:!0,templateUrl:"template/datetime-picker.html",link:function(a,b){b.bind("mousedown",function(a){a.preventDefault(),a.stopPropagation()})}}}),angular.module("ui.bootstrap.datetimepicker").run(["$templateCache",function(a){"use strict";a.put("template/datetime-picker.html",'
')}]); \ No newline at end of file diff --git a/dist/datetime-picker.tpls.js b/dist/datetime-picker.tpls.js index dbb8792..c4c61df 100644 --- a/dist/datetime-picker.tpls.js +++ b/dist/datetime-picker.tpls.js @@ -2,7 +2,7 @@ angular.module('ui.bootstrap.datetimepicker').run(['$templateCache', function($t 'use strict'; $templateCache.put('template/datetime-picker.html', - "
" + "
" ); }]); diff --git a/package.json b/package.json index 11ed7b8..8161f51 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "bootstrap-ui-datetime-picker", "url": "https://github.com/Gillardo/bootstrap-ui-datetime-picker", - "version": "1.0.21", + "version": "1.0.22", "devDependencies": { "grunt": "^0.4.5", "grunt-angular-templates": "^0.5.7", diff --git a/template/datetime-picker.html b/template/datetime-picker.html index 0e1fd44..1ee24c3 100644 --- a/template/datetime-picker.html +++ b/template/datetime-picker.html @@ -1,4 +1,4 @@ -
    +