Mercurial > projects > booket
changeset 3:4786df0aec03
Display URL and hostname
Display the hostname after the title and the full URL below it
author | Guido Berhoerster <guido+booket@berhoerster.name> |
---|---|
date | Mon, 08 Sep 2014 20:01:41 +0200 |
parents | 82c50265c8dc |
children | e78c3356b585 |
files | booket.css booket.html booket.js |
diffstat | 3 files changed, 25 insertions(+), 3 deletions(-) [+] |
line wrap: on
line diff
--- a/booket.css Mon Sep 08 19:34:11 2014 +0200 +++ b/booket.css Mon Sep 08 20:01:41 2014 +0200 @@ -240,6 +240,10 @@ padding: .25em 0 0 0; } +ul#bookmark-list > li p { + margin: 0; +} + ul#bookmark-list > li ~ li { margin: .25em 0 0 0; } @@ -284,9 +288,13 @@ color: #07316e; } -dl.bookmark-metadata { +.bookmark-hostname, +.bookmark-metadata { color: #555753; font-size: .75em; +} + +dl.bookmark-metadata { margin: .25em 0 0 0; }
--- a/booket.html Mon Sep 08 19:34:11 2014 +0200 +++ b/booket.html Mon Sep 08 20:01:41 2014 +0200 @@ -132,13 +132,18 @@ </template> <template id="bookmark-template"> <li> - <a class="bookmark-link" target="_blank"></a><ul - class="tag-list"></ul> + <p> + <a class="bookmark-link" target="_blank"></a> + <span class="bookmark-hostname"></span> + </p> + <ul class="tag-list"></ul> <div class="bookmark-actions"> <button type="button" name="edit-bookmark">Edit</button><button type="button" name="delete-bookmark">Delete</button> </div> <dl class="bookmark-metadata"> + <dt>URL</dt> + <dd class="bookmark-url"></dd> <dt>Added</dt> <dd><time class="ctime"></time></dd> <dt>Last modified</dt>
--- a/booket.js Mon Sep 08 19:34:11 2014 +0200 +++ b/booket.js Mon Sep 08 20:01:41 2014 +0200 @@ -1031,6 +1031,8 @@ var newNode; var bookmarkElement; var linkElement; + var hostnameElement; + var urlElement; var ctimeElement; var mtimeElement; var tagListElement; @@ -1044,6 +1046,13 @@ linkElement.textContent = linkElement.title = bookmark.title; linkElement.href = bookmark.url; + hostnameElement = bookmarkElement.querySelector('.bookmark-hostname'); + hostnameElement.textContent = (linkElement.hostname !== '') ? + '[' + linkElement.hostname + ']' : ''; + + urlElement = bookmarkElement.querySelector('.bookmark-url'); + urlElement.textContent = bookmark.url; + ctimeElement = bookmarkElement.querySelector('.ctime'); ctimeElement.dateTime = bookmark.ctime.toISOString(); ctimeElement.textContent = bookmark.ctime.toString();