atsebay.t/htdocs/js/atsebayt.js

angular.module("AtsebaytApp", ["ngRoute", "ngResource", "ngSanitize"])
    .config(function($routeProvider, $locationProvider) {
	$routeProvider
	    .when("/auth", {
		controller: "AuthController",
		templateUrl: "views/auth.html"
	    })
	    .when("/surveys", {
		controller: "SurveysController",
		templateUrl: "views/surveys.html"
	    })
	    .when("/surveys/:surveyId", {
		controller: "SurveyController",
		templateUrl: "views/survey.html"
	    })
	    .when("/surveys/:surveyId/responses", {
		controller: "SurveyController",
		templateUrl: "views/responses.html"
	    })
	    .when("/surveys/:surveyId/responses/:questId", {
		controller: "QuestionController",
		templateUrl: "views/correction.html"
	    })
	    .when("/", {
		controller: "SurveysController",
		templateUrl: "views/home.html"
	    });
	$locationProvider.html5Mode(true);
    });

angular.module("AtsebaytApp")
    .factory("AllResponses", function($resource) {
        return $resource("/api/surveys/:surveyId/questions/:questId/responses/:respId", { surveyId: '@id', questId: '@id', respId: '@id' }, {
	    'update': {method: 'PUT'},
	})
    })
    .factory("MyResponse", function($resource) {
        return $resource("/api/surveys/:surveyId/responses/:respId", { surveyId: '@id', respId: '@id' })
    })
    .factory("Survey", function($resource) {
	return $resource("/api/surveys/:surveyId", { surveyId: '@id' }, {
	    'update': {method: 'PUT'},
	})
    })
    .factory("SurveyScore", function($resource) {
	return $resource("/api/surveys/:surveyId/score", { surveyId: '@id' })
    })
    .factory("SurveyQuest", function($resource) {
        return $resource("/api/surveys/:surveyId/questions/:questId", { surveyId: '@id', questId: '@id' }, {
	    'update': {method: 'PUT'},
	})
    })
    .factory("User", function($resource) {
	return $resource("/api/users/:userId", { userId: '@id' }, {
	    'update': {method: 'PUT'},
	})
    });

angular.module("AtsebaytApp")
  .directive('integer', function() {
    return {
      require: 'ngModel',
      link: function(scope, ele, attr, ctrl){
	ctrl.$parsers.unshift(function(viewValue){
	  return parseInt(viewValue, 10);
	});
      }
    };
  })

  .component('toast', {
    bindings: {
      date: '=',
      msg: '=',
      title: '=',
      variant: '=',
    },
    controller: function($element) {
      $element.children(0).toast('show')
    },
    template: `<div class="toast mb-2" role="alert" aria-live="assertive" aria-atomic="true" data-delay="7000">
	<div class="toast-header">
          <span ng-if="$ctrl.variant" class="badge badge-pill badge-{{ $ctrl.variant }}" style="padding: .25em .66em">&nbsp;</span>&nbsp;
	  <strong class="mr-auto" ng-bind="$ctrl.title"></strong>
	  <small class="text-muted" ng-bind="$ctrl.date">just now</small>
	  <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
	    <span aria-hidden="true">&times;</span>
	  </button>
	</div>
	<div class="toast-body" ng-bind-html="$ctrl.msg"></div>
      </div>`
  })

  .component('surveyList', {
    bindings: {
      surveys: '=',
      islogged: '=',
      isadmin: '=',
    },
    controller: function($location, $rootScope) {
      this.now = Date.now();
      this.show = function(id) {
	if ($rootScope.isLogged) {
	  $location.url("surveys/" + id);
	} else {
	  $rootScope.addToast({
	    variant: "danger",
	    title: "Authentification requise",
	    msg: "Vous devez être connecté pour accéder aux questionnaires.",
	  });
	  $location.url("auth");
	}
      };
    },
    template: `<table class="table table-striped table-hover">
  <thead>
    <tr>
      <th>Intitulé</th>
      <th>État</th>
      <th>Date</th>
      <th ng-if="$ctrl.islogged">Score</th>
    </tr>
  </thead>
  <tbody style="cursor: pointer;">
    <tr ng-repeat="survey in $ctrl.surveys" ng-if="survey.shown" ng-click="$ctrl.show(survey.id)">
      <td>{{ survey.title }}</td>
      <td class="bg-info" ng-if="survey.start_availability > $ctrl.now">Prévu</td>
      <td class="bg-warning" ng-if="survey.start_availability <= $ctrl.now && survey.end_availability >= $ctrl.now">En cours</td>
      <td class="bg-primary" ng-if="survey.end_availability < $ctrl.now && !survey.corrected">Terminé</td>
      <td class="bg-success" ng-if="survey.end_availability < $ctrl.now && survey.corrected">Corrigé</td>
      <td ng-if="survey.start_availability > $ctrl.now">{{ survey.start_availability | date: "medium" }}</td>
      <td ng-if="survey.start_availability <= $ctrl.now">{{ survey.end_availability | date: "medium" }}</td>
      <td ng-if="$ctrl.islogged">N/A</td>
    </tr>
  </tbody>
  <tfoot ng-if="$ctrl.isadmin">
    <tr>
      <td colspan="4">
	<a href="surveys/new" class="btn btn-sm btn-primary">Ajouter un questionnaire</a>
      </td>
    </tr>
  </tfoot>
</table>`
  })


  .component('surveyBadges', {
    bindings: {
      survey: '=',
    },
    controller: function() {
      var now = Date.now()
      this.test = function(a, b) {
	return Date.parse(a) > now;
      }
    },
    template: `<span class="badge badge-danger" ng-if="$ctrl.test($ctrl.survey.start_availability)">Prévu</span>
<span class="badge badge-warning" ng-if="!$ctrl.test($ctrl.survey.start_availability) && $ctrl.test($ctrl.survey.end_availability)">En cours</span>
<span class="badge badge-primary" ng-if="!$ctrl.test($ctrl.survey.end_availability)">Clos</span>
<span class="badge badge-success" ng-if="$ctrl.survey.corrected">Corrigé</span>`
  });

angular.module("AtsebaytApp")
    .run(function($rootScope, $interval, $http) {
	$rootScope.checkLoginState = function() {
	    $http({
		method: 'GET',
		url: "api/auth",
	    }).then(function(response) {
		$rootScope.isLogged = response.data;
		$rootScope.user = response.data;
	    }, function(response) {
		$rootScope.isLogged = false;
	    });
	};
	$rootScope.checkLoginState();
	$interval($rootScope.checkLoginState, 20000);

        $rootScope.switchAdminMode = function() {
	  var tmp = $rootScope.user.is_admin
	  $rootScope.user.is_admin = $rootScope.user.was_admin || false;
	  $rootScope.user.was_admin = tmp;
	}

        $rootScope.toasts = [];

        $rootScope.addToast = function(toast) {
	  $rootScope.toasts.unshift(toast);
        }

	$rootScope.disconnectCurrentUser = function() {
	    $http({
		method: 'POST',
		url: "api/auth/logout"
	    }).then(function(response) {
		$rootScope.isLogged = false;
		$rootScope.user = null;
	    });
	}
    })

    .controller("AuthController", function($scope, $rootScope, $http, $location) {
	$scope.auth = {
	    "username": "",
	    "password": "",
	};

	$scope.logmein = function() {
	    $scope.pleaseWait = true;
	    $http({
		method: 'POST',
		url: "api/auth",
		data: $scope.auth
	    }).then(function(response) {
		$scope.pleaseWait = false;
		$rootScope.checkLoginState();
		$location.url("/");
	    }, function(response) {
		$scope.pleaseWait = false;
		if (response.data && response.data.errmsg)
		    alert(response.data.errmsg);
	    });
	}
    })

    .controller("SurveysController", function($scope, $rootScope, Survey, $location) {
      $rootScope.qactive = $location.$$path == "/surveys";
      $scope.surveys = Survey.query();
      $scope.surveys.$promise.then(function(data) {
	data.forEach(function(d,k) {
	  data[k].start_availability = Date.parse(data[k].start_availability)
	  data[k].end_availability = Date.parse(data[k].end_availability)
	})
      })
    })

    .controller("SurveyController", function($scope, $rootScope, Survey, $routeParams, $location) {
      $rootScope.qactive = true;
      $scope.survey = Survey.get({ surveyId: $routeParams.surveyId });
      $scope.survey.$promise.then(function(survey) {
        survey.readonly = Date.now() > Date.parse(survey.end_availability)
      })

      $scope.saveSurvey = function() {
	if (this.survey.id) {
	  this.survey.$update(function(v) {
	    $scope.survey = Survey.get({ surveyId: $routeParams.surveyId });
	  });
	} else {
	  this.survey.$save(function() {
	    $location.url("surveys/" + $scope.survey.id);
	  });
	}
      }

      $scope.editSurvey = function() {
	this.survey.edit = true;
      }

      $scope.deleteSurvey = function() {
	this.survey.$remove(function() { $location.url("/surveys/");});
      }

      $scope.showResponses = function() {
	$location.url("surveys/" + this.survey.id + "/responses/" + this.question.id );
      }
    })

    .controller("ResponsesController", function($scope, AllResponses) {
      $scope.responses = AllResponses.query({ surveyId: $scope.survey.id, questId: $scope.question.id });
    })

    .controller("ScoreController", function($scope, SurveyScore) {
      $scope.score = SurveyScore.get({ surveyId: $scope.survey.id, questId: $scope.question.id })
    })

    .controller("QuestionController", function($scope, Survey, SurveyQuest, SurveyQuest, AllResponses, $http, $routeParams) {
      $scope.survey = Survey.get({ surveyId: $routeParams.surveyId });
      $scope.survey.$promise.then(function(survey) {
	survey.start_availability = Date.parse(survey.start_availability)
	survey.end_availability = Date.parse(survey.end_availability)
      })
      $scope.question = SurveyQuest.get({ surveyId: $routeParams.surveyId, questId: $routeParams.questId });
      $scope.responses = AllResponses.query({ surveyId: $routeParams.surveyId, questId: $routeParams.questId });

      $scope.submitCorrection = function() {
	this.response.$update()
      }
      $scope.submitCorrections = function() {
	this.responses.forEach(function(response) {
	  response.$update()
	})
      }
    })

    .controller("QuestionsController", function($scope, SurveyQuest, MyResponse, $http, $location) {
      $scope.questions = SurveyQuest.query({ surveyId: $scope.survey.id });
      $scope.questions.$promise.then(function (questions) {$scope.showSubmit = true;}, function (response) {
	$scope.addToast({
	  variant: "danger",
	  title: $scope.survey.title,
	  msg: "Une erreur s'est produite lors de l'accès aux questions : <strong>" + (response.data ? response.data.errmsg : "impossible de contacter le serveur") + "</strong>",
	});
	$location.url("surveys/")
      })
      $scope.myresponses = MyResponse.query({ surveyId: $scope.survey.id });
      $scope.myresponses.$promise.then(function (responses) {
	$scope.questions.$promise.then(function (questions) {
	  var idxquestions = {}
	  questions.forEach(function(question, qid) {
	    idxquestions[question.id] = qid;
	  });

	  responses.forEach(function(response) {
	    if (!questions[idxquestions[response.id_question]].response) {
	      if (response.value) {
		questions[idxquestions[response.id_question]].value = response.value;
		questions[idxquestions[response.id_question]].response = response;
	      }
	    }
	  })
	});
      });

      $scope.submitAnswers = function() {
	$scope.submitInProgress = true;
	var res = [];
	$scope.questions.forEach(function(q) {
	  res.push({"id_question": q.id, "value": q.value})
	});
	$http({
	  url: "/api/surveys/" + $scope.survey.id,
	  data: res,
	  method: "POST"
	}).then(function(response) {
	  $scope.submitInProgress = false;
	  $scope.addToast({
	    variant: "success",
	    title: $scope.survey.title,
	    msg: "Vos réponses ont bien étés sauvegardées.",
	  });
	}, function(response) {
	  $scope.submitInProgress = false;
	  $scope.addToast({
	    variant: "danger",
	    title: $scope.survey.title,
	    msg: "Une erreur s'est produite durant l'envoie de vos réponses : " + (response.data ? response.data.errmsg : "impossible de contacter le serveur") + "<br>Veuillez réessayer dans quelques instants.",
	  });
	});
      }

      $scope.saveQuestion = function() {
	this.question.edit = false;
	if (this.question.id) {
	  this.question.$update({ surveyId: $scope.survey.id });
	} else {
	  this.question.$save({ surveyId: $scope.survey.id });
	}
      }

      $scope.addQuestion = function() {
	$scope.questions.push(new SurveyQuest({edit:true, kind: 'text'}))
      }

      $scope.editQuestion = function() {
	this.question.edit = true;
      }

      $scope.deleteQuestion = function() {
	if (this.question.id) {
	  this.question.$remove(function() {
	    $scope.questions = SurveyQuest.query({ surveyId: $scope.survey.id });
	  });
	} else {
	  $scope.questions.splice($scope.questions.indexOf(this.question), 1);
	}
      }
    })