Difference between revisions of "Team:Genspace"

Line 1: Line 1:
 
{{Genspace}}
 
{{Genspace}}
<html>
 
<head>
 
<link rel="stylesheet" text="text/css" href="template.css">
 
  
<h2> Welcome to iGEM 2015! </h2>
+
    <div class="showMap">
<p>Our team has been approved and we are ready to start the iGEM season! </p>
+
      <!-- Begin page content -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>
+
      <div class="mapBackground"></div>
 +
      <img id="mapimg" src="https://static.igem.org/mediawiki/2015/5/55/Gowanus_canal.jpg" alt="">
  
 +
      <div class="background"></div>
 +
      <svg id="map" class="showOutline" x="0px" y="0px" viewBox="-53.157 2690.303 1624 3971.865">
 +
        <rect x="-53.157" y="2690.32" opacity="0.5" fill="#FFFFFF" stroke="#8CD1E3" stroke-miterlimit="10" width="1624" height="3971.764"/>
 +
        <polygon class="outline" stroke-linejoin="round" stroke-miterlimit="10" enable-background="new    " points="
 +
          1123.361,4407.782 1119.957,4407.152 1119.576,4403.996 973.628,4391.798 910.539,4329.969 690.985,4380.441 673.786,4387.554
 +
          660.28,4392.5 644.718,4400.491 624.81,4412.828 615.276,4420.4 614.435,4424.604 616.539,4427.97 786.25,4442.901 784.87,4455.566
 +
          837.354,4460.777 835.46,4482.857 591.933,4458.674 576.791,4476.127 564.594,4509.355 557.443,4546.79 582.68,4551.836
 +
          713.066,4564.455 709.912,4599.785 681.731,4596.841 675.001,4589.27 643.035,4587.167 640.933,4590.952 577.843,4583.381
 +
          574.147,4580.432 555.762,4580.438 545.246,4682.222 543.564,4682.222 526.95,4868.338 533.259,4872.964 581.7,4876.997
 +
          580.734,4896.773 531.997,4892.735 526.276,4897.442 521.062,4968.443 519.8,4972.227 525.268,4984.424 518.538,5019.333
 +
          512.65,5038.05 513.878,5051.091 515.594,5102.473 569.57,5281.368 600.737,5285.721 592.756,5357.758 620.515,5441.034
 +
          601.588,5565.945 569.414,5560.268 546.297,5574.724 509.723,5642.437 535.347,5654.899 493.079,5709.154 460.641,5719.423
 +
          426.837,5775.396 802.025,5861.194 774.446,6054.873 760.349,6047.731 752.997,6076.952 342.931,6002.508 332.691,6062.798
 +
          449.211,6090.245 438.824,6138.777 577.306,6164.57 568.549,6194.556 343.9,6151.356 316.74,6136.085 171.902,6108.429
 +
          170.908,6119.659 168.523,6119.56 168.027,6135.955 175.777,6137.742 178.46,6142.512 176.351,6149.064 137.711,6142.236
 +
          134.871,6152.172 331.679,6193.484 330.862,6197.315 362.983,6204.418 357.441,6244.132 494.976,6270.601 502.465,6233.147
 +
          522.099,6237.192 520.837,6241.608 569.854,6251.748 572.358,6248.547 604.111,6254.224 600.327,6285.769 359.334,6251.072
 +
          347.348,6298.453 426.472,6310.932 410.077,6385.752 128.977,6339.251 73.83,6385.752 47.221,6432.31 42.828,6476.969
 +
          51.53,6501.103 374.306,6584.877 359.401,6662.083 10.634,6662.083 -53.157,6646.88 -53.157,5747.243 -13.596,5725.269
 +
          11.827,5898.672 26.135,5895.692 -0.692,5718.625 22.559,5708.492 -4.866,5408.612 50.579,5400.86 128.765,5970.499
 +
          140.986,5969.008 109.688,5740.982 383.938,5697.866 373.214,5532.51 445.81,5522.914 435.039,5449.234 517.683,5434.093
 +
          487.401,5249.248 484.131,5240.62 487.133,5234.261 480.39,5174.233 485.311,5173.904 471.435,5075.453 485.731,5076.116
 +
          488.675,5019.333 476.478,5004.191 484.75,4957.977 483.604,4954.558 486.151,4950.145 514.752,4679.069 506.341,4670.867
 +
          511.331,4665.313 528.422,4544.056 531.997,4510.618 550.503,4460.146 565.646,4436.381 573.427,4426.708 590.04,4407.57
 +
          607.829,4391.805 613.111,4391.973 628.792,4382.263 644.718,4373.712 669.113,4361.515 690.985,4351.419 828.126,4310.067
 +
          830.423,4312.03 897.254,4295.187 915.585,4085.6 870.581,3976.245 872.684,3519.471 902.546,3519.471 902.125,3972.459
 +
          950.915,4078.871 927.782,4310.201 970.263,4356.888 1132.615,4371.189 1130.091,4395.583 1125.044,4395.164 "/>
 +
        <g class="sites">
 +
          <circle id="gcss-01" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="887.405" cy="3544.708" r="10.516"/>
 +
          <circle id="gcss-02" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="887.405" cy="3735.24" r="10.515"/>
 +
          <circle id="gcss-03" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="887.405" cy="3818.519" r="10.515"/>
 +
          <circle id="gcss-04" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="889.929" cy="3986.76" r="10.515"/>
 +
          <circle id="gcss-05" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="927.782" cy="4146.587" r="10.515"/>
 +
          <circle id="gcss-06" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="918.108" cy="4240.802" r="10.515"/>
 +
          <circle id="gcss-07" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="909.696" cy="4312.304" r="10.515"/>
 +
          <circle id="gcss-08" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="1086.349" cy="4388.013" r="10.515"/>
 +
          <circle id="gcss-09" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="741.456" cy="4356.888" r="10.516"/>
 +
          <circle id="gcss-10" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="636.306" cy="4450.261" r="10.516"/>
 +
          <circle id="gcss-11" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="590.04" cy="4572.235" r="10.515"/>
 +
          <circle id="gcss-12" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="525.268" cy="4719.446" r="10.516"/>
 +
          <circle id="gcss-13" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="546.297" cy="4883.901" r="10.515"/>
 +
          <circle id="gcss-14" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="512.65" cy="5195.565" r="10.516"/>
 +
        </g>
 +
      </svg>
 +
    </div>
  
<script>
+
    <div id="page" class="home container">
console.log(d3.selectAll('#contentContainer').html())
+
      <div class="row intro">
 +
        <div class="col-md-5">
 +
          <img src="https://static.igem.org/mediawiki/2015/a/a3/IGEM-genspace-logo-lg.png" alt="">
 +
        </div>
 +
        <div class="col-md-7">
 +
          <div class="page-header">
 +
            <h1> <b>Super<span class="green">FUN</span>d Gowanus!</b>  </h1>
 +
          </div>
 +
          <p class="lead">The Gowanus Canal is a heavily polluted waterway that runs through Brooklyn NY. A designated superfund site, it is slated for cleanup but nearby residents are concerned about the results. Our team is developing a biosensor for waste pollution, giving the community real time access to data on the health of the canal. Additionally we have mined the canal for extremophiles with interesting properties.</p>
 +
          <!-- <img src="https://static.igem.org/mediawiki/2015/2/23/Columbia_NYC_GenspaceLogo.png" alt=""> -->
 +
        </div>
 +
      </div>
 +
      <div class="row">
 +
        <!-- <iframe src="https://www.youtube.com/embed/apROjeiq41o" frameborder="0" allowfullscreen></iframe> -->
 +
        <video preload controls poster="https://static.igem.org/mediawiki/2015/7/79/GowanusCanal_poster.png">
 +
          <source src="https://static.igem.org/mediawiki/2015/c/c4/GowanusCanal_med.mp4" type="video/mp4">
 +
        </video> <p><a href="https://vimeo.com/131812676" target="_blank">What&#039;s In Brooklyn&#039;s Gowanus Canal?</a> from <a href="https://vimeo.com/hakaimagazine">Hakai Magazine</a></p>
 +
      </div>
 +
    </div>
  
</script>
+
    <footer class="footer">
<p>
+
      <div class="container">
<img src="https://static.igem.org/mediawiki/2015/d/db/Team_Genspace_banner.gif">  
+
        <p class="text-muted">Place sticky footer content here.</p>
</p>
+
      </div>
<h4>Before you start: </h4>
+
    </footer>
<p> Please read the following pages:</p>
+
<ul>
+
<li>  <a href="https://2015.igem.org/Requirements">Requirements page </a> </li>
+
<li> <a href="https://2015.igem.org/Wiki_How-To">Wiki Requirements page</a></li>
+
</ul>
+
  
<div class="highlightBox">
+
    <script type="text/javascript">
<h4> Styling your wiki </h4>
+
    //god awful hack to get this to work
<p>You may style this page as you like or you can simply leave the style as it is. You can easily keep the styling and edit the content of these default wiki pages with your project information and completely fulfill the requirement to document your project.</p>
+
    $(function(){
<p>While you may not win Best Wiki with this styling, your team is still eligible for all other awards. This default wiki meets the requirements, it improves navigability and ease of use for visitors, and you should not feel it is necessary to style beyond what has been provided.</p>
+
        $.get( "https://static.igem.org/mediawiki/2015/a/a7/D3.min.txt", function( data ) {
</div>
+
            var resourceContent = data; // can be a global variable too...
 +
            $('body').append($('<script>').html(data))
  
<h4> Editing your wiki </h4>
+
            d3.selectAll('.dropdown')
<p>On this page you can document your project, introduce your team members, document your progress and share your iGEM experience with the rest of the world! </p>
+
              .on('mouseover',function(){ this.classList.add('expand') })
<p> <a href="https://2015.igem.org/wiki/index.php?title=Team:Genspace&action=edit"> Click here to edit this page! </a></p>
+
              .on('mouseout',function(){ this.classList.remove('expand') })
<p>See tips on how to edit your wiki on the <a href="https://2015.igem.org/TemplatesforTeams_Code_Documentation">Template Documentation</a> page.</p>
+
  
 +
            var map = d3.select('#map')
 +
            var img = d3.select('#mapimg')
 +
            var content = d3.select('#page')
 +
            size()
 +
            function size () {
 +
              img.style({
 +
                width:window.innerWidth+'px',
 +
              })
 +
              // content.style({
 +
              //  height:img.node().getBoundingClientRect().height,
 +
              // })
 +
            }
  
<h4>Templates </h4>
+
            d3.select(window).on('resize.index',size)
<p> This year we have created templates for teams to use freely. More information on how to use and edit the templates can be found on the
+
<a href="https://2015.igem.org/TemplatesforTeams_Code_Documentation">Template Documentation </a> page.</p>
+
  
 +
            d3.selectAll('video')
 +
              .on('click',function(){
 +
                  this.play()
 +
              })
  
<h4>Tips</h4>
+
            ready()
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
+
        });
<ul>
+
    });
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
+
    </script>
<li>Be clear about what you are doing and how you plan to do this.</li>
+
   
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
+
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
+
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
+
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="https://2015.igem.org/Calendar_of_Events">iGEM 2015 calendar</a> </li>
+
<li>Have lots of fun! </li>
+
</ul>
+
  
 
+
    <!-- // <script src="js/jquery.min.js" charset="utf-8"></script> -->
<h4>Inspiration</h4>
+
    <!-- // <script src="js/slick.min.js" charset="utf-8"></script> -->
<p> You can also view other team wikis for inspiration! Here are some examples:</p>
+
    <!-- // <script src="js/bootstrap.js" charset="utf-8"></script> -->
<ul>
+
    <!-- // <script src="js/d3.min.js" charset="utf-8"></script> -->
<li> <a href="https://2014.igem.org/Team:SDU-Denmark/"> 2014 SDU Denmark </a> </li>
+
    <!-- // <script src="js/d3-jetpack.js"></script> -->
<li> <a href="https://2014.igem.org/Team:Aalto-Helsinki">2014 Aalto-Helsinki</a> </li>
+
    <!-- // <script src="js/graph-scroll.js"></script> -->
<li> <a href="https://2014.igem.org/Team:LMU-Munich">2014 LMU-Munich</a> </li>
+
    <!-- // <script src="js/shared.js"></script> -->
<li> <a href="https://2014.igem.org/Team:Michigan"> 2014 Michigan</a></li>
+
</body></html>
<li> <a href="https://2014.igem.org/Team:ITESM-Guadalajara">2014 ITESM-Guadalajara </a></li>
+
<li> <a href="https://2014.igem.org/Team:SCU-China"> 2014 SCU-China </a></li>
+
</ul>
+
 
+
<h4> Uploading pictures and files </h4>
+
<p> You can upload your pictures and files to the iGEM 2015 server. Remember to keep all your pictures and files within your team's namespace or at least include your team's name in the file name. <br />
+
When you upload, set the "Destination Filename" to <code>Team:YourOfficialTeamName/NameOfFile.jpg</code>. (If you don't do this, someone else might upload a different file with the same "Destination Filename", and your file would be erased!)</p>
+
 
+
<a href="https://2015.igem.org/Special:Upload">CLICK HERE TO UPLOAD FILES</a>
+
<h4>Our Location</h4>
+
                <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3025.375378691334!2d-73.97977900000004!3d40.6877297!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c25bb25464b153%3A0x663d26fd9a518085!2s33+Flatbush+Ave%2C+Brooklyn%2C+NY+11217!5e0!3m2!1sen!2sus!4v1435872806528" width="400" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>
+
               
+
            </div>
+
</head>
+
</div></div> <!--These are the closing tags for div id="mainContainer" and div id="contentContainer". The corresponding opening tags appear in the template that is {{included}} at the top of this page.-->
+
 
+
 
+
</html>
+

Revision as of 17:17, 18 September 2015

<!DOCTYPE html> Gowanus SuperFUNd - Genspace iGEM 2015

The Gowanus Canal is a heavily polluted waterway that runs through Brooklyn NY. A designated superfund site, it is slated for cleanup but nearby residents are concerned about the results. Our team is developing a biosensor for waste pollution, giving the community real time access to data on the health of the canal. Additionally we have mined the canal for extremophiles with interesting properties.

Place sticky footer content here.

     <img id="mapimg" src="Gowanus_canal.jpg" alt="">
     <svg id="map" class="showOutline" x="0px" y="0px" viewBox="-53.157 2690.303 1624 3971.865">
       <rect x="-53.157" y="2690.32" opacity="0.5" fill="#FFFFFF" stroke="#8CD1E3" stroke-miterlimit="10" width="1624" height="3971.764"/>
       <polygon class="outline" stroke-linejoin="round" stroke-miterlimit="10" enable-background="new    " points="
         1123.361,4407.782 1119.957,4407.152 1119.576,4403.996 973.628,4391.798 910.539,4329.969 690.985,4380.441 673.786,4387.554 
         660.28,4392.5 644.718,4400.491 624.81,4412.828 615.276,4420.4 614.435,4424.604 616.539,4427.97 786.25,4442.901 784.87,4455.566 
         837.354,4460.777 835.46,4482.857 591.933,4458.674 576.791,4476.127 564.594,4509.355 557.443,4546.79 582.68,4551.836 
         713.066,4564.455 709.912,4599.785 681.731,4596.841 675.001,4589.27 643.035,4587.167 640.933,4590.952 577.843,4583.381 
         574.147,4580.432 555.762,4580.438 545.246,4682.222 543.564,4682.222 526.95,4868.338 533.259,4872.964 581.7,4876.997 
         580.734,4896.773 531.997,4892.735 526.276,4897.442 521.062,4968.443 519.8,4972.227 525.268,4984.424 518.538,5019.333 
         512.65,5038.05 513.878,5051.091 515.594,5102.473 569.57,5281.368 600.737,5285.721 592.756,5357.758 620.515,5441.034 
         601.588,5565.945 569.414,5560.268 546.297,5574.724 509.723,5642.437 535.347,5654.899 493.079,5709.154 460.641,5719.423 
         426.837,5775.396 802.025,5861.194 774.446,6054.873 760.349,6047.731 752.997,6076.952 342.931,6002.508 332.691,6062.798 
         449.211,6090.245 438.824,6138.777 577.306,6164.57 568.549,6194.556 343.9,6151.356 316.74,6136.085 171.902,6108.429 
         170.908,6119.659 168.523,6119.56 168.027,6135.955 175.777,6137.742 178.46,6142.512 176.351,6149.064 137.711,6142.236 
         134.871,6152.172 331.679,6193.484 330.862,6197.315 362.983,6204.418 357.441,6244.132 494.976,6270.601 502.465,6233.147 
         522.099,6237.192 520.837,6241.608 569.854,6251.748 572.358,6248.547 604.111,6254.224 600.327,6285.769 359.334,6251.072 
         347.348,6298.453 426.472,6310.932 410.077,6385.752 128.977,6339.251 73.83,6385.752 47.221,6432.31 42.828,6476.969 
         51.53,6501.103 374.306,6584.877 359.401,6662.083 10.634,6662.083 -53.157,6646.88 -53.157,5747.243 -13.596,5725.269 
         11.827,5898.672 26.135,5895.692 -0.692,5718.625 22.559,5708.492 -4.866,5408.612 50.579,5400.86 128.765,5970.499 
         140.986,5969.008 109.688,5740.982 383.938,5697.866 373.214,5532.51 445.81,5522.914 435.039,5449.234 517.683,5434.093 
         487.401,5249.248 484.131,5240.62 487.133,5234.261 480.39,5174.233 485.311,5173.904 471.435,5075.453 485.731,5076.116 
         488.675,5019.333 476.478,5004.191 484.75,4957.977 483.604,4954.558 486.151,4950.145 514.752,4679.069 506.341,4670.867 
         511.331,4665.313 528.422,4544.056 531.997,4510.618 550.503,4460.146 565.646,4436.381 573.427,4426.708 590.04,4407.57 
         607.829,4391.805 613.111,4391.973 628.792,4382.263 644.718,4373.712 669.113,4361.515 690.985,4351.419 828.126,4310.067 
         830.423,4312.03 897.254,4295.187 915.585,4085.6 870.581,3976.245 872.684,3519.471 902.546,3519.471 902.125,3972.459 
         950.915,4078.871 927.782,4310.201 970.263,4356.888 1132.615,4371.189 1130.091,4395.583 1125.044,4395.164 "/>
       <g class="sites">
         <circle id="gcss-01" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="887.405" cy="3544.708" r="10.516"/>
         <circle id="gcss-02" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="887.405" cy="3735.24" r="10.515"/>
         <circle id="gcss-03" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="887.405" cy="3818.519" r="10.515"/>
         <circle id="gcss-04" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="889.929" cy="3986.76" r="10.515"/>
         <circle id="gcss-05" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="927.782" cy="4146.587" r="10.515"/>
         <circle id="gcss-06" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="918.108" cy="4240.802" r="10.515"/>
         <circle id="gcss-07" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="909.696" cy="4312.304" r="10.515"/>
         <circle id="gcss-08" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="1086.349" cy="4388.013" r="10.515"/>
         <circle id="gcss-09" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="741.456" cy="4356.888" r="10.516"/>
         <circle id="gcss-10" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="636.306" cy="4450.261" r="10.516"/>
         <circle id="gcss-11" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="590.04" cy="4572.235" r="10.515"/>
         <circle id="gcss-12" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="525.268" cy="4719.446" r="10.516"/>
         <circle id="gcss-13" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="546.297" cy="4883.901" r="10.515"/>
         <circle id="gcss-14" fill="#FFFFFF" stroke="#000000" stroke-miterlimit="10" cx="512.65" cy="5195.565" r="10.516"/>
       </g>
     </svg>
         <img src="IGEM-genspace-logo-lg.png" alt="">

The Gowanus Canal is a heavily polluted waterway that runs through Brooklyn NY. A designated superfund site, it is slated for cleanup but nearby residents are concerned about the results. Our team is developing a biosensor for waste pollution, giving the community real time access to data on the health of the canal. Additionally we have mined the canal for extremophiles with interesting properties.

       <video preload controls poster="GowanusCanal_poster.png">
         <source src="https://static.igem.org/mediawiki/2015/c/c4/GowanusCanal_med.mp4" type="video/mp4">
</video>

<a href="https://vimeo.com/131812676" target="_blank">What's In Brooklyn's Gowanus Canal?</a> from <a href="https://vimeo.com/hakaimagazine">Hakai Magazine</a>

   <footer class="footer">

Place sticky footer content here.

   </footer>
   <script type="text/javascript">
   //god awful hack to get this to work
   $(function(){
       $.get( "https://static.igem.org/mediawiki/2015/a/a7/D3.min.txt", function( data ) {
           var resourceContent = data; // can be a global variable too...
           $('body').append($('<script>').html(data))
           d3.selectAll('.dropdown')
             .on('mouseover',function(){ this.classList.add('expand') })
             .on('mouseout',function(){ this.classList.remove('expand') })
           var map = d3.select('#map')
           var img = d3.select('#mapimg')
           var content = d3.select('#page')
           size()
           function size () {
             img.style({
               width:window.innerWidth+'px',
             })
             // content.style({
             //   height:img.node().getBoundingClientRect().height,
             // })
           }
           d3.select(window).on('resize.index',size)
           d3.selectAll('video')
             .on('click',function(){
                 this.play()
             })
           ready()
       });
   });
   </script>
   

</body></html>