DevEarley · September 2, 2020 14:55
diff --git a/readme.md b/readme.md
diff --git a/index.html b/index.html
 <html>

 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"
            crossorigin="anonymous" type="text/javascript"></script>
    <link rel="stylesheet" href="./style.css">   
    <script src="./MicroBlog.js"></script>
    <title>Micro Blog</title>
 </head>

 <body>
    <div id="MicroBlog"></div>
 </body>

 </html>
diff --git a/MicroBlog.js b/MicroBlog.js
 (function () {
    let files = [
        'readme.md'
    ];
    let converter = new showdown.Converter();
    let entries = [];
  
    function updateBlog(_entries, _files) {
        let blog = document.getElementById("MicroBlog");
        if (blog != null) {
            blog.innerHTML = "";
            let sortedEntries = _entries.sort(function (a, b) {
                return (getIndex(a.url, _entries, _files) < getIndex(b.url, _entries, _files)) ? -1 : 1;
            });
            for (let i = 0; i < sortedEntries.length; i++) {
                blog.innerHTML += sortedEntries[i].html;
                blog.innerHTML += "<!--" + sortedEntries[i].url + "-->";
            }
        }
    }

    function init(_entries, _files, _converter) {
        for (let f = 0; f < _files.length; f++) {
            let client = new XMLHttpRequest();
            client.open('GET', './' + _files[f]);
            client.send();
            client.onreadystatechange = function () {
                if (client.readyState != 4) return;
                let html = _converter.makeHtml(client.responseText);
                let url = client.responseURL;
                _entries.push({
                    html: html,
                    url: url
                });
                if (_entries.length == _files.length) {
                    updateBlog(_entries, _files);
                }
            }
        }
    }
    
    function getIndex(_url, _entries, _files) {
        var fileName = extractFilename(_url);
        var index = 0;
        for (var i = 0; i < _files.length; i++) {
            let fileNameFromIndex = _files[i];
            if (fileNameFromIndex === fileName) {
                index = i;
            }
        }
        return index;
    }

    function extractFilename(_path) {
        const pathArray = _path.split("/");
        const lastIndex = pathArray.length - 1;
        return pathArray[lastIndex];
    }
  
    init(entries, files, converter);
 })();
diff --git a/run.cmd b/run.cmd
 http-server -a localhost -p 1234 -o
diff --git a/style.css b/style.css
 @import url('https://fonts.googleapis.com/css?family=Caladea:400|Nunito+Sans:400');
 .signature{
  font-family: 'Caladea', sans-serif;

 }
 #MicroBlog{
    max-width: 800px;
    margin: 0 auto;
 }

 html {font-size: 100%;} /*16px*/
 
 body{
    margin: 2.75rem 2.75rem 1.05rem;  
     font-family: 'Nunito Sans', sans-serif;

    font-weight: 400;
    line-height: 1.65;
    text-align: justify;
 }

 body, a {
    background-color: #222;
    color: white;
 }

 hr{
     margin:10vh;
 }


 p {margin-bottom: 1.15rem;}
 
 h1, h2, h3, h4, h5 {
   text-align: left;
   margin: 2.75rem 0 1.05rem;
   font-family: 'Caladea', sans-serif;
   font-weight: 400;
   line-height: 1.15;
 }
 
 h1 {
   margin-top: 0;
   font-size: 2.488em;
 }
 
 h2 {font-size: 2.074em;}
 
 h3 {font-size: 1.728em;}
 
 h4 {font-size: 1.44em;}
 
 h5 {font-size: 1.2em;}
 
 small, .text_small {font-size: 0.833em;}
	<html>

	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"
	crossorigin="anonymous" type="text/javascript"></script>
	<link rel="stylesheet" href="./style.css">
	<script src="./MicroBlog.js"></script>
	<title>Micro Blog</title>
	</head>

	<body>
	<div id="MicroBlog"></div>
	</body>

	</html>
	(function () {
	let files = [
	'readme.md'
	];
	let converter = new showdown.Converter();
	let entries = [];

	function updateBlog(_entries, _files) {
	let blog = document.getElementById("MicroBlog");
	if (blog != null) {
	blog.innerHTML = "";
	let sortedEntries = _entries.sort(function (a, b) {
	return (getIndex(a.url, _entries, _files) < getIndex(b.url, _entries, _files)) ? -1 : 1;
	});
	for (let i = 0; i < sortedEntries.length; i++) {
	blog.innerHTML += sortedEntries[i].html;
	blog.innerHTML += "<!--" + sortedEntries[i].url + "-->";
	}
	}
	}

	function init(_entries, _files, _converter) {
	for (let f = 0; f < _files.length; f++) {
	let client = new XMLHttpRequest();
	client.open('GET', './' + _files[f]);
	client.send();
	client.onreadystatechange = function () {
	if (client.readyState != 4) return;
	let html = _converter.makeHtml(client.responseText);
	let url = client.responseURL;
	_entries.push({
	html: html,
	url: url
	});
	if (_entries.length == _files.length) {
	updateBlog(_entries, _files);
	}
	}
	}
	}

	function getIndex(_url, _entries, _files) {
	var fileName = extractFilename(_url);
	var index = 0;
	for (var i = 0; i < _files.length; i++) {
	let fileNameFromIndex = _files[i];
	if (fileNameFromIndex === fileName) {
	index = i;
	}
	}
	return index;
	}

	function extractFilename(_path) {
	const pathArray = _path.split("/");
	const lastIndex = pathArray.length - 1;
	return pathArray[lastIndex];
	}

	init(entries, files, converter);
	})();
	@import url('https://fonts.googleapis.com/css?family=Caladea:400\|Nunito+Sans:400');
	.signature{
	font-family: 'Caladea', sans-serif;

	}
	#MicroBlog{
	max-width: 800px;
	margin: 0 auto;
	}

	html {font-size: 100%;} /16px/

	body{
	margin: 2.75rem 2.75rem 1.05rem;
	font-family: 'Nunito Sans', sans-serif;

	font-weight: 400;
	line-height: 1.65;
	text-align: justify;
	}

	body, a {
	background-color: #222;
	color: white;
	}

	hr{
	margin:10vh;
	}


	p {margin-bottom: 1.15rem;}

	h1, h2, h3, h4, h5 {
	text-align: left;
	margin: 2.75rem 0 1.05rem;
	font-family: 'Caladea', sans-serif;
	font-weight: 400;
	line-height: 1.15;
	}

	h1 {
	margin-top: 0;
	font-size: 2.488em;
	}

	h2 {font-size: 2.074em;}

	h3 {font-size: 1.728em;}

	h4 {font-size: 1.44em;}

	h5 {font-size: 1.2em;}

	small, .text_small {font-size: 0.833em;}