Tone.js/examples/index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
	<title>EXAMPLES</title>

	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<link rel="icon" type="image/png" sizes="174x174" href="./style/favicon.png">
	
	<script src="./scripts/jquery.min.js"></script>
	<script src="https://tonejs.github.io/Logo/build/Logo.js"></script>
	<script src="./scripts/ExampleList.js"></script>

	<link rel="stylesheet" type="text/css" href="./style/examples.css">	
	<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">

</head>
<body>
	<div id="Content" class="Example">
		<iframe></iframe>
		<div id="Sidebar"></div>
	</div>
	
	<script>

		var container = $("#Sidebar");

		var topbar = $("<div>").attr("id", "TopBar");
		$("body").prepend(topbar);

		// make the hamburger menu
		var hamburger = $("<div>").attr("id", "Hamburger")
			.appendTo(topbar);
		for (var i = 0; i < 3; i++){
			$("<span>").appendTo(hamburger);
		}
		hamburger.on("click", function(){
			$("#Sidebar").toggleClass("Open");
		});

		//add the Logo
		Logo({
			"container" : topbar.get(0),
			"height" : topbar.height() - 6,
			"width" : 140
		});

		for (var catName in ExampleList){
			$("<div>").addClass("Category").text(catName).appendTo(container);
			var category = ExampleList[catName];
			for (var example in category){
				$("<div>").addClass("Item")
					.appendTo(container)
					.html($("<a>").attr("href", "#" + category[example]).text(example));
			}
		}

		$(window).on("hashchange", setHash);	

		function setHash(){
			var hash = window.location.hash.substring(1);
			if (hash === ""){
				return;
			}
			var exampleName;
			//split hash at the .
			if (hash.split(".").length === 2){
				var split = hash.split(".");
				hash = split[0];
				exampleName = split[1];
			}
			var url = location.protocol+'//'+location.host+location.pathname + hash + ".html";
			$("iframe").attr("src", url);

			// close the sidebar if it's open
			if ($("#Sidebar").hasClass("Open")){
				$("#Sidebar").removeClass("Open");
			}

			// add the source link
			var srcUrl = "https://github.com/Tonejs/Tone.js/blob/master/examples/"+hash+".html"
			if (!$("#Source").length){
				$("<a id=\"Source\"></a>").appendTo("#Content");
			}
			$("#Source").attr("href", srcUrl);
		}

		//set it initially
		setHash();


	</script>
</body>
</html>
adds doctype html and utf-8 encoding on all examples 2014-10-22 22:49:42 +00:00			`<!DOCTYPE html>`
making the examples styled and work consistently. 2014-06-23 17:29:22 +00:00			`<html>`
			`<head>`
adds doctype html and utf-8 encoding on all examples 2014-10-22 22:49:42 +00:00			`<meta charset="utf-8">`
making the examples styled and work consistently. 2014-06-23 17:29:22 +00:00			`<title>EXAMPLES</title>`
zooming on mobiles 2014-09-09 19:30:53 +00:00
updated meta tags 2015-06-27 22:10:18 +00:00			`<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">`
adding favicon 2015-12-08 05:06:58 +00:00			`<link rel="icon" type="image/png" sizes="174x174" href="./style/favicon.png">`
styled the example homepage Fixes #3 2014-09-05 05:31:10 +00:00
JS type attribute not needed in html5 (#214) * type attribute not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type at not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not neede * type att not needed * type att not needed * type att not needed * type att not needed 2017-03-18 16:35:37 +00:00			`<script src="./scripts/jquery.min.js"></script>`
			`<script src="https://tonejs.github.io/Logo/build/Logo.js"></script>`
			`<script src="./scripts/ExampleList.js"></script>`
example index page 2015-02-26 16:25:16 +00:00
			`<link rel="stylesheet" type="text/css" href="./style/examples.css">`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00			`<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">`
styled the example homepage Fixes #3 2014-09-05 05:31:10 +00:00
making the examples styled and work consistently. 2014-06-23 17:29:22 +00:00			`</head>`
			`<body>`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00			`<div id="Content" class="Example">`
			`<iframe></iframe>`
			`<div id="Sidebar"></div>`
updated examples style and copy add Logo, updated qwerty hancock & nexusUI 2015-12-05 18:20:53 +00:00			`</div>`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00
JS type attribute not needed in html5 (#214) * type attribute not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type at not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not neede * type att not needed * type att not needed * type att not needed * type att not needed 2017-03-18 16:35:37 +00:00			`<script>`
styled the example homepage Fixes #3 2014-09-05 05:31:10 +00:00
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00			`var container = $("#Sidebar");`
updated examples 2015-06-27 21:25:01 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`var topbar = $("<div>").attr("id", "TopBar");`
			`$("body").prepend(topbar);`

			`// make the hamburger menu`
			`var hamburger = $("<div>").attr("id", "Hamburger")`
			`.appendTo(topbar);`
			`for (var i = 0; i < 3; i++){`
			`$("<span>").appendTo(hamburger);`
			`}`
			`hamburger.on("click", function(){`
			`$("#Sidebar").toggleClass("Open");`
			`});`
updated examples style and copy add Logo, updated qwerty hancock & nexusUI 2015-12-05 18:20:53 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`//add the Logo`
			`Logo({`
			`"container" : topbar.get(0),`
			`"height" : topbar.height() - 6,`
			`"width" : 140`
			`});`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`for (var catName in ExampleList){`
			`$("<div>").addClass("Category").text(catName).appendTo(container);`
			`var category = ExampleList[catName];`
			`for (var example in category){`
			`$("<div>").addClass("Item")`
			`.appendTo(container)`
			`.html($("<a>").attr("href", "#" + category[example]).text(example));`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00			`}`
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`}`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`$(window).on("hashchange", setHash);`
updated meta tags 2015-06-27 22:10:18 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`function setHash(){`
			`var hash = window.location.hash.substring(1);`
			`if (hash === ""){`
			`return;`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00			`}`
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`var exampleName;`
			`//split hash at the .`
			`if (hash.split(".").length === 2){`
			`var split = hash.split(".");`
			`hash = split[0];`
			`exampleName = split[1];`
			`}`
			`var url = location.protocol+'//'+location.host+location.pathname + hash + ".html";`
			`$("iframe").attr("src", url);`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`// close the sidebar if it's open`
			`if ($("#Sidebar").hasClass("Open")){`
			`$("#Sidebar").removeClass("Open");`
			`}`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`// add the source link`
			`var srcUrl = "https://github.com/Tonejs/Tone.js/blob/master/examples/"+hash+".html"`
			`if (!$("#Source").length){`
			`$("<a id=\"Source\"></a>").appendTo("#Content");`
updated examples 2015-06-27 21:25:01 +00:00			`}`
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`$("#Source").attr("href", srcUrl);`
			`}`
updated meta tags 2015-06-27 22:10:18 +00:00
removing jquery ready from examples 2017-03-26 20:39:19 +00:00			`//set it initially`
			`setHash();`
adding example sidebar [skip ci] 2016-12-22 18:21:46 +00:00

styled the example homepage Fixes #3 2014-09-05 05:31:10 +00:00			`</script>`
making the examples styled and work consistently. 2014-06-23 17:29:22 +00:00			`</body>`
JS type attribute not needed in html5 (#214) * type attribute not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type at not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not needed * type att not neede * type att not needed * type att not needed * type att not needed * type att not needed 2017-03-18 16:35:37 +00:00			`</html>`