Difference between revisions of "Team:Calgary/Software"

 
(37 intermediate revisions by 4 users not shown)
Line 11: Line 11:
 
-->
 
-->
 
<html>
 
<html>
 +
  <head>
 +
 +
<link href="https://fonts.googleapis.com/css2?family=Public+Sans:wght@500;600;700&display=swap" rel="stylesheet">
 +
 +
<link
 +
      rel="stylesheet"
 +
      type="text/css"
 +
      href="https://2020.igem.org/Template:Calgary/Imposter-Wet-Overview-Style?action=raw&ctype=text/css"
 +
    />
 +
  
<head>
 
    <link href="https://fonts.googleapis.com/css2?family=Public+Sans:wght@500;600;700&display=swap" rel="stylesheet">
 
    <link rel="stylesheet" type="text/css"
 
        href="https://2020.igem.org/Template:Calgary/Imposter-Wet-Overview-Style?action=raw&ctype=text/css" />
 
 
     <script src="https://2020.igem.org/Template:Calgary/DynamicSizeModelPage?action=raw&ctype=text/javascript"></script>
 
     <script src="https://2020.igem.org/Template:Calgary/DynamicSizeModelPage?action=raw&ctype=text/javascript"></script>
 
     <style>
 
     <style>
        /* The banner image */
+
/* The banner image */
        .banner-image {
+
.banner-image {
            /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
+
  /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
            background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), url("https://static.igem.org/mediawiki/2020/d/da/T--Calgary--IHPbanner.jpeg");
+
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.5) 100%), url("https://static.igem.org/mediawiki/2020/5/56/T--Calgary--modellingbanner.jpeg");
  
            /* Set a specific height */
+
  /* Set a specific height */
            height: 65vh;
+
  height: 65vh;
  
            /* Position and center the image to scale nicely on all screens */
+
  /* Position and center the image to scale nicely on all screens */
            background-position: center;
+
  background-position: center;
            background-repeat: no-repeat;
+
  background-repeat: no-repeat;
            background-size: cover;
+
  background-size: cover;
            position: relative;
+
  position: relative;
            background-attachment: fixed;
+
  background-attachment: fixed;
        }
+
}
  
        /*header font size for tablet*/
 
        @media(max-width: 768px) {
 
            .resp h1 {
 
                font-size: 55px !important;
 
            }
 
        }
 
  
        /*header font size for mobile*/
 
        @media (max-width:525px) {
 
            .resp h1 {
 
                font-size: 50px !important;
 
            }
 
        }
 
  
        @media (max-width: 767px) {
+
/*header font size for tablet*/
 +
@media(max-width: 768px){
 +
  .resp h1{
 +
    font-size:55px!important;
 +
  }}
  
            .banner-image {
+
/*header font size for mobile*/
                background-position: center;
+
@media (max-width:525px){
            }
+
  .resp h1{
        }
+
    font-size:50px!important;
 +
  }}
  
        /*header4 font size for mobile*/
+
@media (max-width: 767px) {
        @media (max-width:525px) {
+
            .resp2 h4 {
+
                font-size: 15px !important;
+
            }
+
        }
+
  
        /*header4 font size for tablet*/
+
.banner-image {
        @media(max-width: 768px) {
+
  background-position: center;
            .resp2 h4 {
+
}
                font-size: 15px !important;
+
}
            }
+
        }
+
  
        /* Style page content */
 
        .main {
 
            padding: 0px 0px;
 
            position: relative;
 
            top: -100px;
 
            /* To override the odd <br> tag bug */
 
        }
 
  
        .break h4 {
+
/*header4 font size for mobile*/
            word-break: break-all;
+
@media (max-width:525px){
        }
+
  .resp2 h4{
 +
    font-size:15px!important;
 +
  }}
  
        /* References section of page slightly above the header */
 
        #project-design,
 
        #part-design,
 
        #experimental-design,
 
        #future-directions {
 
            padding-top: 50px;
 
            margin-top: -50px;
 
        }
 
  
        /* Accordion styling */
+
/*header4 font size for tablet*/
        .btn {
+
@media(max-width: 768px){
            color: #882916;
+
  .resp2 h4{
        }
+
    font-size:15px!important;
 +
  }}
  
        /* mouse over button */
+
/*no beige for mobile*/
        a.imglink {
+
@media (max-width:525px){
            background: #000;
+
  .beige {
            display: inline-block;
+
    background-color:#FFFFFF!important;
        }
+
  }}
  
        a.imglink img {
+
/*padding for mobile*/
            vertical-align: middle;
+
@media (max-width:525px){
            transition: opacity 0.3s;
+
.padding {
            -webkit-transition: opacity 0.3s;
+
      padding-left: 0px!important;
        }
+
      padding-right: 0px!important;
 +
      padding-bottom: 0px!important;
 +
}}
  
        a.imglink:hover img {
 
            opacity: 0.5;
 
        }
 
  
        .grid-container {
 
            display: inline-grid;
 
            grid-row-gap: 15px;
 
            grid-column-gap: 5vw;
 
            grid-template-columns: 30px 50px;
 
            grid-template-rows: 10px 10px 10px 10px 10px;
 
            align-items: center;
 
            justify-items: center;
 
            margin: auto;
 
        }
 
  
        /*
+
/* Style page content */
        GRID:
+
.main {
        1 2
+
  padding: 0px 0px;
        3 4
+
  position: relative;
        5 6
+
  top: -100px; /* To override the odd <br> tag bug */
        7 8
+
}
        9 10
+
        */
+
        .grid1 {
+
            grid-column-start: 1;
+
            grid-column-end: 2;
+
            grid-row-start: 1;
+
            grid-row-end: 2;
+
        }
+
  
        .grid2 {
 
            grid-column-start: 2;
 
            grid-column-end: 3;
 
            grid-row-start: 1;
 
            grid-row-end: 2;
 
        }
 
  
        .grid3 {
+
.break h4{word-break: break-all;}
            grid-column-start: 1;
+
            grid-column-end: 2;
+
            grid-row-start: 2;
+
            grid-row-end: 3;
+
        }
+
  
        .grid4 {
 
            grid-column-start: 2;
 
            grid-column-end: 3;
 
            grid-row-start: 2;
 
            grid-row-end: 3;
 
        }
 
  
        .grid5 {
 
            grid-column-start: 1;
 
            grid-column-end: 2;
 
            grid-row-start: 3;
 
            grid-row-end: 4;
 
        }
 
  
        .grid6 {
+
/* References section of page slightly above the header */
            grid-column-start: 2;
+
#project-design, #part-design, #experimental-design, #future-directions {
            grid-column-end: 3;
+
    padding-top: 50px;
            grid-row-start: 3;
+
    margin-top: -50px;
            grid-row-end: 4;
+
}
        }
+
  
        .grid7 {
 
            grid-column-start: 1;
 
            grid-column-end: 2;
 
            grid-row-start: 4;
 
            grid-row-end: 5;
 
        }
 
  
        .grid8 {
 
            grid-column-start: 2;
 
            grid-column-end: 3;
 
            grid-row-start: 4;
 
            grid-row-end: 5;
 
        }
 
  
        .grid9 {
 
            grid-column-start: 1;
 
            grid-column-end: 2;
 
            grid-row-start: 5;
 
            grid-row-end: 6;
 
        }
 
  
        .grid10 {
+
/* Accordion styling */
            grid-column-start: 2;
+
.btn {color:#882916;}
            grid-column-end: 3;
+
            grid-row-start: 5;
+
            grid-row-end: 6;
+
        }
+
    </style>
+
</head>
+
  
  
<body style="background-color: #FFFFFF;">
 
    <div class="main">
 
        <div class="container-fluid">
 
            <!-- HEADER/BANNER -->
 
            <div class="banner-image">
 
                <div class="banner-text resp">
 
                    <h1 style="font-weight: 600; font-family: 'Public Sans', sans-serif;">SOFTWARE</h1>
 
                </div>
 
            </div>
 
            <!-- BODY -->
 
            <div style="margin-bottom:-200px; background-color:#f0eadfff;" class="intro-body">
 
                <div style="background-color:#FFFFFF; padding-left: 60px; padding-right: 50px; padding-bottom: 60px;"
 
                    class="project-design" id="project-design">
 
                    <center>
 
                        <h2><b>SOFTWARE OVERVIEW</b></h2>
 
                    </center>
 
                    <br>
 
                    <p>
 
                        Oviita has three main wet lab components that allow <span style="font-style: italic;"
 
                            class="italic">Yarrowia lipolytica</span> to be easy and safe to work with in communities,
 
                        and be
 
                        as nutritionally valuable as possible. This year we did extensive planning of experiments,
 
                        including trouble-shooting plans. Check out our work below!
 
                    </p>
 
  
                    <div style="background-color:#f5b984; border-radius: 25px; padding-bottom: 30px;" class="row resp2">
+
/* mouse over button */
                        <div class="grid-container">
+
a.imglink{
                            <div class="grid1">
+
  background:         #000;
                                <a href="https://2020.igem.org/Team:Calgary/Bellatrix" class="imglink">
+
  display:           inline-block;
                                    <center><img style="padding-bottom:20px;" class="img-fluid"
+
}
                                            src="https://static.igem.org/mediawiki/2020/3/3a/T--Calgary--partcollection.jpg">
+
a.imglink img{
                                    </center>
+
  vertical-align:     middle;
                                </a>
+
  transition:         opacity 0.3s;
                                <h4>BELLATRIX</h4>
+
  -webkit-transition: opacity 0.3s;
                            </div>
+
}
                            <div class="grid2">
+
a.imglink:hover img{
                                <p>Integrating cellulase genes into the <span style="font-style: italic;" class="italic">Y. lipolytica</span> genome, thus allowing the yeast to use
+
  opacity:           0.5;
                                    agricultural waste as a carbon source for energy. </p>
+
}
                            </div>
+
    </style>
                        </div>
+
  </head>
                        <div class="col-sm-4" style="padding-top:30px;"><a
+
                                href="https://2020.igem.org/Team:Calgary/Cellulase_General" class="imglink">
+
                                <center><img style="padding-bottom:20px;" class="img-fluid"
+
                                        src="https://static.igem.org/mediawiki/2020/f/ff/T--Calgary--validate.jpg">
+
                                    <h4>GAUSHAUS</h4>
+
                                    <p>Integrating cellulase genes into the <span style="font-style: italic;class="
+
                                            italic">Y. lipolytica</span> genome, thus allowing the yeast to use
+
                                        agricultural waste as a carbon source for energy. </p>
+
                                </center>
+
                            </a>
+
                        </div>
+
  
                        <div style="padding-top:30px;" class="col-sm-4"><a
+
 
                                href="https://2020.igem.org/Team:Calgary/Gaushaus" class="imglink">
+
<body style="background-color: #FFFFFF;">
                                <center><img style="padding-bottom:20px;" class="img-fluid"
+
<div class="main">
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg">
+
    <div class="container-fluid">
                                    <h4>STICKS</h4>
+
                                    <p>Engineering the different strains to be dependent on each other so they can
+
                                        only
+
                                        survive within the bioreactor and not in the environment </p>
+
                                </center>
+
                            </a>
+
                        </div>
+
  
                        <div style="padding-top:30px;" class="col-sm-4"><a
 
                                href="https://2020.igem.org/Team:Calgary/Metabolic_Flux" class="imglink">
 
                                <center><img style="padding-bottom:20px;" class="img-fluid"
 
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg">
 
                                    <h4>METABOLIC FLUX</h4>
 
                                    <p>Engineering the different strains to be dependent on each other so they can
 
                                        only
 
                                        survive within the bioreactor and not in the environment </p>
 
                                </center>
 
                            </a>
 
                        </div>
 
  
                        <div style="padding-top:30px;" class="col-sm-4"><a
 
                                href="https://2020.igem.org/Team:Calgary/Cellobiohydrolase" class="imglink">
 
                                <center><img style="padding-bottom:20px;" class="img-fluid"
 
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg">
 
                                    <h4>HARDWARE</h4>
 
                                    <p>Engineering the different strains to be dependent on each other so they can
 
                                        only
 
                                        survive within the bioreactor and not in the environment </p>
 
                                </center>
 
                            </a>
 
                        </div>
 
  
                        <div style="padding-top:30px;" class="col-sm-4"><a
+
      <!-- HEADER/BANNER -->
                                href="https://2020.igem.org/Team:Calgary/Endoglucanase1" class="imglink">
+
      <div class="banner-image">
                                <center><img style="padding-bottom:20px;" class="img-fluid"
+
        <div class="banner-text resp">
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg">
+
        <h1 style="font-weight: 600; font-family: 'Public Sans', sans-serif;">SOFTWARE</h1>
                                    <h4>ENDOGLUCANASE</h4>
+
                                    <p>Engineering the different strains to be dependent on each other so they can
+
                                        only
+
                                        survive within the bioreactor and not in the environment </p>
+
                                </center>
+
                            </a>
+
                        </div>
+
                    </div>
+
                </div>
+
                <!--End of round div tag-->
+
            </div>
+
 
         </div>
 
         </div>
 +
      </div>
 +
 +
      <!-- BODY -->
 +
      <div style="margin-bottom:-200px; background-color:#f0eadfff;"class="intro-body beige">
 +
<div style="background-color:#FFFFFF; padding-left: 60px; padding-right: 50px; padding-bottom: 60px; border-radius: ;"class = "project-design padding" id="project-design">
 +
        <center><h2><b>SOFTWARE</b></h2></center>
 +
        <br>
 +
        <p>
 +
Software for this year was completed in hope to provide tools and building blocks for future teams while enabling other aspects of our own project. The following softwares were the fruits of our labour over the summer.
 +
          </p>
 +
 +
 +
 +
  <div style="background-color:#f5b984; border-radius: 25px; padding-bottom: 30px;"class="row resp2">
 +
   
 +
    <div style="padding-top:30px;"class="col-sm-4"><a href="https://2020.igem.org/Team:Calgary/Gaushaus" class="imglink">
 +
    <center><img style="padding-bottom:20px;"class="img-fluid"src="https://static.igem.org/mediawiki/2020/b/b3/T--Calgary--GausHaus.png">
 +
 +
<h4>GAUSHAUS</h4>
 +
      <p>The first portion of our project to benefit from our software development was in our measurement. With our molecular dynamics simulations, we were attempting to characterize data coming out of a firehose. By using the GausHaus measuring software, we can temper the flow to be much more usable and concise. This Software enabled our team to develop models and build confidence in the efficacy of our cellulases. Ultimately this software has impacted the lab where we are currently working on secreting the measured cellulases by our yeast. This software was developed in R.
 +
</p></center></a>
 
     </div>
 
     </div>
     </div> <!-- add in new section of CONTENT above this -->
+
      
 +
  <div style="padding-top:30px;"class="col-sm-4"><a href="https://2020.igem.org/Team:Calgary/Bellatrix" class="imglink">
 +
 
 +
<center><img style="padding-bottom:20px;"class="img-fluid"src="https://static.igem.org/mediawiki/2020/f/fc/T--Calgary--bellatrixicon.png">
 +
 
 +
<h4>BELLATRIX</h4>
 +
      <p>The next aspect of our project to feel the breadth of our software was Modelling. Bellatrix was developed to assist the modelling pathway by allowing arduous pdb files to be decomposed into a new file type known as 'star files' this has allowed relational structure matrices to be easily generated and used by our modelling team. This software was developed in Python.
 +
</p></center></a>
 
     </div>
 
     </div>
</body>
+
   
 +
  <div style="padding-top:30px;"class="col-sm-4"><a href="https://2020.igem.org/Team:Calgary/Sticks" class="imglink">
 +
 
 +
    <center><img style="padding-bottom:20px;"class="img-fluid"src="https://static.igem.org/mediawiki/2020/c/c0/T--Calgary--Sticks12.png">
 +
<h4>STICKS</h4>
 +
  <p>For all those computational biologists out there working in R and hate having to jump back and forth with generated pdbs in auxiliary software, we have developed Sticks. Sticks is an R function that allows users to generate dynamic representation Gifs in R. This has saved our drylab a considerable amount of time working on our proteins. This software was developed in R.
 +
</p></center></a>
 +
    </div>
 +
 
 +
    <div style="padding-top:30px;"class="col-sm-4"><a href="https://2020.igem.org/Team:Calgary/iGAM" class="imglink">
 +
 +
      <center><img style="padding-bottom:20px;"class="img-fluid"src="https://static.igem.org/mediawiki/2020/0/0a/T--Calgary--iGAMIcon.png">
 +
<h4>iGAM 2.0</h4>
 +
  <p>In a blast from the past, iGAM has received a few small updates to increase usability. These updates allow the program to work better on other proteins and allow users to insert their own fitness functions. Thereby allowing this software to be used by many more teams. This software was developed in R.
 +
</p></center></a>
 +
    </div>
 +
 
 +
    <div style="padding-top:30px;"class="col-sm-4"><a href="https://2020.igem.org/Team:Calgary/Hardware" class="imglink">
 +
 
 +
      <center><img style="padding-bottom:20px;"class="img-fluid"src="https://static.igem.org/mediawiki/2020/f/fb/T--Calgary--Randlecellnew.png">
 +
  <h4>HARDWARE <br> SOFTWARE</h4>
 +
    <p>Finally, our hardware-software was developed to allow our hardware projects to operate efficiently and reliably. We have provided these scripts to give other teams looking to work on hardware projects a point of reference. This will allow other teams to learn from our mistakes, strengthening their projects. This software was developed in C++.
 +
</p></center></a>
 +
      </div>
 +
 
 +
      <div style="padding-top:30px;"class="col-sm-4"><a href="https://github.com/iGEMCalgary" class="imglink">
 +
 
 +
        <center><img style="padding-bottom:20px;"class="img-fluid"src="https://static.igem.org/mediawiki/2020/3/33/T--Calgary--GitHub.png">
 +
  <h4>GITHUB</h4>
 +
    <p>If you are looking to find any of the softwares above, please visit our GitHub. While you are hunting around you can also view our software from the last few years.
 +
</p></center></a>
 +
      </div>
 +
 
 +
   
 +
    </div> <!--End of round div tag-->
 +
<br><br>
 +
<p>
 +
The fingerprints of our software can be traced throughout our entire project. This has benefited not only the project but also the software as well. Our team is extremely interdisciplinary, and through more and more members of the team using the software, we have been able to gain user input from individuals that we would not normally consider in our development strategy. The result is software that considers the biologist and the engineer. We hope that this will increase its usefulness to other teams allowing it to become a part of many different projects in both the dry and wetlab.
 +
 
 +
</p>
 +
 
  
 +
</div>
 +
          </div> <!-- add in new section of CONTENT above this -->
 +
      </div>
 +
    </div>
 +
  </body>
 
</html>
 
</html>
 
{{Calgary/Imposter-Footer}}
 
{{Calgary/Imposter-Footer}}

Latest revision as of 03:11, 28 October 2020



SOFTWARE


Software for this year was completed in hope to provide tools and building blocks for future teams while enabling other aspects of our own project. The following softwares were the fruits of our labour over the summer.



The fingerprints of our software can be traced throughout our entire project. This has benefited not only the project but also the software as well. Our team is extremely interdisciplinary, and through more and more members of the team using the software, we have been able to gain user input from individuals that we would not normally consider in our development strategy. The result is software that considers the biologist and the engineer. We hope that this will increase its usefulness to other teams allowing it to become a part of many different projects in both the dry and wetlab.