diff --git a/README.md b/README.md
index 1a3bbb4..6ef011e 100644
--- a/README.md
+++ b/README.md
@@ -58,3 +58,7 @@ Copyright (c) 2011-2012, Pavel Shramov; [2-clause BSD License](https://github.co
Copyright (c) 2010-2014 Caolan McMahon; [MIT License](https://github.com/caolan/async/blob/master/LICENSE)
* [Bootstrap](http://getbootstrap.com/)
Copyright (c) 2011-2014 Twitter, Inc; [MIT License](https://github.com/twbs/bootstrap/blob/master/LICENSE)
+* [jQuery](https://github.com/jquery/jquery)
+Copyright 2005, 2014 jQuery Foundation and other contributors; [MIT License](https://github.com/jquery/jquery/blob/master/LICENSE.txt)
+* [DataTables](https://github.com/DataTables/DataTables)
+Copyright (C) 2008-2014, SpryMedia Ltd.; [MIT License](http://www.datatables.net/license/mit)
diff --git a/css/style.css b/css/style.css
index 7e4ce18..7348209 100644
--- a/css/style.css
+++ b/css/style.css
@@ -167,6 +167,11 @@ textarea:focus {
background-color: rgba(255,255,255,255);
}
+/* track messages (data tab) */
+#tab_data {
+ font-size: x-small;
+}
+
/* dashed line animation, derived from Chris Coyier and others
http://css-tricks.com/svg-line-animation-works/
*/
@@ -211,3 +216,22 @@ textarea:focus {
.nav > li > a {
padding: 2px 15px;
}
+
+/*
+ * DataTables
+ */
+
+table.dataTable.mini thead th,
+table.dataTable.mini thead td {
+ padding: 3px 13px 3px 2px;
+}
+
+table.dataTable.mini tbody th,
+table.dataTable.mini tbody td {
+ padding: 2px 2px;
+}
+table.dataTable thead .sorting_asc,
+table.dataTable thead .sorting_desc,
+table.dataTable thead .sorting {
+ background-position: center right -3px;
+}
diff --git a/index.html b/index.html
index e7ac42e..592d967 100644
--- a/index.html
+++ b/index.html
@@ -16,6 +16,7 @@
+
@@ -72,6 +73,7 @@
@@ -101,6 +103,8 @@
+
+
+
diff --git a/js/control/TrackMessages.js b/js/control/TrackMessages.js
new file mode 100644
index 0000000..4d6f2ca
--- /dev/null
+++ b/js/control/TrackMessages.js
@@ -0,0 +1,51 @@
+BR.TrackMessages = L.Class.extend({
+ initialize: function () {
+ },
+
+ update: function (polyline, segments) {
+ var i,
+ messages,
+ data = [],
+ columns;
+
+ if (!segments || segments.length === 0)
+ return;
+
+ for (i = 0; segments && i < segments.length; i++) {
+ messages = segments[i].feature.properties.messages;
+
+ if (i === 0) {
+ columns = this._getColumns(messages[0]);
+ }
+
+ data = data.concat(messages.slice(1));
+ }
+
+ $('#datatable').DataTable({
+ destroy: true,
+ data: data,
+ columns: columns,
+ paging: false,
+ searching: false,
+ info: false,
+ scrollY: 330,
+ scrollX: 370,
+ scrollCollapse: true,
+ order: []
+ });
+
+ },
+
+ _getColumns: function(headings) {
+ var columns = [];
+ for (k = 0; k < headings.length; k++) {
+ // http://datatables.net/reference/option/#Columns
+ columns.push({
+ title: headings[k]
+ });
+ }
+ return columns;
+ }
+});
+
+BR.TrackMessages.include(L.Mixin.Events);
diff --git a/js/index.js b/js/index.js
index 214e8a6..5474642 100644
--- a/js/index.js
+++ b/js/index.js
@@ -88,6 +88,7 @@
elevation,
download,
profile,
+ trackMessages,
leftPaneId = 'leftpane',
saveWarningShown = false;
@@ -140,6 +141,7 @@
BR.message.hideError();
routingOptions.setCustomProfile(null);
});
+ trackMessages = new BR.TrackMessages();
routing = new BR.Routing({
routing: {
@@ -177,6 +179,7 @@
elevation.update(track);
stats.update(track, segments);
+ trackMessages.update(track, segments);
if (latLngs.length > 1) {
urls.gpx = router.getUrl(latLngs, 'gpx');