From e2593e5f2421702c7ad695231d7bff8da68bedbe Mon Sep 17 00:00:00 2001
From: Pierre-Olivier Mercier <nemunaire@nemunai.re>
Date: Sun, 4 Dec 2016 19:13:44 +0100
Subject: [PATCH] frontend: redesign download part

---
 frontend/static/js/app.js        | 22 ++++++++++++++++++++++
 frontend/static/views/theme.html | 25 +++++++------------------
 2 files changed, 29 insertions(+), 18 deletions(-)

diff --git a/frontend/static/js/app.js b/frontend/static/js/app.js
index df0ea4fd..21f8aee3 100644
--- a/frontend/static/js/app.js
+++ b/frontend/static/js/app.js
@@ -92,6 +92,28 @@ angular.module("FICApp")
 	    }
 	}
     })
+    .filter("size", function() {
+	var units = [
+	    "o",
+	    "kio",
+	    "Mio",
+	    "Gio",
+	    "Tio",
+	    "Pio",
+	    "Eio",
+	    "Zio",
+	    "Yio",
+	]
+	return function(input) {
+	    var res = input;
+	    var unit = 0;
+	    while (res > 1024) {
+		unit += 1;
+		res = res / 1024;
+	    }
+	    return (Math.round(res * 100) / 100) + " " + units[unit];
+	}
+    })
     .controller("DataController", function($sce, $scope, $http, $rootScope, $timeout) {
 	var actMenu = function() {
 	    if ($scope.my && $scope.themes) {
diff --git a/frontend/static/views/theme.html b/frontend/static/views/theme.html
index ace895b2..1e538078 100644
--- a/frontend/static/views/theme.html
+++ b/frontend/static/views/theme.html
@@ -19,24 +19,13 @@
 	    <div class="panel-heading">
 	      <div class="panel-title"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Téléchargements</div>
 	    </div>
-	    <table class="table table-striped table-hover">
-	      <thead>
-		<tr>
-		  <th></th>
-		  <th>Nom</th>
-		  <th>Taille</th>
-		  <th>SHA-1</th>
-		</tr>
-	      </thead>
-	      <tbody>
-		<tr ng-repeat="file in my.exercices[current_exercice].files">
-		  <td><a href="{{ file.path }}" target="_self"><span class="glyphicon glyphicon-download" aria-hidden="true"></span></a></td>
-		  <td>{{ file.name }}</td>
-		  <td>{{ file.size }}</td>
-		  <td><code>{{ file.checksum }}</code></td>
-		</tr>
-	      </tbody>
-	    </table>
+	    <div class="list-group">
+	      <a href="{{ file.path }}" target="_self" class="list-group-item" ng-repeat="file in my.exercices[current_exercice].files">
+		<h1 class="pull-left" style="margin: 7px 7px 5px -5px"><span class="glyphicon glyphicon-download" aria-hidden="true"></span></h1>
+		<h4 class="list-group-item-heading"><strong><samp>{{ file.name }}</samp></strong></h4>
+		<p class="list-group-item-text">Taille : <span title="{{ file.size }} octets">{{ file.size | size }}</span> &ndash; SHA-1 : <samp>{{ file.checksum }}</samp></p>
+	      </a>
+	    </div>
 	  </div>
 
 	  <div class="panel panel-danger" ng-show="my.team_id && my.exercices[current_exercice] && !(my.exercices[current_exercice].solved)">