This is an automated email from the git hooks/post-receive script. New commit to branch feature/dateTimePicker in repository pollen. See http://git.chorem.org/pollen.git commit 54f37c72420ec49f147bc9420345397ca5f86f91 Author: Adrien Garandel <a.garandel@dralagen.fr> Date: Tue Jul 29 17:28:41 2014 +0200 add directive dateTimePicker --- pollen-ui-angular/bower.json | 3 +- pollen-ui-angular/src/main/webapp/index.html | 6 +++ .../src/main/webapp/js/controllers/pollCtrl.js | 4 +- pollen-ui-angular/src/main/webapp/js/directives.js | 52 ++++++++++++++++++++++ .../src/main/webapp/partials/dateTimePicker.html | 6 +++ .../src/main/webapp/partials/inline-poll.html | 7 ++- .../src/main/webapp/partials/poll-popupChoice.html | 7 +-- 7 files changed, 73 insertions(+), 12 deletions(-) diff --git a/pollen-ui-angular/bower.json b/pollen-ui-angular/bower.json index 48979ae..3df46f2 100644 --- a/pollen-ui-angular/bower.json +++ b/pollen-ui-angular/bower.json @@ -20,7 +20,8 @@ "ckeditor": "4.4.2", "less": "1.7.3", "jqplot-bower": "1.0.8", - "spin.js": "2.0.1" + "spin.js": "2.0.1", + "eonasdan-bootstrap-datetimepicker": "3.0.0" }, "devDependencies": { "angular-mocks": "1.2.16" diff --git a/pollen-ui-angular/src/main/webapp/index.html b/pollen-ui-angular/src/main/webapp/index.html index 668106d..5f47cf8 100644 --- a/pollen-ui-angular/src/main/webapp/index.html +++ b/pollen-ui-angular/src/main/webapp/index.html @@ -25,6 +25,7 @@ <meta charset="utf-8" /> <link rel="stylesheet" type="text/css" href="lib/bootstrap/dist/css/bootstrap.min.css" /> + <link rel="stylesheet" type="text/css" href="lib/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css" /> <link rel="stylesheet" type="text/css" href="lib/jqplot-bower/dist//jquery.jqplot.min.css" /> <!-- TODO : compile less to css $ lessc -x less/style.less css/style.css @@ -57,6 +58,11 @@ <script language="javascript" type="text/javascript" src="lib/angular-animate/angular-animate.min.js"></script> <script language="javascript" type="text/javascript" src="lib/angular-bootstrap/ui-bootstrap-tpls.min.js"></script> + <script language="javascript" type="text/javascript" src="lib/moment/min/moment.min.js"></script> + <script language="javascript" type="text/javascript" src="lib/moment/min/langs.min.js"></script> + <script language="javascript" type="text/javascript" src="lib/bootstrap/dist/js/bootstrap.min.js"></script> + <script language="javascript" type="text/javascript" src="lib/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script> + <script language="javascript" type="text/javascript" src="js/app.js"></script> <script language="javascript" type="text/javascript" src="js/directives.js"></script> <script language="javascript" type="text/javascript" src="js/services.js"></script> diff --git a/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js b/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js index 6e7faa0..3e3ee16 100644 --- a/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js +++ b/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js @@ -331,7 +331,7 @@ angular.module('pollControllers', ['ngRoute', 'pollenServices', 'pascalprecht.tr } $scope.globalVariables.editMode = true; - $scope.globalVariables.voted = angular.isDefined($scope.data.votants); + //$scope.globalVariables.voted = angular.isDefined($scope.data.votants); $scope.globalVariables.lastType = 'TEXT'; $scope.globalVariables.lastDate = null; $scope.restError = {}; @@ -463,7 +463,7 @@ angular.module('pollControllers', ['ngRoute', 'pollenServices', 'pascalprecht.tr return choice; }, - dateFormat : function () { return $scope.globalVariables.dateFormat;} + dateFormat : function () { return $scope.globalVariables.dateTimeFormat;} } }); diff --git a/pollen-ui-angular/src/main/webapp/js/directives.js b/pollen-ui-angular/src/main/webapp/js/directives.js index 066cddb..f96a65e 100644 --- a/pollen-ui-angular/src/main/webapp/js/directives.js +++ b/pollen-ui-angular/src/main/webapp/js/directives.js @@ -484,4 +484,56 @@ angular.module('pollenDirective', []) }); } } +}]) + +.directive("datetimepicker", ["$timeout", "SessionStorage", function ($timeout, SessionStorage) { + return { + restrict : "E", + scope : { + ngModel: '=', + focus: '=' + }, + templateUrl:"partials/dateTimePicker.html", + link: function(scope, element, attrs) { + scope.dateTimePicker = $(element).find(".datetimepicker"); + scope.dateTimePicker.datetimepicker({ + language: SessionStorage.get().locale + }); + + if (angular.isDate(scope.ngModel)) { + scope.dateTimePicker.data("DateTimePicker").setDate(new Date(scope.ngModel)); + } + + scope.$on("switchLocale", function () { + scope.dateTimePicker.data("DateTimePicker").setLanguage(SessionStorage.get().locale); + }) + + $timeout(function () { + scope.$watch('ngModel', function (newVal, oldVal) { + if (angular.isDate(newVal) && newVal != oldVal) { + scope.dateTimePicker.data("DateTimePicker").setDate(new Date(newVal)); + } + }) + }); + + scope.dateTimePicker.on("dp.change", function(e) { + $timeout.cancel(scope.timeout); + + scope.timeout = $timeout(function () { + scope.$apply(function () { + scope.ngModel = new Date(scope.dateTimePicker.data("DateTimePicker").getDate().format()); + }); + }, 500); + + element.trigger("change"); + + }); + + scope.exit = function() { + element.trigger("blur"); + } + + } + + }; }]) \ No newline at end of file diff --git a/pollen-ui-angular/src/main/webapp/partials/dateTimePicker.html b/pollen-ui-angular/src/main/webapp/partials/dateTimePicker.html new file mode 100644 index 0000000..a346e6c --- /dev/null +++ b/pollen-ui-angular/src/main/webapp/partials/dateTimePicker.html @@ -0,0 +1,6 @@ +<div class="input-group date datetimepicker"> + <input type="text" class="form-control" focus-me="focus" ng-exit="exit()" /> + <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> + </span> +</div> + diff --git a/pollen-ui-angular/src/main/webapp/partials/inline-poll.html b/pollen-ui-angular/src/main/webapp/partials/inline-poll.html index ebef8ae..82bca7b 100644 --- a/pollen-ui-angular/src/main/webapp/partials/inline-poll.html +++ b/pollen-ui-angular/src/main/webapp/partials/inline-poll.html @@ -38,13 +38,12 @@ </div> <div ng-if="choice.choiceType == 'DATE'" edit-me="showEdit" > <div ng-hide="!globalVariables.voted && showEdit || isOpen" class="fixe-input" title="{{choice.description}}"> - {{ (choice.choiceValue | date:globalVariables.dateFormat) || ('poll.edit' | translate) }} + {{ (choice.choiceValue | date:globalVariables.dateTimeFormat) || ('poll.edit' | translate) }} <info-error error="choice.restError.choiceValue[0]" data="choice.choiceValue"></info-error> <input type="button" class="btn btn-default" ng-if="!globalVariables.voted && globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice)" value="..."/> </div> - <div ng-show="!globalVariables.voted && showEdit || isOpen" > - - <input type="text" class="form-control" ng-model="choice.choiceValue" focus-me="showEdit" datepicker-popup="{{globalVariables.dateFormat}}" is-open="isOpen" ng-exit="showEdit = false" ng-click="isOpen = true" auto-save="saveChoice(choice)" required/> + <div ng-show="!globalVariables.voted && showEdit" > + <datetimepicker ng-model="choice.choiceValue" focus="showEdit" ng-exit="showEdit = false" ng-save="saveChoice(choice)"></datetimepicker> <input type="button" class="btn btn-default" data-toggle="modal" data-target="#popupAddChoice" ng-click="editChoice(choice)" value="..."/> </div> </div> diff --git a/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html b/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html index 9262100..07c7d20 100644 --- a/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html @@ -44,13 +44,10 @@ </div> <div class="form-group" ng-if="choice.choiceType == 'DATE'"> - <label for="popChoiceDate" class="col-sm-4 control-label">Date : </label> + <label class="col-sm-4 control-label">Date : </label> <div class="col-sm-6"> - <div class="right-inner-addon "> - <i class="glyphicon glyphicon-calendar glyphicon-input"></i> - <input id="popChoiceDate" class="form-control" datepicker-popup="{{dateFormat}}" type="text" ng-model="choice.choiceValueDate" is-open="opened" ng-click="opened = true" focus-me="choice.choiceType == 'DATE'"/> - </div> + <datetimepicker ng-model="choice.choiceValueDate" focus="choice.choiceType == 'DATE'" ></datetimepicker> </div> </div> -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.