Difference between revisions of "Team:Calgary/Software"

 
(27 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-template-columns: 15vw 35vw;
 
            grid-template-rows: 30vh 30vh 30vh 30vh 30vh 30vh;
 
            align-items: center;
 
            justify-items: center;
 
        }
 
  
        /*
+
/* 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;
+
            margin: 15px;
+
        }
+
  
        .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;
+
            margin: 15px;
+
        }
+
  
        .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;
 
            margin: 15px;
 
        }
 
  
        .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;
 
            margin: 15px;
 
        }
 
  
        .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;
 
            margin: 15px;
 
        }
 
  
        .grid10 {
+
/* Accordion styling */
            grid-column-start: 2;
+
.btn {color:#882916;}
            grid-column-end: 3;
+
            grid-row-start: 5;
+
            grid-row-end: 6;
+
        }
+
        .grid11 {
+
            grid-column-start: 1;
+
            grid-column-end: 2;
+
            grid-row-start: 6;
+
            grid-row-end: 7;
+
            margin: 15px;
+
        }
+
  
        .grid12 {
 
            grid-column-start: 2;
 
            grid-column-end: 3;
 
            grid-row-start: 6;
 
            grid-row-end: 7;
 
        }
 
    </style>
 
</head>
 
  
  
 +
/* mouse over button */
 +
a.imglink{
 +
  background:        #000;
 +
  display:            inline-block;
 +
}
 +
a.imglink img{
 +
  vertical-align:    middle;
 +
  transition:        opacity 0.3s;
 +
  -webkit-transition: opacity 0.3s;
 +
}
 +
a.imglink:hover img{
 +
  opacity:            0.5;
 +
}
 +
    </style>
 +
  </head>
 +
 +
 
 
<body style="background-color: #FFFFFF;">
 
<body style="background-color: #FFFFFF;">
    <div class="main">
+
<div class="main">
        <div class="container-fluid">
+
    <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>
+
                        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 class="grid-container">
 
                            <div class="grid1">
 
                                <a href="https://2020.igem.org/Team:Calgary/Bellatrix" class="imglink">
 
                                    <center><img class="img-fluid"
 
                                            src="https://static.igem.org/mediawiki/2020/3/3a/T--Calgary--partcollection.jpg">
 
                                    </center>
 
                                </a>
 
                               
 
                            </div>
 
                            <div class="grid2">
 
                          <h4>GausHaus</h4>
 
                                <br>
 
                                <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>
 
                            </div>
 
                            <div class="grid3">
 
                                <a
 
                                href="https://2020.igem.org/Team:Calgary/Cellulase_General" class="imglink">
 
                                <center><img class="img-fluid"
 
                                        src="https://static.igem.org/mediawiki/2020/f/ff/T--Calgary--validate.jpg">
 
                                    </center></a>
 
                               
 
                            </div>
 
                            <div class="grid4">
 
                                <h4>Bellatrix</h4>
 
                                <br>
 
                                <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>
 
                            </div>
 
  
                            <div class="grid5">
+
      <!-- HEADER/BANNER -->
                                <a
+
      <div class="banner-image">
                                href="https://2020.igem.org/Team:Calgary/Gaushaus" class="imglink">
+
        <div class="banner-text resp">
                                <center><img class="img-fluid"
+
        <h1 style="font-weight: 600; font-family: 'Public Sans', sans-serif;">SOFTWARE</h1>
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg"></center></a>
+
                               
+
                            </div>
+
                            <div class="grid6">
+
                                <h4>STICKS</h4>
+
                                <br />
+
                                <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>
+
                            </div>
+
                            <div class="grid7">
+
                                <a
+
                                href="https://2020.igem.org/Team:Calgary/Metabolic_Flux" class="imglink">
+
                                <center><img class="img-fluid"
+
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg"></center></a>
+
                            </div>
+
                            <div class="grid8">
+
                                <h4>iGAM 2.0</h4>
+
                                <br/>
+
                                    <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>
+
                            </div>
+
                            <div class="grid9">
+
                                <a
+
                                href="https://2020.igem.org/Team:Calgary/Cellobiohydrolase" class="imglink">
+
                                <center><img class="img-fluid"
+
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg"></center></a>
+
                            </div>
+
                            <div class="grid10">
+
                                <h4>Hardware's Software</h4>
+
                                <br/>
+
                                    <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>
+
                            </div>
+
                            <div class="grid11">
+
                                <a
+
                                href="https://2020.igem.org/Team:Calgary/Endoglucanase1" class="imglink">
+
                                <center><img class="img-fluid"
+
                                        src="https://static.igem.org/mediawiki/2020/7/79/T--Calgary--characterize.jpg"></center></a>
+
                            </div>
+
                            <div class="grid12">
+
                                <h4>Our GitHub</h4>
+
                                <br/>
+
                                    <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>
+
                            </div>
+
                        </div>
+
                    </div>
+
                    <br>
+
                    <p>
+
                        Another summary paragraph here :)
+
                    </p>
+
                </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.