Difference between revisions of "Team:NYU Abu Dhabi/"

 
(45 intermediate revisions by 3 users not shown)
Line 22: Line 22:
 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.1.1/aos.css">
 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.1.1/aos.css">
 
     <!-- <link rel="stylesheet" href="assets/css/styles.min.css"> -->
 
     <!-- <link rel="stylesheet" href="assets/css/styles.min.css"> -->
−
 
+
    <link rel="prefetch" href="https://2019.igem.org/wiki/images/thumb/0/0a/T--NYU_Abu_Dhabi--prender1.png/1600px-T--NYU_Abu_Dhabi--prender1.png">
 +
    <script>
 +
      let getName = () => {
 +
      const name = document.getElementById('user_item').innerText;
 +
      return name.charAt(0).toUpperCase() + name.slice(1);
 +
      }
 +
      let setIt = () => {
 +
        if(((getName()!="Login")||(getName()==""))){
 +
          if((getName().length<= 15)) {
 +
      document.getElementById('nameHolder').innerHTML = "Hey " + getName() + "!";
 +
      clearInterval(intervalAdder);
 +
    }
 +
    }
 +
      }
 +
      intervalAdder = setInterval(setIt, 300);
 +
      $(window).load(function(){
 +
    $('.loader').fadeOut();
 +
      });
 +
    </script>
 
</head>
 
</head>
  
 
<body id="page-top">
 
<body id="page-top">
−
     <!-- Start: *DEPENDANCIES AND PRELOADING --><script
+
     <!-- Start: *DEPENDANCIES AND PRELOADING -->
 +
    <script
 
   src="https://2019.igem.org/Team:NYU_Abu_Dhabi/jquery?action=raw&ctype=text/javascript"></script>
 
   src="https://2019.igem.org/Team:NYU_Abu_Dhabi/jquery?action=raw&ctype=text/javascript"></script>
 
   <script>
 
   <script>
Line 48: Line 67:
 
<script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/smoothScroll?action=raw&ctype=text/javascript"></script>
 
<script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/smoothScroll?action=raw&ctype=text/javascript"></script>
 
<script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/jquery?action=raw&ctype=text/javascript"></script>
 
<script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/jquery?action=raw&ctype=text/javascript"></script>
−
   
+
 
 
     <script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/bootstrapjs?action=raw&ctype=text/javascript"></script>
 
     <script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/bootstrapjs?action=raw&ctype=text/javascript"></script>
 
     <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>-->
 
     <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>-->
 
     <script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/sampleScript?action=raw&ctype=text/javascript"></script>
 
     <script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/sampleScript?action=raw&ctype=text/javascript"></script>
−
   
+
 
 
<script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/IndicatorDebug?action=raw&ctype=text/javascript"></script>
 
<script src="https://2019.igem.org/Team:NYU_Abu_Dhabi/IndicatorDebug?action=raw&ctype=text/javascript"></script>
−
<link rel="prefetch" href="https://2019.igem.org/wiki/images/0/00/T--NYU_Abu_Dhabi--iphone.png">
+
 
−
<link rel="prefetch" href="https://2019.igem.org/wiki/images/5/5d/T--NYU_Abu_Dhabi--d1.png">
+
−
<link rel="prefetch" href="https://2019.igem.org/wiki/images/4/48/T--NYU_Abu_Dhabi--d2.png">
+
−
<link rel="prefetch" href="https://2019.igem.org/wiki/images/a/ad/T--NYU_Abu_Dhabi--d3.png">
+
−
<link rel="prefetch" href="https://2019.igem.org/wiki/images/3/3d/T--NYU_Abu_Dhabi--d4.png">
+
−
<link rel="prefetch" href="https://2019.igem.org/wiki/images/2/2b/T--NYU_Abu_Dhabi--d5.png">
+
−
<link rel="prefetch" href="https://2019.igem.org/wiki/images/2/2c/T--NYU_Abu_Dhabi--d6.png">
+
  
 
     <!-- End: *DEPENDANCIES AND PRELOADING -->
 
     <!-- End: *DEPENDANCIES AND PRELOADING -->
−
     <nav class="navbar navbar-light navbar-expand-lg fixed-top" id="mainNav">
+
     <nav class="navbar navbar-light navbar-expand-lg fixed-top" style="padding:20px 0px;" id="mainNav">
 
         <!-- Start: IGEM MENU LINKS -->
 
         <!-- Start: IGEM MENU LINKS -->
 
         <!-- End: IGEM MENU LINKS -->
 
         <!-- End: IGEM MENU LINKS -->
−
         <div class="container"><img src="https://2019.igem.org/wiki/images/f/f3/T--NYU_Abu_Dhabi--logoWhite.png" style="width: 30px;padding: 5px;"><a class="navbar-brand js-scroll-trigger" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/">Volatect</a><button data-toggle="collapse" data-target="#navbarResponsive" class="navbar-toggler float-right" aria-controls="navbarResponsive"
+
         <div class="container"><img src="https://2019.igem.org/wiki/images/f/f3/T--NYU_Abu_Dhabi--logoWhite.png" class="img-fluid" style="max-width: 30px;
 +
  width:100%;padding: 5px;"><a class="navbar-brand js-scroll-trigger" href="https://2019.igem.org/Team:NYU_Abu_Dhabi">Volatect</a><button data-toggle="collapse" data-target="#navbarResponsive" class="navbar-toggler float-right" aria-controls="navbarResponsive"
 
                 aria-expanded="false" aria-label="Toggle navigation"><i class="fa fa-bars"></i></button>
 
                 aria-expanded="false" aria-label="Toggle navigation"><i class="fa fa-bars"></i></button>
 
             <div class="collapse navbar-collapse" id="navbarResponsive" style="z-index: 9999;">
 
             <div class="collapse navbar-collapse" id="navbarResponsive" style="z-index: 9999;">
 
                 <ul class="nav navbar-nav ml-auto">
 
                 <ul class="nav navbar-nav ml-auto">
 +
                  <style>
 +
                    a:visited {
 +
                      color:black;
 +
                    }
 +
                  </style>
  
−
 
+
                     <li class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" id="navbarDropdown" href="#" style="height: 100%;" role="button" aria-haspopup="true">Description&nbsp;</a>
−
                     <li class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" id="navbarDropdown" href="#yolo" style="height: 100%;" role="button" aria-haspopup="true">Description&nbsp;</a>
+
 
                         <div class="dropdown-menu js-scroll-trigger" role="menu"
 
                         <div class="dropdown-menu js-scroll-trigger" role="menu"
 
                             aria-labelledby="navbarDropdown">
 
                             aria-labelledby="navbarDropdown">
−
                             <a class="dropdown-item" role="presentation" href="description.html">Description</a>
+
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Description">Description</a>
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Software">Software</a><a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Hardware">Hardware</a>
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Software">Software</a><a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Hardware">Hardware</a>
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Parts">Parts</a>
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Parts">Parts</a>
 +
                            <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Demonstrate">Demonstrate</a>
 +
 
                         </div>
 
                         </div>
 
                     </li>
 
                     </li>
Line 84: Line 104:
 
                     <li class="nav-item" role="presentation"><a class="nav-link" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Awards">Awards</a></li>
 
                     <li class="nav-item" role="presentation"><a class="nav-link" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Awards">Awards</a></li>
  
−
                     <li class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="#yolo" style="height: 100%;" role="presentation">Process&nbsp;</a>
+
                     <li class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="#" style="height: 100%;" role="presentation">Process&nbsp;</a>
 
                         <div class="dropdown-menu" role="menu">
 
                         <div class="dropdown-menu" role="menu">
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Experiments">Experiments</a>
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Experiments">Experiments</a>
Line 90: Line 110:
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Results">Results&nbsp;</a>
 
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Results">Results&nbsp;</a>
 
                           <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Design">Design</a>
 
                           <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Design">Design</a>
 +
 
                             <a
 
                             <a
 
                                     class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Safety">Safety</a>
 
                                     class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Safety">Safety</a>
Line 96: Line 117:
  
  
−
                     <li class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="#yolo" style="height: 100%;" role="presentation">Engagement&nbsp;</a>
+
                     <li class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="#" style="height: 100%;" role="presentation">Engagement&nbsp;</a>
 
                         <div class="dropdown-menu" role="menu">
 
                         <div class="dropdown-menu" role="menu">
−
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Experiments">Collaborations</a>
+
                             <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Collaborations">Collaborations</a>
−
                           <a class="dropdown-item" role="presentation" href="human-practices.html">Human Practices</a>
+
                           <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Human_Practices">Human Practices</a>
−
                             <a class="dropdown-item" role="presentation" href="integrated-humans.html">Integrated Human</a><a class="dropdown-item" role="presentation"
+
                             <a class="dropdown-item" role="presentation"
−
                                href="public-engagement.html">Public Engagement</a>
+
                                href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Public_Engagement">Public Engagement</a>
 +
                                <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Attributions">Attributions</a>
 
                             </div>
 
                             </div>
 
                     </li>
 
                     </li>
 +
                    <li class="nav-item" role="presentation"><a class="nav-link" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Team">Team</a></li>
  
 +
                  <li class="nav-item" role="presentation"><a class="nav-link" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/About">About</a></li>
  
−
 
+
                     <li style="display:none" class="nav-item" role="presentation"><a class="nav-link" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Parts">Parts</a></li>
−
                    <li class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" id="navbarDropdown" href="#yolo" style="height: 100%;" role="button" aria-haspopup="true">About&nbsp;</a>
+
                     <li style="display:none" class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="human-practices.html">HUMAN</a>
−
                        <div class="dropdown-menu js-scroll-trigger" role="menu"
+
−
                            aria-labelledby="navbarDropdown">
+
−
                            <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Mission">Mission Statement</a>
+
−
                            <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Team">Team</a>
+
−
                            <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Attributions">Attributions</a>
+
−
                            <a class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Collaborations">Collaborations</a>
+
−
                            <a
+
−
                                class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Nyuad-iGem">NYUAD iGem</a>
+
−
                                <a
+
−
                                class="dropdown-item" role="presentation" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Beyond-iGem">Beyond iGem</a>
+
−
                        </div>
+
−
 
+
−
                    </li>
+
−
                 
+
−
                     <li style="visibility:hidden" class="nav-item" role="presentation"><a class="nav-link" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/Parts">Parts</a></li>
+
−
                     <li style="visibility:hidden" class="nav-item dropdown" role="presentation"><a class="dropdown-toggle nav-link" data-toggle="dropdown" aria-expanded="false" href="human-practices.html">HUMAN</a>
+
 
                         <div class="dropdown-menu" role="menu"><a class="dropdown-item" role="presentation" href="human-practices.html">Human Practices</a>
 
                         <div class="dropdown-menu" role="menu"><a class="dropdown-item" role="presentation" href="human-practices.html">Human Practices</a>
−
                             <a class="dropdown-item" role="presentation" href="integrated-humans.html">Integrated Human</a><a class="dropdown-item" role="presentation"
+
                             <a class="dropdown-item" role="presentation"
 
                                 href="public-engagement.html">Public Engagement</a></div>
 
                                 href="public-engagement.html">Public Engagement</a></div>
 
                     </li>
 
                     </li>
−
                 
+
 
−
                    <li class="nav-item" role="presentation"><a class="nav-link" href="https://2019.igem.org/Team:NYU_Abu_Dhabi/VolatectAPI">WEB API</a></li>
+
 
 
                 </ul>
 
                 </ul>
 
             </div>
 
             </div>
Line 140: Line 148:
 
             <div class="row">
 
             <div class="row">
 
                 <div class="col-md-12">
 
                 <div class="col-md-12">
−
<div id="fadeHeaderOut"></div><h1 id="meetVolatectHeader" class="text-center" style="padding-top:20%;font-size: 9vh;color: rgb(255,255,255);font-family: Catamaran !important; font-weight: 200 !important;">Meet Volatect. A disease diagnostic device that works like magic</h1><div id="scene"></div></div>
+
<div id="fadeHeaderOut"></div><h1 id="meetVolatectHeader" class="text-center" style="padding-top:20%;font-size: 9vh;color: rgb(255,255,255);font-family: Catamaran !important; font-weight: 200 !important;"><span id="nameHolder"></span> Meet Volatect. Flying safe starts by flying healthy.</h1><div id="scene"></div></div>
 
             </div>
 
             </div>
 
             <div class="row">
 
             <div class="row">
Line 155: Line 163:
  
 
<script>
 
<script>
−
$( document ).ready(function() {
+
$( document ).ready(function() {
 
     var isHovered=false;
 
     var isHovered=false;
 
     $( ".nav-item.dropdown" ).each(function(){
 
     $( ".nav-item.dropdown" ).each(function(){
−
       
+
 
 
         $( this ).hover(function(){
 
         $( this ).hover(function(){
−
       
+
 
 
$(this).children("div").fadeIn(400);
 
$(this).children("div").fadeIn(400);
 
         // $(this).children("div").addClass("show");
 
         // $(this).children("div").addClass("show");
Line 174: Line 182:
 
         $(this).hover(function(){
 
         $(this).hover(function(){
 
             isHovered=true;
 
             isHovered=true;
−
           
+
 
 
         }, function() {
 
         }, function() {
 
             isHovered=false;
 
             isHovered=false;
Line 184: Line 192:
 
                           });
 
                           });
 
     */
 
     */
−
   
+
 
 
     var is_mobile = false;
 
     var is_mobile = false;
  
 
     if( $('#mobileChecker').css('display')=='none') {
 
     if( $('#mobileChecker').css('display')=='none') {
−
         is_mobile = true;      
+
         is_mobile = true;
 
     }
 
     }
  
Line 201: Line 209:
 
</div>
 
</div>
 
         </div>
 
         </div>
−
         <!-- Start: HEADER_ANIMATIONS --><div style="position:fixed;left: 0;
+
         <!-- Start: HEADER_ANIMATIONS --><div style="position:fixed;left: 0;
−
right: 0;" id="productImage"><div class="text-center"><img id="productImageActual" src="https://2019.igem.org/wiki/images/0/00/T--NYU_Abu_Dhabi--iphone.png" ><div id="pinTheProduct"></div></div></div>
+
right: 0;" id="productImage">
 +
 
 +
<div class="text-center">
 +
  <img src="https://2019.igem.org/wiki/images/a/ab/T--NYU_Abu_Dhabi--loaderyo.gif" class="loader img-fluid" /><br/><img id="productImageActual" src="https://2019.igem.org/wiki/images/1/16/T--NYU_Abu_Dhabi--pn1.png" style="max-width:400px;"><div id="pinTheProduct"></div></div></div>
  
 
<script>
 
<script>
Line 209: Line 220:
 
         var controller2 = new ScrollMagic.Controller();
 
         var controller2 = new ScrollMagic.Controller();
 
         //TweenMax.set("#headerTextVolatect", {x:0, y:0});
 
         //TweenMax.set("#headerTextVolatect", {x:0, y:0});
−
         //TweenMax.to("#headerTextVolatect",1,{y:2, repeat:-1});  
+
         //TweenMax.to("#headerTextVolatect",1,{y:2, repeat:-1});
−
       
+
 
−
       
+
 
−
       
+
 
 
         //end hover
 
         //end hover
 
         // build tween
 
         // build tween
−
         var tweenMoveProduct = TweenMax.to("#productImage", 1000, {top:"20%"});
+
         var tweenMoveProduct = TweenMax.to("#productImage", 1000, {top:"25%"});
 
         var tweenFadeOut = TweenMax.to("#productImage", 1000, {opacity:0});
 
         var tweenFadeOut = TweenMax.to("#productImage", 1000, {opacity:0});
 
         var tweenRotate = TweenMax.to("#productImageActual",0,{rotation:0});
 
         var tweenRotate = TweenMax.to("#productImageActual",0,{rotation:0});
 
         var images = [
 
         var images = [
−
         "https://2019.igem.org/wiki/images/0/00/T--NYU_Abu_Dhabi--iphone.png",
+
         "https://2019.igem.org/wiki/images/1/16/T--NYU_Abu_Dhabi--pn1.png",
−
         "https://2019.igem.org/wiki/images/5/5d/T--NYU_Abu_Dhabi--d1.png",
+
         "https://2019.igem.org/wiki/images/3/35/T--NYU_Abu_Dhabi--pn2.png",
−
         "https://2019.igem.org/wiki/images/4/48/T--NYU_Abu_Dhabi--d2.png",
+
         "https://2019.igem.org/wiki/images/e/ee/T--NYU_Abu_Dhabi--pn3.png",
−
         "https://2019.igem.org/wiki/images/a/ad/T--NYU_Abu_Dhabi--d3.png",
+
         "https://2019.igem.org/wiki/images/0/06/T--NYU_Abu_Dhabi--pn4.png",
−
         "https://2019.igem.org/wiki/images/3/3d/T--NYU_Abu_Dhabi--d4.png",
+
         "https://2019.igem.org/wiki/images/e/e2/T--NYU_Abu_Dhabi--pn5.png",
−
         "https://2019.igem.org/wiki/images/2/2b/T--NYU_Abu_Dhabi--d5.png",
+
         "https://2019.igem.org/wiki/images/e/e8/T--NYU_Abu_Dhabi--pn6.png",
−
             "https://2019.igem.org/wiki/images/2/2c/T--NYU_Abu_Dhabi--d6.png"
+
            "https://2019.igem.org/wiki/images/3/32/T--NYU_Abu_Dhabi--pn8.png",
−
   
+
            "https://2019.igem.org/wiki/images/3/32/T--NYU_Abu_Dhabi--pn9.png",
 +
            "https://2019.igem.org/wiki/images/e/ea/T--NYU_Abu_Dhabi--pn10.png",
 +
            "https://2019.igem.org/wiki/images/1/13/T--NYU_Abu_Dhabi--pn11.png",
 +
            "https://2019.igem.org/wiki/images/2/2e/T--NYU_Abu_Dhabi--pn12.png",
 +
            "https://2019.igem.org/wiki/images/f/f9/T--NYU_Abu_Dhabi--pn13.png",
 +
            "https://2019.igem.org/wiki/images/2/25/T--NYU_Abu_Dhabi--pn14.png",
 +
            "https://2019.igem.org/wiki/images/9/91/T--NYU_Abu_Dhabi--pn15.png",
 +
            "https://2019.igem.org/wiki/images/6/61/T--NYU_Abu_Dhabi--pn16.png",
 +
            "https://2019.igem.org/wiki/images/a/a9/T--NYU_Abu_Dhabi--pn17.png",
 +
            "https://2019.igem.org/wiki/images/4/42/T--NYU_Abu_Dhabi--pn18.png",
 +
            "https://2019.igem.org/wiki/images/8/87/T--NYU_Abu_Dhabi--pn19.png",
 +
            "https://2019.igem.org/wiki/images/3/34/T--NYU_Abu_Dhabi--pn20.png",
 +
            "https://2019.igem.org/wiki/images/1/1f/T--NYU_Abu_Dhabi--pn21.png",
 +
            "https://2019.igem.org/wiki/images/b/bd/T--NYU_Abu_Dhabi--pn22.png",
 +
            "https://2019.igem.org/wiki/images/6/66/T--NYU_Abu_Dhabi--pn23.png",
 +
            "https://2019.igem.org/wiki/images/b/bc/T--NYU_Abu_Dhabi--pn24.png",
 +
            "https://2019.igem.org/wiki/images/0/0e/T--NYU_Abu_Dhabi--p25.png",
 +
            "https://2019.igem.org/wiki/images/4/4b/T--NYU_Abu_Dhabi--p26.png",
 +
             "https://2019.igem.org/wiki/images/2/2c/T--NYU_Abu_Dhabi--p28.png",
 +
            "https://2019.igem.org/wiki/images/8/8e/T--NYU_Abu_Dhabi--p29.png"
 +
 
 +
 
 +
 
 +
 
 
     ];
 
     ];
 +
 +
    arrayLength = images.length;
 +
for (i = 0; i < arrayLength; i++) {
 +
  //  <link rel="prefetch" href="https://2019.igem.org/wiki/images/thumb/0/0a/T--NYU_Abu_Dhabi--prender1.png/1600px-T--NYU_Abu_Dhabi--prender1.png">
 +
  let code ="<link rel='prefetch' href='" + images[i] + "'>";
 +
$('head').append(code);
 +
}
  
 
     // TweenMax can tween any property of any object. We use this object to cycle through the array
 
     // TweenMax can tween any property of any object. We use this object to cycle through the array
Line 234: Line 275:
 
     var tweenRemoveDisplay = TweenMax.to("#productImage", 1, {display:"none"});
 
     var tweenRemoveDisplay = TweenMax.to("#productImage", 1, {display:"none"});
 
         //productImage
 
         //productImage
−
   
+
 
 
     // create tween
 
     // create tween
 
     var tweenBlast = TweenMax.to(obj, 1000,
 
     var tweenBlast = TweenMax.to(obj, 1000,
Line 249: Line 290:
 
     );
 
     );
 
         // build scene
 
         // build scene
−
         var timelineProductAnimation = new TimelineMax().add(tweenHeaderFade).add(tweenRotate).add(tweenMoveProduct).add(tweenBlast).add(tweenFadeOut).add(tweenRemoveDisplay);
+
         var timelineProductAnimation = new TimelineMax().add(tweenHeaderFade).add(tweenRotate).add(tweenMoveProduct).add(tweenBlast,"f").add(tweenFadeOut).add(tweenRemoveDisplay);
 
         var scene2 = new ScrollMagic.Scene({ duration:"150%",offset:"0"})
 
         var scene2 = new ScrollMagic.Scene({ duration:"150%",offset:"0"})
 
         .setPin("#productImage")
 
         .setPin("#productImage")
Line 255: Line 296:
 
                         //.addIndicators({name: "pinProduct"}) // add indicators (requires plugin)
 
                         //.addIndicators({name: "pinProduct"}) // add indicators (requires plugin)
 
                         .addTo(controller2);
 
                         .addTo(controller2);
−
       
+
 
 
         scene2.on("end", function (event) {
 
         scene2.on("end", function (event) {
 
     //alert("done");
 
     //alert("done");
 
});
 
});
 
         //.add(tweenTargetGroup)
 
         //.add(tweenTargetGroup)
−
         var tweenTargetGroup =TweenMax.to("#myVideo", 5000, {opacity:1});  
+
         var tweenTargetGroup =TweenMax.to("#myVideo", 5000, {opacity:1});
 
         var targetGroupTimeline = new TimelineMax().add(tweenTargetGroup);
 
         var targetGroupTimeline = new TimelineMax().add(tweenTargetGroup);
 
         var scene2 = new ScrollMagic.Scene({ duration:"100px",offset:"0"})
 
         var scene2 = new ScrollMagic.Scene({ duration:"100px",offset:"0"})
Line 268: Line 309:
 
                         //.addIndicators({name: "targetVideo"}) // add indicators (requires plugin)
 
                         //.addIndicators({name: "targetVideo"}) // add indicators (requires plugin)
 
                         .addTo(controller2);
 
                         .addTo(controller2);
−
       
+
 
 
     });
 
     });
−
   
+
 
−
     //  
+
     //
 
</script>
 
</script>
  
Line 326: Line 367:
 
   color: #fff;
 
   color: #fff;
 
   cursor: pointer;
 
   cursor: pointer;
−
   
+
 
 
}
 
}
  
Line 335: Line 376:
 
     </style>
 
     </style>
 
<video autoplay muted loop id="myVideo">
 
<video autoplay muted loop id="myVideo">
−
   <source src="https://www.videvo.net/videvo_files/converted/2014_08/preview/Gatwick_Airport_1Videvo_1.mov32092.webm" type="video/mp4">
+
   <!-- https://www.videvo.net/videvo_files/converted/2014_08/preview/Gatwick_Airport_1Videvo_1.mov32092.webm -->
 +
  <source src="https://2019.igem.org/wiki/images/d/d2/T--NYU_Abu_Dhabi--airport3_.mp4" type="video/mp4">
 
</video>
 
</video>
  
 
<div class="videoContent">
 
<div class="videoContent">
−
   <h1 class="videoContentText" style="text-align:center;font-size:7vw;height: 100%;  
+
   <h1 class="videoContentText" style="text-align:center;font-size:7vw;height: 100%;
 
     width:100%;
 
     width:100%;
 
     display:flex;
 
     display:flex;
Line 346: Line 388:
 
     color:white;
 
     color:white;
 
     font-family: Catamaran !important; font-weight: 200 !important;">REVOLUTIONIZING YOUR TRAVEL EXPERIENCE</h1>
 
     font-family: Catamaran !important; font-weight: 200 !important;">REVOLUTIONIZING YOUR TRAVEL EXPERIENCE</h1>
−
+
 
 
  </div></div>
 
  </div></div>
 
     <!-- End: TargetGroupVideo -->
 
     <!-- End: TargetGroupVideo -->
Line 356: Line 398:
 
             </div>
 
             </div>
 
             <div class="row text-center d-flex justify-content-center align-items-center">
 
             <div class="row text-center d-flex justify-content-center align-items-center">
−
                 <div class="col-md-12"> <h1 style="font-size:5vw;color:#fffbfe" >Meet Volatectica. A disease diagnostic device that works like magic. </h1><a class="btn btn-outline-warning btn-xl js-scroll-trigger" role="button" href="#download">pre order</a></div>
+
                 <div class="col-md-12"> <h1 style="font-size:5vw;color:#fffbfe" >Meet Volatect. A disease diagnostic device that works like magic. </h1><a class="btn btn-outline-warning btn-xl js-scroll-trigger" role="button" href="#download">pre order</a></div>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 
     <!-- End: mobileScreenProductHeader -->
 
     <!-- End: mobileScreenProductHeader -->
−
    <div data-aos="fade-down" data-aos-duration="500" data-aos-offset="200" class="d-block d-lg-none" style="background-color: #000000;">
 
−
        <!-- Start: TargetGroupVideoMobile --><div style="position:relative;background-color: #000000;background-image: url('assets/img/bg-pattern.png');height: 100%;">
 
−
    <style>
 
−
    #myVideoMobile {
 
−
        position:relative;
 
−
        z-index:0;
 
−
        width: 100%;
 
−
}
 
  
−
.videoContent {
+
<h1 class="text-center d-block d-lg-none"> REVOLUTIONIZING YOUR TRAVEL EXPERIENCE</h1>
−
     top:0;
+
     <video autoplay muted loop style="height:100%;width:100%;" class="d-block d-lg-none">
−
    bottom:0;
+
      <source src="https://2019.igem.org/wiki/images/d/d2/T--NYU_Abu_Dhabi--airport3_.mp4" type="video/mp4">
−
    margin:auto;
+
    </video>
−
    position:absolute;
+
 
−
    max-height:50%;
+
−
    left:0;
+
−
    z-index:1;
+
−
  background: rgba(0, 0, 0, 0.5);
+
−
  color: #f1f1f1;
+
−
  width: 100%;
+
−
  padding: 20px;
+
−
}
+
  
−
#myBtn {
 
−
  width: 200px;
 
−
  font-size: 18px;
 
−
  padding: 10px;
 
−
  border: none;
 
−
  background: #000;
 
−
  color: #fff;
 
−
  cursor: pointer;
 
−
   
 
−
}
 
  
−
#myBtn:hover {
 
−
  background: #ddd;
 
−
  color: black;
 
−
}
 
−
    </style>
 
−
<video autoplay muted loop id="myVideoMobile">
 
−
  <source src="https://www.videvo.net/videvo_files/converted/2014_08/preview/Gatwick_Airport_1Videvo_1.mov32092.webm" type="video/mp4">
 
−
</video>
 
  
−
<div class="videoContent">
+
    <div style="display:none;" data-aos="fade-down" data-aos-duration="500" data-aos-offset="200" class="d-block d-lg-none" style="background-color: #000000;">
−
  <h1 style="text-align:center;font-size:7vw;height: 100%;
+
        <!-- Start: TargetGroupVideoMobile -->
−
    width:100%;
+
        <div class="d-block d-lg-none" style="position:relative;background-color: #000000;background-image: url('assets/img/bg-pattern.png');height: 100%;">
−
    display:flex;
+
 
−
    align-items: center;
+
 
−
    justify-content: center;">REVOLUTIONIZING YOUR TRAVEL EXPERIENCE</h1>
+
</div>
−
+
−
</div></div>
+
 
         <!-- End: TargetGroupVideoMobile -->
 
         <!-- End: TargetGroupVideoMobile -->
 
     </div>
 
     </div>
 +
 
     <!-- Start: How does it work? -->
 
     <!-- Start: How does it work? -->
−
     <section id="volatectSteps" class="index-howto-alt py-3">
+
     <section style="display:none;" id="volatectSteps" class="index-howto-alt py-3 " >
−
         <div class="container" style="padding: 100px 0px;">
+
         <div class="container d-none d-lg-block" style="padding: 100px 0px; ">
 
             <h2 class="text-center mb-3">How does it work?</h2>
 
             <h2 class="text-center mb-3">How does it work?</h2>
 
             <div class="psd-line pos-rel" style="position:relative;">
 
             <div class="psd-line pos-rel" style="position:relative;">
Line 465: Line 472:
 
     <div></div>
 
     <div></div>
 
     <!-- Start: Features Desktop -->
 
     <!-- Start: Features Desktop -->
−
     <div id="engineeringbio" class="d-none d-lg-block" style="background-color: white;background-image: url(&quot;https://2019.igem.org/wiki/images/f/f3/T--NYU_Abu_Dhabi--bg-pattern.png&quot;);height: 300vh;width: 100%;"><div id="middleMarker"></div>
+
     <div id="engineeringbio" class="d-none d-lg-block" style="background-color: black;background-image: url(&quot;https://2019.igem.org/wiki/images/f/f3/T--NYU_Abu_Dhabi--bg-pattern.png&quot;);height: 500vh;width: 100%;"><div id="middleMarker"></div>
 
<div class="row " style="position:fixed;top:25%;width:100%;opacity:0;" id="featuresHeaderText">
 
<div class="row " style="position:fixed;top:25%;width:100%;opacity:0;" id="featuresHeaderText">
 
   <div style="width:100%;" class="col w-100 text-center">
 
   <div style="width:100%;" class="col w-100 text-center">
−
       <h1 style="color:white;font-size: 9vh;">State of the art Engineering and Biology</h1>
+
       <h1 style="color:white;font-size: 9vh;">State of the art <span style="color:#fdcc52">Engineering</span> and <span style="color:#fdcc52;">Biology</span></h1>
 
     </div>
 
     </div>
 
</div>
 
</div>
Line 515: Line 522:
 
   canvas.height = 800;
 
   canvas.height = 800;
 
   ctx = canvas.getContext("2d");
 
   ctx = canvas.getContext("2d");
−
 
+
 
−
 
+
 
 
   height = canvas.height;
 
   height = canvas.height;
 
   width = canvas.width;
 
   width = canvas.width;
Line 544: Line 551:
 
     var y1 = unit * Math.sin(x) + xAxis;
 
     var y1 = unit * Math.sin(x) + xAxis;
 
     var y2 = unit * Math.sin(-x) + xAxis;
 
     var y2 = unit * Math.sin(-x) + xAxis;
−
 
+
 
−
 
+
 
 
     ctx.moveTo(i, y1);
 
     ctx.moveTo(i, y1);
 
     ctx.lineTo(i, y2);
 
     ctx.lineTo(i, y2);
Line 555: Line 562:
 
function drawCircles(i, x, y1, y2) {
 
function drawCircles(i, x, y1, y2) {
 
   ctx.beginPath();
 
   ctx.beginPath();
−
   ctx.lineWidth = 0;  
+
   ctx.lineWidth = 0;
 
   ctx.arc(i, y1, ballWeight - Math.cos(x) * 6, 0, 2 * Math.PI);
 
   ctx.arc(i, y1, ballWeight - Math.cos(x) * 6, 0, 2 * Math.PI);
 
   ctx.fill();
 
   ctx.fill();
Line 573: Line 580:
  
 
</style>
 
</style>
−
 
+
 
 
     </div>
 
     </div>
 
     <div id="featureInfoHolder" class="col-sm-5 my-auto">
 
     <div id="featureInfoHolder" class="col-sm-5 my-auto">
 
     <h1 class="headingTextBioEngineering" style="font-size: 5vw;">Crispr</h1>
 
     <h1 class="headingTextBioEngineering" style="font-size: 5vw;">Crispr</h1>
−
     <p class="gradientText" style="font-size: 1.5vw;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
+
     <p class="gradientText" style="font-size: 1.5vw;">CRISPR (Clustered Regularly Interspaced Short Palindromic Repeats) is a genome-editing technology derived from the bacterial defense system strategy to cut the DNA of viruses and other invading bodies. The method we are utilizing, DETECTR, involves the use of CRISPR-Cas12a to accurately detect a DNA sequence and cut a fluorescent probe to release light upon detection.
−
        dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><button class="btn btn-primary" type="button">Learn more</button></div>
+
</p><button class="btn btn-primary engineeringbiobutton" type="button">Learn more</button></div>
 
</div>
 
</div>
  
Line 595: Line 602:
 
   width: 50%
 
   width: 50%
 
}
 
}
−
</style>  
+
</style>
 
<svg id="microfluidics" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1560 400" enable-background="new 0 0 1560 400" xml:space="preserve">
 
<svg id="microfluidics" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1560 400" enable-background="new 0 0 1560 400" xml:space="preserve">
−
   
+
 
 
<pattern  width="304" height="304" patternUnits="userSpaceOnUse" id="New_Pattern" viewBox="0 -304 304 304" overflow="visible">
 
<pattern  width="304" height="304" patternUnits="userSpaceOnUse" id="New_Pattern" viewBox="0 -304 304 304" overflow="visible">
 
     <g>
 
     <g>
 
         <rect y="-304" fill="none" width="304" height="304"/>
 
         <rect y="-304" fill="none" width="304" height="304"/>
−
   
+
 
 
         <style type="text/css">
 
         <style type="text/css">
 
             .ic-path {
 
             .ic-path {
Line 771: Line 778:
 
<rect fill="url(#New_Pattern)" width="1560" height="400"/>
 
<rect fill="url(#New_Pattern)" width="1560" height="400"/>
 
       </svg></div><div id="" class="col-sm-5 my-auto">
 
       </svg></div><div id="" class="col-sm-5 my-auto">
−
     <h1 class="headingTextBioEngineering" style="font-size: 5vw;">Microfluidics</h1>
+
     <h1 class="headingTextBioEngineering" style="font-size: 5vw;font-family:avenir">Microfluidics</h1>
−
     <p class="gradientText" style="font-size: 1.5vw;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
+
     <p class="gradientText" style="font-size: 1.5vw;">
−
        dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><button class="btn btn-primary" type="button">Learn more</button></div>
+
Microfluidics unites the reliability of lab tests with the  integrated efficiency of a printed circuit board. It tackles the challenges of controlling fluid flow in micromillimeters sized channel geometries and facilitating complex on-chip biological protocols both spatially and temporally. In accordance with the international trends of integrating technologies to ensure reliable use, scalability and user availability, Volatect's chip is the result of improving multiple iterations on iGEM's diagnostics track over the years and a pursuit of high standards both in signal quality and chemical contamination prevention.
 +
    </p><button class="btn btn-primary engineeringbiobutton" type="button">Learn more</button></div>
 
</div>
 
</div>
  
Line 779: Line 787:
 
<div class="row" style="position:fixed;top:25%;opacity:0;" id="webapiHolder">
 
<div class="row" style="position:fixed;top:25%;opacity:0;" id="webapiHolder">
 
   <div id="featureHolder" class="col-sm-6 my-auto">
 
   <div id="featureHolder" class="col-sm-6 my-auto">
−
 
+
 
 
     <style>
 
     <style>
 
     #map {
 
     #map {
Line 788: Line 796:
 
}
 
}
 
circle {
 
circle {
−
   fill: blue;
+
   fill: #fdcc52;
 
}
 
}
 
/* circle, */
 
/* circle, */
 
.banaan {
 
.banaan {
 
   fill: #00FF00;
 
   fill: #00FF00;
−
   box-shadow: 0 0 0 0 rgba(232, 76, 61, 0.7);
+
   border-radius: 25px;
−
   border-radius: 50%;
+
   animation: blinker 1s linear infinite;
 
}
 
}
 +
 
.banaan2 {
 
.banaan2 {
 
   fill: red;
 
   fill: red;
−
   box-shadow: 0 0 0 0 rgba(232, 76, 61, 0.7);
+
   border-radius: 25px;
−
   border-radius: 50%;
+
   animation: blinker 1s linear infinite;
 
}
 
}
 +
  
 
@keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
 
@keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
Line 806: Line 816:
 
@keyframes crescendo {
 
@keyframes crescendo {
 
   0%  {transform: scale(.8);}
 
   0%  {transform: scale(.8);}
−
   100% {transform: scale(100);}
+
   100% {transform: scale(500);}
 +
}
 +
@keyframes blinker {
 +
  50% {
 +
    opacity: 0;
 +
  }
 
}
 
}
 
</style>
 
</style>
Line 3,433: Line 3,448:
  
 
<script>
 
<script>
−
     $(function () {  
+
     $(function () {
 
     setRandomClass();
 
     setRandomClass();
 
setInterval(function () {
 
setInterval(function () {
Line 3,444: Line 3,459:
 
     var number = items.length;
 
     var number = items.length;
  
−
   
+
 
 
   //alert("yolo");
 
   //alert("yolo");
 
     items.removeClass("banaan");
 
     items.removeClass("banaan");
 
     items.removeClass("banaan2");
 
     items.removeClass("banaan2");
 +
    items.attr("r","1.9");
 
   for(x=0;x<Math.random() * 25;x++){
 
   for(x=0;x<Math.random() * 25;x++){
 
     var random = Math.floor((Math.random() * number));
 
     var random = Math.floor((Math.random() * number));
 
       var random2 = Math.floor((Math.random() * 10));
 
       var random2 = Math.floor((Math.random() * 10));
 
       if(random2<7) {
 
       if(random2<7) {
 +
  items.eq(random).attr("r","4");
 
   items.eq(random).addClass("banaan");
 
   items.eq(random).addClass("banaan");
 
       } else {
 
       } else {
 +
        items.eq(random).attr("r","4");
 
           items.eq(random).addClass("banaan2");
 
           items.eq(random).addClass("banaan2");
 
       }
 
       }
−
   
+
 
 
   }
 
   }
  
Line 3,463: Line 3,481:
 
     </div><div id="featureInfoHolder" class="col-sm-5 my-auto">
 
     </div><div id="featureInfoHolder" class="col-sm-5 my-auto">
 
     <h1 class="headingTextBioEngineering" style="font-size: 5vw;">WEB API</h1>
 
     <h1 class="headingTextBioEngineering" style="font-size: 5vw;">WEB API</h1>
−
     <p class="gradientText" style="font-size: 1.5vw;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
+
     <p class="gradientText" style="font-size: 1.5vw;">
−
        dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><button class="btn btn-primary" type="button">Learn more</button></div>
+
      An API (Application Programming Interface) simply put is a way for applications to communicate with each other. The Volatect API is intended to be used by medical researchers. We believe that the data that comes out of air travel disease reports from our device could help immensely in the analysis and prediction of outbreaks around the world as we provide disease diagnosis in relation to the nationality and the flight path of the passengers.
 +
    </p><button class="btn btn-primary engineeringbiobutton" type="button">Learn more</button></div>
  
 
</div>
 
</div>
−
   
+
 
 
         <!-- Start: Fade2Black -->
 
         <!-- Start: Fade2Black -->
 
<style>
 
<style>
 
     @import "compass/css3";
 
     @import "compass/css3";
 
     .headingTextBioEngineering {
 
     .headingTextBioEngineering {
−
         color:white;
+
         color:#fdcc52;
 
     }
 
     }
 
.gradientText {
 
.gradientText {
 
font-size: 2vw;
 
font-size: 2vw;
 
   background: #8A2387;
 
   background: #8A2387;
−
   background: -webkit-linear-gradient(to right, #1E90FF, #00BFFF, #1E90FF);
+
   background: -webkit-linear-gradient(to right, #C8C8C8 , #FFFFFF, #C8C8C8 );
−
   background: linear-gradient(to right, #1E90FF, #00BFFF, #1E90FF);  
+
   background: linear-gradient(to right,#C8C8C8 , #FFFFFF, #C8C8C8);
−
 
+
 
 
   -webkit-background-clip: text;
 
   -webkit-background-clip: text;
−
 
+
 
 
   color: transparent;
 
   color: transparent;
 
}
 
}
 
     #engineeringbio {
 
     #engineeringbio {
 
         opacity:0;
 
         opacity:0;
 +
    }
 +
    .engineeringbiobutton {
 +
      background:black;
 +
      border-color:#fdcc52;
 +
      display:none;
 
     }
 
     }
 
</style><script>
 
</style><script>
−
   
+
 
−
     $(function () {  
+
     $(function () {
 
         var controller3 = new ScrollMagic.Controller();
 
         var controller3 = new ScrollMagic.Controller();
 
         var tweenFadeIn = TweenMax.to("#engineeringbio", 1, {backgroundColor:"black",opacity:1});
 
         var tweenFadeIn = TweenMax.to("#engineeringbio", 1, {backgroundColor:"black",opacity:1});
 +
        var fadeoutvideo = TweenMax.to("#myVideo", 1, {opacity:"0"});
 
         var tweenStepsFadeIn = TweenMax.to("#volatectSteps", 1, {backgroundColor:"black"});
 
         var tweenStepsFadeIn = TweenMax.to("#volatectSteps", 1, {backgroundColor:"black"});
 
         var tweenRotate = TweenMax.to("#canvas-container", 1, {scale:"0.9",rotation:0});
 
         var tweenRotate = TweenMax.to("#canvas-container", 1, {scale:"0.9",rotation:0});
 
         var tweenMicro =TweenMax.to("#microfluidics", 1, {scale:"1.5"});          //volatectSteps
 
         var tweenMicro =TweenMax.to("#microfluidics", 1, {scale:"1.5"});          //volatectSteps
 
       // var tween2 = TweenMax.to("#productImage", 1000, {rotation:"360"});
 
       // var tween2 = TweenMax.to("#productImage", 1000, {rotation:"360"});
−
         var timelineProductAnimation2 = new TimelineMax().add(tweenStepsFadeIn,"f").add(tweenFadeIn,"f").add(tweenRotate,"f").add(tweenMicro,"f");
+
         var timelineProductAnimation2 = new TimelineMax().add(fadeoutvideo,"f").add(tweenRotate,"f").add(tweenMicro,"f");
 
         var sceneBack = new ScrollMagic.Scene({ duration:"200px",offset:"0"})
 
         var sceneBack = new ScrollMagic.Scene({ duration:"200px",offset:"0"})
 
         .triggerElement("#engineeringbio")
 
         .triggerElement("#engineeringbio")
Line 3,503: Line 3,528:
 
                         .addTo(controller3);
 
                         .addTo(controller3);
 
     });
 
     });
−
   
+
 
−
   
+
 
 
</script>
 
</script>
  
 
         <!-- End: Fade2Black -->
 
         <!-- End: Fade2Black -->
 
         <!-- Start: ScrollFeatures --><script>
 
         <!-- Start: ScrollFeatures --><script>
−
   
+
 
−
     $(function () {  
+
     $(function () {
 
         $("#featuresHeaderText").css("display", "none");
 
         $("#featuresHeaderText").css("display", "none");
 
         $("#middleFeatureContainer").css("display", "none");
 
         $("#middleFeatureContainer").css("display", "none");
 
         $("#microfluidicsContainer").css("display", "none");
 
         $("#microfluidicsContainer").css("display", "none");
 
         $("#webapiHolder").css("display", "none");
 
         $("#webapiHolder").css("display", "none");
−
       
+
 
 
         var controller4 = new ScrollMagic.Controller();
 
         var controller4 = new ScrollMagic.Controller();
 
         var timelineFeatures = new TimelineMax()
 
         var timelineFeatures = new TimelineMax()
−
         .add(TweenMax.to("#featuresHeaderText", 50, {opacity:1,top:"45%"}))
+
         .add(TweenMax.to("#featuresHeaderText", 20, {opacity:1,top:"35%"}))
−
         .add(TweenMax.to("#featuresHeaderText", 50, {opacity:0,top:"35%"}),"q")
+
         .add(TweenMax.to("#featuresHeaderText", 20, {opacity:0,top:"35%"}))
 
         .add(TweenMax.to("#featuresHeaderText", 1, {display:"none"}))
 
         .add(TweenMax.to("#featuresHeaderText", 1, {display:"none"}))
 
         .add(TweenMax.to("#middleFeatureContainer", 50, {opacity:1,top:"7%"}),"q")
 
         .add(TweenMax.to("#middleFeatureContainer", 50, {opacity:1,top:"7%"}),"q")
Line 3,530: Line 3,555:
 
         .add(TweenMax.to("#webapiHolder", 10, {opacity:0,display:"none"}),"last")
 
         .add(TweenMax.to("#webapiHolder", 10, {opacity:0,display:"none"}),"last")
 
         .add(TweenMax.to("#webapiHolder", 1, {display:"none"}))
 
         .add(TweenMax.to("#webapiHolder", 1, {display:"none"}))
−
       
+
 
 
         //microfluidicsContainer webapiHolder
 
         //microfluidicsContainer webapiHolder
−
         var sceneBack2 = new ScrollMagic.Scene({ duration:"300%",offset:0})
+
         var sceneBack2 = new ScrollMagic.Scene({ duration:"500%",offset:0})
 
         .setTween(timelineFeatures)
 
         .setTween(timelineFeatures)
 
         .triggerElement("#engineeringbio")
 
         .triggerElement("#engineeringbio")
Line 3,557: Line 3,582:
 
                         .addTo(controller4);
 
                         .addTo(controller4);
 
     });
 
     });
−
   
+
 
−
   
+
 
 
</script>
 
</script>
  
Line 3,565: Line 3,590:
 
     <!-- End: Features Desktop -->
 
     <!-- End: Features Desktop -->
 
     <!-- Start: Features Mobile --><section id="features" class="features d-block d-lg-none" style=" background:url('assets/img/bg-pattern.png'), linear-gradient(to left, #cecccc, #fdfffc, #fdfffc, #cecccc);">
 
     <!-- Start: Features Mobile --><section id="features" class="features d-block d-lg-none" style=" background:url('assets/img/bg-pattern.png'), linear-gradient(to left, #cecccc, #fdfffc, #fdfffc, #cecccc);">
−
   
+
 
−
 
+
 
 
     <div class="container">
 
     <div class="container">
 
         <div class="section-heading text-center">
 
         <div class="section-heading text-center">
 
             <h2 style="">State-of-the-art Biology and Engineering</h2>
 
             <h2 style="">State-of-the-art Biology and Engineering</h2>
−
            <p class="text-muted">bla bla bla</p>
+
 
 
             <hr />
 
             <hr />
 
         </div>
 
         </div>
 
         <div class="row">
 
         <div class="row">
−
            <div class="col-lg-4 my-auto">
+
 
−
                <div class="device-container">
+
−
                    <div class="Push-20"></div><img class="img-fluid" src="assets/img/bargraphrgb_p.png" /></div>
+
−
            </div>
+
 
             <div class="col-lg-8 my-auto">
 
             <div class="col-lg-8 my-auto">
 
                 <div class="container-fluid">
 
                 <div class="container-fluid">
 
                     <div class="row">
 
                     <div class="row">
 
                         <div class="col-lg-6">
 
                         <div class="col-lg-6">
−
                             <div class="feature-item" style=""><img src="assets/img/Crispr.gif.gif" class="img-fluid"/></i>
+
                             <div class="feature-item" style=""><img src="https://2019.igem.org/wiki/images/e/e9/T--NYU_Abu_Dhabi--crispranimation.gif" class="img-fluid"/></i>
 
                                 <h3>CRISPR</h3>
 
                                 <h3>CRISPR</h3>
−
                                 <p class="text-muted">We use Crispr in order to target specific genes. Bla bla</p><button class="btn btn-primary" data-toggle="modal" data-target="#crisprInfo" type="button">Learn More</button></div>
+
                                 <p class="text-muted">
−
                            <div class="Push-20"></div>
+
                                  CRISPR technology is a simple yet powerful tool for editing genomes. It allows researchers to easily alter DNA sequences and modify gene function. Its many potential applications include correcting genetic defects, treating and preventing
−
                        </div>
+
                                      the spread of diseases and improving crops. However, its promise also raises ethical concerns.In popular usage, "CRISPR" (pronounced "crisper") is shorthand for "CRISPR-Cas9." CRISPRs are specialized stretches of DNA. The protein
−
                        <div class="col-lg-6">
+
                                      Cas9 (or "CRISPR-associated") is an enzyme that acts like a pair of molecular scissors, capable of cutting strands of DNA.
−
                            <div class="feature-item" style=""><i class="icon-camera text-primary"></i>
+
                                 </p></div>
−
                                 <h3>RPA / LAMP</h3>
+
−
                                <p class="text-muted">Fluoresence is what we use to decide what the</p><button class="btn btn-primary" data-toggle="modal" data-target="#crisprInfo" type="button">Learn More</button></div>
+
 
                             <div class="Push-20"></div>
 
                             <div class="Push-20"></div>
 
                         </div>
 
                         </div>
 
                         <div class="col-lg-6">
 
                         <div class="col-lg-6">
−
                             <div class="feature-item" style=""><i class="fa fa-bolt text-primary"></i>
+
                             <div class="feature-item" style="">
−
                                 <h3>DEP</h3>
+
                              <img src="https://2019.igem.org/wiki/images/a/a7/T--NYU_Abu_Dhabi--microfluidicsmobile.gif" class="img-fluid" />
−
                                 <p class="text-muted">Di Electric Bla bla force used to do ___</p><button class="btn btn-primary" data-toggle="modal" data-target="#crisprInfo" type="button">Learn More</button></div>
+
                            </i>
 +
                                 <h3>Microfluidics</h3>
 +
                                 <p class="text-muted">
 +
Microfluidics unites the reliability of lab tests with the  integrated efficiency of a printed circuit board. It tackles the challenges of controlling fluid flow in micromillimeters sized channel geometries and facilitating complex on-chip biological protocols both spatially and temporally.  In accordance with the international trends of integrating technologies to ensure reliable use, scalability and user availability, Volatect's chip is the result of improving multiple iterations on iGEM's diagnostics track over the years and a pursuit of high standards both in signal quality and chemical contamination prevention.
 +
                                </p></div>
 
                             <div class="Push-20"></div>
 
                             <div class="Push-20"></div>
 
                         </div>
 
                         </div>
 
                         <div class="col-lg-6">
 
                         <div class="col-lg-6">
−
                             <div class="feature-item" style=""><i class="icon-graph text-primary"></i>
+
                             <div class="feature-item" style=""><img src="https://2019.igem.org/wiki/images/1/10/T--NYU_Abu_Dhabi--webapimob.gif" class="img-fluid" /></i>
−
                                 <h3>Machine Learning</h3>
+
                                 <h3>Volatect API</h3>
−
                                 <p class="text-muted">We use machine learning models to make accurate deductions on data.</p><button class="btn btn-primary" data-toggle="modal" data-target="#crisprInfo" type="button">Learn More</button></div>
+
                                 <p class="text-muted">
 +
We built a WEB API that allows secure access to the data we collect using our device. Medical researchers can now use the data we collect from passengers in airports to predict and report disease outbreaks before they happen.&nbsp;
 +
                                </p></div>
 
                             <div class="Push-20"></div>
 
                             <div class="Push-20"></div>
 
                         </div>
 
                         </div>
Line 3,613: Line 3,639:
 
     <!-- End: Features Mobile -->
 
     <!-- End: Features Mobile -->
 
     <!-- Start: WEB API MOBILE -->
 
     <!-- Start: WEB API MOBILE -->
−
    <div data-aos="flip-up" class="d-block d-lg-none" style="background-color: black;padding: 20px;"><script>
+
<div style="display:none;"></div>
−
    const sleep = (milliseconds) => {
+
−
  return new Promise(resolve => setTimeout(resolve, milliseconds))
+
−
}
+
−
setCodeTextAreas = (request,response) => {
+
−
  document.getElementById("apirequest").innerText=request;
+
−
document.getElementById("apiresponse").innerText=response;
+
−
}
+
−
loadTextArea = (request,response) => {
+
−
    seconds=Math.floor(Math.random() * (2000 - 100 + 1)) + 100;
+
−
    setCodeTextAreas(request,"-LOADING-");
+
−
    showLoader();
+
−
    sleep(seconds).then(() => {
+
−
setCodeTextAreas(request,response);
+
−
        hideLoader();
+
−
})
+
−
}
+
−
hideLoader = () => {
+
−
    var link = document.getElementById('loaderImage');
+
−
link.style.visibility = 'hidden';
+
−
}
+
−
showLoader = () => {
+
−
    var link = document.getElementById('loaderImage');
+
−
link.style.visibility = 'visible';
+
−
}
+
−
generalCall = () => {
+
−
  loadTextArea("{Request: all}","{ { \"Disease\":\"HIV\",\r\n  \"fluorescencePositiveMin\":30,\r\n  \"fluorescencePositiveDanger\":40,\r\n  \"datapoints\": {\r\n    \"noOfDatapoints\":5000,\r\n    \"errorVal\":\"40\",\r\n    }\r\n}, { \"Disease\":\"Ebola\",\r\n  \"fluorescencePositiveMin\":20,\r\n  \"fluorescencePositiveDanger\":25,\r\n  \"datapoints\": {\r\n    \"noOfDatapoints\":3500,\r\n    \"errorVal\":\"30\",\r\n    }\r\n}");
+
−
 
+
−
}
+
−
HIVPositive = () => {
+
−
  loadTextArea("{Request: { disease: \"HIV\", intensity : 32 } }","{Response:{ HIV: true , Danger: false}}");
+
−
}
+
−
HIVNegative = () => {
+
−
  loadTextArea("{Request: { disease: \"HIV\", intensity : 20 } }","{Response:{ HIV: false , Danger: false}}");
+
−
}
+
−
HIVDanger = () => {
+
−
  loadTextArea("{Request: { intensity : 46 } }","{Response:{ HIV: false, Danger: true}}");
+
−
}
+
−
</script>
+
−
        <div class="row">
+
−
            <div class="col-md-12">
+
−
                <h1 class="text-center" style="width: 100%;color: rgb(255,255,255);">Web API</h1>
+
−
                <p class="lead text-center" style="width: 100%;min-width: 100%;color: rgb(255,255,255);font-size: 18px;">We built a WEB API that allows secure access to the data we collect using our device. Medical researchers can now use the data we collect from passengers in airports to predict and report disease outbreaks before they happen.&nbsp;</p>
+
−
                <!-- Start: Juvi - Push Empty Space 20px -->
+
−
                <div class="Push-20"></div>
+
−
                <!-- End: Juvi - Push Empty Space 20px -->
+
−
                <!-- Start: Juvi - Push Empty Space 20px -->
+
−
                <div class="Push-20"></div>
+
−
                <!-- End: Juvi - Push Empty Space 20px --><img src="assets/img/built-on-heroku-light.svg" style="width: 300px;"><img src="assets/img/kisspng-postgresql-clip-art-database-logo-web-design-strategy-relik-5b67d8468fcf82.2394477615335322305891.jpg" style="width: 100px;"></div>
+
−
        </div>
+
−
        <div class="row d-none">
+
−
            <div class="col-md-4 d-xl-flex justify-content-xl-center align-items-xl-center" style="padding: 20px;"><div class="dropdown d-flex justify-content-center" style="padding:10px;"><button  class="btn btn-primary dropdown-toggle d-xl-flex justify-content-xl-center align-items-xl-center" data-toggle="dropdown" aria-expanded="false" type="button">Select Request </button>
+
−
    <div role="menu" class="dropdown-menu"><a role="presentation" class="dropdown-item" onclick="generalCall()">General Request</a><a role="presentation" class="dropdown-item" onclick="HIVPositive();">HIV Positive Call</a><a role="presentation" class="dropdown-item" onclick="HIVNegative();">HIV Negative Call</a><a role="presentation" class="dropdown-item" onclick="HIVDanger();">HIV Positive Danger Call</a></div>
+
−
</div><div class="dropdown d-flex justify-content-center"><img class="img-fluid text-center" style="visibility:hidden;" id="loaderImage" src="assets/img/loading.svg" /></div></div>
+
−
            <div class="col-md-4 d-flex d-xl-flex justify-content-center justify-content-xl-center" style="padding: 10px;"><textarea class="border rounded shadow-lg" id="apirequest" readonly="" style="height: 250px;width: 100%;font-size: 18px;" placeholder="Request Call "></textarea></div>
+
−
            <div class="col d-flex d-xl-flex justify-content-center justify-content-xl-center"
+
−
                style="padding: 10px;"><textarea class="border rounded shadow-lg" id="apiresponse" readonly="" style="height: 250px;width: 100%;font-size: 18px;" placeholder="Response JSON"></textarea></div>
+
−
        </div>
+
−
    </div>
+
 
     <!-- End: WEB API MOBILE -->
 
     <!-- End: WEB API MOBILE -->
 
     <section id="socialContainer" class="contact" style="background-color: #fdfffc;">
 
     <section id="socialContainer" class="contact" style="background-color: #fdfffc;">
Line 3,677: Line 3,645:
 
             <h2><span>We&nbsp;</span><i class="fa fa-heart" id="heart_icon"></i><span>&nbsp;new friends!</span></h2>
 
             <h2><span>We&nbsp;</span><i class="fa fa-heart" id="heart_icon"></i><span>&nbsp;new friends!</span></h2>
 
             <ul class="list-inline list-social">
 
             <ul class="list-inline list-social">
−
                 <li class="list-inline-item social-twitter"><a href="#"><i class="fa fa-twitter"></i></a></li>
+
                 <li class="list-inline-item social-youtube"><a href="https://www.youtube.com/channel/UCQnySAKw67slX8T6r9bAcYw"><img src="https://2019.igem.org/wiki/images/9/91/T--NYU_Abu_Dhabi--_ytcircle.svg" width="80" height="80" ></a></li>
−
                 <li class="list-inline-item social-facebook"><a href="#"><i class="fa fa-facebook"></i></a></li>
+
                 <li class="list-inline-item social-instagram"><a href="https://www.instagram.com/igem_nyuad/"><img src="https://2019.igem.org/wiki/images/3/3a/T--NYU_Abu_Dhabi--igicon.png" width="80" height="80"></a></li>
−
                 <li class="list-inline-item social-google-plus"><a href="#"><i class="fa fa-google-plus"></i></a></li>
+
                 <li class="list-inline-item social-facebook"><a href="https://www.facebook.com/iGEMNYUAD/"><img src="https://2019.igem.org/wiki/images/thumb/2/2e/T--NYU_Abu_Dhabi--fblogo.png/240px-T--NYU_Abu_Dhabi--fblogo.png" width="80" height="80"></a></li>
 
             </ul>
 
             </ul>
 
         </div>
 
         </div>
Line 3,687: Line 3,655:
 
         <!-- Start: HeartAnimation -->
 
         <!-- Start: HeartAnimation -->
 
<script>
 
<script>
−
   
+
 
−
     $(function () {  
+
     $(function () {
 
         var controller5 = new ScrollMagic.Controller();
 
         var controller5 = new ScrollMagic.Controller();
−
     
+
 
 
         var rotateHeart = new TimelineMax()
 
         var rotateHeart = new TimelineMax()
 
         .add(TweenMax.to("#heart_icon", 50, {rotation:180}),"up")
 
         .add(TweenMax.to("#heart_icon", 50, {rotation:180}),"up")
Line 3,696: Line 3,664:
 
         .add(TweenMax.to("#heart_icon", 50, {rotation:360}),"down")
 
         .add(TweenMax.to("#heart_icon", 50, {rotation:360}),"down")
 
         .add(TweenMax.to("#heart_icon", 50, {y:0}),"down")
 
         .add(TweenMax.to("#heart_icon", 50, {y:0}),"down")
−
       
+
 
 
         //microfluidicsContainer webapiHolder
 
         //microfluidicsContainer webapiHolder
 
         var sceneHeart = new ScrollMagic.Scene({ duration:"100px",offset:"50px"})
 
         var sceneHeart = new ScrollMagic.Scene({ duration:"100px",offset:"50px"})
Line 3,702: Line 3,670:
 
         .triggerElement("#socialContainer")
 
         .triggerElement("#socialContainer")
 
       //.setPin("#middleFeatureContainer")
 
       //.setPin("#middleFeatureContainer")
−
                         //.addIndicators({name: "heart"})  
+
                         //.addIndicators({name: "heart"})
 
                         .addTo(controller5)
 
                         .addTo(controller5)
 
         .on("start", ()=> {
 
         .on("start", ()=> {
Line 3,710: Line 3,678:
 
         });
 
         });
 
     });
 
     });
−
   
+
 
−
   
+
 
 
</script>
 
</script>
 
         <!-- End: HeartAnimation -->
 
         <!-- End: HeartAnimation -->
Line 3,722: Line 3,690:
 
       filter: gray; /* IE5+ */
 
       filter: gray; /* IE5+ */
 
       -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */
 
       -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */
−
       -webkit-transition: all .1s ease-in-out;
+
       -webkit-transition: all .1s ease-in-out;
−
     
+
 
 
     }
 
     }
  
Line 3,731: Line 3,699:
 
       -webkit-filter: grayscale(0);
 
       -webkit-filter: grayscale(0);
 
       -webkit-transform: scale(1.01);
 
       -webkit-transform: scale(1.01);
−
     
+
 
−
     
+
 
 
     }
 
     }
 
     .mobile-space {
 
     .mobile-space {
Line 3,752: Line 3,720:
  
 
                 <div class="col-md-3 col-xl-2 d-xl-flex justify-content-xl-center align-items-xl-center"><img class="img-fluid sponsor-logo" src="https://2019.igem.org/wiki/images/thumb/a/a5/T--NYU_Abu_Dhabi--NYU-logo.png/800px-T--NYU_Abu_Dhabi--NYU-logo.png"></div><div class="col-xl-2 d-lg-none mobile-space" ></div>
 
                 <div class="col-md-3 col-xl-2 d-xl-flex justify-content-xl-center align-items-xl-center"><img class="img-fluid sponsor-logo" src="https://2019.igem.org/wiki/images/thumb/a/a5/T--NYU_Abu_Dhabi--NYU-logo.png/800px-T--NYU_Abu_Dhabi--NYU-logo.png"></div><div class="col-xl-2 d-lg-none mobile-space" ></div>
 +
 +
                <div class="col-md-3 col-xl-2 d-xl-flex justify-content-xl-center align-items-xl-center"><img class="img-fluid sponsor-logo" src="https://2019.igem.org/wiki/images/0/06/T--NYU_Abu_Dhabi--3mlogo.png"></div><div class="col-xl-2 d-lg-none mobile-space" ></div>
 +
 +
                <div class="col-md-3 col-xl-2 d-xl-flex justify-content-xl-center align-items-xl-center"><img class="img-fluid sponsor-logo" src="https://2019.igem.org/wiki/images/c/c6/T--NYU_Abu_Dhabi--ansyslogo.png"></div><div class="col-xl-2 d-lg-none mobile-space" ></div>
 +
 +
                <div class="col-md-3 col-xl-2 d-xl-flex justify-content-xl-center align-items-xl-center"><img class="img-fluid sponsor-logo" src="https://2019.igem.org/wiki/images/0/0a/T--NYU_Abu_Dhabi--jklogo.png"></div><div class="col-xl-2 d-lg-none mobile-space" ></div>
 +
 +
                <div class="col-md-3 col-xl-2 d-xl-flex justify-content-xl-center align-items-xl-center"><img class="img-fluid sponsor-logo" src="https://2019.igem.org/wiki/images/e/ee/T--NYU_Abu_Dhabi--snapgenelogo.png"></div><div class="col-xl-2 d-lg-none mobile-space" ></div>
 +
 +
  
 
             </div>
 
             </div>
Line 3,759: Line 3,737:
 
     <footer style="background-color: white; color:black;" class="text-center">
 
     <footer style="background-color: white; color:black;" class="text-center">
 
         <div class="container">
 
         <div class="container">
−
             <p class="text-center">©&nbsp;Pathogenie 2019. All Rights Reserved.</p>
+
             <p class="text-center">©&nbsp;Volatect 2019. All Rights Reserved.</p>
−
            <ul class="list-inline" style="color:black;">
+
−
                <li class="list-inline-item"><a href="#" style="color:black;">Privacy</a></li>
+
−
                <li class="list-inline-item"><a href="#" style="color:black;">Terms</a></li>
+
−
                <li class="list-inline-item"><a href="#" style="color:black;">FAQ</a></li>
+
−
            </ul>
+
 
         </div>
 
         </div>
 
     </footer>
 
     </footer>
Line 3,785: Line 3,758:
 
     </div>
 
     </div>
 
     <!-- Start: SmoothWheel Integration --> <script>
 
     <!-- Start: SmoothWheel Integration --> <script>
−
       $(function(){
+
       /*$(function(){
−
   
+
 
 
     var $window = $(window);        //Window object
 
     var $window = $(window);        //Window object
−
   
+
 
 
     var scrollTime = 1.5;          //Scroll time
 
     var scrollTime = 1.5;          //Scroll time
 
     var scrollDistance = 200;      //Distance. Use smaller value for shorter scroll and greater value for longer scroll
 
     var scrollDistance = 200;      //Distance. Use smaller value for shorter scroll and greater value for longer scroll
−
       
+
 
 
     $window.on("mousewheel DOMMouseScroll", function(event){
 
     $window.on("mousewheel DOMMouseScroll", function(event){
−
       
+
 
−
         event.preventDefault();  
+
         event.preventDefault();
−
                                       
+
 
         var delta = event.originalEvent.wheelDelta/120 || -event.originalEvent.detail/3;
 
         var delta = event.originalEvent.wheelDelta/120 || -event.originalEvent.detail/3;
 
         var scrollTop = $window.scrollTop();
 
         var scrollTop = $window.scrollTop();
 
         var finalScroll = scrollTop - parseInt(delta*scrollDistance);
 
         var finalScroll = scrollTop - parseInt(delta*scrollDistance);
−
           
+
 
 
         TweenMax.to($window, scrollTime, {
 
         TweenMax.to($window, scrollTime, {
 
             scrollTo : { y: finalScroll, autoKill:true },
 
             scrollTo : { y: finalScroll, autoKill:true },
 
                 ease: Power1.easeOut,  //For more easing functions see https://api.greensock.com/js/com/greensock/easing/package-detail.html
 
                 ease: Power1.easeOut,  //For more easing functions see https://api.greensock.com/js/com/greensock/easing/package-detail.html
 
                 autoKill: true,
 
                 autoKill: true,
−
                 overwrite: 5                          
+
                 overwrite: 5
 
             });
 
             });
−
                   
+
 
 
     });
 
     });
−
   
+
 
−
});
+
});*/
 
     </script>
 
     </script>
 
     <!-- End: SmoothWheel Integration -->
 
     <!-- End: SmoothWheel Integration -->

Latest revision as of 03:18, 22 October 2019

Volatect

Meet Volatect. Flying safe starts by flying healthy.


REVOLUTIONIZING YOUR TRAVEL EXPERIENCE

Meet Volatect. A disease diagnostic device that works like magic. 

pre order

REVOLUTIONIZING YOUR TRAVEL EXPERIENCE

State of the art Engineering and Biology

Crispr

CRISPR (Clustered Regularly Interspaced Short Palindromic Repeats) is a genome-editing technology derived from the bacterial defense system strategy to cut the DNA of viruses and other invading bodies. The method we are utilizing, DETECTR, involves the use of CRISPR-Cas12a to accurately detect a DNA sequence and cut a fluorescent probe to release light upon detection.

Microfluidics

Microfluidics unites the reliability of lab tests with the integrated efficiency of a printed circuit board. It tackles the challenges of controlling fluid flow in micromillimeters sized channel geometries and facilitating complex on-chip biological protocols both spatially and temporally. In accordance with the international trends of integrating technologies to ensure reliable use, scalability and user availability, Volatect's chip is the result of improving multiple iterations on iGEM's diagnostics track over the years and a pursuit of high standards both in signal quality and chemical contamination prevention.

WEB API

An API (Application Programming Interface) simply put is a way for applications to communicate with each other. The Volatect API is intended to be used by medical researchers. We believe that the data that comes out of air travel disease reports from our device could help immensely in the analysis and prediction of outbreaks around the world as we provide disease diagnosis in relation to the nationality and the flight path of the passengers.

State-of-the-art Biology and Engineering

CRISPR

CRISPR technology is a simple yet powerful tool for editing genomes. It allows researchers to easily alter DNA sequences and modify gene function. Its many potential applications include correcting genetic defects, treating and preventing the spread of diseases and improving crops. However, its promise also raises ethical concerns.In popular usage, "CRISPR" (pronounced "crisper") is shorthand for "CRISPR-Cas9." CRISPRs are specialized stretches of DNA. The protein Cas9 (or "CRISPR-associated") is an enzyme that acts like a pair of molecular scissors, capable of cutting strands of DNA.

Microfluidics

Microfluidics unites the reliability of lab tests with the integrated efficiency of a printed circuit board. It tackles the challenges of controlling fluid flow in micromillimeters sized channel geometries and facilitating complex on-chip biological protocols both spatially and temporally. In accordance with the international trends of integrating technologies to ensure reliable use, scalability and user availability, Volatect's chip is the result of improving multiple iterations on iGEM's diagnostics track over the years and a pursuit of high standards both in signal quality and chemical contamination prevention.

Volatect API

We built a WEB API that allows secure access to the data we collect using our device. Medical researchers can now use the data we collect from passengers in airports to predict and report disease outbreaks before they happen. 

We  new friends!

© Volatect 2019. All Rights Reserved.