From 1c09ae2fa8b18acc7b0701e073239af272a85cf6 Mon Sep 17 00:00:00 2001
From: nemunaire <nemunaire@nemunai.re>
Date: Sun, 18 Nov 2018 21:27:35 +0100
Subject: [PATCH] admin: Continue refactoring of exercice view

---
 admin/static/js/app.js           | 23 +++++++++++++++++
 admin/static/views/exercice.html | 43 +++++++++++++-------------------
 2 files changed, 40 insertions(+), 26 deletions(-)

diff --git a/admin/static/js/app.js b/admin/static/js/app.js
index 95013394..b56d5268 100644
--- a/admin/static/js/app.js
+++ b/admin/static/js/app.js
@@ -1023,6 +1023,26 @@ angular.module("FICApp")
 	$scope.exercices = Exercice.query();
 	$scope.fields = ["title", "urlid", "statement", "overview", "depend", "gain", "coefficient", "videoURI"];
 
+	$scope.showDownloads = false;
+	$scope.toggleDownloads = function(val) {
+	    $scope.showDownloads = val ||!$scope.showDownloads;
+	}
+
+	$scope.showHints = false;
+	$scope.toggleHints = function(val) {
+	    $scope.showHints = val || !$scope.showHints;
+	}
+
+	$scope.showFlags = false;
+	$scope.toggleFlags = function(val) {
+	    $scope.showFlags = val || !$scope.showFlags;
+	}
+
+	$scope.showQuizz = false;
+	$scope.toggleQuizz = function(val) {
+	    $scope.showQuizz = val || !$scope.showQuizz;
+	}
+
 	$scope.saveExercice = function() {
 	    if (this.exercice.id) {
 		this.exercice.$update();
@@ -1070,6 +1090,7 @@ angular.module("FICApp")
 	$scope.hints = ExerciceHint.query({ exerciceId: $routeParams.exerciceId });
 
 	$scope.addHint = function() {
+	    $scope.toggleHints(true);
 	    $scope.hints.push(new ExerciceHint());
 	}
 	$scope.deleteHint = function() {
@@ -1110,6 +1131,7 @@ angular.module("FICApp")
 	$scope.flags = ExerciceFlag.query({ exerciceId: $routeParams.exerciceId });
 
 	$scope.addFlag = function() {
+	    $scope.toggleFlags(true);
 	    $scope.flags.push(new ExerciceFlag());
 	}
 	$scope.deleteFlag = function() {
@@ -1150,6 +1172,7 @@ angular.module("FICApp")
 	$scope.quiz = ExerciceMCQFlag.query({ exerciceId: $routeParams.exerciceId });
 
 	$scope.addQuiz = function() {
+	    $scope.toggleQuizz(true);
 	    $scope.quiz.push(new ExerciceMCQFlag());
 	}
 	$scope.deleteQuiz = function() {
diff --git a/admin/static/views/exercice.html b/admin/static/views/exercice.html
index ee6b2b77..6dedba68 100644
--- a/admin/static/views/exercice.html
+++ b/admin/static/views/exercice.html
@@ -27,11 +27,13 @@
   <div class="col-md-4" ng-controller="ExerciceFilesController" ng-show="exercice.id">
     <div class="card border-secondary">
       <div class="card-header bg-secondary text-light">
-	<button ng-click="addFile()" class="float-right btn btn-sm btn-primary ml-2"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button>
-	<button ng-click="syncFiles()" class="float-right btn btn-sm btn-light ml-2"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span></button>
-	<h4 class="m-0">Téléchargements</h4>
+	<h4 class="m-0" ng-click="toggleDownloads()"><small class="glyphicon" ng-class="{'glyphicon-chevron-right': !showDownloads, 'glyphicon-chevron-down': showDownloads}" aria-hidden="true"></small> Téléchargements</h4>
       </div>
-      <div class="list-group">
+      <div class="list-group" ng-show="showDownloads">
+	<div class="list-group-item bg-light text-dark" style="padding: 2px">
+	  <button ng-click="syncFiles()" class="btn btn-sm btn-light ml-2"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> Synchroniser</button>
+	  <button ng-click="addFile()" class="btn btn-sm btn-primary ml-2"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Ajouter</button>
+	</div>
 	<form ng-submit="saveFile()" class="list-group-item bg-light text-dark" ng-repeat="file in files">
 	  <div class="row form-group">
 	    <input type="text" ng-model="file.name" class="col form-control form-control-sm" placeholder="Nom de fichier">
@@ -46,22 +48,14 @@
 	</form>
       </div>
     </div>
-  </div>
 
-</div>
-
-<hr>
-
-<div class="row mb-5" ng-show="exercice.id">
-
-  <div class="col-md-4" ng-controller="ExerciceHintsController">
-    <div class="card border-info">
+    <div class="mt-2 card border-info" ng-controller="ExerciceHintsController" ng-show="exercice.id">
       <div class="card-header bg-info text-light">
 	<button ng-click="addHint()" class="float-right btn btn-sm btn-primary ml-2"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button>
 	<button ng-click="syncHints()" class="float-right btn btn-sm btn-light ml-2"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span></button>
-	<h4 class="m-0">Indices</h4>
+	<h4 class="m-0" ng-click="toggleHints()"><small class="glyphicon" ng-class="{'glyphicon-chevron-right': !showHints, 'glyphicon-chevron-down': showHints}" aria-hidden="true"></small> Indices</h4>
       </div>
-      <div class="list-group">
+      <div class="list-group" ng-show="showHints">
 	<form ng-submit="saveHint()" class="list-group-item form-horizontal bg-light text-dark" ng-repeat="hint in hints">
 	  <input type="text" id="htitle{{hint.id}}" ng-model="hint.title" class="form-control form-control-sm" placeholder="Titre">
 	  <textarea class="form-control form-control-sm" id="hcnt{{hint.id}}" ng-model="hint.content" ng-if="!hint.file"></textarea>
@@ -84,16 +78,14 @@
 	</form>
       </div>
     </div>
-  </div>
 
-  <div class="col-md-4" ng-controller="ExerciceFlagsController">
-    <div class="card border-success">
-      <div class="card-header bg-success text-light">
+    <div class="mt-2 card border-success" ng-controller="ExerciceFlagsController" ng-show="exercice.id">
+      <div class="card-header bg-success border-success text-light">
 	<button ng-click="addFlag()" class="float-right btn btn-sm btn-primary ml-2"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button>
 	<button ng-click="syncFlags()" class="float-right btn btn-sm btn-light ml-2"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span></button>
-	<h4>Drapeaux</h4>
+	<h4 class="m-0" ng-click="toggleFlags()"><small class="glyphicon" ng-class="{'glyphicon-chevron-right': !showFlags, 'glyphicon-chevron-down': showFlags}" aria-hidden="true"></small> Drapeaux</h4>
       </div>
-      <div class="list-group">
+      <div class="list-group" ng-show="showFlags">
 	<form ng-submit="saveFlag()" class="list-group-item form-horizontal bg-light text-dark" ng-repeat="flag in flags">
 	  <div class="row" id="flag-{{flag.id}}">
 	    <input type="text" id="klabel{{flag.id}}" ng-model="flag.label" class="col form-control form-control-sm" placeholder="Intitulé" title="Intitulé">
@@ -121,15 +113,13 @@
 	</form>
       </div>
     </div>
-  </div>
 
-  <div class="col-md-4" ng-controller="ExerciceFlagsController">
-    <div class="card border-success" ng-controller="ExerciceMCQFlagsController">
+    <div class="mt-2 card border-success" ng-controller="ExerciceMCQFlagsController" ng-show="exercice.id">
       <div class="card-header bg-success text-light">
 	<button ng-click="addQuiz()" class="float-right btn btn-sm btn-primary ml-2"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button>
-	<h4>Quizz</h4>
+	<h4 class="m-0" ng-click="toggleQuizz()"><small class="glyphicon" ng-class="{'glyphicon-chevron-right': !showQuizz, 'glyphicon-chevron-down': showQuizz}" aria-hidden="true"></small> Quizz</h4>
       </div>
-      <div class="list-group">
+      <div class="list-group" ng-show="showQuizz">
 	<form ng-submit="saveQuiz()" class="list-group-item form-horizontal bg-light text-dark" ng-repeat="(qk,q) in quiz">
 	  <div class="form-group row" id="quiz-{{q.id}}">
 	    <input type="text" id="qlabel{{q.id}}" ng-model="q.title" class="col form-control" placeholder="Intitulé">
@@ -161,6 +151,7 @@
 	</form>
       </div>
     </div>
+
   </div>
 
 </div>