Team:uOttawa

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
{{ Template:uo2014_common }}
{{ Template:uo2014_common }}
-
content
+
<style type="text/css">
 +
/* gplay background */
 +
html { background-image: url("https://static.igem.org/mediawiki/2014/9/98/Uo2014-gplay.png");
 +
</style>
 +
 
 +
<script>
 +
    $(function() {
 +
        var currentTileset = 0;
 +
        var duration = 500;
 +
 
 +
        $(".hover").parents(".ig-tile").hover(function() {
 +
            $(this).find(".hover").slideDown(300);
 +
        }, function() {
 +
            $(this).find(".hover").slideUp(300);
 +
        });
 +
 
 +
        $(".leftarrow").click(function(e) {
 +
            scrollTo(currentTileset - 1);
 +
        });
 +
        $(".rightarrow").click(function(e) {
 +
            scrollTo(currentTileset + 1);
 +
        });
 +
 
 +
        $(window).resize(function() {
 +
            scrollTo(currentTileset, true);
 +
        });
 +
 
 +
        function scrollTo(tileset, instant) {
 +
            if (!instant) instant = false;
 +
 
 +
            if (tileset < 0 || tileset > 3) return;
 +
 
 +
            // Scroll to the chosen tile
 +
            currentTileset = tileset;
 +
            var tileWidth = $(".ig-tileset-outer").width()
 +
                + 2 * parseInt($(".ig-tileset-outer").css("margin-left"));
 +
            var scrollTarget = -tileset * tileWidth;
 +
            var t = instant ? 0 : duration;
 +
            $(".ig-scroller").animate({ left: scrollTarget }, t);
 +
 
 +
            // Hide the arrows
 +
            if (tileset == 0)
 +
                $(".leftarrow").fadeOut(300);
 +
            else
 +
                $(".leftarrow").fadeIn(300);
 +
            if (tileset == 3)
 +
                $(".rightarrow").fadeOut(300);
 +
            else
 +
                $(".rightarrow").fadeIn(300);
 +
        }
 +
 
 +
        setTimeout(function(){
 +
            $(".ig-tile").each(function() {
 +
                if (Math.random() < 0.5)
 +
                    $(this).fadeIn(700);
 +
                else
 +
                    $(this).slideDown(700);
 +
            });
 +
        }, 400);
 +
    });
 +
    </script>
 +
 
 +
<header class="ig-main-header">
 +
        <div class="row">
 +
            <a href="#" class="title"><span class="igem">iGEM</span>uOttawa</a>
 +
            <nav>
 +
                <a href="project.html">project</a>
 +
                <a href="drylab.html">dry lab</a>
 +
                <a href="policy.html">policy</a>
 +
                <a href="team.html">team</a>
 +
            </nav>
 +
            <img src="r/uo2014-igemlogo.png" alt="" class="igem-logo no-k">
 +
        </div>
 +
    </header>
 +
 
 +
    <img src="r/uo2014-arrow-left.png" alt="" class="ig-arrow leftarrow no-k" hidden>
 +
    <img src="r/uo2014-arrow-right.png" alt="" class="ig-arrow rightarrow no-k">
 +
 
 +
    <div class="ig-scroll-wrapper">
 +
        <div class="ig-scroller">
 +
 
 +
            <!-- ====== WET LAB ====== -->
 +
            <div class="ig-tileset-outer"><div class="ig-tileset-inner">
 +
                <div class="ig-tile wl-1">
 +
                    <img src="r/uo2014-tile2.jpg" alt="">
 +
                    <div class="text">
 +
                        <h2>Take the tour!</h2>
 +
                        <p>How we built the tri-stable switch in <em>S. cerevisae</em>.</p>
 +
                        <p class="hover" hidden>Let us take you through our creative and scientific process of building one of the most interesting proposed genetic networks &mdash; one that may shed light on how stem cells specialize and allow us to create similar behaviour in a lab.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile wl-2">
 +
                    <img src="r/uo2014-tile1.jpg" alt="">
 +
                    <div class="text">
 +
                        <h2>The project</h2>
 +
                        <p>Modelling stem cell differentiation using a tri-stable switch.</p>
 +
                        <p class="hover" hidden>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile wl-3">
 +
                    <img src="r/uo2014-tile3.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Results</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile wl-4">
 +
                    <img src="r/uo2014-tile4.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Methods</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile wl-5">
 +
                    <img src="r/uo2014-tile16.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Measurement</h3>
 +
                        <p>Interlab study</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile wl-6">
 +
                    <img src="r/uo2014-tile15.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Biobricks</h3>
 +
                    </div>
 +
                </div>
 +
            </div></div>
 +
 
 +
            <!-- ====== DRY LAB ====== -->
 +
            <div class="ig-tileset-outer"><div class="ig-tileset-inner">
 +
                <div class="ig-tile dl-1">
 +
                    <img src="r/uo2014-tile5.jpg" alt="">
 +
                    <div class="text">
 +
                        <h2>The tri-stable switch</h2>
 +
                        <p>Modelling stem cell differentiation in <em>S. cerevisae</em>.</p>
 +
                        <p class="hover" hidden>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile dl-2">
 +
                    <img src="r/uo2014-tile6.jpg" alt="">
 +
                    <div class="text">
 +
                        <h2>The tri-stable switch</h2>
 +
                        <p>Modelling stem cell differentiation in <em>S. cerevisae</em>.</p>
 +
                        <p class="hover" hidden>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile dl-3">
 +
                    <img src="r/uo2014-tile7.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Results</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile dl-4">
 +
                    <img src="r/uo2014-tile8.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Methods</h3>
 +
                    </div>
 +
                </div>
 +
            </div></div>
 +
 
 +
            <!-- ====== HP ====== -->
 +
            <!--
 +
                Headings: - OGEM
 +
                          - Let's Talk Science + Classroom presentations
 +
                          - Festivals
 +
                          - Mini-enrichment
 +
            -->
 +
 
 +
            <div class="ig-tileset-outer"><div class="ig-tileset-inner">
 +
                <div class="ig-tile hp-1">
 +
                    <img src="r/uo2014-tile9.jpg" alt="">
 +
                    <div class="text">
 +
                        <h2>The tri-stable switch</h2>
 +
                        <p>Modelling stem cell differentiation in <em>S. cerevisae</em>.</p>
 +
                        <p class="hover" hidden>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile hp-2">
 +
                    <img src="r/uo2014-tile10.jpg" alt="">
 +
                    <div class="text">
 +
                        <h2>The tri-stable switch</h2>
 +
                        <p>Modelling stem cell differentiation in <em>S. cerevisae</em>.</p>
 +
                        <p class="hover" hidden>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile hp-3">
 +
                    <img src="r/uo2014-tile11.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Results</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile hp-4">
 +
                    <img src="r/uo2014-tile12.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Methods</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile hp-5">
 +
                    <img src="r/uo2014-tile12.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Methods</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile hp-6">
 +
                    <img src="r/uo2014-tile12.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Methods</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile hp-7">
 +
                    <img src="r/uo2014-tile12.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Methods</h3>
 +
                    </div>
 +
                </div>
 +
            </div></div>
 +
 
 +
            <!-- ====== Team ====== -->
 +
            <div class="ig-tileset-outer"><div class="ig-tileset-inner">
 +
                <div class="ig-tile te-1">
 +
                    <video src="r/uo2014-timelapse.mp4" width="100%" autoplay loop preload="auto" muted>
 +
                    </video>
 +
                    <div class="text">
 +
                        <h2>The hardest-working team in iGEM.</h2>
 +
                        <p><s>Working hard</s> Hardly working 24/7 since 2008.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile te-2">
 +
                    <img src="r/uo2014-tile10.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Safety</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile te-3">
 +
                    <img src="r/uo2014-tile11.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Notebook</h3>
 +
                    </div>
 +
                </div>
 +
                <div class="ig-tile te-4">
 +
                    <img src="r/uo2014-tile12.jpg" alt="">
 +
                    <div class="text">
 +
                        <h3>Attributions</h3>
 +
                    </div>
 +
                </div>
 +
            </div></div>
 +
        </div>
 +
    </div>
<!-- =================
<!-- =================

Revision as of 19:52, 15 October 2014

<style type="text/css"> /* gplay background */ html { background-image: url("Uo2014-gplay.png"); </style>

<script>

   $(function() {
       var currentTileset = 0;
       var duration = 500;
       $(".hover").parents(".ig-tile").hover(function() {
           $(this).find(".hover").slideDown(300);
       }, function() {
           $(this).find(".hover").slideUp(300);
       });
       $(".leftarrow").click(function(e) {
           scrollTo(currentTileset - 1);
       });
       $(".rightarrow").click(function(e) {
           scrollTo(currentTileset + 1);
       });
       $(window).resize(function() {
           scrollTo(currentTileset, true);
       });
       function scrollTo(tileset, instant) {
           if (!instant) instant = false;
           if (tileset < 0 || tileset > 3) return;
           // Scroll to the chosen tile
           currentTileset = tileset;
           var tileWidth = $(".ig-tileset-outer").width()
               + 2 * parseInt($(".ig-tileset-outer").css("margin-left"));
           var scrollTarget = -tileset * tileWidth;
           var t = instant ? 0 : duration;
           $(".ig-scroller").animate({ left: scrollTarget }, t);
           // Hide the arrows
           if (tileset == 0)
               $(".leftarrow").fadeOut(300);
           else
               $(".leftarrow").fadeIn(300);
           if (tileset == 3)
               $(".rightarrow").fadeOut(300);
           else
               $(".rightarrow").fadeIn(300);
       }
       setTimeout(function(){
           $(".ig-tile").each(function() {
               if (Math.random() < 0.5)
                   $(this).fadeIn(700);
               else
                   $(this).slideDown(700);
           });
       }, 400);
   });
   </script>

<header class="ig-main-header">

           <a href="#" class="title">iGEMuOttawa</a>
           <nav>
               <a href="project.html">project</a>
               <a href="drylab.html">dry lab</a>
               <a href="policy.html">policy</a>
               <a href="team.html">team</a>
           </nav>
           <img src="r/uo2014-igemlogo.png" alt="" class="igem-logo no-k">
   </header>
   <img src="r/uo2014-arrow-left.png" alt="" class="ig-arrow leftarrow no-k" hidden>
   <img src="r/uo2014-arrow-right.png" alt="" class="ig-arrow rightarrow no-k">
                   <img src="r/uo2014-tile2.jpg" alt="">

Contents

Take the tour!

How we built the tri-stable switch in S. cerevisae.

Let us take you through our creative and scientific process of building one of the most interesting proposed genetic networks — one that may shed light on how stem cells specialize and allow us to create similar behaviour in a lab.

                   <img src="r/uo2014-tile1.jpg" alt="">

The project

Modelling stem cell differentiation using a tri-stable switch.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.

                   <img src="r/uo2014-tile3.jpg" alt="">

Results

                   <img src="r/uo2014-tile4.jpg" alt="">

Methods

                   <img src="r/uo2014-tile16.jpg" alt="">

Measurement

Interlab study

                   <img src="r/uo2014-tile15.jpg" alt="">

Biobricks

                   <img src="r/uo2014-tile5.jpg" alt="">

The tri-stable switch

Modelling stem cell differentiation in S. cerevisae.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.

                   <img src="r/uo2014-tile6.jpg" alt="">

The tri-stable switch

Modelling stem cell differentiation in S. cerevisae.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.

                   <img src="r/uo2014-tile7.jpg" alt="">

Results

                   <img src="r/uo2014-tile8.jpg" alt="">

Methods


                   <img src="r/uo2014-tile9.jpg" alt="">

The tri-stable switch

Modelling stem cell differentiation in S. cerevisae.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.

                   <img src="r/uo2014-tile10.jpg" alt="">

The tri-stable switch

Modelling stem cell differentiation in S. cerevisae.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus reprehenderit, minima consequuntur enim corporis quod quis unde iusto ratione consectetur! Quibusdam quas voluptas necessitatibus alias aspernatur quasi a maxime impedit.

                   <img src="r/uo2014-tile11.jpg" alt="">

Results

                   <img src="r/uo2014-tile12.jpg" alt="">

Methods

                   <img src="r/uo2014-tile12.jpg" alt="">

Methods

                   <img src="r/uo2014-tile12.jpg" alt="">

Methods

                   <img src="r/uo2014-tile12.jpg" alt="">

Methods

                   <video src="r/uo2014-timelapse.mp4" width="100%" autoplay loop preload="auto" muted>
                   </video>

The hardest-working team in iGEM.

Working hard Hardly working 24/7 since 2008.

                   <img src="r/uo2014-tile10.jpg" alt="">

Safety

                   <img src="r/uo2014-tile11.jpg" alt="">

Notebook

                   <img src="r/uo2014-tile12.jpg" alt="">

Attributions