Difference between revisions of "Team:Freiburg"

 
(46 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{Freiburg/Styles}}
+
{{Freiburg/Styles}} {{Freiburg/Home}} {{Freiburg/Main}} {{Freiburg/Menubar}}
{{Freiburg/Home}}
+
{{Freiburg/Main}}
+
{{Freiburg/Menubar}}
+
 
+
 
<html>
 
<html>
 
 
<!-- styles for countdown -->
 
<!-- styles for countdown -->
    <style>
+
<style>
        body {
+
    body {
            text-align: right;
+
        text-align: right;
/*            background: #00ECB9;*/
+
        /*            background: #00ECB9;*/
            font-family: sans-serif;
+
        font-family: sans-serif;
            font-weight: 100;
+
        font-weight: 100;
 
+
    }
 +
   
 +
    hh6 {
 +
        margin-right: 30px;
 +
        color: black;
 +
        font-weight: 0;
 +
        font-size: 10px;
 +
        /*            margin: 20px 0px 10px;*/
 +
    }
 +
   
 +
    #clockdiv {
 +
        font-family: sans-serif;
 +
        color: #fff;
 +
        display: inline-block;
 +
        font-weight: 10;
 +
        text-align: center;
 +
        font-size: 10px;
 +
    }
 +
   
 +
    #clockdiv>div {
 +
        padding: 5px;
 +
        border-radius: 3px;
 +
        /*            background: #00BF96;*/
 +
        display: inline-block;
 +
    }
 +
   
 +
    #clockdiv div>span {
 +
        padding: 5px;
 +
        border-radius: 3px;
 +
        background: black;
 +
        display: inline-block;
 +
    }
 +
   
 +
    .smalltext {
 +
        color: black;
 +
        padding-top: 5px;
 +
        font-size: 10px;
 +
    }
 +
    /*-------guided tou related styles---------*/
 +
    /*-------guided tour style sheet-----------*/
 +
   
 +
    .wrap {
 +
        position: relative;
 +
        top: 40px;
 +
        margin: auto;
 +
        width: 800px;
 +
        overflow: hidden;
 +
        height: 500px;
 +
    }
 +
   
 +
    body {
 +
        background-color: rgba(0, 0, 0, 0.5);
 +
        max-height: 500px;
 +
    }
 +
   
 +
    #slides {
 +
        /*    width: 999999px;*/
 +
        height: 20000px;
 +
    }
 +
   
 +
    #slides > div {
 +
        background-color: #fff7f2;
 +
        height: 500px;
 +
        width: 800px;
 +
        border-radius: 200px;
 +
        float: left;
 +
        /*    margin-right: 200px;*/
 +
        margin-bottom: 100px;
 +
        text-align: center;
 +
        display: -webkit-flex;
 +
        -webkit-flex-direction: row;
 +
        -webkit-justify-content: center;
 +
        -webkit-align-items: center;
 +
        display: flex;
 +
        flex-direction: row;
 +
        justify-content: center;
 +
        align-items: center;
 +
        -webkit-transition: all 1s linear;
 +
        transition: all 1s linear;
 +
    }
 +
   
 +
    #slides h1,
 +
    #slides h2,
 +
    #slides h3,
 +
    #slides h4,
 +
    #slides h5 {
 +
        color: #534741;
 +
        font-family: 'League Gothic', sans-serif;
 +
        letter-spacing: 5px;
 +
    }
 +
   
 +
    #slides > div h2 {
 +
        font-size: 180px;
 +
        line-height: 1em;
 +
        margin: 0;
 +
    }
 +
   
 +
    .sporiBtm {
 +
        width: 55px;
 +
        position: absolute;
 +
        left: 83.5%;
 +
        top: 48%;
 +
        -moz-transform: scaleX(-1);
 +
        -o-transform: scaleX(-1);
 +
        -webkit-transform: scaleX(-1);
 +
        transform: scaleX(-1);
 +
    }
 +
   
 +
    .arrowRht {
 +
        width: 60px;
 +
        position: absolute;
 +
        left: 83%;
 +
        top: 57%;
 +
    }
 +
   
 +
    .arrowLft {
 +
        width: 60px;
 +
        position: absolute;
 +
        left: 83%;
 +
        top: 34%;
 +
    }
 +
   
 +
    .arrowImg:hover img {
 +
        -webkit-transform: scale(1.15);
 +
        /* Safari and Chrome */
 +
        -moz-transform: scale(1.15);
 +
        /* Firefox */
 +
        -ms-transform: scale(1.15);
 +
        /* IE 9 */
 +
        -o-transform: scale(1.15);
 +
        /* Opera */
 +
        transform: scale(1.15);
 +
    }
 +
   
 +
    .gtContent {
 +
        position: relative;
 +
        width: 400px;
 +
        left: 20px;
 +
        top: 60px;
 +
    }
 +
   
 +
    .gtContent2 {
 +
        position: relative;
 +
        width: 200px;
 +
        left: 20px;
 +
        top: 40px;
 +
    }
 +
   
 +
    .gtContent3 {
 +
        position: relative;
 +
        width: 350px;
 +
        left: 20px;
 +
        top: 60px;
 +
    }
 +
   
 +
    .gtContent4 {
 +
        position: relative;
 +
        top: 50px;
 +
        left: 20px;
 +
    }
 +
   
 +
    .gtContent5 {
 +
        position: relative;
 +
        width: 200px;
 +
        left: 20px;
 +
        top: 80px;
 +
    }
 +
   
 +
    .gtBubble {
 +
        width: 500px;
 +
        top: 10%;
 +
        left: 20%;
 +
        position: absolute;
 +
    }
 +
   
 +
    .gtBubble2 {
 +
        width: 700px;
 +
        top: 10%;
 +
        left: 20%;
 +
        position: absolute;
 +
    }
 +
   
 +
    .gtSpori {
 +
        width: 300px;
 +
        position: absolute;
 +
        left: 0%;
 +
        top: 35%;
 +
        z-index: 8;
 +
    }
 +
    /*---------------------------------------------*/
 +
   
 +
    .info {
 +
        /*            left: 25%;*/
 +
        position: relative;
 +
        top: 10%;
 +
        height: 800px;
 +
        width: 1000px;
 +
        /*            background-color: #299ac5;*/
 +
        display: flex;
 +
        flex-direction: column;
 +
        /*            justify-content: center;*/
 +
    }
 +
   
 +
    .color1 {
 +
        /*  background-color: #299ac5;*/
 +
        width: 100%;
 +
        height: 3000px;
 +
        text-align: center;
 +
        font-size: 20px;
 +
    }
 +
   
 +
    .container {
 +
        display: flex;
 +
        flex-direction: column;
 +
        border-radius: 25px;
 +
        background-color: rgba(0, 0, 0, 0.25);
 +
        margin-top: 50px;
 +
    }
 +
   
 +
    #c1,
 +
    #c2,
 +
    #c3 {
 +
        height: 150px;
 +
    }
 +
   
 +
    .open {
 +
        display: flex;
 +
        flex-direction: column;
 +
        margin-top: -10px;
 +
    }
 +
   
 +
    #o1,
 +
    #o2,
 +
    #o3 {
 +
        visibility: hidden;
 +
    }
 +
   
 +
    .closed {
 +
        display: flex;
 +
    }
 +
   
 +
    #c1Img {
 +
        position: relative;
 +
        top: -7px;
 +
        width: 90px;
 +
    }
 +
   
 +
    .imgDiv {
 +
        position: relative;
 +
        left: 15%;
 +
        top: 40px;
 +
        width: 150px;
 +
        height: 70px;
 +
        /*            background-color: darkgrey;*/
 +
    }
 +
   
 +
    .txtDiv {
 +
        margin-left: 130px;
 +
        margin-top: 60px;
 +
        width: 460px;
 +
        height: 70px;
 +
        /*            background-color: darkgrey;*/
 +
    }
 +
   
 +
    .resultDiv {
 +
        margin-top: -30px;
 +
        margin-left: 50px;
 +
        top: 15px;
 +
        width: 90%;
 +
        /*            background-color: darkgrey;*/
 +
    }
 +
   
 +
    #o1 reultDiv {
 +
        height: 300px;
 +
    }
 +
   
 +
    .txt2Div {
 +
        margin-left: 20px;
 +
        margin-top: 15px;
 +
        width: 660px;
 +
        height: 70px;
 +
        /*            background-color: darkgrey;*/
 +
    }
 +
   
 +
    .txt2Div div {
 +
        margin-left: 30px;
 +
    }
 +
   
 +
    .Arrow {
 +
        margin-top: 40px;
 +
        margin-left: 20px;
 +
        width: 70px;
 +
        height: 70px;
 +
    }
 +
   
 +
    .Arrow img {
 +
        width: 70px;
 +
    }
 +
   
 +
    @media screen and (max-width: 500px) {
 +
        .info {
 +
            margin-left: 2%;
 +
            -webkit-transform: scale(0.40);
 +
            -moz-transform: scale(0.40);
 +
            -ms-transform: scale(0.40);
 +
            transform: scale(0.40);
 +
            -ms-transform-origin: 0% 0%;
 +
            -webkit-transform-origin: 0% 0%;
 +
            transform-origin: 0% 0%;
 
         }
 
         }
 
+
         #back-top {
         hh6 {
+
             visibility: hidden;
             margin-right: 30px;
+
            color: black;
+
            font-weight: 0;
+
            font-size: 10px;
+
/*            margin: 20px 0px 10px;*/
+
 
         }
 
         }
 +
    }
 +
</style>
 +
<!-- end of style for countdown -->
  
         #clockdiv {
+
<body>
             font-family: sans-serif;
+
    <div class="column full_size">
            color: #fff;
+
         <div class="para_center_20">
             display: inline-block;
+
             <font color="#bc5916">
             font-weight: 10;
+
                <p style="font-size:30px"> Welcome to the Team-Wiki from iGEM Freiburg 2016.</p>
             text-align: center;
+
                <br>
            font-size: 10px;
+
                <br> On the following pages we want to show you how we use <i>Bacillus subtilis</i> endospores to reduce the side effects of systemically distributed medication.
        }
+
                <br>
 +
                <br> Click on the menus to get more information or follow Spori through a guided tour.
 +
             </font>
 +
        </div>
 +
    </div>
 +
    <center>
 +
        <div id="tour" style="display:block">
 +
             <!-- div class="closeframe">
 +
                <a href='#' onclick="document.getElementById('tour').style.display = 'none'" style="color:brown;">X</a ></div-->
 +
             <center>
 +
                <div class='info'>
 +
                    <div id="c1" class="container">
 +
                        <div class="closed">
 +
                            <div class='imgDiv'>
 +
                                <img id="c1Img" src="https://static.igem.org/mediawiki/2016/2/2e/T--Freiburg--Spori.png">
 +
                            </div>
 +
                            <div class='txtDiv'>
 +
                                <h3 style="color:rgb(189, 89, 22);">Please Click on the Arrow to begin the Guided Tour.
 +
                                </h3>
 +
                            </div>
 +
                            <div class="Arrow">
 +
                                <img id="c1Arrow" src="https://static.igem.org/mediawiki/2016/b/bd/T--Freiburg--gtRight.png">
 +
                            </div>
 +
                        </div>
 +
                        <div id="o1" class="open">
 +
                            <div class='resultDiv'>
 +
                                <div class="image">
 +
                                    <img class="gtSpori" src="https://static.igem.org/mediawiki/2016/2/2e/T--Freiburg--Spori.png" alt="Smiley face">
 +
                                </div>
 +
                                <div class="wrap">
 +
                                    <div id="slides">
 +
                                        <!-- load in slides -->
 +
                                    </div>
 +
                                    <div class="arrowImg">
 +
                                        <img class="arrowLft" src="https://static.igem.org/mediawiki/2016/4/43/T--Freiburg--gtLeft.png" alt="Smiley face" onclick="Slides.prev()">
 +
                                    </div>
 +
                                    <div class="">
 +
                                        <img class="sporiBtm" src="https://static.igem.org/mediawiki/2016/d/d1/T--Freiburg--Proof_of_Concept_Front1.png" alt="Smiley face">
 +
                                    </div>
 +
                                    <div class="arrowImg">
 +
                                        <img class="arrowRht" src="https://static.igem.org/mediawiki/2016/b/bd/T--Freiburg--gtRight.png" alt="Smiley face" onclick="Slides.next()">
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </div>
 +
                </div>
  
         #clockdiv>div {
+
            </center>
            padding: 5px;
+
         </div>
            border-radius: 3px;
+
    </center>
/*            background: #00BF96;*/
+
            display: inline-block;
+
        }
+
  
        #clockdiv div>span {
+
    <script>
            padding: 5px;
+
         /////////////////////////////////////////////////////////////
            border-radius: 3px;
+
            background: black;
+
            display: inline-block;
+
         }
+
  
         .smalltext {
+
         // for opoening and closing GT tag
            color: black;
+
            padding-top: 5px;
+
            font-size: 10px;
+
        }
+
    </style>
+
    <!-- end of style for countdown -->
+
  
<body>
+
        var c1Flag = 0;
<div class="column full_size" >
+
        var c1Arrow = document.getElementById('c1Arrow'); // Grabbing the sample  id
 +
        var c1 = document.getElementById('c1');
 +
        c1Arrow.addEventListener('click', function (e) { // When someone clicks on it
 +
            if (c1Flag == 0) {
 +
                c1.style.height = '700px';
 +
                c1Flag = 1;
 +
                $("#o1").css("visibility", "visible");
 +
                $("#c1Arrow").attr("src", "https://static.igem.org/mediawiki/2016/4/43/T--Freiburg--gtLeft.png");
 +
            } else {
 +
                c1.style.height = "150px";
 +
                c1Flag = 0;
 +
                $("#o1").css("visibility", "hidden");
 +
                $("#c1Arrow").attr("src", "https://static.igem.org/mediawiki/2016/b/bd/T--Freiburg--gtRight.png");
  
  <div class="para_center_without_margin_bottom" style="font-size:30px" >Welcome to the Team-Wiki from iGEM Freiburg 2016.  </div>
+
            }
 +
        });
  
  
  <div class="para_center_without_margin_bottom" > <font color="#bc5916">
 
  This Wiki is under construction - if you miss any information: write us an E-Mail to <a href="mailto:igem_2016@freigem.org" style="color:#e8a126">igem_2016@freigem.org</a></span></font>
 
  </div>
 
  
  <div class="para_center_without_margin_bottom" ><font color="#bc5916">
+
        //GT
  On the following pages we want to show you how we use <i>Bacillus subtilis</i> endospores to reduce the side effects of systemically distributed medication.</font>
+
        var Slides = {
  </div>
+
            container: $('#slides'),
  
<div class="para_center_without_margin_bottom"><font color="#bc5916">Click on the menus to get more information or follow Spori through a guided tour (coming soon). </font>
+
            totalSlides: '',
</div>
+
  
 +
            translateAmount: 0,
  
</div>
+
            currentSlide: 0,
  
 +
            slideWidth: '',
  
 +
            slideArray: [
 +
            // 0
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/7/78/T--Freiburg--GT_s0.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/1/1e/T--Freiburg--GT_s0c.png" alt="Smiley face" onclick="" />\n ' +
 +
            '</div>',
 +
            // 1
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/c/c0/T--Freiburg--GT_s1.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/8/82/T--Freiburg--GT_s1c.png" alt="Smiley face" onclick="" />\n ' +
 +
            '</div>',
 +
            // 2
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/0/06/T--Freiburg--GT_s2.png" alt="Smiley face" onclick="" />\n' +
 +
            '<div class="twoVids" style="display:inline-block">\n' +
 +
            '<img class="gtContent5" src="https://static.igem.org/mediawiki/2016/f/fd/T--Freiburg--GT_s2c1.gif" alt="Smiley face" onclick="" /> \n ' +
 +
            '<img class="gtContent5" src="https://static.igem.org/mediawiki/2016/3/3a/T--Freiburg--GT_s2c2.gif" alt="Smiley face" onclick="" /> \n ' +
 +
            '</div>\n' +
 +
            '</div>',
 +
            // 3 
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/7/73/T--Freiburg--GT_s3.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent2" src="https://static.igem.org/mediawiki/2016/4/47/T--Freiburg--GT_s3c.png" alt="Smiley face" onclick="" /> \n ' +
 +
            '</div>',
 +
            // 4
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/7/78/T--Freiburg--GT_s4.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent3" src="https://static.igem.org/mediawiki/2016/4/40/T--Freiburg--GT_s4c.gif" alt="Smiley face" onclick="" /> \n ' +
 +
            '</div>',
 +
            // 5   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/d/db/T--Freiburg--GT_s5.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/9/92/T--Freiburg--GT_s5c.png" alt="Smiley face" onclick="" /> \n ' +
 +
            '</div>',
 +
            // 6   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/0/09/T--Freiburg--GT_s6.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/1/1d/T--Freiburg--GT_s6c.png" alt="Smiley face" onclick="" />\n ' +
 +
            '</div>',
 +
            // 7   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/7/79/T--Freiburg--GT_s7.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/8/89/T--Freiburg--GT_s7c.png" alt="Smiley face" onclick="" />\n ' +
 +
            '</div>',
 +
            // 8   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/5/55/T--Freiburg--GT_s8.2.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/c/c9/T--Freiburg--GT_s8c.png" alt="Smiley face" onclick="" />\n ' +
 +
            '</div>',
 +
            // 9   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/f/fd/T--Freiburg--GT_s9.png" alt="Smiley face" onclick="" />\n' +
 +
            '<div class="twoVids" style="display:inline-block">\n' +
 +
            '<video class="gtContent4" width="220" loop autoplay> <source src="https://static.igem.org/mediawiki/2016/2/2a/T--Freiburg--GT_s9c1.mp4" type="video/mp4"></video>\n ' +
 +
            '<video class="gtContent4" width="220" loop autoplay> <source src="https://static.igem.org/mediawiki/2016/2/2e/T--Freiburg--GT_s9c2.mp4" type="video/mp4"></video>\n ' +
 +
            '</div>\n' +
 +
            '</div>',
 +
            // 10   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/3/36/T--Freiburg--GT_s10.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/3/33/T--Freiburg--GT_s10c.png" alt="Smiley face" onclick="" /> \n ' +
 +
            '</div>',
 +
            // 11   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/b/b7/T--Freiburg--GT_s11.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/1/13/T--Freiburg--GT_s11c.png" alt="Smiley face" onclick="" /> \n ' +
 +
            '</div>',
 +
            // 12   
 +
            '<div>\n' +
 +
            '<img class="gtBubble" src="https://static.igem.org/mediawiki/2016/8/8d/T--Freiburg--GT_s12.png" alt="Smiley face" onclick="" />\n' +
 +
            '<img class="gtContent" src="https://static.igem.org/mediawiki/2016/9/97/T--Freiburg--GT_s12c.png" alt="Smiley face" onclick="" /> \n ' +
 +
            '</div>',
  
<div id="hh6" style="font-size: 10px; margin-right:30px;">Wiki Freeze Countdown</div>
+
         ],
<div id="clockdiv">
+
         <div>
+
            <span class="days"></span>
+
            <div class="smalltext">Days</div>
+
        </div>
+
        <div>
+
            <span class="hours"></span>
+
            <div class="smalltext">Hours</div>
+
        </div>
+
        <div>
+
            <span class="minutes"></span>
+
            <div class="smalltext">Minutes</div>
+
        </div>
+
        <div>
+
            <span class="seconds"></span>
+
            <div class="smalltext">Seconds</div>
+
        </div>
+
    </div>
+
  
 +
            init: function (totalSlides) {
 +
                var each;
  
<script>
+
                if (!totalSlides) throw new Error('Please pass the total number of slides.');
        console.log("hello js");
+
                Slides.totalSlides = totalSlides;
  
        function getTimeRemaining(endtime) {
+
                Slides.loadContent();
            var t = Date.parse(endtime) - Date.parse(new Date());
+
            var seconds = Math.floor((t / 1000) % 60);
+
            var minutes = Math.floor((t / 1000 / 60) % 60);
+
            var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
+
            var days = Math.floor(t / (1000 * 60 * 60 * 24));
+
            return {
+
                'total': t,
+
                'days': days,
+
                'hours': hours,
+
                'minutes': minutes,
+
                'seconds': seconds
+
            };
+
        }
+
  
        function initializeClock(id, endtime) {
+
                each = Slides.container.children('div');
            var clock = document.getElementById(id);
+
            var daysSpan = clock.querySelector('.days');
+
            var hoursSpan = clock.querySelector('.hours');
+
            var minutesSpan = clock.querySelector('.minutes');
+
            var secondsSpan = clock.querySelector('.seconds');
+
  
            function updateClock() {
+
                // Determine the width of our canvas
                 var t = getTimeRemaining(endtime);
+
                 Slides.slideWidth = each.height() + (parseInt(each.css('margin-bottom'), 10));
  
                 daysSpan.innerHTML = t.days;
+
                 Slides.keyPress();
                hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
+
                 Slides.keyDown();
                 minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
+
            },
                secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
+
  
                if (t.total <= 0) {
+
            loadContent: function () {
                     clearInterval(timeinterval);
+
                Slides.container.hide();
 +
                for (var i = 0; i < Slides.totalSlides; i++) {
 +
                     $('<div id="#slide-' + i + '"></div>')
 +
                        //                .load('slides/' + i + '.html')
 +
                        .html(Slides.slideArray[i])
 +
                        .appendTo(Slides.container);
 
                 }
 
                 }
             }
+
                Slides.container.show();
 +
             },
  
             updateClock();
+
             keyDown: function () {
             var timeinterval = setInterval(updateClock, 1000);
+
                console.log("keydown func");
        }
+
                $(document.body).keydown(function (evt) {
 +
                    //            console.log(evt);
 +
                    var e = evt || window.event;
 +
                    console.log("key:", e.keyCode);
 +
                    // if left or right arrow key is pressed
 +
                    if (e.keyCode === 39 || e.keyCode === 37) {
 +
                        e.preventDefault();
 +
                        (e.keyCode === 39) ? Slides.next(): Slides.prev();
 +
                    }
 +
                });
 +
             },
 +
 
 +
            keyPress: function () {
 +
                console.log("keypress func");
 +
                $(document.body).keypress(function (evt) {
 +
                    //            console.log(evt);
 +
                    var e = evt || window.event;
 +
                    console.log("key:", e.keyCode);
 +
                    // if left or right arrow key is pressed
 +
                    if (e.keyCode === 39 || e.keyCode === 37) {
 +
                        e.preventDefault();
 +
                        (e.keyCode === 39) ? Slides.next(): Slides.prev();
 +
                    }
 +
                });
 +
            },
 +
 
 +
 
 +
            next: function () {
 +
                console.log(Slides.totalSlides, Slides.currentSlide);
 +
                if (Slides.currentSlide + 1 != Slides.totalSlides) {
 +
                    Slides.translateAmount -= Slides.slideWidth;
 +
                    Slides.updateHash(++Slides.currentSlide);
 +
                    Slides.animate();
 +
                }
 +
            },
  
//       var deadline = new Date(Date.parse(new Date()) + 31 * 24 * 60 * 60 * 1000);
+
            prev: function () {
        var deadline = new Date(2016,9,19,0,0,0,0)
+
                // No more left to go back.
 +
                if (Slides.translateAmount === 0) return;
 +
 
 +
                Slides.translateAmount += Slides.slideWidth;
 +
                Slides.updateHash(--Slides.currentSlide);
 +
                Slides.animate();
 +
            },
 +
 
 +
            animate: function () {
 +
                Slides
 +
                    .container
 +
                    .children()
 +
                    .css({
 +
                        '-webkit-transform': 'translateY(' + Slides.translateAmount + 'px)',
 +
                        'transform': 'translateY(' + Slides.translateAmount + 'px)'
 +
                    });
 +
 
 +
            },
 +
 
 +
            updateHash: function (direction) {
 +
                // Update current Slides and hash.
 +
                location.hash = '#slide-' + Slides.currentSlide;
 +
            }
 +
        };
  
         initializeClock('clockdiv', deadline);
+
         Slides.init(13);
 
     </script>
 
     </script>
 
</body>
 
</body>
  
 
</html>
 
</html>

Latest revision as of 03:46, 20 October 2016

Welcome to the Team-Wiki from iGEM Freiburg 2016.



On the following pages we want to show you how we use Bacillus subtilis endospores to reduce the side effects of systemically distributed medication.

Click on the menus to get more information or follow Spori through a guided tour.

Please Click on the Arrow to begin the Guided Tour.

Smiley face
Smiley face
Smiley face
Smiley face