Code viewer for World: 4. Comments, Types and Var...
        AB.restoreData ( function ( clicked ) { clicker(clicked); } );
        
        function clicker(x) {
            clicked = x;
        }
        
        function tbc() {
            if (typeof clicked === 'undefined') {
                clicked = [];
            }
            clicked.push('true');
            console.log(clicked);
        }
        
        function move_on() {
            AB.world.saveData = function () { return clicked; };   
            
            if (typeof clicked === 'undefined' || clicked.length<1) {
                if (typeof clicked === 'undefined') {
                    clicked = [];
                }
                alert_box();
            }
            else {
                dont_continue_lesson();
            }
        }
        
        function alert_box() {
        console.log('alert');
            /*Creating and appending the element */
        
            var element = '<div id="overlay" style="opacity:0"><div id="container">';
            element += "<h1>Have you completed this lesson?</h1><p>It seems that you haven't completed all the tasks, are you sure you want to move on?</p></br></br>";
            element += "<center><button onclick='dont_continue_lesson()' >  Yes  </button>";
            element += "<button onclick='continue_lesson()'>  No  </button></center>";
            element += "</div></div>";
            document.body.innerHTML += (element);
            document.getElementById('overlay').style.display = "block";
        
            var fadeIn = setInterval(function () {
                if (document.getElementById('overlay').style.opacity > 0.98) clearInterval(fadeIn);
                var overlay = document.getElementById('overlay');
                overlay.style.opacity = parseFloat(overlay.style.opacity, 10) + 0.05;
            }, 50);
        };
        
        function continue_lesson() {
            document.getElementById("overlay").outerHTML = "";
        }
        
        function dont_continue_lesson() {
            AB.saveData ( clicked );
            window.location.href = 'https://run.ancientbrain.com/run.php?world=8790247811';
            console.log(clicked);
        }
        


document.write ( `

<style id="css">
</style>

<header>
    <img src="uploads/alexmurphy1996/comments_icon.png" align="left" height=23%/>
	<h1> 4. Comments, Types and Variables </h1>
</header>

<section>


	<article>
	    <p>In programming we use comments to explain the code that we write.  Comments in javascript are any text after double forward slash - //.</p>
	    <p><font color="gray">
	    &nbsp&nbsp/*</br>
	    &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp This is a block comment.</br> 
	    &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp All text within this block is commented out.</br>
	    &nbsp&nbsp*/
	    </font></p>
		<p>
		    In order to assign and store values to a reference so the value can be used again throughout a program, both constants and variables are used.
		</p>
		<ul><li>
		    Variables are a very important part of programming. 
		    In computer science variables are simply named locations in memory where data can be stored.
		</li></br>
		<li>
		    Constants are the same as variables except they do not change throughout the lifetime of the program.
		</li></br>
		<li>
		    Variables have a type, some examples are - Strings, Integers, Booleans.
		</li></ul>
        </br>
		<table align="center">
			<tr>
				<th><i>Type</i></th>
				<th><i>Example</i></th>
			</tr>
			<tr>
				<td>String</td>
				<td>"hello world"</td>
			</tr>
			<tr>
				<td>Integer</td>
				<td>1, 10, 533, etc.</td>
			</tr>
			<tr>
				<td>Boolean</td>
				<td>true/false</td>
			</tr>
		</table>
		</br>
        <center><b>Don't worry about the names of the types for now, you'll get by fine without knowing them.</b></center>
		<p>
		Variables and constants are declared in the following way:
		</p></br>
		<img src="/uploads/alexmurphy1996/UntitledDiagram.jpg">
		<p>Constants use <b>const</b> instead of var, but again don't worry, we'll just use var for now.</p>
		</br>
		<p>
		    Statements in JavaScript nearly always end in a semicolon - ';'.
		    </br></br><b><i>Examples:</i></b></br>
		    <ul>
		        <i>var word = "dog";</i> - This statement assigns the string 'dog' to the variable named 'word'.
		        </br></br>
		        <i>var x = 1.265;</i> <span style:"padding-left:5em">- This statement assigns the float value 1.265 the the variable named 'x'.</span>
		    </ul></p>
		</br></br>
		<h2> Exercise 4.1 </h2>

		<p>Follow <a href="https://ancientbrain.com/world.php?world=1665807120" onclick="tbc()">this link</a> to be brought to the World we are editing for this lesson. Clone the world and open the editor.</p>
		</br>
        <p align="center"><iframe   style='width:30vw; height:20vw; border:1px solid black;' scrolling=no src='https://ancientbrain.com/embed.php?world=1665807120' align="middle"></iframe></br></br>
		<p>
		  <b>1)</b> Uncomment the variable named <b>string</b> and run the world. Set a word of your choice to it and run the world again.
		</p></br>
		<img src="uploads/alexmurphy1996/MakeLotsOfThem.png" width=35% height=45% style="float:right">
		<p>
		  <b>2)</b> Declare a variable named <b>amount</b> and assign an integer to it to show your string more times.
		</p></br>
		<p>
		  <b>3)</b> Declare a variable named <b>colour</b> and assign it to true to change the colour of your string.
		</p></br>
		
		</br></br>
		<h2> Exercise 4.2 </h2>
		</br>
		<p>
		  <b>1)</b> Declare variable named <b>chasing</b>, set it to true and run the world. You will now witness a game of chasing being played out.
		</p></br>
		<p>
		  <b>2)</b> Upload your own images to be the chaser and the runner. Then update the appropriate variables to display your own characters.
		</p></br>
		<p>
		  <b>3)</b> Upload your own sound effect for the end of the game and update the song variable appropriately.
		</p></br>
		<p>
		  <b>4)</b> Make the funniest game of chasing you can.
		</p></br>
		</br></br>
		
		<center><button class="btn success" onclick="move_on()" id="l2">Now let's do some calculations!</button><center>

	</article>
	
		<nav id="nav">	</nav>
</section>

` );




    	$.getScript("/uploads/alexmurphy1996/navigation.js",  function()
        {
            $("#nav").html(thehtml);
        });
        
        $.getScript("/uploads/alexmurphy1996/css.js",  function()
        {
            $("#css").html(the_css);
        });