Add bandwidth counter to file viewer

res/template/file_viewer.html

@@ -45,7 +45,10 @@
 				<div>
 					<button class="toolbar_button button_full_width" onClick="Toolbar.toggle();">Hide Toolbar</button>
 
-					<div id="views" style="text-align: center;">Views: No</div>
+					<div id="stat_views_label" class="toolbar_label">Views</div>
+					<div id="stat_views" style="text-align: center;">N/A</div>
+					<div id="stat_downloads_label" class="toolbar_label">Downloads</div>
+					<div id="stat_downloads" style="text-align: center;">N/A</div>
 
 					<a href="/" id="btnHome" class="button toolbar_button button_full_width">
 						<img src="/res/img/pixeldrain_small.png" alt="Back to the Home page"/>

res/template/fragments/api/file.html

@@ -158,6 +158,7 @@
 	"date_last_view": 1485894987, // Timestamp
 	"size": 5694837, // Bytes
 	"views" 1234, // Amount of unique file views
+	"bandwidth_used": 1234567890, // Bytes
 	"mime_type" "image/png",
 	"description": "File description",
 	"mime_image": "http://pixeldra.in/res/img/mime/image-png.png", // Image associated with the mime type

res/template/fragments/api/list.html

@@ -130,7 +130,8 @@
 			"description": "",
 			"date_created": 1513033304,
 			"date_last_view": 1513033304,
-			"views": 1
+			"views": 1,
+			"bandwidth_used": 1234567890
 		},
 		{
 			"detail_href": "/file/RKwgZb/info",
@@ -139,7 +140,8 @@
 			"description": "",
 			"date_created": 1513033304,
 			"date_last_view": 1513033304,
-			"views": 2
+			"views": 2,
+			"bandwidth_used": 1234567890
 		},
 		{
 			"detail_href": "/file/DRaL_e/info",
@@ -148,7 +150,8 @@
 			"description": "",
 			"date_created": 1513033304,
 			"date_last_view": 1513033304,
-			"views": 3
+			"views": 3,
+			"bandwidth_used": 1234567890
 		}
 	]
 }