Difference between revisions of "Team:Newcastle/libs/HP/js-js"

m
m
Line 701: Line 701:
 
$("body").append($newdiv2);
 
$("body").append($newdiv2);
 
$("#page-cover").css("opacity", 0.6).fadeIn(300, function () {
 
$("#page-cover").css("opacity", 0.6).fadeIn(300, function () {
−
var $newdiv1 = $("<div id='level2popup'><div id='popuptext'>One key advantage of biological circuitry is the potential to self-heal, negating the need for additional supplies or repair specialists. This would be particularly useful in places where these assets are in short supply, such as on the upcoming manned mission to Mars - this is the scenario covered by exercise 2.</div></div>");
+
var $newdiv1 = $("<div id=\'level2popup\'><div id=\'popuptext\'>One key advantage of biological circuitry is the potential to self-heal, negating the need for additional supplies or repair specialists. This would be particularly useful in places where these assets are in short supply, such as on the upcoming manned mission to Mars - this is the scenario covered by exercise 2.</div></div>");
 
$("body").append($newdiv1);
 
$("body").append($newdiv1);
 
var $button = $("<input type='button' id='button2' value='Close'>");
 
var $button = $("<input type='button' id='button2' value='Close'>");

Revision as of 22:33, 19 October 2016

var randomNumber = generateNumber(); var base4Name = convertBaseFour(randomNumber); var userName;

function init() { var a = document.getElementById("levelOneAppear"); $(a).css("display", "block"); $('.component').draggable({ //containment: "#breadboard", cursor: "move", // stop: stopHandler, // drag: dragHandler, helper: "clone" }); $('#batterydrop').droppable({ drop: batteryHandler }); $('#bulbdrop').droppable({ drop: bulbHandler }); $('#wiredrop').droppable({ drop: wireHandler }); $('#turbinedrop').droppable({ drop: turbineHandler }); $('#applicationsdrop').droppable({ drop: turbineHandler }); }

var states = { LEVEL_ONE: 0 , LEVEL_TWO: 6 , LEVEL_THREE: 12 , LEVEL_FOUR: 19 , LEVEL_FIVE: 23 } var passwordbase4 = 312; var gbl_state = states.LEVEL_ONE; var gbl_txtix = 0; var helpTxt = [ 'Welcome to Level 1' , 'Drag and drop a light bulb and battery to form a basic circuit.' , 'Change the voltage to make the light bulb brighter or dimmer.' , 'Now replace the light bulb, by dragging and dropping the bacterial light bulb to the same position.' , 'Like before, change the voltage to make the bacterial light bulb brighter or dimmer.' , 'Oops! The E.coli used in the bulb have died. This has upset the E.coli activists who feel there should be rights for bacteria. Click next to find out more.' , 'Welcome to Level 2' , 'Drag and drop electrical wires to connect the transmitter to mission control' , 'Part of the wires have broken and there are not enough processed materials on board to fix the problem. This means that communication to Earth has been lost.' , 'Drag and drop the neuron wires instead. Neurons have self healing capabilities so they should repair parts of the wire that break without the need for processed materials.' , 'Oh no! Something is wrong with the neuron wires! It seems that the high levels of radiation and vibration from the rocket have made the neurons ill. Click next to find out more.' , 'It seems that the high levels of radiation and vibration from the rocket have made the neurons ill. Click next to find out more.' , 'Welcome to Level 3' , 'On less windy days, turbines use electrical power to help initiate movement of the turbine. Fuel cells could be a possible substitute for replacing the non-renewable power needed to do this. Drag and drop a fuel cell containing genetically engineered E.coli.' , 'Unfortunately, the E.coli fuel cell has not generated enough power to start the turbine. Click Next to bin the fuel cell' , 'Drag and drop the fuel cell containing insect cells instead.' , 'Unfortunately, the insect fuel cell has not generated enough power to start the turbine. Click Next to bin the insect fuel cell' , 'Drag and drop the fuel cell containing cat tissue.' , 'The cat tissue fuel cell has not generated enough power to start the turbine either. The idea of binning a fuel cell containing cat tissue might upset you, how far are you willing to go? Click next to find out more about disposal of cells and the ethics surrounding it' , 'Welcome to Level 4' , 'Click on the 3D printer to print a 3D heart, and then drag and drop it into the circuit to power a kidney dialysis machine' , 'Click on the 3D printer to print another 3D heart, and drag and drop it into the circuit to power a video game' , "In July, Newcastle iGEM 2016 ran a sixth former\'s day where they asked students about the application of cells. Click next to find out more" , 'Welcome to Level 4' , 'Oh look! Billy has sent a message! Click open to find out what he says.' , 'Billy wants you to tell him your name, click reply to respond to his email' , 'Type your name in the box, and we will send your name via Edinburgh iGEM 2016 Babbled system.' , 'Press find to search the word library and assign a number to your name.' , 'Press next to convert the base 10 value of your name to base 4' , 'The password previously agreed with Billy is "MagicFish". "MagicFish" has a value of 54 in base 10. In base 4, this converts to 312.' , 'In order to send your encrypted message, we have to XOR the base 4 values for your name and the password' , 'Babbled stores base 4 values so that each digit represents a base' , 'Press send to tell Billy your name' , 'Oh no! Your name has been intercepted by the e.coli activists! Luckily, they do not know the password to decrypt your message, so your message is safe. But imagine if they cracked your password... click next to find out more!' ];

$(function() { 

   $("#voltageSpinner").on("change blur", function() {
           var currentVal = $("#voltageSpinner").val();

           if ($("#bulbdrop").data("contents") === "LIGHTBULB") {
               if (currentVal >= 30) {
                   $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/b/ba/T--Newcastle--HPS-electricbulb_veryon.png')");

               } else if (currentVal >= 20) {

                   $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/f/f7/T--Newcastle--HPS-electricbulb_100on.png')");
               } else if (currentVal >= 10) {

                   $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/4/4d/T--Newcastle--HPS-electricbulb_dim.png')");
               } else {

                   $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/9/9e/T--Newcastle--HPS-electricbulb_off.png')");
           }
       } else {
           if (currentVal >= 30) {
               $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/2/2d/T--Newcastle--HPS-bacteria-unhappy.png')");

gbl_txtix = 5; 

               nxt();
           } else if (currentVal >= 20) {
               $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/5/5a/T--Newcastle--HPS-bacteriabulb_on100.png')");
           } else if (currentVal >= 10) {
               $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/2/27/T--Newcastle--HPS-bacteriabulb_dim.png')");
           } else {
               $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/0/0b/T--Newcastle--HPS-bacteriabulb_off.png')");
           }
       }
   });

});

Number.prototype.pad = function (size) { var s = String(this); while (s.length < (size || 2)) { s = "0" + s; } return s; }

function TenToFour(number) { var ix = 0; var digits = []; while (number != 0) { var remainder = number % 4; number = Math.floor(number / 4); digits.push(remainder); ix++; } digits.reverse(); var tmp = ""; //console.log(digits); if (digits.length == 0) { digits.push(0); } for (var i = 0; i < digits.length; i++) { tmp += String(digits[i]); } return parseInt(tmp); }

function xor(num1, num2) { // console.log("___XORing: " + String(num1) + " and " + String(num2)); return (4 - (num1 + num2) % 4) % 4; }

function encrypt(msg, key) { var ary_msg = msg.pad(5).split(""); var ary_key = key.pad(5).split(""); return apply_xor(ary_msg, ary_key); }

function apply_xor(as, bs) { if (as.length != bs.length) { return NaN; } var tmp = []; for (var i = 0; i < as.length; i++) { //console.log("XORing: " + String(as[i]) + " and " + String(bs[i])); var res = xor(parseInt(as[i]), parseInt(bs[i])); console.log(res); tmp.push(res); } return tmp; } var dna = "ATGC";

function nToDNA(n) { var str_n = n.toString(); var tmp = ""; for (var i = 0; i < str_n.length; i++) { tmp += dna[parseInt(str_n[i])]; } return tmp; }

function nxt() { console.log(gbl_txtix); var table = document.getElementById("baseTable"); $("#levelOneAppear").text(helpTxt[gbl_txtix++]); if (gbl_txtix >= states.LEVEL_TWO) { $(".toolbox").hide(); } else { $(".toolbox").show(); } if (gbl_txtix == 5) { $("#onebutton").hide(); } if (gbl_txtix == 6) {

var $newdiv2 = $("
");

$("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

var $newdiv1 = $("
Oops! The e.coli used in the bulb have died. This has upset the e.coli activists who feel there should be rights for bacteria. Click close to find out more.
<img id='eca' src='https://static.igem.org/mediawiki/2016/0/09/T--Newcastle--HPS-ecoli_activist.png'>
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level1popup').remove(); $('#page-cover').remove(); playLevel1Video(); }); }); $("#onebutton").show(); nxt(); } if (gbl_txtix == 12) {

var $newdiv2 = $("
");

$("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

var $newdiv1 = $("
<video id='video2' width='420'> <source src='https://2016.igem.org/File:T--Newcastle--Simulator2.webm' type='video/webm'></video>
Play Video
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level2popup').remove(); $('#page-cover').remove(); 

                               $('#video2').remove();

levelThreeAppear(); }); }); } if (gbl_txtix == 16) { $("#turbinedrop").css("background-image", "url()"); } if (gbl_txtix == 18) { $("#turbinedrop").css("background-image", "url()"); } if (gbl_txtix == 19) {

var $newdiv2 = $("
");

$("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

var $newdiv1 = $("
The cat cell has not generated enough power to start the turbine, the cat fuel cell has to be binned!
<img src='https://static.igem.org/mediawiki/2016/d/dd/T--Newcastle--HPS-bin.png' height='300' width='200>
The idea of binning a fuel cell containing cats might upset you, how far are you willing to go? Click Close to find out more about disposal of cells and the ethics surrounding it.
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level3popup').remove(); $('#page-cover').remove(); playLevel3Video(); }); }); } if (gbl_txtix == 23) { levelFiveAppear(); 

               $("#unopened").show();

} 

       if (gbl_txtix == 24) {
               $("#unopened").show();

} if (gbl_txtix == 25) { $("#onebutton").attr('value', 'Open'); $("#unopened").show(); } else if (gbl_txtix == 26) { $("#onebutton").attr('value', 'Reply'); $("#email").show(); $("#unopened").hide(); } else if (gbl_txtix == 27) { $("#onebutton").attr('value', 'Next'); $("#email").hide(); $("#unopened").hide(); $("#baseTable").show(); } else if (gbl_txtix == 28) { $("#onebutton").attr('value', 'Find'); $("#baseTable").show(); $("#email").hide(); console.log("gbl is " + gbl_txtix); } else if (gbl_txtix == 33) { $("#onebutton").attr('value', 'Send'); $("#email").hide(); $("#baseTable").hide(); $("#unopened").hide(); } else { $("#onebutton").attr('value', 'Next'); $("#email").hide(); $("#unopened").hide(); } //Display number associated with the name if (gbl_txtix => 27) { $("#baseTable").show(); } else { $("#baseTable").hide(); } if (gbl_txtix == 28) { var row1 = table.insertRow(1); var cell0 = row1.insertCell(0); var cell1 = row1.insertCell(1); // Add some text to the new cells: userName = nameFunction(); cell0.innerHTML = "Name:"; cell1.innerHTML = userName; //displayRandNumber(); } //Display base 4 of random number of the name else if (gbl_txtix == 29) { table.deleteRow(1); var row2 = table.insertRow(1); var cell20 = row2.insertCell(0); var cell21 = row2.insertCell(1); var cell22 = row2.insertCell(2); cell20.innerHTML = "Name:"; cell21.innerHTML = userName; cell22.innerHTML = randomNumber; //displayBase4OfName(); } else if (gbl_txtix == 30) { table.deleteRow(1); var row3 = table.insertRow(1); var cell30 = row3.insertCell(0); var cell31 = row3.insertCell(1); var cell32 = row3.insertCell(2); var cell33 = row3.insertCell(3); cell30.innerHTML = "Name:"; cell31.innerHTML = userName; //var randomNumber = generateNumber(); cell32.innerHTML = randomNumber; cell33.innerHTML = base4Name; } else if (gbl_txtix == 31) { var rowPassword1 = table.insertRow(2); var cellPassword1 = rowPassword1.insertCell(0); var cellPassword2 = rowPassword1.insertCell(1); var cellPassword3 = rowPassword1.insertCell(2); var cellPassword4 = rowPassword1.insertCell(3); cellPassword1.innerHTML = "Password:"; cellPassword2.innerHTML = "MagicFish"; cellPassword3.innerHTML = 54; cellPassword4.innerHTML = 312; //var cell4 = row1.insertCell(3); //var base4 = displayBase4OfName(); } //Display XOR else if (gbl_txtix == 32) { var rowBlank1 = table.insertRow(3); var cellBlank1 = rowBlank1.insertCell(0); cellBlank1.innerHTML = " "; var rowXOR1 = table.insertRow(4); var cellXOR1 = rowXOR1.insertCell(0); var cellXOR2 = rowXOR1.insertCell(1); var cellXOR3 = rowXOR1.insertCell(2); var cellXOR4 = rowXOR1.insertCell(3); cellXOR1.innerHTML = "XOR:"; cellXOR2.innerHTML = base4Name; cellXOR3.innerHTML = "XOR"; cellXOR4.innerHTML = 312; //displayXOR(); } //Display XOR result else if (gbl_txtix == 33) { var rowBlank2 = table.insertRow(5); var cellBlank2 = rowBlank2.insertCell(0); cellBlank2.innerHTML = " "; var rowXOR2 = table.insertRow(6); var cellXOR21 = rowXOR2.insertCell(0); var cellXOR22 = rowXOR2.insertCell(1); cellXOR21.innerHTML = "Answer:"; cellXOR22.innerHTML = printArray(encrypt(base4Name, 312)); //displayXORResult(); } else if (gbl_txtix == 34) { // Show Table Here } else { $("#baseTable").hide(); // Hide the table for all other instances of gbl_txtix that don't include 28, 29, 30 , 31, 32 or 33) } if (gbl_txtix == 34) { console.log("activist");

var $newdiv2 = $("
");

$("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

var $newdiv1 = $("
Oh no! Your name has been intercepted by the e.coli activists! Luckily, they could not decrypt your message but imagine if they cracked your password... click close to find out more!
<img id='eca' src='https://static.igem.org/mediawiki/2016/0/09/T--Newcastle--HPS-ecoli_activist.png'>
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level5popup').remove(); $('#page-cover').remove(); playLevel5Video(); }); }); } }

function playLevel1Video() {

var $newdiv2 = $("
");

$("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

var $newdiv1 = $("
<video id="video1" width="420"> 
   <source src="https://2016.igem.org/File:T--Newcastle--Simulator1.webm" type="video/webm">
 </video>
Play Video
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level1popup').remove(); $('#page-cover').remove(); $('#video1').remove(); levelTwoAppear(); }); }); }

function playLevel3Video() {

var $newdiv2 = $("
");

$("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

var $newdiv1 = $("
<video id="video3" width="420"> 
       <source src="https://2016.igem.org/File:T--Newcastle--Simulator3.webm" type="video/webm">
</video>Play Video
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level3popup').remove(); $('#page-cover').remove(); $('#video3').remove(); levelFiveAppear(); }); }); }

function ending() {

var $newdiv2 = $("
");

$("body").append($newdiv2); 

$("#page-cover").css("opacity", 0.6).fadeIn(300, function () {
var $newdiv1 = $("
Thank you for playing through our simulator. We hope it has made you consider the ethical issues surrouding interfacing bacteria with technology. Why not share it with someone you know and keep the discussion going!
Best wishes,
Newcastle iGEM 2016
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='End'>"); $($newdiv1).append($button); $($button).click(function () { window.location.reload();

}); }); } function playLevel5Video() {

var $newdiv2 = $("
");

$("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

var $newdiv1 = $("
<video id="video5" width="420"> 
   <source src="https://2016.igem.org/File:T--Newcastle--Simulator4.webm" type="video/webm">
</video>Play Video
");

$("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level5popup').remove(); $('#page-cover').remove(); $('#video5').remove(); 

                       ending();

}); }); }

function showEmail() { $("#email").show(); }

function displayRandNumber() { return randomnumber; }

function displayBase4OfName() { return base4Name; }

function displayXOR() { document.getElementById("displayXOR").innerHTML = base4Name + " XOR 312"; }

function displayXORResult() { document.getElementById("displayXORResult").innerHTML = " = " + printArray(encrypt(base4Name, 312)); }

function printArray(array) { var result = array.join(""); return result; }

function nameFunction() { var person = prompt("Please enter your name"); return person; // if (person != null) { // document.getElementById("displayname").innerHTML = "Your name is " + person + "!"; // } }

function generateNumber() { var randNum = Math.floor((Math.random() * 62) + 1); console.log("rand num = " + randNum); return randNum; }

function shiftBase(n, b) { var digits = []; while (n > 0) { digits.unshift(n % b); n = Math.floor(n/b); } return digits; }

function zipDigits(digits, b) { var n = 0; for (var i = 0; i < digits.length; i++) { n = b * n + digits[i]; } return n; }

function convertBaseFour(randomnumber) { return zipDigits(shiftBase(randomnumber, 4), 10); }

function batteryHandler(event, ui) { var draggable = ui.draggable; if (draggable.attr('id') === "BATTERY") { $("#batterydrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/4/46/T--Newcastle--HPS-electricbattery.png')"); 

               $("#batterydrop").data("contents", "BATTERY");

} else if (draggable.attr('id') === "FUEL_CELL") { $("#batterydrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/a/ae/T--Newcastle--HPS-fuelcell_empty.jpg')"); 

               $("#batterydrop").data("contents", "FUEL_CELL");

} else { alert("Sorry, that doesn't go there."); } }

function bulbHandler(event, ui) { var draggable = ui.draggable; if (draggable.attr('id') === "LIGHTBULB") { $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/9/9e/T--Newcastle--HPS-electricbulb_off.png')"); 

              $("#bulbdrop").data("contents", "LIGHTBULB");

} else if (draggable.attr('id') === "BIOBULB") { $("#bulbdrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/0/0b/T--Newcastle--HPS-bacteriabulb_off.png')"); 

               $("#bulbdrop").data("contents", "BIOBULB");

} else { alert("Sorry, that doesn't go there."); } 

       if (($("#bulbdrop").data("contents") === "LIGHTBULB" || $("#bulbdrop").data("contents") === "BIOBULB")
            && ($("#batterydrop").data("contents") === "BATTERY" || $("#batterydrop").data("contents") === "FUEL_CELL"))

{ 

console.log("Enable");
$("#voltageSpinner").prop('disabled', false);

} } /** This makes the Spinner become enabled. This method ensures that the Battery + Bulb or Bacteria + Fuel Cell are in place correctly, at which point it is correct to enable the voltage to be input. **/ var batteryConfirm; var bulbConfirm; var bacteriaConfirm; var fuelcellConfirm; var batterybulbCombo = false; var bacteriafuelcellCombo;

function SpinnerActivation(confirm) { if (confirm === "Battery Confirmation") { batteryConfirm = true; } else if (confirm === "Bulb Confirmation") { bulbConfirm = true; } else if (confirm === "Fuel Cell Confirmation") { fuelcellConfirm = true; } else if (confirm === "Bacteria Confirmation") { bacteriaConfirm = true; } if (batteryConfirm && bulbConfirm) { var spinner = $("#voltageSpinner").spinner(); spinner.spinner("enable"); batterybulbCombo = true; bacteriafuelcellCombo = false; } if (fuelcellConfirm && bacteriaConfirm) { var spinner = $("#voltageSpinner").spinner(); spinner.spinner("enable"); bacteriafuelcellCombo = true; batterybulbCombo = false; } }

function wireHandler(event, ui) { var draggable = ui.draggable; if (draggable.attr('id') === "WIRE") { $("#wiredrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/4/45/T--Newcastle--HPS-wireX.png')"); } else if (draggable.attr('id') === "NEURON_WIRE") { $("#wiredrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/6/65/T--Newcastle--HPS-neuron_wire.png')"); } }

function turbineHandler(event, ui) { var draggable = ui.draggable; if (draggable.attr('id') === "CELL") { $("#turbinedrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/a/ae/T--Newcastle--HPS-fuelcell_empty.jpg')"); } else if (draggable.attr('id') === "INSECT_CELL") { $("#turbinedrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/4/4b/T--Newcastle--HPS-fuelcell_insects.jpg')"); } else if (draggable.attr('id') === "CAT_CELL") { $("#turbinedrop").css("background-image", "url('https://static.igem.org/mediawiki/2016/f/f9/T--Newcastle--HPS-fuelcell_cat.jpg')"); } }

function applicationsHandler(event, ui) { var draggable = ui.draggable; if (draggable.attr('id') === "KIDNEY") { $("#applicationsdrop").css("background-image", "url('kidney.png')"); } else if (draggable.attr('id') === "GAME") { $("#applicationsdrop").css("background-image", "url('game.png')"); } }

function hideAppear() { var a = document.getElementById("levelOneAppear"); $(a).css("display", "none"); var a = document.getElementById("levelTwoAppear"); $(a).css("display", "none"); var a = document.getElementById("levelThreeAppear"); $(a).css("display", "none"); var a = document.getElementById("levelFourAppear"); $(a).css("display", "none"); var a = document.getElementById("levelFiveAppear"); $(a).css("display", "none"); } /* Gets the relative text boxes to appear when each level of the simulator is clicked*/ function levelOneAppear() { $(".componentbox").show(); 

       $('#onebutton').show();

var spinner = $("#voltageSpinner").spinner(); spinner.spinner("disable"); $(".circuit img").show(); $(".circuit img").attr("src", "T--Newcastle--HPS-level1.png"); $('#batterydrop').removeAttr('id'); $('#bulbdrop').removeAttr('id'); $('#wiredrop').removeAttr('id'); $('#turbinedrop').removeAttr('id'); $('#applicationsdrop').removeAttr('id'); $('#babbleddrop').removeAttr('id');

$('.circuit').prepend("
"); $('.circuit').prepend("
");

$('.link').empty();

$("
  • <img src='https://static.igem.org/mediawiki/2016/4/46/T--Newcastle--HPS-electricbattery.png' style='height: 135px; width: 180px;' alt='battery'>
    • ").appendTo('.link'); $("
  • <img src='https://static.igem.org/mediawiki/2016/a/ae/T--Newcastle--HPS-fuelcell_empty.jpg' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link'); $("
  • <img src='https://static.igem.org/mediawiki/2016/9/9e/T--Newcastle--HPS-electricbulb_off.png' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link'); $("
  • <img src='https://static.igem.org/mediawiki/2016/0/0b/T--Newcastle--HPS-bacteriabulb_off.png' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link');

    init(); gbl_txtix = states.LEVEL_ONE; nxt();

    var $newdiv2 = $("
    ");

    $("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

    var $newdiv1 = $("
    Hello! Welcome to the Culture Shock interactive experience, we've created 4 different levels which explore the ethical issues surrounding the integration of biology and electronics. When you're ready, use the Next button at the top to navigate through the first level which involves building a simple circuit featuring a bulb and a fuel cell - based on a real circuit we've built in the lab!
    ");

    $("body").append($newdiv1); var $button = $("<input type='button' id='button1' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level1popup').remove(); $('#page-cover').remove(); }); }); }

    function levelTwoAppear() { $('#onebutton').show(); $(".componentbox").show(); $(".circuit img").show(); $(".circuit img").attr("src", "T--Newcastle--HPS-level2.png"); $('#batterydrop').removeAttr('id'); $('#bulbdrop').removeAttr('id'); $('#wiredrop').removeAttr('id'); $('#turbinedrop').removeAttr('id'); $('#applicationsdrop').removeAttr('id'); $('#babbleddrop').removeAttr('id');

    $('.circuit').prepend("
    ");

    $('.link').empty();

    $("
  • <img src='https://static.igem.org/mediawiki/2016/4/45/T--Newcastle--HPS-wireX.png' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link'); $("
  • <img src='https://static.igem.org/mediawiki/2016/6/65/T--Newcastle--HPS-neuron_wire.png' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link');

    init(); gbl_txtix = states.LEVEL_TWO; nxt();

    var $newdiv2 = $("
    ");

    $("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

    var $newdiv1 = $("
    One key advantage of biological circuitry is the potential to self-heal, negating the need for additional supplies or repair specialists. This would be particularly useful in places where these assets are in short supply, such as on the upcoming manned mission to Mars - this is the scenario covered by exercise 2.
    ");

    $("body").append($newdiv1); var $button = $("<input type='button' id='button2' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level2popup').remove(); $('#page-cover').remove(); }); }); }

    function levelThreeAppear() { $('#onebutton').show(); $(".circuit img").show(); $(".circuit img").attr("src", "T--Newcastle--HPS-level3.png"); $('#batterydrop').removeAttr('id'); $('#bulbdrop').removeAttr('id'); $('#wiredrop').removeAttr('id'); $('#turbinedrop').removeAttr('id'); $('#applicationsdrop').removeAttr('id'); $('#babbleddrop').removeAttr('id');

    $('.circuit').prepend("
    ");

    $('.link').empty();

    $("
  • <img src='https://static.igem.org/mediawiki/2016/a/ae/T--Newcastle--HPS-fuelcell_empty.jpg' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link'); $("
  • <img src='https://static.igem.org/mediawiki/2016/4/4b/T--Newcastle--HPS-fuelcell_insects.jpg' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link'); $("
  • <img src='https://static.igem.org/mediawiki/2016/f/f9/T--Newcastle--HPS-fuelcell_cat.jpg' style='height: 90px; width: 90px;' alt='battery'>
    • ").appendTo('.link');

    init(); gbl_txtix = states.LEVEL_THREE; nxt();

    var $newdiv2 = $("
    ");

    $("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

    var $newdiv1 = $("
    Level 3 concerns renewable fuel sources and features a turbine which requires a fuel source to activate it and get it to a speed from which it can generate electricity. While certain fuel sources are more effective than others, they bring with them their own sets of associated ethical issues.
    ");

    $("body").append($newdiv1); var $button = $("<input type='button' id='button3' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level3popup').remove(); $('#page-cover').remove(); }); }); }

    function levelFourAppear() { $('#onebutton').show(); $(".componentbox").show(); $(".circuit img").show(); $(".circuit img").attr("src", "T--Newcastle--HPS-level4.png"); $('#batterydrop').removeAttr('id'); $('#bulbdrop').removeAttr('id'); $('#wiredrop').removeAttr('id'); $('#turbinedrop').removeAttr('id'); $('#applicationsdrop').removeAttr('id'); $('#babbleddrop').removeAttr('id');

    $('.circuit').prepend("
    ");

    $('.link').empty();

    $("
  • <img src='kidney.png' style='height: 90px; width: 90px;' alt='kidney'>
    • ").appendTo('.link');

    init(); gbl_txtix = states.LEVEL_FOUR; nxt();

    var $newdiv2 = $("
    ");

    $("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

    var $newdiv1 = $("
    ");

    $("body").append($newdiv1); var $button = $("<input type='button' id='button4' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level4popup').remove(); $('#page-cover').remove(); }); }); }

    function levelFiveAppear() { $('#onebutton').show(); $("#unopened").show(); $(".circuit img").hide(); $("#unopened").show(); $(".componentbox").hide();

    $('#batterydrop').removeAttr('id'); $('#bulbdrop').removeAttr('id'); $('#wiredrop').removeAttr('id'); $('#turbinedrop').removeAttr('id'); $('#applicationsdrop').removeAttr('id'); $('#babbleddrop').removeAttr('id'); $('.link').empty(); init(); gbl_txtix = states.LEVEL_FIVE; nxt();

    var $newdiv2 = $("
    ");

    $("body").append($newdiv2); $("#page-cover").css("opacity", 0.6).fadeIn(300, function () {

    var $newdiv1 = $("
    This level is a little different to the last 3. Working with the iGEM team at Edinburgh University, we've developed a level featuring their Babbled DNA data storage system. Level 4 shows how the sytem works and uses encryption to avoid the hacking of sensitive data, which is an important issue facing this emerging technology.
    ");

    $("body").append($newdiv1); var $button = $("<input type='button' id='button5' value='Close'>"); $($newdiv1).append($button); $($button).click(function () { $('#level5popup').remove(); $('#page-cover').remove(); }); }); 

           $("#unopened").show();

    }