Difference between revisions of "Team:NDNF China/Collaborations"

(Replaced content with "{{IGEM_TopBar}} {{NDNF_China}} <html> </html>")
Line 1: Line 1:
−
{{IGEM_TopBar}}
 
 
{{NDNF_China}}
 
{{NDNF_China}}
 +
{{NDNF China/Nav}}
 
<html>
 
<html>
 +
<head>
 +
    <meta charset="UTF-8">
 +
    <style type="text/css">
 +
   
 +
    @font-face {
 +
    font-family: 'Mango';
 +
    src: url("https://static.igem.org/mediawiki/2021/8/87/T--NDNF_China--font--cute.otf");
 +
    }
  
 +
    @font-face {
 +
    font-family: 'Sary-Soft-6';
 +
    src:url("https://static.igem.org/mediawiki/2021/7/74/T--NDNF_China--NotoSans-Regular-2.ttf");
 +
    }
 +
 +
    @font-face {
 +
    font-family: 'Suffer';
 +
    src:url("https://static.igem.org/mediawiki/2021/3/3a/T--NDNF_China--Tilda-Script-S-Non-connect-Demo-2.otf");
 +
    }
 +
 +
    .videooo{
 +
        width:100%;
 +
        position:absolute;
 +
        z-index:001;
 +
    }
 +
 +
    .intro2{
 +
        width:100%;
 +
        left:0rem;
 +
        position:absolute;
 +
        top:100vh;
 +
        background-color:white;
 +
        z-index:003;
 +
    }
 +
 +
    .intro1{
 +
        height:calc(100% - 9.66vw);
 +
        width:20%;
 +
        right:0rem;
 +
        position:absolute;
 +
        background-color:#E3E0F1;
 +
        background-image: linear-gradient(to bottom, #E3E0F1 50%, #D1E9F3 100%);
 +
        z-index:003;
 +
    }
 +
 +
    .div{
 +
        padding-left:6.2vw;
 +
        text-align:justify;
 +
        position:relative;
 +
        padding-top:7.5vw;
 +
        left:4.5vw;
 +
        width:60vw;
 +
    }
 +
 +
    h2,h3,h4{
 +
        font-family:Suffer;
 +
        font-weight:bold;
 +
    }
 +
 +
    h2{
 +
        font-size:32px;
 +
        color:#536998;
 +
        position:relative;
 +
    }
 +
 +
    h3{
 +
        font-size:25px;
 +
        color:#5F9EA0;
 +
    }
 +
 +
    h4{
 +
        font-size:22px;
 +
        color:#A092C7;
 +
    }
 +
 +
    .icon{
 +
        width:3.12vw;
 +
        position:absolute;
 +
        left:2.5%;
 +
        display:inline-block;
 +
    }
 +
 +
    .button2{
 +
        background-color:#EBD3E8;
 +
        border:none;
 +
        padding: 0.75vw 3vw;
 +
        text-align: center;
 +
        text-decoration:none;
 +
        display: inline-block;
 +
        font-size: 18px;
 +
        border-radius: 1.09vw;
 +
        font-family:Sary-Soft-6;
 +
        margin: 0.31vw 0 1.5vw 0;
 +
    }
 +
 +
    .button2:hover {
 +
        background-color:white;
 +
        -webkit-transition-duration: 0.4s; /* Safari */
 +
        transition-duration: 0.4s;
 +
    }
 +
 +
    .buttonw{
 +
        text-decoration:none;
 +
        color:#7373B9;
 +
    }
 +
 +
 +
    li{
 +
        list-style: none;
 +
        margin: 0;
 +
        vertical-align: top;
 +
    }
 +
    ul{
 +
        margin: 0;
 +
        padding: 0;
 +
    }
 +
    .directory-nav{
 +
        position: fixed;
 +
        right:0;
 +
        width:15.6vw;
 +
        bottom:8.7vw;
 +
        padding: 0.94vw 0 1.56vw 2.5vw;
 +
        display: none;
 +
        z-index:006;
 +
    }
 +
    .directory-nav li{
 +
        height: 2.65vw;
 +
        line-height: 2.65vw;
 +
        position: relative;
 +
    }
 +
    .directory-nav li a{
 +
        text-decoration:none;
 +
    }
 +
    .directory-nav .l1{
 +
    }
 +
    .directory-nav .l2{
 +
        text-indent:0.75vw;
 +
    }
 +
    .directory-nav .l1 a{
 +
        font-size: 14px;
 +
        font-family: Sary-Soft-6
 +
    }
 +
    .directory-nav .l2 a{
 +
        font-size: 12px;
 +
        font-family: Sary-Soft-6
 +
    }
 +
    .directory-nav,.directory-nav a{
 +
        color:#272727;
 +
    }
 +
    .directory-nav .cur a{
 +
        color:#483D8B;
 +
        font-weight:bold;
 +
    }
 +
    .directory-nav .line{
 +
        position: absolute;
 +
        left:0.31vw;
 +
        top: 0.39vw;
 +
        bottom: 0.39vw;
 +
        z-index: 1;
 +
        width: 0.16vw;
 +
        background: #ddd;
 +
    }
 +
    .directory-nav .c-top,.directory-nav .c-bottom{
 +
        position: absolute;
 +
        left: 0;
 +
        z-index: 2;
 +
        display: block;
 +
        width: 0.78vw;
 +
        height: 0.78vw;
 +
        font-size: 0;
 +
        line-height: 0;
 +
        background: url(https://static.igem.org/mediawiki/2021/a/ac/T--NDNF_China--directory-nav2.png) no-repeat 0 -69px;
 +
    }
 +
    .directory-nav .c-dot{
 +
        position: absolute;
 +
        left:-2.5vw;
 +
        top: 50%;
 +
        z-index: 2;
 +
        margin-top:-0.39vw;
 +
        display: block;
 +
        width: 0.78vw;
 +
        height: 0.78vw;
 +
        font-size: 0;
 +
        line-height: 0;
 +
        background: url(https://static.igem.org/mediawiki/2021/1/11/T--NDNF_China--directory-nav3.png) no-repeat -275px 0;
 +
    }
 +
    .directory-nav .c-top{
 +
        top: 0;
 +
    }
 +
    .directory-nav .c-bottom{
 +
        bottom: 0;
 +
    }
 +
    .directory-nav .cur-tag{
 +
        position: absolute;
 +
        left: -0.08vw;
 +
        top:2.34vw;
 +
        z-index: 5;
 +
        margin-top: -0.47vw;
 +
        display: block;
 +
        width: 1.48vw;
 +
        height: 1.01vw;
 +
        font-size: 0;
 +
        line-height: 0;
 +
        background: url(https://static.igem.org/mediawiki/2021/3/30/T--NDNF_China--directory-nav.png) no-repeat -271px -37px;
 +
        -webkit-transition:top 0s ease 0s;
 +
        transition:top 0s ease 0s;
 +
    }
 +
 +
    </style>
 +
</head>
 +
<body>
 +
 +
<div class="videooo">
 +
    <video width="100%" src="https://static.igem.org/mediawiki/2021/8/86/T--NDNF_China--Integrated_hp.mp4" autoplay muted loop></video>
 +
</div>
 +
 +
<div class="intro2">
 +
    <div class="intro1"></div>
 +
 +
    <div class="div" style="padding-top:5vw;">
 +
        <h2 style="display:inline-block;">Collaboration with GreatBay_SZ</h2>
 +
        <img src="https://static.igem.org/mediawiki/2021/0/0b/T--NDNF_China--iconfv1.png" class="icon">
 +
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;font-weight: bold;">Work with GreatBay_SZ team to verify barcode functionality.</p>
 +
       
 +
        <img src="https://static.igem.org/mediawiki/2021/9/99/T--NDNF_China--collab_t.png" width="300" height="300" style="float: left;padding-right: 2vw;">
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;padding-bottom: 3vw;">Our project contains unique information: barcode of "NDNFCHINAiGEM2021" was edited to the genome of E. coli top10 strain by gene editing.To verify that the Barcode we designed works properly, we cooperated with GreatBay_SZ team. GreatBay_SZ developed a Cas12-based barcode detection system and was very willing to perform the detection for us. Finally, we successfully detected the barcode, which further proved the feasibility of GreatBay_SZ team's detection method.</p>
 +
 +
        <img src="https://2021.igem.org/File:T--GreatBay_SZ--Collaboration_fluorescence_detection_result_P3.png" width="300" height="300">
 +
        <img src="https://static.igem.org/mediawiki/2021/4/45/T--GreatBay_SZ--cas12a_test_strip.png" width="400" height="300">
 +
 +
        <p style="color:#9370DB;font-size:18px;font-family:Sary-Soft-6;padding-left: 2vw;padding-top: 3vw;">For more details please click the button below  </p>
 +
        <div class="button2">
 +
            <a href="https://2021.igem.org/Team:GreatBay_SZ/Communication" class="buttonw" style="text-decoration:none;color:#9370DB;">GreatBay_SZ Collaboration ></a>
 +
        </div>
 +
 +
    </div>
 +
 +
    <div class="div">
 +
        <h2 style="display:inline-block;">Collaboration with SZ_SHD</h2>
 +
        <img src="https://static.igem.org/mediawiki/2021/1/13/T--NDNF_China--iconfv2.png" class="icon">
 +
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;font-weight: bold;">Provide final product packaging form for SZ SHD team.</p>
 +
        <img src="https://static.igem.org/mediawiki/2021/8/89/T--NDNF_China--sz_shd.png" width="340" height="300" style="float: left;">
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;">The SZ_SHD team wanted to screen keratinase enzymes for good hair removal and develop them into emerging hair removal products, so they wanted to find a medium that could maintain enzyme activity for a long period while can also isolate external contamination. During our communication, both teams agreed that the safe and stable environment provided by NDNF's Hidro could also be applied to enzyme preservation, so we provided guidance to SZ_SHD project on Hidro's preparation and sent some reagents. Finally, SZ_SHD also obtained very encouraging results: Hidro is indeed effective in preserving enzyme activity at room temperature (25°C).</p>
 +
 +
        <img src="https://static.igem.org/mediawiki/2021/a/a6/T--NDNF_China--collab_3.png" width="400" height="250" style="float: left;">
 +
        <img src="https://static.igem.org/mediawiki/2021/c/c3/T--NDNF_China--collab_4.png" width="250" height="250">
 +
 +
        <p style="color:#9370DB;font-size:18px;font-family:Sary-Soft-6;padding-left: 2vw;padding-top: 3vw;">For more details please click the button below  </p>
 +
 +
        <div class="button2">
 +
            <a href="https://2021.igem.org/Team:SZ_SHD/Collaborations" class="buttonw" style="text-decoration:none;color:#9370DB;">SZ_SHD Collaborations ></a>
 +
        </div>
 +
 +
 +
 +
    </div>
 +
 +
    <div class="div">
 +
        <h2 style="display:inline-block;">Collaboration with SDSZ</h2>
 +
        <img src="https://static.igem.org/mediawiki/2021/1/17/T--NDNF_China--iconfv3.png" class="icon">
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;font-weight: bold;">The SDSZ team provided us with fluorescence microscopes</p>
 +
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;">NDNF has selected fluorescent proteins as reporter genes in the circuit design, so we need to use fluorescence microscope for data acquisition when testing the operation of the gene circuit, but we do not have the microscope in our lab. IP of SDSZ has previously used fluorescence microscope, and helped us find a lab that can borrow the instrument as well as help us to collect important experimental results.</p>
 +
    </div>
 +
    <div class="div">
 +
 +
        <h2 style="display:inline-block;">Collaboration with BJU_China</h2>
 +
        <img src="https://static.igem.org/mediawiki/2021/1/17/T--NDNF_China--iconfv3.png" class="icon">
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;font-weight: bold;">Assisted BJU China to improve the project</p>
 +
        <p style="font-size:18px;font-family:Sary-Soft-6;">BJU_China is a high school team that shares a lab with us. Our team has successful experience in  gene editing, so we were able to provide some guidance for them. We exchanged some notes on gene editing and taught them in detail how to prepare competent cells. In addition, BJU_China produced tyrian purple（which is a dye), and they wanted to make some jewelry with this dye. NDNF_China team included crafters who helped BJU_China weave bracelets with tyrian purple string. </p>
 +
    </div>
 +
=
 +
 +
       
 +
 +
    <img style="height:9.66vw;width:100%;z-index:998;" src="https://static.igem.org/mediawiki/2021/d/d8/T--NDNF_China--footerff.png">
 +
 +
</div>
 +
 +
    <script src="https://2021.igem.org/Team:NDNF_China/js2"></script>
 +
    <script>
 +
 +
    function DirectoryNav($h,config){
 +
        this.opts = $.extend(true,{
 +
            scrollThreshold:0.3,
 +
            scrollSpeed:500,
 +
            scrollTopBorder:400,
 +
            easing: 'swing',
 +
            delayDetection:200,
 +
            scrollChange:function(){}
 +
        },config);
 +
        this.$win = $(window);
 +
        this.$h = $h;
 +
        this.$pageNavList = "";
 +
        this.$pageNavListLis ="";
 +
        this.$curTag = "";
 +
        this.$pageNavListLiH = "";
 +
        this.offArr = [];
 +
        this.curIndex = 0;
 +
        this.scrollIng = false;
 +
        this.init();
 +
    }
 +
 +
    DirectoryNav.prototype = {
 +
        init:function(){
 +
            this.make();
 +
            this.setArr();
 +
            this.bindEvent();
 +
        },
 +
        make:function(){
 +
            $("body").append('<div class="directory-nav" id="directoryNav"><ul></ul><span class="cur-tag"></span><span class="c-top"></span><span class="c-bottom"></span><span class="line"></span></div>>');
 +
            var $hs = this.$h,
 +
                $directoryNav = $("#directoryNav"),
 +
                temp = [],
 +
                index1 = 0,
 +
                index2 = 0;
 +
            $hs.each(function(index){
 +
                var $this = $(this),
 +
                        text = $this.text();
 +
                if(this.tagName.toLowerCase()=='h2'){
 +
                    index1++;
 +
                    if(index1%2==0) index2 = 0;
 +
                    temp.push('<li class="l1"><span class="c-dot"></span>'+index1+'. <a class="l1-text">'+text+'</a></li>');
 +
                }else{
 +
                    index2++;
 +
                    temp.push('<li class="l2">'+index1+'.'+index2+' <a class="l2-text">'+text+'</a></li>');
 +
 +
                }
 +
            });
 +
            $directoryNav.find("ul").html(temp.join(""));
 +
 +
            this.$pageNavList = $directoryNav;
 +
            this.$pageNavListLis = this.$pageNavList.find("li");
 +
            this.$curTag = this.$pageNavList.find(".cur-tag");
 +
            this.$pageNavListLiH = this.$pageNavListLis.eq(0).height();
 +
 +
            if(!this.opts.scrollTopBorder){
 +
                this.$pageNavList.show();
 +
            }
 +
        },
 +
        setArr:function(){
 +
            var This = this;
 +
            this.$h.each(function(){
 +
                var $this = $(this),
 +
                    offT = Math.round($this.offset().top);
 +
                This.offArr.push(offT);
 +
            });
 +
        },
 +
        posTag:function(top){
 +
            this.$curTag.css({top:top+'px'});
 +
        },
 +
        ifPos:function(st){
 +
            var offArr = this.offArr;
 +
            //console.log(st);
 +
            var windowHeight = Math.round(this.$win.height() * this.opts.scrollThreshold);
 +
            for(var i=0;i<offArr.length;i++){
 +
                if((offArr[i] - windowHeight) < st) {
 +
                    var $curLi = this.$pageNavListLis.eq(i),
 +
                        tagTop = $curLi.position().top;
 +
                    $curLi.addClass("cur").siblings("li").removeClass("cur");
 +
                    this.curIndex = i;
 +
                    this.posTag(tagTop+this.$pageNavListLiH*0.5);
 +
                    //this.curIndex = this.$pageNavListLis.filter(".cur").index();
 +
                    this.opts.scrollChange.call(this);
 +
                }
 +
            }
 +
        },
 +
        bindEvent:function(){
 +
            var This = this,
 +
                show = false,
 +
                timer = 0;
 +
            this.$win.on("scroll",function(){
 +
                var $this = $(this);
 +
                clearTimeout(timer);
 +
                timer = setTimeout(function(){
 +
                    This.scrollIng = true;
 +
                    if($this.scrollTop()>This.opts.scrollTopBorder){
 +
                        if(!This.$pageNavListLiH) This.$pageNavListLiH = This.$pageNavListLis.eq(0).height();
 +
                        if(!show){
 +
                            This.$pageNavList.fadeIn();
 +
                            show = true;
 +
                        }
 +
                        This.ifPos( $(this).scrollTop() );
 +
                    }else{
 +
                        if(show){
 +
                            This.$pageNavList.fadeOut();
 +
                            show = false;
 +
                        }
 +
                    }
 +
                },This.opts.delayDetection);
 +
            });
 +
 +
            this.$pageNavList.on("click","li",function(){
 +
                var $this = $(this),
 +
                    index = $this.index();
 +
                This.scrollTo(This.offArr[index]);
 +
            })
 +
        },
 +
        scrollTo: function(offset,callback) {
 +
            var This = this;
 +
            $('html,body').animate({
 +
                scrollTop: offset - 130
 +
            }, this.opts.scrollSpeed, this.opts.easing, function(){
 +
                This.scrollIng = false;
 +
                if (callback){
 +
                    if (this.tagName.toLowerCase()=='body'){
 +
                        callback();
 +
                    }
 +
                }
 +
            });
 +
        }
 +
    };
 +
 +
    var directoryNav = new DirectoryNav($("h2,h3"),{
 +
        scrollTopBorder:400
 +
    });
 +
 +
    </script>
 +
</body>
 
</html>
 
</html>

Revision as of 03:16, 19 October 2021

Collaboration with GreatBay_SZ

Work with GreatBay_SZ team to verify barcode functionality.

Our project contains unique information: barcode of "NDNFCHINAiGEM2021" was edited to the genome of E. coli top10 strain by gene editing.To verify that the Barcode we designed works properly, we cooperated with GreatBay_SZ team. GreatBay_SZ developed a Cas12-based barcode detection system and was very willing to perform the detection for us. Finally, we successfully detected the barcode, which further proved the feasibility of GreatBay_SZ team's detection method.

For more details please click the button below

GreatBay_SZ Collaboration >

Collaboration with SZ_SHD

Provide final product packaging form for SZ SHD team.

The SZ_SHD team wanted to screen keratinase enzymes for good hair removal and develop them into emerging hair removal products, so they wanted to find a medium that could maintain enzyme activity for a long period while can also isolate external contamination. During our communication, both teams agreed that the safe and stable environment provided by NDNF's Hidro could also be applied to enzyme preservation, so we provided guidance to SZ_SHD project on Hidro's preparation and sent some reagents. Finally, SZ_SHD also obtained very encouraging results: Hidro is indeed effective in preserving enzyme activity at room temperature (25°C).

For more details please click the button below

SZ_SHD Collaborations >

Collaboration with SDSZ

The SDSZ team provided us with fluorescence microscopes

NDNF has selected fluorescent proteins as reporter genes in the circuit design, so we need to use fluorescence microscope for data acquisition when testing the operation of the gene circuit, but we do not have the microscope in our lab. IP of SDSZ has previously used fluorescence microscope, and helped us find a lab that can borrow the instrument as well as help us to collect important experimental results.

Collaboration with BJU_China

Assisted BJU China to improve the project

BJU_China is a high school team that shares a lab with us. Our team has successful experience in gene editing, so we were able to provide some guidance for them. We exchanged some notes on gene editing and taught them in detail how to prepare competent cells. In addition, BJU_China produced tyrian purple（which is a dye), and they wanted to make some jewelry with this dye. NDNF_China team included crafters who helped BJU_China weave bracelets with tyrian purple string.

=