server/admin/static/views/exercice.html

<h2>{{exercice.title}}</h2>

<div class="row mb-5">

  <form class="col-md-8" ng-submit="saveExercice()">
    <div class="form-group row" ng-repeat="field in fields">
      <label for="{{ field }}" class="col-sm-1 col-form-label-sm">{{ field | capitalize }}</label>
      <div class="col-sm-11">
	<input type="text" class="form-control form-control-sm" id="{{ field }}" ng-model="exercice[field]" ng-if="field != 'statement' && field != 'overview' && field != 'depend' && field != 'gain' && field != 'coefficient'">
	<input type="text" class="form-control form-control-sm" id="{{ field }}" ng-model="exercice[field]" ng-if="field == 'gain'" integer>
	<input type="text" class="form-control form-control-sm" id="{{ field }}" ng-model="exercice[field]" ng-if="field == 'coefficient'" float>
	<textarea class="form-control form-control-sm" id="{{field}}" ng-model="exercice[field]" ng-if="field == 'statement' || field == 'overview'"></textarea>
	<select class="form-control form-control-sm" id="{{field}}" ng-model="exercice[field]" ng-options="ex.id as ex.title group by ex.path.split('/')[0] for ex in exercices" ng-if="field == 'depend'">
	  <option value="">Aucune</option>
	</select>
      </div>
    </div>
    <div class="text-right" ng-show="exercice.id">
      <button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-save" aria-hidden="true"></span> Save</button>
      <button type="button" class="btn btn-danger" ng-click="deleteExercice()"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span> Delete</button>
    </div>
    <div class="text-right" ng-show="!exercice.id">
      <button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Create exercice</button>
    </div>
  </form>

  <div class="col-md-4" ng-show="exercice.id">
    <div class="card border-secondary" ng-controller="ExerciceFilesController">
      <div class="card-header bg-secondary text-light">
	<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" ng-show="showDownloads">
	<div class="btn-toolbar bg-secondary justify-content-end" role="toolbar">
	  <div class="btn-group" role="group">
	    <button type="button" ng-click="syncFiles()" class="btn btn-sm btn-light"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> Synchroniser</button>
	    <button type="button" ng-click="addFile()" class="btn btn-sm btn-info"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Ajouter</button>
	  </div>
	</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">
	    <a href="{{file.path}}" class="btn btn-sm btn-secondary col-auto"><span class="glyphicon glyphicon-download" aria-hidden="true"></span></a>
	    <button type="submit" class="btn btn-sm btn-success col-auto"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></button><br>
	    <button type="button" ng-click="deleteFile()" class="btn btn-sm btn-danger col-auto"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
	  </div>
	  <div class="cksum">
	    Taille&nbsp;: <span title="{{ file.size }} octets">{{ file.size | size }}</span> &dash;
	    BLAKE2b&nbsp;: <samp title="{{ file.checksum | cksum }}">{{ file.checksum | cksum }}</samp>
	  </div>
	</form>
      </div>
    </div>

    <div class="mt-2 card border-info" ng-controller="ExerciceHintsController">
      <div class="card-header bg-info text-light">
	<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" ng-show="showHints">
	<div class="btn-toolbar bg-info justify-content-end" role="toolbar">
	  <div class="btn-group" role="group">
	    <button type="button" ng-click="syncHints()" class="btn btn-sm btn-light"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> Synchroniser</button>
	    <button type="button" ng-click="addHint()" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Ajouter</button>
	  </div>
	</div>
	<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>
	  <p ng-if="hint.file">
	    Fichier&nbsp;: <samp>{{ hint.file }}</samp><br>
	    Hash&nbsp;: <samp class="cksum">{{ hint.content }}</samp><br>
	  </p>
	  <div class="row">
	    <div class="col-8 input-group input-group-sm mb-3">
	      <div class="input-group-prepend">
		<span class="input-group-text" id="inputGroup-sizing-sm">Coût</span>
	      </div>
	      <input type="text" id="hcost{{hint.id}}" ng-model="hint.cost" class="form-control" integer>
	    </div>
	    <div class="col-4">
	      <button type="submit" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></button>
	      <button type="button" ng-click="deleteHint()" class="btn btn-sm btn-danger" ng-show="hint.id"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
	    </div>
	  </div>
	</form>
      </div>
    </div>

    <div class="mt-2 card border-success" ng-controller="ExerciceFlagsController">
      <div class="card-header bg-success border-success text-light">
	<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" ng-show="showFlags">
	<div class="btn-toolbar bg-success justify-content-end" role="toolbar">
	  <div class="btn-group" role="group">
	    <button type="button" ng-click="syncFlags()" class="btn btn-sm btn-light"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> Synchroniser</button>
	    <button type="button" ng-click="addFlag()" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Ajouter</button>
	  </div>
	</div>
	<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é">
	    <div class="col-auto" ng-show="flag.id">
	      <button type="button" ng-click="deleteFlag()" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
	    </div>
	  </div>
	  <div class="row">
	    <input type="text" id="khelp{{flag.id}}" ng-model="flag.help" class="col form-control form-control-sm" placeholder="Indication de formatage" title="Indication de formatage">
	    <div class="col-auto">
	      <button type="submit" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></button>
	    </div>
	  </div>
	  <div class="row">
	    <input type="text" id="kvalue{{flag.id}}" ng-model="flag.value" class="col form-control form-control-sm" placeholder="Condensat" ng-if="flag.id" title="Condensat">
	    <input type="text" id="kflag{{flag.id}}" ng-model="flag.flag" class="col form-control form-control-sm" placeholder="Chaîne brute à valider" ng-if="!flag.id" title="Chaîne brute à valider">
	    <div class="col-auto custom-control custom-checkbox ml-1">
	      <input type="checkbox" class="custom-control-input" id="kicase{{flag.id}}" ng-model="flag.ignorecase">
	      <label class="custom-control-label" for="kicase{{flag.id}}">Ignore case</label>
	    </div>
	  </div>
	  <div class="row">
	    <input type="text" id="kvre{{flag.id}}" ng-model="flag.validator_regexp" class="col form-control form-control-sm" placeholder="Regexp selecting validation string" title="Regexp selecting validation string">
	  </div>
	</form>
      </div>
    </div>

    <div class="mt-2 card border-success" ng-controller="ExerciceMCQFlagsController">
      <div class="card-header bg-success text-light">
	<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" ng-show="showQuizz">
	<div class="btn-toolbar bg-success justify-content-end" role="toolbar">
	  <div class="btn-group" role="group">
	    <button type="button" ng-click="addQuiz()" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Ajouter</button>
	  </div>
	</div>
	<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é">
	    <div class="col-auto" ng-show="q.id">
	      <button type="button" ng-click="deleteQuiz()" class="btn btn-danger"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
	    </div>
	  </div>
	  <div class="form-group row" ng-repeat="(ck,choice) in q.entries">
	    <div class="col form-check">
	      <label class="custom-control custom-checkbox">
		<input class="custom-control-input" type="checkbox" ng-model="choice.response">
		<span class="custom-control-label">
		  <input type="text" id="kchoice{{q.id}}-{{choice.id}}" ng-model="choice.label" class="form-control form-control-sm" placeholder="Intitulé">
		</span>
	      </label>
	    </div>
	    <div class="col-auto">
	      <button type="button" ng-click="deleteChoice()" class="btn btn-sm btn-danger"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></button>
	    </div>
	  </div>
	  <div class="form-group row">
	    <div class="col-auto">
	      <button type="button" ng-click="addChoice()" class="btn btn-primary"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Ajouter un choix</button>
	    </div>
	    <div class="col-auto">
	      <button type="submit" class="btn btn-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></button>
	    </div>
	  </div>
	</form>
      </div>
    </div>

    <div class="mt-2 card border-warning" ng-controller="ExerciceTagsController">
      <div class="card-header bg-warning text-light">
	<h4 class="m-0" ng-click="toggleTags()"><small class="glyphicon" ng-class="{'glyphicon-chevron-right': !showTags, 'glyphicon-chevron-down': showTags}" aria-hidden="true"></small> Tags</h4>
      </div>
      <div class="list-group" ng-show="showTags">
	<div class="btn-toolbar bg-warning justify-content-end" role="toolbar">
	  <div class="btn-group" role="group">
	    <button type="button" ng-click="addTag()" class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Ajouter</button>
	    <button type="button" ng-click="saveTags()" class="btn btn-sm btn-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Sauvegarder</button>
	  </div>
	</div>
	<form ng-submit="saveTags()" class="list-group-item bg-light text-dark">
	  <div class="row form-group" ng-repeat="(k, tag) in tags track by $index">
	    <input type="text" ng-model="tags[k]" class="col form-control form-control-sm" placeholder="#tag">
	    <button type="button" ng-click="deleteTag()" class="btn btn-sm btn-danger col-auto"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
	  </div>
	</form>
      </div>
    </div>

  </div>

</div>