bookmarks browser v2

bookmarks browser - convert chrome Bookmarks to html, and then add search and collapse tree view.

by Laurens Maneschijn

HTML

<!-- original Bookmarks JSON to html bookmarklet forked from: http://jsfiddle.net/d3Dqe/ -->

Drag the links below to bookmarks bar:<br>

<a href="javascript:(function(){var preWithJson=document.querySelector('pre');var parsedJson=JSON.parse(preWithJson.textContent).roots;var bHeader=document.createElement('h1');bHeader.textContent='Bookmarks';var bodyNode=document.querySelector('body');bodyNode.insertBefore(bHeader,preWithJson);var dlMasterContainer=document.createElement('dl');function iterBookmarks(bookmarkFolder,dlContainer){(function(bMarks,dlContainer){for(var i=0;i&lt;bMarks.length;i++){var dt=document.createElement('dt');if(bMarks[i].type==='folder'){var folderHeader=document.createElement('h3');folderHeader.innerHTML=bMarks[i].name;dt.appendChild(folderHeader);var innerDL=document.createElement('dl');dt.appendChild(innerDL);dlContainer.appendChild(dt);iterBookmarks(bMarks[i].children,innerDL);}else{var a=document.createElement('a');a.setAttribute('href',bMarks[i].url);a.innerHTML=bMarks[i].name;dt.appendChild(a);dlContainer.appendChild(dt);}};})(bookmarkFolder,dlContainer);}var bbFDT=document.createElement('dt');var bbFH3=document.createElement('h3');bbFH3.innerHTML='Bookmarks Bar';var bbFDL=document.createElement('dl');bbFDT.appendChild(bbFH3);bbFDT.appendChild(bbFDL);dlMasterContainer.appendChild(bbFDT);iterBookmarks(parsedJson.bookmark_bar.children,bbFDL);var obFDT=document.createElement('dt');var obFH3=document.createElement('h3');obFH3.innerHTML='Other Bookmarks';var obFDL=document.createElement('dl');obFDT.appendChild(obFH3);obFDT.appendChild(obFDL);dlMasterContainer.appendChild(obFDT);iterBookmarks(parsedJson.other.children,obFDL);bodyNode.insertBefore(dlMasterContainer,preWithJson);})();" id="codeOut">Bookmarks JSON to html</a>
-- convert JSON contents of your Chrome "Bookmarks" file to html view.<br>

<a href="javascript:(function(){ if (window.bookmarks_handled) { return; } window.bookmarks_handled = true; function changeTag(el_old, newtag) {...

CSS

code {
	display: inline-block;
	padding: 1px;
	margin: 1px;
	background: #8884;
	border: 1px dashed #8888;
	border-radius: 4px;
}

q {
	font-weight: bold;
	quotes: "“" "”" "‘" "’";
	quotes: '"' '"';
	quotes: "'" "'";
}
q::before {
	content: open-quote;
}
q::after {
	content: close-quote;
}