Difference between revisions of "Team:UMaryland/Measurement"

Line 11: Line 11:
 
     <script src="https://static.igem.org/mediawiki/2016/c/ce/T--UMaryland--parallax.txt"></script>
 
     <script src="https://static.igem.org/mediawiki/2016/c/ce/T--UMaryland--parallax.txt"></script>
 
     <script src="https://static.igem.org/mediawiki/2016/d/d3/T--UMaryland--slick.txt" type="text/javascript"></script>
 
     <script src="https://static.igem.org/mediawiki/2016/d/d3/T--UMaryland--slick.txt" type="text/javascript"></script>
     <title>Measurement</title>
+
     <title>Human Practices</title>
 
</head>
 
</head>
  
Line 245: Line 245:
 
             left: 0;
 
             left: 0;
 
             right: 0;
 
             right: 0;
             margin-top: 100px;
+
             margin-top: 200px;
 
             z-index: 3;
 
             z-index: 3;
 
         }
 
         }
Line 340: Line 340:
 
             right: 15px;
 
             right: 15px;
 
             z-index: 2;
 
             z-index: 2;
             margin-top: -83px;
+
             margin-top: -12px;
 
         }
 
         }
  
Line 360: Line 360:
 
margin-left: 25px;
 
margin-left: 25px;
 
}
 
}
+
 +
#div-figures{
 +
padding-bottom: 100px;
 +
font-size: 14pt;
 +
}
 +
 
.titleText {
 
.titleText {
margin-left: auto;
+
position: absolute;
margin-right: auto;
+
top: 350px;
 +
left: 50%;
 +
margin-left: -40%;
 +
right: auto;
 
width: 80%;
 
width: 80%;
 
min-width: 1000px;
 
min-width: 1000px;
 
max-width: 1500px;
 
max-width: 1500px;
 
}
 
}
#div-figures{
+
padding-bottom: 100px;
+
h11, h21, h31 {
font-size: 14pt;
+
font-family: Lora;
 +
display: inline-block;
 +
position: relative;
 +
padding-bottom: 10px;
 +
padding-left: 10px;
 +
padding-top: 10px;
 +
padding-right: 10px;
 +
background: rgba(0,0,0, 0.7);
 +
line-height: 1em;
 
}
 
}
         h11 {
+
 +
         h11 {
 
             color: white;
 
             color: white;
 
             font-size: 30pt;
 
             font-size: 30pt;
 
             font-weight: 400;
 
             font-weight: 400;
 
             text-align: left;
 
             text-align: left;
            display: block;
 
margin-top: 60px;
 
padding-top: 180px;
 
            margin-bottom: 0.83em;
 
 
         }
 
         }
  
Line 388: Line 401:
 
             font-weight: 300;
 
             font-weight: 300;
 
             text-align: left;
 
             text-align: left;
            display: block;
 
            margin-top: 0.83em;
 
            margin-bottom:: 0.83em;
 
 
         }
 
         }
  
 
         h31 {
 
         h31 {
 
             color: white;
 
             color: white;
             font-size: 18pt;
+
             font-size: 20pt;
 
             font-weight: 200;
 
             font-weight: 200;
 
             text-align: left;
 
             text-align: left;
            display: block;
 
            margin-top: 0.83em;
 
            margin-bottom:: 0.83em;
 
 
         }
 
         }
  
 
         #div-text {
 
         #div-text {
 
padding-top: 50px;
 
padding-top: 50px;
background-color: #f9f9f9;
+
padding-bottom: 150px;
 
         }
 
         }
  
         #div-pic {
+
         .div-scrollPic {
 
             z-index: -999;
 
             z-index: -999;
 
             height: 500px;
 
             height: 500px;
Line 414: Line 421:
 
         }
 
         }
  
 +
.scrollContainer {
 +
 +
position: relative;
 +
width: 100%;
 +
}
 +
 
         .imageEmbed {
 
         .imageEmbed {
 
             /* creates border around image on each page */
 
             /* creates border around image on each page */
Line 425: Line 438:
 
         #div-text p, .longText li {
 
         #div-text p, .longText li {
 
             /* formats text and lists within .longText */
 
             /* formats text and lists within .longText */
 +
padding-top: 15px;
 +
padding-bottom: 15px;
 
             font-size: 14pt;
 
             font-size: 14pt;
 
             line-height: 2;
 
             line-height: 2;
Line 496: Line 511:
 
             margin-top: 50px;
 
             margin-top: 50px;
 
         }
 
         }
 +
 +
#div-slideshow {
 +
margin-top: 40px;
 +
margin-bottom: 40px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
width: 800px;
 +
}
 +
 +
#div-slideshow img {
 +
width: 750px;
 +
margin-top: 15px;
 +
margin-bottom: 15px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
border: 2px solid #A8A8A8;
 +
}
 +
 +
#div-dots {
 +
            height: 100px;
 +
        }
 +
 +
#div-dots {
 +
            height: 100px;
 +
        }
 +
 
         </style>
 
         </style>
 
<nav>
 
<nav>
<img src="https://static.igem.org/mediawiki/2016/2/26/T--UMaryland--newlogo.jpeg" id="img-logo" width="128px">
+
<a href="https://2016.igem.org/Team:UMaryland"><img src="https://static.igem.org/mediawiki/2016/2/26/T--UMaryland--newlogo.jpeg" id="img-logo" width="128px"></a>
 
<ul>
 
<ul>
 
<a style="opacity: 0">Fix</a>
 
<a style="opacity: 0">Fix</a>
Line 522: Line 563:
 
</ul>
 
</ul>
 
</div>
 
</div>
<div data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2016/5/5a/T--UMaryland--il.jpg" id="div-pic">
+
<div class="scrollContainer">
<div class="titleText">  
+
<div data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2016/5/5a/T--UMaryland--il.jpg" class="div-scrollPic" style="height: 650px;">
<!-- where background image below titles show -->
+
<div class="titleText">  
<h11>Interlab Study</h11>
+
<style>
<h21>Fluorescence Data From 3 Different Constructs with GFP</h21>
+
</style>
<h31>Standardizing fluorescence measurements and promoting further joint scientific efforts of the iGEM community. </h31>
+
<!-- where background image below titles show -->
</div>
+
<h11>Interlab Study</h11></br>
        </div>
+
<h21>Fluorescence Data From 3 Different Constructs with GFP</h21></br>
<div id="div-text"> <!-- Start of main text of page -->
+
<h31>Standardizing fluorescence measurements and promoting further joint scientific efforts of the iGEM community. </h31></br>
 +
</div>
 +
</div>
 +
</div>
 
<!-- Heading text -->
 
<!-- Heading text -->
 
 
Line 572: Line 616:
 
</ul>
 
</ul>
 
</div>
 
</div>
<div id="div-figures">
+
<div id="div-slideshow">
 
<div>
 
<div>
 
<img class="figure" src="https://static.igem.org/mediawiki/2016/a/ae/T--UMaryland--absorbance.JPG">
 
<img class="figure" src="https://static.igem.org/mediawiki/2016/a/ae/T--UMaryland--absorbance.JPG">
Line 607: Line 651:
 
 
 
<script>
 
<script>
 +
 +
        $('#div-slideshow').slick({
 +
dots: true
 +
        });
 +
 
$(window).resize(function() {
 
$(window).resize(function() {
var marginTotal = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTotal = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginLeft = marginTotal / 2;
 
var marginLeft = marginTotal / 2;
 
if (marginLeft > 14) {
 
if (marginLeft > 14) {
Line 616: Line 665:
 
}
 
}
 
 
var marginTitle = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTitle = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginCheck = marginTitle / 2;
 
var marginCheck = marginTitle / 2;
 
if (marginCheck < 15) {
 
if (marginCheck < 15) {
$('.titleText').css('margin-left','15px');
+
$('.titleText').css('left','15px');
 +
$('.titleText').css('margin-left','0px');
 
} else {
 
} else {
$('.titleText').css('margin-left','auto');
+
$('.titleText').css('left','50%');
 +
$('.titleText').css('margin-left','-40%');
 
}
 
}
 
})
 
})
 
 
 
$(window).load(function() {
 
$(window).load(function() {
var marginTotal = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTotal = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginLeft = marginTotal / 2;
 
var marginLeft = marginTotal / 2;
 
if (marginLeft > 14) {
 
if (marginLeft > 14) {
Line 634: Line 685:
 
}
 
}
 
 
var marginTitle = $('.titleText').outerWidth(true) - $('.titleText').outerWidth(false);
+
var marginTitle = $(window).outerWidth(true) - $('.titleText').outerWidth(false);
 
var marginCheck = marginTitle / 2;
 
var marginCheck = marginTitle / 2;
 
if (marginCheck < 15) {
 
if (marginCheck < 15) {
$('.titleText').css('margin-left','15px');
+
$('.titleText').css('left','15px');
 +
$('.titleText').css('margin-left','0px');
 
} else {
 
} else {
$('.titleText').css('margin-left','auto');
+
$('.titleText').css('left','50%');
 +
$('.titleText').css('margin-left','-40%');
 
}
 
}
 
})
 
})
Line 646: Line 699:
 
       <script>
 
       <script>
 
/* Hiding stupid stuff*/
 
/* Hiding stupid stuff*/
                $('#top_title').css('display', 'none');
+
        $('#top_title').css('display', 'none');
$('#top_menu').css('display', 'none');
+
$('#top_menu').css('display', 'none');
//$('#top_menu_14').css('display', 'none');
+
        $('#HQ_page').css('display', 'none');
                $('#HQ_page').css('display', 'none');
+
$('#top_menu_under').css('display', 'none');
$('#top_menu_under').css('display', 'none');
+
$('#content').removeClass('mw-body')
$('#content').removeClass('mw-body');
+
    .attr('role','dummy2')
$('#content').attr('role','dummy2')
+
    .attr('id','dummy');
$('#content').attr('id','dummy')
+
 
$('#HQ_page').attr("id","iGEM"); //voids all dumb CSS iGEM HQ wrote which overrides our code
 
$('#HQ_page').attr("id","iGEM"); //voids all dumb CSS iGEM HQ wrote which overrides our code
 
$('#mw-content-text').attr("id","overruled").removeClass('mw-content-ltr');
 
$('#mw-content-text').attr("id","overruled").removeClass('mw-content-ltr');
Line 661: Line 713:
 
$('nav').mouseover(
 
$('nav').mouseover(
 
function () {
 
function () {
$('#img-logo').css('transition', '.35s ease-in');
+
$('#img-logo').css('transition', '.35s ease-in')
$('#img-logo').css('opacity', '1');
+
    .css('opacity', '1');
 
$('nav ul').addClass("hover");
 
$('nav ul').addClass("hover");
 
}
 
}
Line 669: Line 721:
 
function () {
 
function () {
 
var scroll = $(window).scrollTop();
 
var scroll = $(window).scrollTop();
if (scroll > 0) {if ( $(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false) {
+
if (scroll > 0) {if ( $(window).width() >= 1090) { var pushed = $('body').hasClass('pushed'); if (pushed == false) {
$('#img-logo').css('transition', '.25s ease');
+
$('#img-logo').css('opacity', '0');
+
 
$('nav ul').removeClass("hover");
 
$('nav ul').removeClass("hover");
 
$('nav').css('transition', '.5s ease');
 
$('nav').css('transition', '.5s ease');
 +
    $('#img-logo').css('transition', '.25s ease')
 +
        .css('opacity', '0');
 
}}}
 
}}}
  
Line 681: Line 733:
 
$(document).ready(function() {     
 
$(document).ready(function() {     
 
function checkWidth() {
 
function checkWidth() {
if ($(window).width() < 980 || $('nav').hasClass('pushed')){
+
if ($(window).width() < 1090 || $('nav').hasClass('pushed')){
 
$('nav li').css('display', 'none');
 
$('nav li').css('display', 'none');
 
$('#img-more').css('display','block');
 
$('#img-more').css('display','block');
 
$('nav ul').addClass("hover");
 
$('nav ul').addClass("hover");
$('#img-logo').css('transition', '.35s ease-in');
+
$('#img-logo').css('transition', '.35s ease-in')
$('#img-logo').css('opacity', '1');
+
    .css('opacity', '1');
 
} else {
 
} else {
 
$('nav li').css('display', 'inline');
 
$('nav li').css('display', 'inline');
Line 692: Line 744:
 
$('nav ul').removeClass("hover");
 
$('nav ul').removeClass("hover");
 
if ($(window).scrollTop() > 0) {
 
if ($(window).scrollTop() > 0) {
$('#img-logo').css('transition', '.25s ease');
+
$('#img-logo').css('transition', '.25s ease')
$('#img-logo').css('opacity', '0');
+
    .css('opacity', '0');
 
$('nav ul').addClass("scrolled");
 
$('nav ul').addClass("scrolled");
 
}
 
}
Line 710: Line 762:
 
$('nav img').toggleClass('pushed');
 
$('nav img').toggleClass('pushed');
 
$('body').toggleClass('pushed');
 
$('body').toggleClass('pushed');
if ($(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false){
+
if ($(window).width() >= 1090) { var pushed = $('body').hasClass('pushed'); if (pushed == false){
 
$('nav li').css('display', 'inline');
 
$('nav li').css('display', 'inline');
 
$('#img-more').css('display','none');
 
$('#img-more').css('display','none');
 
$('nav ul').removeClass("hover");
 
$('nav ul').removeClass("hover");
$('#img-logo').css('transition', '.25s ease');
 
$('#img-logo').css('opacity', '0');
 
 
}}
 
}}
 
});
 
});
Line 722: Line 772:
 
$(window).scroll(function() {
 
$(window).scroll(function() {
 
var scroll = $(window).scrollTop();
 
var scroll = $(window).scrollTop();
if (scroll > 0) { if ( $(window).width() >= 980) {
+
if (scroll > 0) { if ( $(window).width() >= 1090) {
 
nav.addClass("scrolled");
 
nav.addClass("scrolled");
 
nav.removeClass("hover");
 
nav.removeClass("hover");
$('#img-logo').css('transition', '.25s ease');
+
$('#img-logo').css('transition', '.25s ease')
$('#img-logo').css('opacity', '0');
+
    .css('opacity', '0');
 
}} else {
 
}} else {
 
nav.removeClass("scrolled");
 
nav.removeClass("scrolled");
$('#img-logo').css('transition', '.35s ease-in');
+
$('#img-logo').css('transition', '.35s ease-in')
$('#img-logo').css('opacity', '1');
+
    .css('opacity', '1');
 
}
 
}
 
});
 
});
 
</script>
 
</script>
         <script> $('#iGEM').css('display','block'); </script>
+
         <script> $('#iGEM').css('display','block');
 +
 +
$('body').css('display', 'block');</script>
 
<script>
 
<script>
 
$(document).ready(function(){
 
$(document).ready(function(){
  $('#div-figures').slick({
+
   
  });
+
  $('body').css('display', 'block')
+
 
});
 
});
 
 
Line 751: Line 802:
 
});
 
});
 
 
var element_position = $('#div-protocol').offset().top;
 
 
var toggle = 1;
 
var toggle = 1;
  
 +
 +
 
</script>
 
</script>
 
</html>
 
</html>

Revision as of 01:30, 10 October 2016

</div> </div> Human Practices

Interlab Study
Fluorescence Data From 3 Different Constructs with GFP
Standardizing fluorescence measurements and promoting further joint scientific efforts of the iGEM community.

The interlab study measures the fluorescence of three different constructs with GFP as well as a positive and negative control. It attempts to standardize the fluorescence measurements by adjusting absorbance values when compared to blanks, reducing the amount of independent variables by controlling for concentration, and adjusting fluorescence values based on the standard curve of FITC. The goal of this study is to see how the observed fluorescence values compare across the iGEM community to see if the adjustments successfully standardize fluorescence measurements.

As a community of synthetic biologist, a key to the advancement of the field is collaboration among groups. For proper collaboration, we must be able to communicate our findings in ways that are concrete and well defined, making standards essential.

Tested Devices

Transform competent cells with Test Devices 1 - 3, positive control, and negative control provided and plate them overnight on chloramphenicol resistant plates.

  • Test Device 1: J23101.B0034.E0040.B0015 in pSB1C3
  • Test Device 2: J23106.B0034.E0040.B0015 in pSB1C3
  • Test Device 3: J23117.B0034.E0040.B0015 in pSB1C3
  • Positive Control Device: I20270 in pSB1C3
  • Negative Control Device: R0040 in pSB1C3

Protocol

  1. Pick two colonies from each plate to inoculate and grow overnight.
  2. Calibrate the plate reader- Measure absorbance of LUDOX and water to find a corrected absorbance that can then be used to find a conversion factor for a standard OD600 measurement.
  3. Use FITC to create a standard fluorescence curve - Measure fluorescence of FITC at different concentrations to generate a curve of fluorescence over concentration.
  4. Measure OD600 of the overnight cultures and create dilutions to put them at an OD600 of 0.02.
  5. Incubate at 37 C and take 100ul samples every hour (from hours 0-6).
  6. Measure OD600 of all the samples and record.

Results

  • Most samples grew exponentially, device 1 seemed to have little growth.
  • Negative control and device 3 did not show fluorescence. Positive control, device 1, and device 2 showed increases in fluorescence over time.
  • The results show that fluorescence per unit of concentration remains relatively constant over time.
Figure 1. Cell growth versus absorbance.
Figure 2. Cell growth versus flourescence.
Figure 3. Cell growth versus absorbance / flourescence.