Added loading message

12 files changed, 135 insertions, 53 deletions

diff --git a/AutoAudio.html b/AutoAudio.html
index 005bcb5..8b452a8 100644
--- a/AutoAudio.html
+++ b/AutoAudio.html
@@ -40,7 +40,7 @@
         </form>

 

         <br>

-        <button onclick="create();" type='button' class="btn btn-success">Create</button>

+        <button onclick="start();" type='button' id="Create" class="btn btn-success">Create</button>

         <br><br>

 

         <audio id='Audio' controls></audio>

diff --git a/AutoImages.html b/AutoImages.html
index 35347f4..84f840a 100644
--- a/AutoImages.html
+++ b/AutoImages.html
@@ -22,7 +22,7 @@
         After you click create, wait until the image shows, then click "Download".</p>

 

         <br>

-        <button onclick="create();" type='button' class="btn btn-success">Create</button>

+        <button onclick="start();" type="button" id="Create" class="btn btn-success">Create</button>

         <br><br>

 

         <form id='Options'>

diff --git a/AutoVideos.html b/AutoVideos.html
index 3ff960b..ba81097 100644
--- a/AutoVideos.html
+++ b/AutoVideos.html
@@ -17,7 +17,7 @@
 

         <h2>AutoVideos</h2>

         <p>AutoVideos is a program that creates computer generated videos.<br>

-        For an explanation of AutoAudio, go <a href="explanation.html">here</a>

+        For an explanation of AutoVideos, go <a href="explanation.html">here</a>

         First click the create button then the download button.<br>

         If the download button doesn't work, just right click on the image then click "Save image as...".

         Change X and Y to change the resolution of the image.<br>

@@ -47,7 +47,7 @@
         </form>

 

         <br>

-        <button onclick="create();" type='button' class="btn btn-success">Create</button>

+        <button onclick="start();" type='button' id='Create' class="btn btn-success">Create</button>

         <br><br>

 

         <p id='Time'></p>

diff --git a/NameGenerator.html b/NameGenerator.html
index 5dab38a..975a092 100644
--- a/NameGenerator.html
+++ b/NameGenerator.html
@@ -25,7 +25,7 @@
 
 		Number of names: <input type="number" id="numNames" value=10><br>
 		Display names at bottom <input id="outputNames" type="checkbox" checked=true> (Unchecking this option will mean that you will have to download the names to see them)<br><br>
-		<button id="button" onclick="createNames();">Create Names!</button><br>
+		<button id="button" class="btn btn-primary" onclick="create();">Create Names!</button><br>
 		<a id="download" target="_blank"></a>
 
 		<div id="names">
diff --git a/Navbar.html b/Navbar.html
index 3c02353..a1523bb 100644
--- a/Navbar.html
+++ b/Navbar.html
@@ -3,15 +3,14 @@
 <nav style="margin-bottom: 0px" class="navbar navbar-default">
   <div class="container-fluid">
     <div class="navbar-header">
-        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
-          <span class="sr-only">Toggle navigation</span>
+        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
           <span class="icon-bar"></span>
           <span class="icon-bar"></span>
           <span class="icon-bar"></span>
         </button>
         <a class="navbar-brand" target="_top" href="index.html">AutoArt</a>
     </div>
-    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+    <div class="collapse navbar-collapse" id="navbar-collapse">
       <ul class="nav navbar-nav">
         <li><a target="_top" href="index.html">Home</a></li>
         <li><a target="_top" href="all.html">All</a></li>
diff --git a/js/AutoAudio.js b/js/AutoAudio.js
index cc6b554..d3cf4f0 100644
--- a/js/AutoAudio.js
+++ b/js/AutoAudio.js
@@ -62,7 +62,7 @@ function rmvmath(str)
 		}
 	}
 	return newstr;
-};
+}
 
 function randEquation()
 {
@@ -156,6 +156,8 @@ function create()
 	var start = date.getTime();
 	var form = document.getElementById('Options');
 	var errtag = document.getElementById('Error');
+
+
 	errtag.innerHTML = '';
 	for (var i = 0; i < form.elements.length; i++)
 	{
@@ -201,6 +203,8 @@ function create()
 	functionp.innerHTML = '$Function: $' + rmvmath(equation);
 	LatexIT.render('*',false);
 
+	stopLoading();
+
 	if(notify)
 	{
 		alert('Your audio has finished.');
@@ -211,3 +215,21 @@ function create()
 
 
 }
+
+function startLoading()
+{
+	$('#Create').prop('disabled', true);
+	$('#Create').html('Loading...');
+}
+
+function stopLoading()
+{
+	$('#Create').prop('disabled', false);
+	$('#Create').html('Create');
+}
+
+function start()
+{
+	startLoading();
+	window.setTimeout(create, 1);
+}
diff --git a/js/AutoImages.js b/js/AutoImages.js
index cd3ff66..502fff6 100644
--- a/js/AutoImages.js
+++ b/js/AutoImages.js
@@ -51,12 +51,12 @@ function rmvmath(str)
 		}
 	}
 	return newstr;
-};
+}
 
 function randItem(l)
 {
 	return l[Math.floor(Math.random() * l.length)];
-};
+}
 
 function countChar(string, letter)
 {
@@ -69,7 +69,7 @@ function countChar(string, letter)
 		}
 	}
 	return amount;
-};
+}
 
 
 
@@ -149,7 +149,7 @@ function randEquation()
         equation += ')';
 	}
     return equation;
-};
+}
 
 
 function create()
@@ -224,17 +224,39 @@ function create()
 
 	functionp.innerHTML = '$Functions: \\newline\\newline Red: $' + rmvmath(requation) + '$\\newline\\newline Green: $' + rmvmath(gequation) + '$\\newline\\newline Blue: $' + rmvmath(bequation) + '$';
 	LatexIT.render('*',false);
+
+	stopLoading();
+
 	if(notify)
 	{
 		alert('Your image has finished.');
 	}
 	document.getElementById('Download').innerHTML = "Download";
-};
+}
+
+function startLoading()
+{
+	$('#Create').prop('disabled', true);
+	$('#Create').html('Loading...');
+}
 
+function stopLoading()
+{
+	$('#Create').prop('disabled', false);
+	$('#Create').html('Create');
+}
 
-function download() {
+function start()
+{
+	startLoading();
+	window.setTimeout(create, 1);
+}
+
+function download()
+{
     var dt = canvas.toDataURL('image/png');
     this.href = dt;
-};
+}
+
 var downloadLink = document.getElementById('Download');
 downloadLink.addEventListener('click', download, false);
diff --git a/js/AutoVideos.js b/js/AutoVideos.js
index 08a47fc..f92ea9d 100644
--- a/js/AutoVideos.js
+++ b/js/AutoVideos.js
@@ -43,12 +43,12 @@ function rmvmath(str)
 		}
 	}
 	return newstr;
-};
+}
 
 function randItem(l)
 {
 	return l[Math.floor(Math.random() * l.length)];
-};
+}
 
 function countChar(string, letter)
 {
@@ -61,7 +61,7 @@ function countChar(string, letter)
 		}
 	}
 	return amount;
-};
+}
 
 
 function randEquation()
@@ -147,7 +147,7 @@ function randEquation()
         equation += ')';
 	}
     return equation;
-};
+}
 
 function evalEquation(eq, x, y, t)
 {
@@ -160,7 +160,8 @@ function evalEquation(eq, x, y, t)
 	{
 		return 0;
 	}
-};
+}
+
 function create()
 {
 	var d = new Date();
@@ -255,10 +256,30 @@ function create()
 	$("#Function").html('$Functions: \\newline\\newline Red: $' + rmvmath(requation) + '$\\newline\\newline Green: $' + rmvmath(gequation) + '$\\newline\\newline Blue: $' + rmvmath(bequation) + '$');
 	LatexIT.render('*',false);
 
+	stopLoading();
+
 	if(notify)
 	{
 		alert('Your video has finished.');
 	}
 
 
-};
+}
+
+function startLoading()
+{
+	$('#Create').prop('disabled', true);
+	$('#Create').html('Loading...');
+}
+
+function stopLoading()
+{
+	$('#Create').prop('disabled', false);
+	$('#Create').html('Create');
+}
+
+function start()
+{
+	startLoading();
+	window.setTimeout(create, 1);
+}
diff --git a/js/NameGenerator.js b/js/NameGenerator.js
index 44e3eaa..2a11411 100644
--- a/js/NameGenerator.js
+++ b/js/NameGenerator.js
@@ -2,7 +2,7 @@
 var trigrams = {};
 var trigramKeyList;
 var sumStartsWith = {};
-	
+
 function loadTrigrams(responseText)
 {
 	var lines = responseText.split('\n');
@@ -14,9 +14,9 @@ function loadTrigrams(responseText)
 			continue;
 		trigrams[trigram] = value;
 	}
-	
+
 	trigramKeyList = Object.keys(trigrams);
-	
+
 	document.getElementById("loading").innerHTML = "";
 }
 
@@ -24,7 +24,7 @@ function start()
 {
 	var xhttp = new XMLHttpRequest();
 
-	xhttp.onreadystatechange = function() 
+	xhttp.onreadystatechange = function()
 	{
 		if (xhttp.readyState == 4 && xhttp.status == 200)
 		{
@@ -37,10 +37,10 @@ function start()
 
 function pickFirst2()
 {
-	
+
 	var count = 0;
 	var sum = 0;
-	
+
 	for (var i = 0; i < trigramKeyList.length; i++)
 	{
 		if (trigramKeyList[i][0] == ' ')
@@ -48,10 +48,10 @@ function pickFirst2()
 			sum += trigrams[trigramKeyList[i]];
 		}
 	}
-	
+
 	var selected = Math.random() * sum;
-	
-	
+
+
 	for (var i = 0; i < trigramKeyList.length; i++)
 	{
 		if (trigramKeyList[i][0] == ' ')
@@ -61,7 +61,7 @@ function pickFirst2()
 				return trigramKeyList[i].substring(1);
 		}
 	}
-	
+
 	return "ERROR";
 }
 
@@ -84,7 +84,7 @@ function nextChar(name)
 	}
 	var selected = Math.random() * total;
 	var count = 0;
-	
+
 	for (var i = 0; i < trigramKeyList.length; i++)
 	{
 		if (trigramKeyList[i].substring(0, 2) == last2)
@@ -94,7 +94,7 @@ function nextChar(name)
 				return trigramKeyList[i][2];
 		}
 	}
-	
+
 	return "ERROR";
 }
 
@@ -111,39 +111,58 @@ function generateName()
 		next = nextChar(name);
 	}
 	while (next != ' ');
-	
+
 	name = name[0].toUpperCase() + name.substring(1);
-	
-	
+
+
 	return name;
 }
 
 
 function createNames()
 {
-	document.getElementById("button").disabled = true;
 	var nameStr = '';
 	var numNames = document.getElementById("numNames").value;
 	var nameDiv = document.getElementById("names");
-	
+
 	window.setTimeout(50, function() {document.getElementById("loading").innerHTML = "Loading...";});
-	
+
 	nameDiv.innerHTML = "";
-	
+
 	for (var i = 0; i < numNames; i++)
 		nameStr += generateName() + "<br>";
-	
+
 	if (document.getElementById("outputNames").checked)
 		nameDiv.innerHTML = nameStr;
-	
+
 	document.getElementById("loading").innerHTML = "";
-	
+
 	var dload;
 	dload = document.getElementById("download");
 	dload.innerHTML = "Download names (.txt)";
 	var txt = nameStr.replace(/<br>/g, "\n");
 	dload.href = "data:text/plain;charset=utf-8," + encodeURI(txt);
-	document.getElementById("button").disabled = false;
+
+	stopLoading();
+}
+
+function startLoading()
+{
+	$('#button').prop('disabled', true);
+	$('#button').html('Loading...');
+}
+
+function stopLoading()
+{
+	$('#button').prop('disabled', false);
+	$('#button').html('Create Names!');
+}
+
+
+function create()
+{
+	startLoading();
+	window.setTimeout(createNames, 1);
 }
 
-start();
\ No newline at end of file
+start();
diff --git a/js/mazesolver.js b/js/mazesolver.js
index aa43ed3..c2b5b89 100644
--- a/js/mazesolver.js
+++ b/js/mazesolver.js
@@ -2,7 +2,6 @@
 var canvas = document.getElementById('Canvas');
 var form = document.getElementById('Form');
 
-canvas.onmousedown = function(e) { if (e.button === 1) return false; }
 
 var X;
 var Y;
@@ -367,7 +366,7 @@ function mousePressed(event)
 
 	var button = -1;
 
-	if ("which" in event) 
+	if ("which" in event)
         if (event.which == 2) button = 1; else if (event.which == 3) button = 2; else button = 0;
     else if ("button" in event)
         button = event.button;
diff --git a/js/modularpascal.js b/js/modularpascal.js
index 80f65d3..ea91de1 100644
--- a/js/modularpascal.js
+++ b/js/modularpascal.js
@@ -32,10 +32,10 @@ function updateTriangle()
 		{

 			fill(colors[triangle[i][j]][0], colors[triangle[i][j]][1], colors[triangle[i][j]][2]);

 			rect(getPos(i, j)[0], getPos(i, j)[1], 2, 2);

-			

+

 		}

 	}

-	

+

 }

 

 function setup()

@@ -51,5 +51,5 @@ function getPos(row, column)
 

 function draw()

 {

-	

+

 }

diff --git a/modularpascal.html b/modularpascal.html
index 2fb5b6f..2472aaf 100644
--- a/modularpascal.html
+++ b/modularpascal.html
@@ -14,7 +14,7 @@
         <p>A picture of Pascal's triangle mod x. This program might be a bit slow.</p>

 

         <script src="js/modularpascal.js"></script>

-        x: <input min="1" value="2" type="number" id="mod"><br>

-        <button onclick="updateTriangle();">Update</button><br>

+        x: <input min="1" value="2" type="number" id="mod"><br><br>

+        <button class="btn btn-sm btn-primary" onclick="updateTriangle();">Update</button><br>

     </body>

 </html>