Author: garandel Date: 2014-05-02 17:30:54 +0200 (Fri, 02 May 2014) New Revision: 3901 Url: http://forge.chorem.org/projects/pollen/repository/revisions/3901 Log: save poll with $http Modified: trunk/pollen-ui-angular/src/main/webapp/js/app.js trunk/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js trunk/pollen-ui-angular/src/main/webapp/partials/big-poll.html trunk/pollen-ui-angular/src/main/webapp/partials/inline-poll.html trunk/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html trunk/pollen-ui-angular/src/main/webapp/partials/poll.html Modified: trunk/pollen-ui-angular/src/main/webapp/js/app.js =================================================================== --- trunk/pollen-ui-angular/src/main/webapp/js/app.js 2014-05-02 12:21:03 UTC (rev 3900) +++ trunk/pollen-ui-angular/src/main/webapp/js/app.js 2014-05-02 15:30:54 UTC (rev 3901) @@ -18,8 +18,52 @@ * along with this program. If not, see <http://www.gnu.org/licenses/>. * #L% */ -angular.module('pollen', ["restangular", 'ngRoute', 'pollControllers', 'ui.bootstrap']) +angular.module('pollen', ["restangular", 'ngRoute', 'pollControllers', 'ui.bootstrap'], function($httpProvider) { + // Use x-www-form-urlencoded Content-Type + $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8'; + /** + * The workhorse; converts an object to x-www-form-urlencoded serialization. + * @param {Object} obj + * @return {String} + */ + var param = function(obj) { + var query = '', name, value, fullSubName, subName, subValue, innerObj, i; + + for(name in obj) { + value = obj[name]; + + if(value instanceof Array) { + for(i=0; i<value.length; ++i) { + subValue = value[i]; + fullSubName = name + '[' + i + ']'; + innerObj = {}; + innerObj[fullSubName] = subValue; + query += param(innerObj) + '&'; + } + } + else if(value instanceof Object) { + for(subName in value) { + subValue = value[subName]; + fullSubName = name + '.' + subName ; + innerObj = {}; + innerObj[fullSubName] = subValue; + query += param(innerObj) + '&'; + } + } + else if(value !== undefined && value !== null) + query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&'; + } + + return query.length ? query.substr(0, query.length - 1) : query; + }; + + // Override $http service's default transformRequest + $httpProvider.defaults.transformRequest = [function(data) { + return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data; + }]; +}) + .config(['$routeProvider', function($routeProvider) { $routeProvider.when('/', {templateUrl: './partials/home.html', controller: "HomeCtrl"}) .when('/poll/create', {templateUrl: './partials/poll.html', controller: "PollAdminCtrl"}) @@ -31,7 +75,8 @@ }]) .config(['RestangularProvider', function (RestangularProvider) { - RestangularProvider.setBaseUrl('http://demo.codelutin.com/pollen-rest-api-latest/v1'); + //RestangularProvider.setBaseUrl('http://demo.codelutin.com/pollen-rest-api-latest/v1'); + RestangularProvider.setBaseUrl('http://localhost:8080/pollen-rest-api/v1'); }]) .factory('PollsRest', ['Restangular', function(Restangular) { @@ -103,7 +148,6 @@ $timeout (function () { scope.$apply(attrs.ngExit); }, 150); - event.preventDefault(); }); }; }) Modified: trunk/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js =================================================================== --- trunk/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js 2014-05-02 12:21:03 UTC (rev 3900) +++ trunk/pollen-ui-angular/src/main/webapp/js/controllers/pollCtrl.js 2014-05-02 15:30:54 UTC (rev 3901) @@ -30,7 +30,7 @@ }, 5000); }); - $scope.poll = pollStorage.get(); + $scope.poll = {}; $scope.toHTML = function (data) { return $sce.trustAsHtml(data); @@ -64,44 +64,48 @@ }]) -.controller('PollAdminCtrl', ['$scope', '$controller', '$modal', '$filter', '$timeout', 'PollsRest', 'pollStorage', function ($scope, $controller, $modal, $filter, $timeout, PollsRest, pollStorage) { +.controller('PollAdminCtrl', ['$scope', '$controller', '$modal', '$filter', '$timeout', 'PollsRest', '$http', 'pollStorage', function ($scope, $controller, $modal, $filter, $timeout, PollsRest, $http, pollStorage) { $controller('PollCtrl', {$scope:$scope}); var initPoll = function () { PollsRest.one('new').get().then(function (skeletonPoll) { $scope.poll = skeletonPoll; - $scope.poll.choices = []; + $scope.poll.choice = []; + $scope.vote = {}; + $scope.vote.choice = $scope.poll.choice; + }); } var initChoice = function () { return { name: '', - type: $scope.globalVariables.lastType + choiceType: $scope.globalVariables.lastType }; } $scope.globalVariables.editMode = true; $scope.globalVariables.create = true; $scope.globalVariables.voted = angular.isDefined($scope.poll.votants); - $scope.globalVariables.lastType = 'text'; + $scope.globalVariables.lastType = 'TEXT'; $scope.$watch('pollForm.$valid', function (newVal) { $scope.formValid = newVal; $scope.globalVariables.errorForm = false; }); - if (!angular.isDefined($scope.poll.choices)) { + if (!angular.isDefined($scope.poll.choice)) { initPoll(); } + else { + $scope.vote = {}; + $scope.vote.choice = $scope.poll.choice; + } - $scope.vote = {}; - $scope.vote.choices = $scope.poll.choices; - $scope.addChoice = function () { - var index = $scope.poll.choices.push(initChoice()); - var choice = $scope.poll.choices[index-1]; + var index = $scope.poll.choice.push(initChoice()); + var choice = $scope.poll.choice[index-1]; popupChoice(choice, 'Add Choice'); } @@ -110,9 +114,9 @@ } var deleteChoice = function (ch) { - var index = $scope.poll.choices.indexOf(ch); + var index = $scope.poll.choice.indexOf(ch); if (index > -1) { - $scope.poll.choices.splice(index,1); + $scope.poll.choice.splice(index,1); } } @@ -130,14 +134,18 @@ modalInstance.result.then(function (ch) { deleteChoice(ch); }, function () { - $scope.globalVariables.lastType = choice.type; + $scope.globalVariables.lastType = choice.choiceType; }); } $scope.save = function () { if ($scope.formValid) { - pollStorage.put($scope.poll); - $scope.globalVariables.saved = true; + var data = {}; + data.poll = $scope.poll; + $http.post('http://localhost:8080/pollen-rest-api/v1/polls', data).success(function (data) { + $scope.globalVariables.saved = true; + }); + } else { $scope.globalVariables.errorForm = true; @@ -147,13 +155,14 @@ $scope.reset = function () { $scope.poll = initPoll(); - $scope.voteChoices = $scope.poll.choices; + $scope.voteChoice = $scope.poll.choice; pollStorage.put({}); } $scope.delete = function () { $scope.poll = initPoll(); - $scope.voteChoices = $scope.poll.choices; + $scope.voteChoice= $scope.poll.choice; + $scope.globalVariables.voted = false; pollStorage.put({}); } @@ -168,7 +177,9 @@ } $scope.cancelChoice = function () { - angular.copy(oldChoice, $scope.choice); + if (angular.isDefined(oldChoice)) { + angular.copy(oldChoice, $scope.choice); + } $modalInstance.dismiss(); } @@ -179,9 +190,15 @@ } }]) -.controller('PollVoteCtrl', ['$scope', '$filter', '$controller', 'pollStorage', function ($scope, $filter, $controller, pollStorage) { +.controller('PollVoteCtrl', ['$scope', '$filter', '$controller', 'Restangular', 'pollStorage', function ($scope, $filter, $controller, Restangular, pollStorage) { $controller('PollCtrl', {$scope:$scope}); + Restangular.one('polls').get().then(function (poll) { + $scope.poll = poll[0]; + + initVote(); + }) + $scope.globalVariables.editMode = false; $scope.$watch('vote.ame', function (newVal) { if (newVal != '') { @@ -192,23 +209,22 @@ var initVote = function () { $scope.vote = {}; $scope.vote.name = ""; - $scope.vote.choices = []; + $scope.vote.choice = []; for (var i = 0; i < $scope.poll.choices.length; ++i) { - if ($scope.poll.choices[i].type == 'text') { - $scope.vote.choices.push({name:$scope.poll.choices[i].name, value:false}); + if ($scope.poll.choices[i].choiceType == 'text') { + $scope.vote.choices.push({name:$scope.poll.choice[i].name, value:false}); } - else if ($scope.poll.choices[i].type == 'date') { - $scope.vote.choices.push({name: $scope.poll.choices[i].date , value:false}); + else if ($scope.poll.choices[i].choiceType == 'date') { + $scope.vote.choices.push({name: $scope.poll.choice[i].date , value:false}); } } } - initVote(); $scope.voter = function () { if ($scope.vote.name != '') { var data = {}; data.name = $scope.vote.name; - data.choices = angular.copy($scope.vote.choices); + data.choice = angular.copy($scope.vote.choice); if (!angular.isDefined($scope.poll.votants)) { $scope.poll.votants = []; } Modified: trunk/pollen-ui-angular/src/main/webapp/partials/big-poll.html =================================================================== --- trunk/pollen-ui-angular/src/main/webapp/partials/big-poll.html 2014-05-02 12:21:03 UTC (rev 3900) +++ trunk/pollen-ui-angular/src/main/webapp/partials/big-poll.html 2014-05-02 15:30:54 UTC (rev 3901) @@ -25,7 +25,7 @@ <div class="col-sm-10"> <div ng-click="showChoiceDesc = !showChoiceDesc" > - <div ng-if="choice.type == 'text'"> + <div ng-if="choice.type == 'TEXT'"> <h3 edit-me="showEdit" ng-hide="showEdit" ng-mouseenter="showEditHover = true" ng-mouseleave="showEditHover = false"> <button class="btn btn-default" ng-if="!globalVariables.voted && globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice)">...</button> {{choice.name}} @@ -35,7 +35,7 @@ </h3> </div> - <div ng-if="choice.type == 'date'"> + <div ng-if="choice.type == 'DATE'"> <h3 edit-me="showEdit" ng-hide="showEdit || isOpen" ng-mouseenter="showEditHover = true" ng-mouseleave="showEditHover = false"> <button class="btn btn-default" ng-if="!globalVariables.voted && globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice)">...</button> {{choice.date | date:'dd/MM/yyyy'}} Modified: trunk/pollen-ui-angular/src/main/webapp/partials/inline-poll.html =================================================================== --- trunk/pollen-ui-angular/src/main/webapp/partials/inline-poll.html 2014-05-02 12:21:03 UTC (rev 3900) +++ trunk/pollen-ui-angular/src/main/webapp/partials/inline-poll.html 2014-05-02 15:30:54 UTC (rev 3901) @@ -24,15 +24,15 @@ <table> <tr> <td><button ng-if="globalVariables.editMode" ng-click="bigVersion()" class="btn btn-default" >Big version</button></td> - <td ng-repeat="choice in poll.choices" class="pollChoice pollAnim" ng-mouseenter="showEditHover = true" ng-mouseleave="showEditHover = false"> - <div ng-if="choice.type == 'text'" edit-me="showEdit" > + <td ng-repeat="choice in poll.choice" class="pollChoice pollAnim" ng-mouseenter="showEditHover = true" ng-mouseleave="showEditHover = false"> + <div ng-if="choice.choiceType == 'TEXT'" edit-me="showEdit" > <div ng-hide="showEdit && !globalVariables.voted" class="fixe-input" title="{{choice.description}}">{{choice.name}} <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="showEdit && !globalVariables.voted"> <input type="text" class="form-control" ng-model="choice.name" focus-me="showEdit" ng-exit="showEdit = false" required/> <input type="button" class="btn btn-default" data-toggle="modal" data-target="#popupAddChoice" ng-click="editChoice(choice)" value="..."/> </div> </div> - <div ng-if="choice.type == 'date'" edit-me="showEdit" > + <div ng-if="choice.choiceType == 'DATE'" edit-me="showEdit" > <div ng-hide="!globalVariables.voted && showEdit || isOpen" class="fixe-input" title="{{choice.description}}">{{choice.date | date:'dd/MM/yyyy'}} <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.date" focus-me="showEdit" datepicker-popup="dd/MM/yyyy" is-open="isOpen" ng-exit="showEdit = false" required/> @@ -45,8 +45,8 @@ <tr> <td class="pollChoice"> <input type="text" class="form-control" placeholder="votre nom" ng-model="vote.name" /> </td> - <td ng-repeat="choice in vote.choices" class="pollChoice"> - <input type="checkbox" name="{{choice.name}}" ng-model="choice.value"/> + <td ng-repeat="choice in vote.choice" class="pollChoice"> + <input type="checkbox" name="$index" ng-model="choice.value"/> </td> <td> <input class="btn btn-primary btn-large" type="button" value="Vote" ng-click="voter()" /> Modified: trunk/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html =================================================================== --- trunk/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html 2014-05-02 12:21:03 UTC (rev 3900) +++ trunk/pollen-ui-angular/src/main/webapp/partials/poll-popupChoice.html 2014-05-02 15:30:54 UTC (rev 3901) @@ -29,13 +29,13 @@ <label class="col-sm-4 control-label">Type de choix :</label> <div class="col-sm-8 btn-group"> - <button type="button" class="btn btn-default" ng-model="choice.type" btn-radio="'text'">Text</button> - <button type="button" class="btn btn-default" ng-model="choice.type" btn-radio="'date'">Date</button> - <button type="button" class="btn btn-default" ng-model="choice.type" btn-radio="'picture'" disabled>Image</button> + <button type="button" class="btn btn-default" ng-model="choice.choiceType" btn-radio="'TEXT'">Text</button> + <button type="button" class="btn btn-default" ng-model="choice.choiceType" btn-radio="'DATE'">Date</button> + <button type="button" class="btn btn-default" ng-model="choice.choiceType" btn-radio="'PICTURE'" disabled>Image</button> </div> </div> - <div class="form-group" ng-if="choice.type == 'text'"> + <div class="form-group" ng-if="choice.choiceType == 'TEXT'"> <label for="popNameChoiceCheck" class="col-sm-4 control-label">Nom du Choix : </label> <div class="col-sm-6"> @@ -43,7 +43,7 @@ </div> </div> - <div class="form-group" ng-if="choice.type == 'date'"> + <div class="form-group" ng-if="choice.choiceType == 'DATE'"> <label for="popNameChoiceDate" class="col-sm-4 control-label">Date : </label> <div class="col-sm-6"> Modified: trunk/pollen-ui-angular/src/main/webapp/partials/poll.html =================================================================== --- trunk/pollen-ui-angular/src/main/webapp/partials/poll.html 2014-05-02 12:21:03 UTC (rev 3900) +++ trunk/pollen-ui-angular/src/main/webapp/partials/poll.html 2014-05-02 15:30:54 UTC (rev 3901) @@ -23,7 +23,7 @@ <alert type="'danger'" ng-if="globalVariables.errorForm"> Champ non remplie </alert> <alert type="'success'" ng-if="globalVariables.editMode && globalVariables.saved"> Sondage sauvegardé..</alert> - <alert type="'success'" ng-if="!globalVariables.editMode && globalVariables.saved"> Vote effectué.. </alert> + <alert type="'success'" ng-if="!globalVariables.editMode && globalVariables.saved"> Vote effectué.. <pre>{{rest}}</pre></alert> <alert type="'warning'" ng-if="globalVariables.voted"> Les votes ont commencé, certaine modification sont inaccessible.. </alert>