# HG changeset patch
# User Guido Berhoerster <guido+booket@berhoerster.name>
# Date 1410197651 -7200
# Node ID 82c50265c8dcdbd01070ead7c29b696f10e1af36
# Parent  6559033d9996f186e4677d7c9c4f5adff3fe3e7a
Display creation and modification time

diff -r 6559033d9996 -r 82c50265c8dc booket.css
--- a/booket.css	Sat Sep 06 18:20:15 2014 +0200
+++ b/booket.css	Mon Sep 08 19:34:11 2014 +0200
@@ -283,3 +283,22 @@
 a.bookmark-link:visited:active {
     color: #07316e;
 }
+
+dl.bookmark-metadata {
+    color: #555753;
+    font-size: .75em;
+    margin: .25em 0 0 0;
+}
+
+dl.bookmark-metadata dt {
+    font-weight: bold;
+}
+
+dl.bookmark-metadata dt::after {
+    content: ':';
+}
+
+dl.bookmark-metadata dd {
+    margin: 0;
+    padding: 0;
+}
diff -r 6559033d9996 -r 82c50265c8dc booket.html
--- a/booket.html	Sat Sep 06 18:20:15 2014 +0200
+++ b/booket.html	Mon Sep 08 19:34:11 2014 +0200
@@ -138,6 +138,12 @@
               <button type="button" name="edit-bookmark">Edit</button><button
               type="button" name="delete-bookmark">Delete</button>
             </div>
+            <dl class="bookmark-metadata">
+              <dt>Added</dt>
+              <dd><time class="ctime"></time></dd>
+              <dt>Last modified</dt>
+              <dd><time class="mtime"></time></dd>
+            </dl>
           </li>
         </template>
       </ul>
diff -r 6559033d9996 -r 82c50265c8dc booket.js
--- a/booket.js	Sat Sep 06 18:20:15 2014 +0200
+++ b/booket.js	Mon Sep 08 19:34:11 2014 +0200
@@ -1031,6 +1031,8 @@
     var newNode;
     var bookmarkElement;
     var linkElement;
+    var ctimeElement;
+    var mtimeElement;
     var tagListElement;
 
     newNode = document.importNode(this.bookmarkTemplate.content, true);
@@ -1042,6 +1044,14 @@
     linkElement.textContent = linkElement.title = bookmark.title;
     linkElement.href = bookmark.url;
 
+    ctimeElement = bookmarkElement.querySelector('.ctime');
+    ctimeElement.dateTime = bookmark.ctime.toISOString();
+    ctimeElement.textContent = bookmark.ctime.toString();
+
+    mtimeElement = bookmarkElement.querySelector('.mtime');
+    mtimeElement.dateTime = bookmark.mtime.toISOString();
+    mtimeElement.textContent = bookmark.mtime.toString();
+
     tagListElement = bookmarkElement.querySelector('ul.tag-list');
     bookmark.tags.forEach(function (tag) {
         var newNode;