tootoo-2020-12-25.html

<!doctype html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0" />
	<meta name="description"
		content="TooToo 2020 uses the GitHub API to provide access to all the current files hosted with GitHub Pages.">
	<meta name="keywords" content="JavaScript,Markdown,GitHub,FOSS">
	<meta name="date" content="2020-12-25">
	<title></title>

	<!-- Copyright 2020 Theo Armour. MIT license -->
	<link rel="stylesheet" href="./lib/style/style-2020-12-24.css">

	<style>
		:root {
			/* --mnu-width: 15rem; */
			--main-hue: 0;
			/* 0 to 360 0=red 120=green 240=blue */
		}

		#MNUdivPopUp {
			max-height: 40vh;
		}
	</style>

</head>

<body>
	<!-- https://github.com/showdownjs/showdown -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"></script>

	<script src="./lib/mnu-menu/v-2020-12-25/mnu-menu.js"></script>

	<script src="./lib/grv-github-repo-tree-view/grv-github-repo-tree-view-2020-12-25.js"></script>

	<script src="./lib/fo-file-open/foo-file-open-object-2020-12-25.js"></script>
	<script src="./lib/fo-file-open/foz-file-open-zip-2020-07-07.js"></script>
	<script src="./lib/fo-file-open/fr-file-reader-2020-07-06.js"></script>


	<details id=detNavMenu class="gmd-4">

		<summary id=sumNavMenu class="summary-secondary gmd-1">show || hide menu</summary>

		<nav id="navMenu" class="gmd-2">

			<div id=MNUdivHeader></div>

			<div id=divNavLog></div>

			<details id=detFile>

				<summary class="summary-primary gmd-1" title="Open files on your device: ">file menu</summary>

				<div id=FRdivMenuFileReader></div>

				<p>
					<input type=file id=FRinpFile onchange=FR.readFile(this); accept="*">
				</p>

				<div id=FOOdivLog>to be reset</div>

				<div id=FOZdivFileOpenZip></div>

				<div id=divLog></div>

			</details>


			<div id=GFFdivDetails></div>

			<div id=GRVdivDetails></div>


			<div id="divStats"></div>
			<div id="divLog"></div>

			<hr>

			<div id=MNUdivFooter></div>

		</nav>

	</details>


	<main>

		<div id="divContentMain"></div>

	</main>


	<script>

		// divDescription.innerHTML = document.head.querySelector( "[ name=description ]" ).content +
		// 	"<br><br>Update: " + document.head.querySelector( "[ name=version ]" ).content

		const source = "https://github.com/pushme-pullyou/tootoo-2020/";

		const version = document.head.querySelector( "[ name=date ]" ).content;

		const description = document.head.querySelector( "[ name=description ]" ).content;

		init();

		function init() {

			MNU.path = "./";

			MNU.init();

			aGithub.href = source;

			spnTitle.innerHTML = "TooToo";

			spnVersion.innerHTML = version;

			divDescription.innerHTML = description;

			// if running on server, keeps address bar pointed to latest dev

			//if ( !location.hash && location.protocol === "https:" ) {
			if ( location.protocol === "https:" ) {

				window.history.pushState( "", "", "./" + location.hash );

				GRV.urlViewer = "";
				//GRV.ignoreFolders = [ "archive", "drafts", "images", "js", "lib", "src", "templates" ];
				//GRV.ignoreFolders = [ "archive", "drafts", "images", lib", "lib3d", "lib-template-viewer",
				//"lib3d-template-viewer", "plugins","src", "templates" ];


			} else {

				if ( location.href.includes( "pushme" ) ) {

					GRV.urlViewer = ""; // "https://pushme-pullyou.github.io/";

				} else {

					GRV.urlViewer = "";

				}
				GRV.ignoreFolders = [];

			}

			GRV.user = "pushme-pullyou";
			GRV.repo = "tootoo-2020";
			//GRV.getFiles = GRV.getFilesSimple;

			GRV.init();

			FOO.init();

			FOO.onHashChange();

		}


		// function onHashChange() {

		// 	const fileName = location.hash ? location.hash.slice( 1 ) : GRV.defaultFile;
		// 	const title = fileName.split( "/" ).pop();
		// 	const extension = title.toLowerCase().split( '.' ).pop();
		// 	const url = GRV.urlViewer + fileName

		// 	document.title = title;

		// 	if ( extension === "md" ) {

		// 		showdown.setFlavor( "github" );

		// 		const options = { excludeTrailingPunctuationFromURLs: true, ghMention: true, parseImgDimensions: true, simplifiedAutoLink: true, simpleLineBreaks: true, emoji: true, openLinksInNewWindow: true };

		// 		const xhr = new XMLHttpRequest();
		// 		xhr.open( "get", url, true );
		// 		xhr.onload = () => {
		// 			const txt = xhr.responseText.replace( /\<!--@@@/, "" ).replace( /\@@@-->/, "" );
		// 			divContentMain.innerHTML = new showdown.Converter( options ).makeHtml( txt );
		// 			window.scrollTo( 0, 0 );
		// 		};
		// 		xhr.send( null );

		// 		return;

		// 	}

		// 	if ( [ "gif", "jpg", "png", "svg" ].includes( extension ) ) {

		// 		divContentMain.innerHTML = `<a href=${ url } title="Open this image in a new window" target="_blank" ><img src="${ url }" style=max-width:100% ></a>`;

		// 		return;

		// 	}

		// 	divContentMain.innerHTML = `<iframe src="${ url }" height=${ window.innerHeight } width=100% ></iframe>`;

		// }

	</script>
</body>

</html>