Files
mdlinks/index.html
2016-07-25 09:46:08 +03:00

230 lines
6.8 KiB
HTML

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=320" />
<STYLE type="text/css">
BODY { scrollbar-face-color: #9C9CFF;
font-family: monospace;
color: #9C9CFF;
background-color: #3939DE;
font-size:12px;}
PRE { border: solid black 0px; }
HR { color: #9C9CFF; width:100%; border-width:0;height:5px;background-color:#9C9CFF;}
TABLE { background-color: #9C9CFF; width: 100%; border-spacing: 10px;
border-collapse: separate;}
TD { background-color: #3939DE; vertical-align: top; padding: 0px; width: 25%;}
LI { text-indent:-1.3em;
padding-left:1.4em;
font-size:12px;
list-style-type:none;
overflow: hidden;
margin-bottom: 0.2em;
}
LI:before {
content:"-";
padding-right: 0.5em;
}
A:link { text-decoration:none;font-size:12px;color:#9C9CFF; }
A:visited { text-decoration:none;font-size:12px;color:#9C9CFF;}
A:hover { color:#ffffff; }
A:focus { color:#ffffff; }
#filter { font-family: monospace;
color:#9C9CFF; background-color: #3939DE; width: 90%;
text-align: center; }
.head { font-size: 14px; text-align:left; padding-left:1em; padding-top: 0.2em; margin-bottom: -0.5em; }
.tickbox { display: block; float: right; }
LI.nolink:before {
content:" ";
padding-right: 1.3em;
}
</STYLE>
<script language="javascript">
function init() {
var head = document.head;
if (config.style!=null) {
var link = document.createElement('link');
link.type = 'text/css';
link.rel = 'stylesheet';
link.href = config.style;
head.appendChild(link);
}
if (config.favicon!=null) {
var link = document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'icon';
link.href = config.favicon;
head.appendChild(link);
}
var title = document.createElement('title');
title.innerHTML=config.title;
head.appendChild(title);
if (!config.search) {
document.getElementById('search').style.display='none';
}
document.getElementById("filter").focus();
hitList=search_hits(document.getElementById("filter").value);
print_results(hitList);
}
String.prototype.capitalizeFirstLetter = function() {
return this.charAt(0).toUpperCase() + this.slice(1);
}
function make_link(md) {
var match=linkReg.exec(md);
if (match != null) {
return "<li>"+match[1]+"<a href=\""+match[3]+"\">"+match[2]+"</a>"+match[4];
}
match=linkPlain.exec(md);
if (match != null) {
return "<li>"+match[1]+"<a href=\""+match[2]+"\">"+match[2]+"</a>"+match[3];
}
return "<li class=nolink>"+md
}
function make_head(c) {
var name=c.substring(1).trim();
var head=c.trim().replace(/ /g,"&nbsp;");
return '<a name="'+name+'"><div class=head align=center>'+head+'</div><hr WIDTH="100%" SIZE=3 NOSHADE>';
}
function filter(ev) {
var needle=document.getElementById('filter').value;
hitList=search_hits(needle);
var c=hitList.length;
var lastHit=hitList[c-1];
print_results(hitList);
var key=ev.keyCode;
if (key==13){
if (c==0) { document.getElementById('filter').focus(); }
if (c==1) { open_link(lastHit); }
if (c>1) {
document.getElementById('filter').focus();
}
}
}
function no_filter(){}
function search_hits(needle) {
needle=needle.trim().toLowerCase();
if (needle=="") {
return Array.apply(null, {length: linkList.length}).map(Number.call, Number);
}
hitList=[];
for (l=0; l<linkList.length; l++) {
var match=linkReg.exec(linkList[l].toLowerCase());
if (match != null ) {
if ( match[2].indexOf(needle)>-1 ) { hitList.push(l); }
continue
}
match=linkPlain.exec(linkList[l].toLowerCase());
if (match != null ) {
if ( match[2].indexOf(needle)>-1 ) { hitList.push(l); }
continue
}
}
return hitList
}
function open_link(c) {
var match=linkReg.exec(linkList[c]);
if (match != null ) { location.href=match[3]; return }
match=linkPlain.exec(linkList[c]);
if (match != null ) { location.href=match[2]; return }
return
}
function print_results(hitList) {
var doc=document.getElementById("main");
doc.innerHTML="";
var tbl=document.createElement("table");
var tbody=document.createElement("tbody");
tbl.appendChild(tbody);
doc.appendChild(tbl);
var str="";
var cat=0;
for (c=0; c<linkList.length; c++) {
if ( linkList[c].substring(0,2) == "# " ) {
if (cat%config.columns==0) { tbody.innerHTML+="<tr>"; }
var td=document.createElement("td");
td.innerHTML+=make_head(linkList[c]);
tbody.appendChild(td);
cat+=1;
} else {
if (hitList.indexOf(c)==-1) { continue }
td.innerHTML+=make_link(linkList[c]);
}
}
}
function get_URL(s) {
if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); }
else { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); }
xmlhttp.onreadystatechange=function()
{ if (xmlhttp.readyState==4 && xmlhttp.status==200)
{ parse_links(xmlhttp.responseText);
}}
xmlhttp.open("GET", s, true);
xmlhttp.send();
}
function read_links() {
get_URL(config.source);
}
function parse_links(s) {
var linkRows=s.split("\n");
var links=[];
for (r=0; r<linkRows.length; r++) {
if (linkRows[r].length>1) {
links.push(linkRows[r]);
}
}
linkList=links.slice(0);
init();
}
function move_cursor(ev) {
var kC=ev.keyCode;
var k=String.fromCharCode(ev.keyCode);
/*if (/[0-9]/.test(k) ) {
var ki=parseInt(k); if (ki==0) { ki=10; }
open_link(hitList[ki-1]);
return
}*/
if (/S/.test(k)) {
document.getElementById("filter").focus();
}
}
function toggle_blank() {
var blank=document.getElementById('open_blank').checked;
var anchors = document.getElementsByTagName('a');
for (var i=0; i<anchors.length; i++){
if (blank) {
anchors[i].setAttribute('target', '_blank');
} else {
anchors[i].removeAttribute('target');
}
}
}
var linkReg=/([^\[]*)\[([^\]]+)\]\(([^\)]+)\)(.*)/;
var linkPlain=/(.*)(http[^\s]+)(.*)/;
var linkList=[];
var hitList=[];
var config = {
title:'MDLinks',
source:'links.txt',
search:true,
columns:4,
style:null,
favicon:null
};
document.onkeyup=move_cursor;
</script>
<script language="javascript" src="config.js"></script>
</head>
<body onload="read_links()">
<div id="search"><input type="text" oninput="filter(event)" onkeypress="filter(event)" onblur="no_filter()" id="filter" title="Filter links by name">
<span class=tickbox><input type=checkbox id=open_blank title="Open links in new window" onclick="toggle_blank()" tabindex=-1></span>
</div>
<div id="main"></div>
</body>
</html>