Team:Calgary/TestPage

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
{{Team:Calgary/Main}}
{{Team:Calgary/Main}}
<html>
<html>
-
<head>
+
<script>
-
<link href="https://2013.igem.org/Team:Calgary/StyleSheets/HomePage?action=raw&ctype=text/css" rel="stylesheet">
+
$(document).ready(function() {
-
<script>
+
$('#TopBar').css('display', 'none');
-
$(document).ready(function() {
+
$('#Page').css('position', 'relative');
-
//Display slider for Javascript users
+
$('#Page').css('top', '-70px');
-
$('#Slider').css('display', 'block');
+
});
-
+
</script>
-
//Set height of slider (16/5 ratio)
+
<section id="Content">
-
$('#Slider').css('height', ($('body').width() / 3.2));
+
-
+
-
//Position right/left arrows
+
-
var BarHeight = $('#Slider').height() -  $('#BottomLinks').height();
+
-
$('#LeftBar, #RightBar').css('height', BarHeight);
+
-
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
+
-
//Repeats for window resize
+
<h1>Quantitative App</h1>
-
$(window).resize(function() {
+
-
$('#Slider').css('height', ($('body').width() / 3.2));
+
-
+
-
var BarHeight = $('#Slider').height() -  $('#BottomLinks').height();
+
-
$('#LeftBar, #RightBar').css('height', BarHeight);
+
-
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
+
-
});
+
-
+
-
var TotalSlides = $('.Slides').length;
+
-
var CurrentSlide = 0;
+
-
$('#RightArrow').click(function() {
+
<h2>DNA binding to TALEs<h2>
-
CurrentSlide = ++CurrentSlide % TotalSlides;
+
 
-
changeSlide(CurrentSlide);
+
<p>The positive DNA&#39;s are colored red, negative DNA is green, TALEs are black and after binding (i.e. saturation) they turn blue. The sliders under &quot;global settings&quot;€ are parameters needed before the simulation runs. Given that a simulation can take 30 seconds to complete, they should not be changed frequently as it will take longer to show the results. The sliders under &quot;€œdisplay settings&quot;€ are parameters needed after the simulation runs. Their responses are much faster and are best played by clicking on the plus sign to the right and hit &quot;€œPlay&quot;. If you only see a grey box, you may need to install the Mathematica CDF Player. The download link can be found <a href="http://www.wolfram.com/cdf-player/">here</a>. Otherwise, the data from our model, as well as images of the app we designed, can be found on the <a href="https://2013.igem.org/Team:Calgary/Project/OurSensor/Modelling/QuantitativeModelling">quantitative modelling page</a>.
-
});
+
</p>
-
+
 
-
$('#LeftArrow').click(function() {
+
<img align="right" style="width:35%;" src="https://static.igem.org/mediawiki/2013/6/6b/UCalgary2013SWAgenModelInstruction.jpg" style="float: left; clear: both;"></img>
-
CurrentSlide = (CurrentSlide + TotalSlides - 1) % TotalSlides;
+
 
-
changeSlide(CurrentSlide);
+
<script type="text/javascript" src="http://www.wolfram.com/cdf-player/plugin/v2.1/cdfplugin.js"></script>
-
});
+
<script type="text/javascript">
-
+
var cdf = new cdfplugin();
-
$('.SlideLink').click(function() {
+
cdf.embed('http://igem.ucalgary.ca/misc/Deployed.cdf', 430, 800);
-
var ClickedSlide = $(this).attr('id');
+
</script>
-
CurrentSlide = parseInt(ClickedSlide.replace('Link', ''));
+
 
-
changeSlide(CurrentSlide);
+
<h2>Enzyme kinetics of horseradish peroxidase</h2>
-
});
+
 
-
+
<script type="text/javascript" src="http://www.wolfram.com/cdf-player/plugin/v2.1/cdfplugin.js"></script>
-
function changeSlide(num){
+
<script type="text/javascript">
-
var SlideID = '#Slide' + num;
+
var cdf = new cdfplugin();
-
$('.Slides').css('display', 'none');
+
cdf.embed('http://igem.ucalgary.ca/misc/HorseradishPeroxidase.cdf', 350, 360);
-
$(SlideID).css('display', 'block');
+
</script>
-
}
+
 
-
+
<h2>Enzyme kinetics of beta-galactosidase</h2>
-
setInterval(function(){ 
+
 
-
CurrentSlide = ++CurrentSlide % TotalSlides;
+
<script type="text/javascript" src="http://www.wolfram.com/cdf-player/plugin/v2.1/cdfplugin.js"></script>
-
changeSlide(CurrentSlide);
+
<script type="text/javascript">
-
},2000);
+
var cdf = new cdfplugin();
-
});
+
cdf.embed('http://igem.ucalgary.ca/misc/Beta-Galactosidase.cdf', 350, 330);
-
</script>
+
</script>
-
</head>
+
 
-
+
<h2>Frequently Asked Questions
-
<body>
+
</h2>
-
<section id="HomePageContent">
+
 
-
<div id="Slider">
+
<h3>1. Can I see your code?
-
<div id="Slide0" class="Slides current"></div>
+
</h3>
-
<div id="Slide1" class="Slides"></div>
+
<p>Sure! Here are <a href="https://static.igem.org/mediawiki/2013/3/3a/UCalgary2013SWTheCode.txt" target="_blank">DNA binding to TALEs agent based model</a>,
-
<div id="Slide2" class="Slides"></div>
+
<a href="https://static.igem.org/mediawiki/2013/b/b5/UCalgary2013SWHorseradishPeroxidaseCode.txt" target="_blank">horseradish peroxidase kinetic model</a>, and
-
<div id="Slide3" class="Slides"></div>
+
<a href="https://static.igem.org/mediawiki/2013/0/08/UCalgary2013SWBeta-GalactosidaseCode.txt " target="_blank">beta-galactosidase kinetic model</a>.
-
<div id="Slide4" class="Slides"></div>
+
</p>
-
<div id="Slide5" class="Slides"></div>
+
 
-
<div id="LeftBar" class="SideBar"><div id="LeftArrow"></div></div>
+
<h3>2. I see a block of text with red background. What should I do?
-
<div id="RightBar" class="SideBar"><div id="RightArrow"></div></div>
+
</h3>
-
<ul id="BottomLinks">
+
<p>Don&#39;t worry, everything is under control. For the DNA binding to TALEs agent based model, wait for at least 30 seconds. If the problem persists, reset the current time to 1. For the kinetic models, use the plus/minus sign to change the parameters, or simply hit auto-run on the upper-right corner.
-
<li id="Link0" class="SlideLink">Intro</li><li id="Link1" class="SlideLink">Problem</li><li id="Link2" class="SlideLink">Situation</li><li id="Link3" class="SlideLink">Idea</li><li id="Link4" class="SlideLink">Solution</li><li id="Link5" class="SlideLink">Platform</li>
+
</p>
-
</ul>
+
 
-
</div>
+
</section>
-
+
-
<section id="Overview">
+
-
<h2>Our Project</h2>
+
-
<p>
+
-
Outbreaks of foodborne illnesses are a growing problem in our lives. In 2011, the Centers for Disease Control and Prevention (CDC) in the United States, identified 767 outbreaks affecting nearly 14,000 people of foodborne illnesses. Of these, pathogenic <i>E. coli</i> was a recurring theme in many of these outbreaks. In Alberta, we recently experienced our own foodborne disease outbreak in late 2012. This outbreak was the result of pathogenic <i>E. coli</i> serotype O157 and led to significant food recall alongside many hospitalizations, deaths, massive economic losses and an overall loss of consumer confidence in food safety. Current detection methods require long incubation times to amplify <i>E. coli</i> in the sample and followed by amplification to verify the presence of known genes that are associated with pathogenic <i>E. coli</i>.
+
-
</p>
+
-
<p>
+
-
One of the contributing factors connected with the outbreak in Alberta was the lack of rapid on-site detection systems available. Thus, the University of Calgary 2013 iGEM Collegiate team is using synthetic biology to develop system to rapidly detect the presence of pathogenic <i>E. coli</i> in the beef industry. By using engineered biological nanoparticles and DNA binding proteins we can specifically detect pathogenic DNA sequences. Our biosensor functions at the genomic level to detect the presence or absence of pathogenic <i>E. coli</i> in a given sample. This system allows us to pinpoint contamination during meat processing and also provides the ability to prescreen cattle in a preventative way to limit potential sources of contamination from the processing chain. Our system provides a powerful new tool for food safety, but also shows promise as a platform for the rapid detection of target organisms that are identified as key targets in a myriad of sectors from health to environment to biosecurity.
+
-
</p>
+
-
</section>
+
-
+
-
<section id="SectionLinks">
+
-
<div class="Wrap">
+
-
<a href="https://2013.igem.org/Team:Calgary/Project/OurSensor">
+
-
<div id="DescriptionLink1" class="DescriptionLink">
+
-
<h2>Our Sensor</h2>
+
-
<img src="https://static.igem.org/mediawiki/2013/4/44/Calgary2013_Our_Sensor.png">
+
-
<p>Check out what we did in the lab this year in response to <i>E. coli</i> contamination in the beef industry. Learn about the design of our detector, linker, reporter as well as the development of a prototype and mathematical model.</p>
+
-
</div>
+
-
</a>
+
-
+
-
<a href="https://2013.igem.org/Team:Calgary/Project/DataPage">
+
-
<div id="DescriptionLink2" class="DescriptionLink">
+
-
<h2>Data Page</h2>
+
-
<img src="https://static.igem.org/mediawiki/2013/b/bf/Calgary2013_Data_Page.png">
+
-
<p>Want to see a summary of what we accomplished this season? Click here to check out our data page where we outline all of the work that we’ve done to date!</p>
+
-
</div>
+
-
</a>
+
-
<div style="clear:both;"></div>
+
-
<a href="https://2013.igem.org/Team:Calgary/Project/HumanPractices">
+
-
<div id="DescriptionLink3" class="DescriptionLink">
+
-
<h2>Human Practices</h2>
+
-
<img src="https://static.igem.org/mediawiki/2013/5/54/Calgary2013_Human_Practices.png">
+
-
<p>Check out how Human Practices helped to guide the development of our sensor. Learn how we spent time talking to various experts in the beef industry in order to design our project with our end-user in mind.</p>
+
-
</div>
+
-
</a>
+
-
+
-
<a href="https://2013.igem.org/Team:Calgary/Project/Collaboration">
+
-
<div id="DescriptionLink4" class="DescriptionLink">
+
-
<h2>Collaboration</h2>
+
-
<img src="https://static.igem.org/mediawiki/2013/3/36/Calgary2013_CollaborationButton.png">
+
-
<p>We worked hard with the Paris Bettencourt team this season to develop useful tools for the rest of the iGEM community. Click here to find out what our collaboration can add to iGEM. </p>
+
-
</div>
+
-
</a>
+
-
</div>
+
-
</section>
+
-
</section>
+
-
</body>
+
</html>
</html>

Revision as of 03:18, 28 September 2013

Quantitative App

DNA binding to TALEs

The positive DNA's are colored red, negative DNA is green, TALEs are black and after binding (i.e. saturation) they turn blue. The sliders under "global settings"€ are parameters needed before the simulation runs. Given that a simulation can take 30 seconds to complete, they should not be changed frequently as it will take longer to show the results. The sliders under "€œdisplay settings"€ are parameters needed after the simulation runs. Their responses are much faster and are best played by clicking on the plus sign to the right and hit "€œPlay". If you only see a grey box, you may need to install the Mathematica CDF Player. The download link can be found here. Otherwise, the data from our model, as well as images of the app we designed, can be found on the quantitative modelling page.

Enzyme kinetics of horseradish peroxidase

Enzyme kinetics of beta-galactosidase

Frequently Asked Questions

1. Can I see your code?

Sure! Here are DNA binding to TALEs agent based model, horseradish peroxidase kinetic model, and beta-galactosidase kinetic model.

2. I see a block of text with red background. What should I do?

Don't worry, everything is under control. For the DNA binding to TALEs agent based model, wait for at least 30 seconds. If the problem persists, reset the current time to 1. For the kinetic models, use the plus/minus sign to change the parameters, or simply hit auto-run on the upper-right corner.

Retrieved from "http://2013.igem.org/Team:Calgary/TestPage"