Massively better exports. Stylesheets and Stats added.

src/main/java/de/fabianonline/telegram_backup/Database.java

@@ -415,23 +415,30 @@ public class Database {
 		} catch (SQLException e) { throw new RuntimeException(e); }
 	}
 	
-	
 	public HashMap<String, Integer> getMessageTypesWithCount() {
+		return getMessageTypesWithCount(new GlobalChat());
+	}		
+	
+	public HashMap<String, Integer> getMessageTypesWithCount(AbstractChat c) {
 		HashMap<String, Integer> map = new HashMap<String, Integer>();
 		try {
-			ResultSet rs = stmt.executeQuery("SELECT message_type, COUNT(id) FROM messages GROUP BY message_type");
+			ResultSet rs = stmt.executeQuery("SELECT message_type, COUNT(id) FROM messages WHERE " + c.getQuery() + " GROUP BY message_type");
 			while (rs.next()) {
-				map.put(rs.getString(1), rs.getInt(2));
+				map.put("count.messages.type." + rs.getString(1), rs.getInt(2));
 			}
 			return map;
 		} catch (Exception e) { throw new RuntimeException(e); }
 	}
 	
 	public HashMap<String, Integer> getMessageMediaTypesWithCount() {
+		return getMessageMediaTypesWithCount(new GlobalChat());
+	}
+	
+	public HashMap<String, Integer> getMessageMediaTypesWithCount(AbstractChat c) {
 		HashMap<String, Integer> map = new HashMap<String, Integer>();
 		try {
 			int count = 0;
-			ResultSet rs = stmt.executeQuery("SELECT media_type, COUNT(id) FROM messages GROUP BY media_type");
+			ResultSet rs = stmt.executeQuery("SELECT media_type, COUNT(id) FROM messages WHERE " + c.getQuery() + " GROUP BY media_type");
 			while (rs.next()) {
 				String s = rs.getString(1);
 				if (s==null) {
@@ -439,19 +446,49 @@ public class Database {
 				} else {
 					count += rs.getInt(2);
 				}
-				map.put(s, rs.getInt(2));
+				map.put("count.messages.media_type." + s, rs.getInt(2));
 			}
-			map.put("any", count);
+			map.put("count.messages.media_type.any", count);
 			return map;
 		} catch (Exception e) { throw new RuntimeException(e); }
 	}
 	
-	public int[][] getMessageTimesMatrix(Integer dialog_id, Integer chat_id) {
+	public HashMap<String, Object> getMessageAuthorsWithCount() {
+		return getMessageAuthorsWithCount(new GlobalChat());
+	}
+	
+	public HashMap<String, Object> getMessageAuthorsWithCount(AbstractChat c) {
+		HashMap<String, Object> map = new HashMap<String, Object>();
+		HashMap<User, Integer> user_map = new HashMap<User, Integer>();
+		int count_others = 0;
+		try {
+			ResultSet rs = stmt.executeQuery("SELECT users.id, users.first_name, users.last_name, users.username, COUNT(messages.id) "+
+				"FROM messages, users WHERE users.id=messages.sender_id AND " + c.getQuery() + " GROUP BY sender_id");
+			while (rs.next()) {
+				User u = new User(rs.getInt(1), rs.getString(2), rs.getString(3), rs.getString(4));
+				if (u.isMe) {
+					map.put("authors.count.me", rs.getInt(5));
+				} else {
+					user_map.put(u, rs.getInt(5));
+					count_others += rs.getInt(5);
+				}
+			}
+			map.put("authors.count.others", count_others);
+			map.put("authors.all", user_map.entrySet());
+			return map;
+		} catch (Exception e) { throw new RuntimeException(e); }
+	}
+	
+	public int[][] getMessageTimesMatrix() {
+		return getMessageTimesMatrix(new GlobalChat());
+	}
+
+	public int[][] getMessageTimesMatrix(AbstractChat c) {
 		int result[][] = new int[7][24];
 		try {
 			ResultSet rs = stmt.executeQuery("SELECT STRFTIME('%w', time, 'unixepoch') as DAY, " +
 				"STRFTIME('%H', time, 'unixepoch') AS hour, " +
-				"COUNT(id) FROM messages GROUP BY hour, day " +
+				"COUNT(id) FROM messages WHERE " + c.getQuery() + " GROUP BY hour, day " +
 				"ORDER BY hour, day");
 			while (rs.next()) {
 				result[rs.getInt(1) == 0 ? 6 : rs.getInt(1)-1][rs.getInt(2)] = rs.getInt(3);
@@ -497,29 +534,25 @@ public class Database {
 		}
 	}
 	
-	public LinkedList<HashMap<String, Object>> getMessagesForExport(Dialog d) {
+	public LinkedList<HashMap<String, Object>> getMessagesForExport(AbstractChat c) {
-		return getMessagesForExport("dialog_id", d.id);
-	}
-	
-	public LinkedList<HashMap<String, Object>> getMessagesForExport(Chat c) {
-		return getMessagesForExport("chat_id", c.id);
-	}
-	
-	private LinkedList<HashMap<String, Object>> getMessagesForExport(String type, Integer id) {
 		try {
+			
 			ResultSet rs = stmt.executeQuery("SELECT messages.id as message_id, text, time*1000 as time, has_media, " +
 				"media_type, media_file, media_size, users.first_name as user_first_name, users.last_name as user_last_name, " +
 				"users.username as user_username, users.id as user_id, " +
 				"users_fwd.first_name as user_fwd_first_name, users_fwd.last_name as user_fwd_last_name, users_fwd.username as user_fwd_username " +
 				"FROM messages, users LEFT JOIN users AS users_fwd ON users_fwd.id=fwd_from_id WHERE " +
-				"users.id=messages.sender_id AND " + type + "=" + id + " " +
+				"users.id=messages.sender_id AND " + c.getQuery() + " " +
 				"ORDER BY messages.id");
 			SimpleDateFormat format_time = new SimpleDateFormat("HH:mm:ss");
 			SimpleDateFormat format_date = new SimpleDateFormat("d MMM yy");
 			ResultSetMetaData meta = rs.getMetaData();
 			int columns = meta.getColumnCount();
 			LinkedList<HashMap<String, Object>> list = new LinkedList<HashMap<String, Object>>();
+			
+			Integer count=0;
 			String old_date = null;
+			Integer old_user = null;
 			while (rs.next()) {
 				HashMap<String, Object> h = new HashMap<String, Object>(columns);
 				for (int i=1; i<=columns; i++) {
@@ -535,9 +568,13 @@ public class Database {
 				}
 				h.put("from_me", rs.getInt("user_id")==user_manager.getUser().getId());
 				h.put("is_new_date", !date.equals(old_date));
+				h.put("odd_even", (count%2==0) ? "even" : "odd");
+				h.put("same_user", old_user!=null && rs.getInt("user_id")==old_user);
+				old_user = rs.getInt("user_id");
 				old_date = date;
 				
 				list.add(h);
+				count++;
 			}
 			rs.close();
 			return list;
@@ -564,9 +601,11 @@ public class Database {
 	
 	
 	
+	public abstract class AbstractChat {
+		public abstract String getQuery();
+	}
 	
-	
+	public class Dialog extends AbstractChat{
-	public class Dialog {
 		public int id;
 		public String first_name;
 		public String last_name;
@@ -580,9 +619,11 @@ public class Database {
 			this.username = username;
 			this.count = count;
 		}
+		
+		public String getQuery() { return "dialog_id=" + id; }
 	}
 	
-	public class Chat {
+	public class Chat extends AbstractChat {
 		public int id;
 		public String name;
 		public int count;
@@ -592,5 +633,24 @@ public class Database {
 			this.name = name;
 			this.count = count;
 		}
+		
+		public String getQuery() {return "chat_id=" + id; }
+	}
+	
+	public class User {
+		public String name;
+		public boolean isMe;
+		
+		public User(int id, String first_name, String last_name, String username) {
+			isMe = id==user_manager.getUser().getId();
+			StringBuilder s = new StringBuilder();
+			if (first_name!=null) s.append(first_name + " ");
+			if (last_name!=null) s.append(last_name);
+			name = s.toString().trim();
+		}
+	}
+	
+	public class GlobalChat extends AbstractChat {
+		public String getQuery() { return "1=1"; }
 	}
 }

src/main/java/de/fabianonline/telegram_backup/exporter/HTMLExporter.java

@@ -24,30 +24,41 @@ import java.io.PrintWriter;
 import java.io.BufferedWriter;
 import java.io.FileWriter;
 import java.io.IOException;
+import java.net.URL;
+import org.apache.commons.io.FileUtils;
 import java.util.LinkedList;
 import java.util.HashMap;
 import java.util.Map;
+import java.util.Set;
 
 import com.github.mustachejava.DefaultMustacheFactory;
 import com.github.mustachejava.Mustache;
 import com.github.mustachejava.MustacheFactory;
 
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+
 public class HTMLExporter {
+	private static Logger logger = LoggerFactory.getLogger(HTMLExporter.class);
+	
 	public void export(UserManager user) {
 		try {
 			Database db = new Database(user, null);
 			
 			// Create base dir
+			logger.debug("Creating base dir");
 			String base = user.getFileBase() + "files" + File.separatorChar;
 			new File(base).mkdirs();
 			new File(base + "dialogs").mkdirs();
 			
+			logger.debug("Fetching dialogs");
 			LinkedList<Database.Dialog> dialogs = db.getListOfDialogsForExport();
+			logger.debug("Fetching chats");
 			LinkedList<Database.Chat> chats = db.getListOfChatsForExport();
 			
-			
+			logger.debug("Generating index.html");
 			HashMap<String, Object> scope = new HashMap<String, Object>();
-			scope.put("user", user.getUser());
+			scope.put("user", user);
 			scope.put("dialogs", dialogs);
 			scope.put("chats", chats);
 			
@@ -66,18 +77,11 @@ public class HTMLExporter {
 			
 			scope.put("count.messages.from_me", db.getMessagesFromUserCount());
 
-			scope.put("heatmap_data", intArrayToString(db.getMessageTimesMatrix(null, null)));
+			scope.put("heatmap_data", intArrayToString(db.getMessageTimesMatrix()));
 			
-			HashMap<String, Integer> types;
+			scope.putAll(db.getMessageAuthorsWithCount());
-			types = db.getMessageTypesWithCount();
+			scope.putAll(db.getMessageTypesWithCount());
-			for (Map.Entry<String, Integer> entry : types.entrySet()) {
+			scope.putAll(db.getMessageMediaTypesWithCount());
-				scope.put("count.messages.type." + entry.getKey(), entry.getValue());
-			}
-			
-			types = db.getMessageMediaTypesWithCount();
-			for (Map.Entry<String, Integer> entry : types.entrySet()) {
-				scope.put("count.messages.media_type." + entry.getKey(), entry.getValue());
-			}
 			
 			MustacheFactory mf = new DefaultMustacheFactory();
 			Mustache mustache = mf.compile("templates/html/index.mustache");
@@ -87,27 +91,44 @@ public class HTMLExporter {
 			
 			mustache = mf.compile("templates/html/chat.mustache");
 			
+			logger.debug("Generating dialog pages");
 			for (Database.Dialog d : dialogs) {
 				LinkedList<HashMap<String, Object>> messages = db.getMessagesForExport(d);
 				scope.clear();
 				scope.put("dialog", d);
 				scope.put("messages", messages);
 				
+				scope.putAll(db.getMessageAuthorsWithCount(d));
+				scope.put("heatmap_data", intArrayToString(db.getMessageTimesMatrix(d)));
+				scope.putAll(db.getMessageTypesWithCount(d));
+				scope.putAll(db.getMessageMediaTypesWithCount(d));
+				
 				w = new FileWriter(base + "dialogs" + File.separatorChar + "user_" + d.id + ".html");
 				mustache.execute(w, scope);
 				w.close();
 			}
 			
+			logger.debug("Generating chat pages");
 			for (Database.Chat c : chats) {
 				LinkedList<HashMap<String, Object>> messages = db.getMessagesForExport(c);
 				scope.clear();
 				scope.put("chat", c);
 				scope.put("messages", messages);
 				
+				scope.put("heatmap_data", intArrayToString(db.getMessageTimesMatrix(c)));
+				scope.putAll(db.getMessageTypesWithCount(c));
+				scope.putAll(db.getMessageMediaTypesWithCount(c));
+				
 				w = new FileWriter(base + "dialogs" + File.separatorChar + "chat_" + c.id + ".html");
 				mustache.execute(w, scope);
 				w.close();
 			}
+			
+			logger.debug("Generating additional files");
+			// Copy CSS
+			URL cssFile = getClass().getResource("/templates/html/style.css");
+			File dest = new File(base + "style.css");
+			FileUtils.copyURLToFile(cssFile, dest);
 		} catch (IOException e) {
 			e.printStackTrace();
 			throw new RuntimeException("Exception above!");
@@ -126,4 +147,13 @@ public class HTMLExporter {
 		sb.append("]");
 		return sb.toString();
 	}
+	
+	private String mapToString(Map<String, Integer> map) {
+		StringBuilder sb = new StringBuilder("[");
+		for (Map.Entry<String, Integer> entry : map.entrySet()) {
+			sb.append("['" + entry.getKey() + "', " + entry.getValue() + "],");
+		}
+		sb.append("]");
+		return sb.toString();
+	}
 }

src/main/java/de/fabianonline/telegram_backup/exporter/StatsExporter.java

@@ -1,85 +0,0 @@
-/* Telegram_Backup
- * Copyright (C) 2016 Fabian Schlenz
- * 
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- * 
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU General Public License for more details.
- * 
- * You should have received a copy of the GNU General Public License
- * along with this program.  If not, see <http://www.gnu.org/licenses/>. */
-
-package de.fabianonline.telegram_backup.exporter;
-
-import de.fabianonline.telegram_backup.UserManager;
-import de.fabianonline.telegram_backup.Database;
-
-import java.io.File;
-import java.io.PrintWriter;
-import java.io.BufferedWriter;
-import java.io.FileWriter;
-import java.io.IOException;
-import java.util.LinkedList;
-import java.util.HashMap;
-import java.util.Map;
-
-import com.github.mustachejava.DefaultMustacheFactory;
-import com.github.mustachejava.Mustache;
-import com.github.mustachejava.MustacheFactory;
-
-public class StatsExporter {
-	public void export(UserManager user) {
-		try {
-			Database db = new Database(user, null);
-			
-			// Create base dir
-			String base = user.getFileBase() + "export" + File.separatorChar + "stats" + File.separatorChar;
-			new File(base).mkdirs();
-			
-			HashMap<String, Object> scope = new HashMap<String, Object>();
-			
-			// Collect data
-			LinkedList<Database.Dialog> dialogs = db.getListOfDialogsForExport();
-			LinkedList<Database.Chat> chats = db.getListOfChatsForExport();
-			
-			scope.put("count.chats", chats.size());
-			scope.put("count.dialogs", dialogs.size());
-			
-			int count_messages_chats = 0;
-			int count_messages_dialogs = 0;
-			for (Database.Chat   c : chats)   count_messages_chats   += c.count;
-			for (Database.Dialog d : dialogs) count_messages_dialogs += d.count;
-			
-			scope.put("count.messages", count_messages_chats + count_messages_dialogs);
-			scope.put("count.messages.chats", count_messages_chats);
-			scope.put("count.messages.dialogs", count_messages_dialogs);
-			
-			scope.put("count.messages.from_me", db.getMessagesFromUserCount());
-			
-			HashMap<String, Integer> types;
-			types = db.getMessageTypesWithCount();
-			for (Map.Entry<String, Integer> entry : types.entrySet()) {
-				scope.put("count.messages.type." + entry.getKey(), entry.getValue());
-			}
-			
-			types = db.getMessageMediaTypesWithCount();
-			for (Map.Entry<String, Integer> entry : types.entrySet()) {
-				scope.put("count.messages.media_type." + entry.getKey(), entry.getValue());
-			}
-			
-			MustacheFactory mf = new DefaultMustacheFactory();
-			Mustache mustache = mf.compile("templates/stats/index.mustache");
-			FileWriter w = new FileWriter(base + "index.html");
-			mustache.execute(w, scope);
-			w.close();
-		} catch (IOException e) {
-			e.printStackTrace();
-			throw new RuntimeException("Exception above!");
-		}
-	}
-}

src/main/resources/templates/html/_stats.mustache

@@ -0,0 +1,160 @@
+<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script>
+<script src="https://code.highcharts.com/highcharts.js"></script>
+<script src="https://code.highcharts.com/modules/heatmap.js"></script>
+<script src="https://code.highcharts.com/modules/drilldown.js"></script>
+
+<script type="text/javascript">
+	$(function() {
+		$('#heatmap').highcharts({
+			chart: {
+				type: 'heatmap',
+			},
+			colorAxis: {
+				stops: [
+					[0, '#FFEDA0'],
+					[1, '#B10026'],
+				],
+			},
+			xAxis: {
+				categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
+			},
+			yAxis: {
+				reversed: true,
+				title: { text: "Hour", },
+			},
+			series: [{
+				name: 'Messages per hour',
+				data: {{heatmap_data}},
+			}],
+		});
+		
+		{{#count.dialogs}}
+		$('#chart_chat_types').highcharts({
+			chart: {
+				type: 'pie',
+			},
+			title: {
+				text: 'Chat types',
+			},
+			series: [{
+				name: 'Types',
+				data: [{
+					name: 'Dialogs',
+					y: {{count.dialogs}},
+				}, {
+					name: 'Group chats',
+					y: {{count.chats}},
+				}],
+			}],
+		});
+		{{/count.dialogs}}
+		
+		$('#chart_media_types').highcharts({
+			chart: {
+				type: 'pie',
+			},
+			title: {
+				text: 'Media types',
+			},
+			subtitle: {
+				text: 'Click on media slice to expand',
+			},
+			series: [{
+				name: 'Has media',
+				data: [
+					{name: 'No media',    y: {{count.messages.media_type.null}}+0, drilldown: null},
+					{name: 'With media',  y: {{count.messages.media_type.any}}+0, drilldown: 'With media'},
+				].filter(function(d){return d.y>0;}),
+			}],
+			drilldown: {
+				series: [{
+					name: 'Media types',
+					id: 'With media',
+					data: [
+						['Photo',       {{count.messages.media_type.photo}}+0],
+						['Audio',       {{count.messages.media_type.audio}}+0],
+						['Video',       {{count.messages.media_type.video}}+0],
+						['Geolocation', {{count.messages.media_type.geo}}+0],
+						['Document',    {{count.messages.media_type.document}}+0],
+						['Sticker',     {{count.messages.media_type.sticker}}+0],
+						['Venue',       {{count.messages.media_type.venue}}+0],
+						['Contact',     {{count.messages.media_type.contact}}+0],
+					].filter(function(d){return d[1]>0;}),
+				}],
+			},
+		});
+		
+		var authors_options = {
+			chart: {
+				type: 'pie',
+			},
+			title: {
+				text: 'Authors',
+			},
+			series: [{
+				name: 'Authors',
+				data: [
+					{name: 'Me',     y: {{authors.count.me}}, drilldown: null},
+					{name: 'Others', y: {{authors.count.others}}, drilldown: 'Others'},
+				]
+			}],
+			drilldown: {
+				series: [{
+					name: 'Authors',
+					id: 'Others',
+					data: null,
+				}],
+			},
+		};
+		
+		var author_data = [
+			{{#authors.all}}
+				['{{key.name}}', {{value}}],
+			{{/authors.all}}
+		];
+		author_data.sort(function(a, b) { return b[1]-a[1]; });
+		var other_count = 0;
+		var limit = 7;
+		var new_data = [];
+		if (author_data.length > 8) {
+			for (var i=0; i<author_data.length; i++) {
+				if (i<=limit) {
+					new_data.push(author_data[i]);
+				} else {
+					other_count += author_data[i][1];
+				}
+			}
+			if (other_count>0) new_data.push(["Other", other_count]);
+			authors_options.drilldown.series[0].data = new_data;
+		} else {
+			author_data.unshift(["Me", {{authors.count.me}}]);
+			authors_options.series[0].data = author_data;
+		}
+		
+		$('#chart_authors').highcharts(authors_options);
+		
+		$('#chart_message_types').highcharts({
+			chart: {
+				type: 'pie',
+			},
+			title: {
+				text: 'Message types',
+			},
+			series: [{
+				name: 'Message types',
+				data: [
+					{name: 'Normal messages',  y: {{count.messages.type.message}}+0},
+					{name: 'Empty messages',   y: {{count.messages.type.empty_message}}+0},
+					{name: 'Service messages', y: {{count.messages.type.service_message}}+0},
+				].filter(function(d){return d.y>0;}),
+			}],
+		});
+	});
+</script>
+
+<span id="heatmap" style="width: 400px; height: 500px;"></span>
+
+{{#count.dialogs}}<span id="chart_chat_types" style="width: 400px; height: 500px;"></span>{{/count.dialogs}}
+<span id="chart_message_types" style="width: 400px; height: 500px;"></span>
+<span id="chart_media_types" style="width: 400px; height: 500px;"></span>
+<span id="chart_authors" style="width: 400px; height: 500px;"></span>

src/main/resources/templates/html/chat.mustache

@@ -2,6 +2,8 @@
 <html>
 <head>
 	<title>Telegram Backup for {{user.getUserString}}</title>
+	<meta charset="UTF-8">
+	<link rel="stylesheet" href="../style.css" type="text/css" />
 </head>
 
 <body>
@@ -22,9 +24,9 @@
 				{{formatted_date}}
 			</li>
 			{{/is_new_date}}
-			<li class="message {{#from_me}}from-me{{/from_me}}" data-message-id="{{message_id}}" data-media="{{media_type}}">
+			<li class="message {{#from_me}}from-me{{/from_me}} {{odd_even}} {{#same_user}}same-user{{/same_user}}" data-message-id="{{message_id}}" data-media="{{media_type}}">
-				<span class="sender">{{user_first_name}}</span>
 				<span class="time">{{formatted_time}}</span>
+				<span class="sender">{{user_first_name}}</span>
 				{{#text}}<span class="text">{{text}}</span>{{/text}}
 				{{#media_sticker}}<span class="sticker"><img src="../../../stickers/{{media_file}}" /></span>{{/media_sticker}}
 				{{#media_photo}}<span class="photo"><img src="../{{media_file}}" /></span>{{/media_photo}}
@@ -35,5 +37,7 @@
 	
 	<a href="../index.html">Back to the overview</a>
 	
+	{{> _stats }}
+	
 </body>
 </html>

src/main/resources/templates/html/index.mustache

@@ -5,108 +5,7 @@
 	
 	<meta charset="UTF-8">
 	
-	<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script>
+	<link rel="stylesheet" href="style.css" type="text/css" />
-	<script src="https://code.highcharts.com/highcharts.js"></script>
-	<script src="https://code.highcharts.com/modules/heatmap.js"></script>
-	<script src="https://code.highcharts.com/modules/drilldown.js"></script>
-	
-	<script type="text/javascript">
-		$(function() {
-			$('#heatmap').highcharts({
-				chart: {
-					type: 'heatmap',
-				},
-				colorAxis: {
-					stops: [
-						[0, '#000000'],
-						[1, '#FF0000'],
-					],
-				},
-				xAxis: {
-					categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
-				},
-				yAxis: {
-					reversed: true,
-					title: { text: "Hour", },
-				},
-				series: [{
-					name: 'Messages per hour',
-					data: {{heatmap_data}},
-				}],
-			});
-			
-			$('#chart_chat_types').highcharts({
-				chart: {
-					type: 'pie',
-				},
-				title: {
-					text: 'Chat types',
-				},
-				series: [{
-					name: 'Types',
-					data: [{
-						name: 'Dialogs',
-						y: {{count.dialogs}},
-					}, {
-						name: 'Group chats',
-						y: {{count.chats}},
-					}],
-				}],
-			});
-			
-			$('#chart_media_types').highcharts({
-				chart: {
-					type: 'pie',
-				},
-				title: {
-					text: 'Media types',
-				},
-				subtitle: {
-					text: 'Click on media slice to expand',
-				},
-				series: [{
-					name: 'Has media',
-					data: [
-						{name: 'No media',    y: {{count.messages.media_type.null}}+0, drilldown: null},
-						{name: 'With media',  y: {{count.messages.media_type.any}}+0, drilldown: 'With media'},
-					],
-				}],
-				drilldown: {
-					series: [{
-						name: 'Media types',
-						id: 'With media',
-						data: [
-							{name: 'Photo',       y: {{count.messages.media_type.photo}}+0},
-							{name: 'Audio',       y: {{count.messages.media_type.audio}}+0},
-							{name: 'Video',       y: {{count.messages.media_type.video}}+0},
-							{name: 'Geolocation', y: {{count.messages.media_type.geo}}+0},
-							{name: 'Document',    y: {{count.messages.media_type.document}}+0},
-							{name: 'Sticker',     y: {{count.messages.media_type.sticker}}+0},
-							{name: 'Venue',       y: {{count.messages.media_type.venue}}+0},
-							{name: 'Contact',     y: {{count.messages.media_type.contact}}+0},
-						],
-					}],
-				},
-			});
-			
-			$('#chart_message_types').highcharts({
-				chart: {
-					type: 'pie',
-				},
-				title: {
-					text: 'Message types',
-				},
-				series: [{
-					name: 'Message types',
-					data: [
-						{name: 'Normal messages',  y: {{count.messages.type.message}}+0},
-						{name: 'Empty messages',   y: {{count.messages.type.empty_message}}+0},
-						{name: 'Service messages', y: {{count.messages.type.service_message}}+0},
-					],
-				}],
-			});
-		});
-	</script>
 </head>
 
 <body>
@@ -138,11 +37,7 @@
 		{{/chats}}
 	</ul>
 
+	{{> _stats }}
 	
-	<span id="heatmap" style="width: 400px; height: 500px;"></span>
-	
-	<span id="chart_chat_types" style="width: 400px; height: 500px;"></span>
-	<span id="chart_message_types" style="width: 400px; height: 500px;"></span>
-	<span id="chart_media_types" style="width: 400px; height: 500px;"></span>
 </body>
 </html>

src/main/resources/templates/html/style.css

@@ -0,0 +1,48 @@
+body { font-family: Verdana, sans-serif; }
+
+ul.messages {
+	padding-left: 0px;
+}
+
+li.date, li.message {
+	list-style-type: none;
+}
+
+li.message { padding-left: 20px; }
+
+li.date {
+	font-weight: bold;
+	font-size: bigger;
+	margin-top: 10px;
+	text-transform: uppercase;
+	border-bottom: 1px dotted #888;
+}
+
+li.message.from-me {
+	background-color: #eef !important;
+}
+
+li .sender {
+	font-weight: bold;
+	min-width: 10em;
+	display: inline-block;
+}
+
+li.message .photo {
+	vertical-align: top;
+}
+
+li.message .photo img {
+	max-width: 250px;
+	max-height: 250px;
+}
+
+li.message.same-user .sender { visibility: hidden; }
+
+li .time {
+	font-size: smaller;
+}
+
+li.message.even {
+	background-color: #f8f8f8;
+}

src/main/resources/templates/stats/index.mustache

@@ -1,86 +0,0 @@
-count.chats: {{count.chats}}
-count.dialogs: {{count.dialogs}}
-count.messages: {{count.messages}}
-count.messages.chats: {{count.messages.chats}}
-count.messages.dialogs: {{count.messages.dialogs}}
-count.messages.from_me: {{count.messages.from_me}}
-
-count.messages.type.message: {{count.messages.type.message}}
-count.messages.type.empty_message: {{count.messages.type.empty_message}}
-count.messages.type.service_message: {{count.messages.type.service_message}}
-
-count.messages.media_type.null: {{count.messages.media_type.null}}
-count.messages.media_type.photo:{{count.messages.media_type.photo}}
-count.messages.media_type.audio:{{count.messages.media_type.audio}}
-count.messages.media_type.video:{{count.messages.media_type.video}}
-count.messages.media_type.geo:{{count.messages.media_type.geo}}
-count.messages.media_type.document:{{count.messages.media_type.document}}
-count.messages.media_type.sticker:{{count.messages.media_type.sticker}}
-count.messages.media_type.venue:{{count.messages.media_type.venue}}
-count.messages.media_type.contact:{{count.messages.media_type.contact}}
-
-
-<html>
-<head>
-	<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-	<script type="text/javascript">
-		google.charts.load("current", {packages:["corechart"]});
-		google.charts.setOnLoadCallback(drawChart);
-		
-		function drawChart() {
-			drawChartChatTypes();
-			drawChartMessageTypes();
-			drawChartMediaTypes();
-		}
-	
-		function drawChartChatTypes() {
-			var data = google.visualization.arrayToDataTable([
-				['Type', 'Count'],
-				['Dialog', {{count.dialogs}}],
-				['Chat', {{count.chats}}]
-			]);
-			var options = {
-				title: 'Chat types',
-				legend: 'none',
-				pieSliceText: 'label',
-			};
-
-			var chart = new google.visualization.PieChart(document.getElementById('chart_chat_types'));
-			chart.draw(data, options);
-		}
-		
-		function drawChartMediaTypes() {
-			var data = google.visualization.arrayToDataTable([
-				['Type', 'Count'],
-				['No media', {{count.messages.media_type.null}}], ['Photo', {{count.messages.media_type.photo}}],
-				['Audio', {{count.messages.media_type.audio}}], ['Video', {{count.messages.media_type.video}}],
-				['Geolocation', {{count.messages.media_type.geo}}], ['Document', {{count.messages.media_type.document}}],
-				['Sticker', {{count.messages.media_type.sticker}}], ['Venue', {{count.messages.media_type.venue}}],
-				['Contact', {{count.messages.media_type.contact}}]
-			]);
-			var options = { title: 'Media types', legend: 'none', pieSliceText: 'label' };
-			var chart = new google.visualization.PieChart(document.getElementById('chart_media_types'));
-			chart.draw(data, options);
-		}
-		
-		function drawChartMessageTypes() {
-			var data = google.visualization.arrayToDataTable([
-				['Type', 'Count'],
-				['Normal messages', {{count.messages.type.message}}],
-				['Empty messages', {{count.messages.type.empty_message}}],
-				['Service messages', {{count.messages.type.service_message}}]
-			]);
-			var options = { title: 'Message types', legend: 'none', pieSliceText: 'label' };
-			
-			var chart = new google.visualization.PieChart(document.getElementById('chart_message_types'));
-			chart.draw(data, options);
-		}
-	</script>
-</head>
-
-<body>
-	<div id="chart_chat_types" style="width: 900px; height: 500px;"></div>
-	<div id="chart_message_types" style="width: 900px; height: 500px;"></div>
-	<div id="chart_media_types" style="width: 900px; height: 500px;"></div>
-</body>
-</html>