Team:Gaston Day School/Parts

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
{{CSS/Main}}
{{CSS/Main}}
 +
<html>
 +
<style>
 +
[class*='grid']
 +
{
 +
text-align: center;
 +
                        Width: 100%;
 +
}
 +
[class*='row']
 +
{
 +
width: 100%;
 +
}
-
<html>
+
[class*='column']
 +
{
 +
float: left;
 +
width: 16%;
 +
                        margin:10px;
 +
                        Border: 1px solid #000000;
 +
                        Background-color: #ffffff;
 +
}
 +
               
 +
                body
 +
                {
 +
                        font-size: 80%;
 +
                        font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
 +
                        background-image: url("http://newevolutiondesigns.com/images/freebies/retro-wallpaper-1.jpg");
 +
                        width:80%;
 +
                        margin-left: 10%;
 +
                        margin-right: 10%;
 +
                }
-
<body>
+
                ul#tabs
-
<canvas id="myCanvas" resize></canvas>
+
-
</body>
+
-
<style type="text/css">
+
-
#groupparts {text-align: center; margin-left: auto; margin-right: auto;}
+
-
</style>
+
-
<!--main content -->
+
-
<table width="70%" align="center">
+
 +
                {
 +
                        list-style-type: none; padding: 0 0 0.3em 0;
 +
                }
-
<!--welcome box -->
+
                ul#tabs li
-
<tr>
+
                {
-
<td style="border:1px solid black;" colspan="3" align="center" height="150px" bgColor=#FF404B>
+
                        display: inline;
-
<h1 >WELCOME TO iGEM 2014! </h1>
+
                }
-
<p>Your team has been approved and you are ready to start the iGEM season!
+
             
-
<br>On this page you can document your project, introduce your team members, document your progress <br> and share your iGEM experience with the rest of the world! </p>
+
                ul#tabs li a
-
<br>
+
                {
-
<p style="color:#E7E7E7"> <a href="https://2014.igem.org/wiki/index.php?title=Team:Gaston_Day_School/Parts&action=edit"style="color:#FFFFFF"> Click here  to edit this page!</a> </p>
+
                        color: #42454a;
-
</td>
+
                        background-color: #fefefe;
-
</tr>
+
                        border: 1px solid #000000;
-
<script type="text/javascript" src="js/paper.js"></script>
+
                        border-bottom: none;  
-
<!-- Define inlined PaperScript associate it with myCanvas -->
+
                        padding: 0.3em;  
-
<script type="text/paperscript" canvas="myCanvas">
+
                        border-radius: 5px;
-
// Create a Paper.js Path to draw a line into it:
+
                        text-decoration: none;
-
var path = new Path();
+
                }     
-
// Give the stroke a color
+
-
path.strokeColor = 'black';
+
-
var start = new Point(100, 100);
+
-
// Move to start and draw a line from there
+
-
path.moveTo(start);
+
-
// Note the plus operator on Point objects.
+
-
// PaperScript does that for us, and much more!
+
-
path.lineTo(start + [ 100, -50 ]);
+
-
</script>
+
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
-
<!-- end welcome box -->
+
-
<tr>
+
-
<!--navigation menu -->
+
                ul#tabs li a:hover
-
<td align="center" colspan="3">
+
                {
 +
                        background-color: #ffffff;
 +
                }
-
<table  width="100%">
+
                ul#tabs li a.selected
-
<tr heigth="15px"></tr>
+
                {
-
<tr heigth="75px">
+
                        color: #000; background-color: #ffffff; font-weight: bold; padding: 0.7em 0.3em 0.38em 0.3em;
 +
                }
 +
                div.tabContent
 +
                {
 +
                        border: 1px solid #000000;
 +
                        background-color: #ffffff;
 +
                        float: left;
 +
                        border-radius: 5px;
 +
                        width: 100%;
 +
                        padding: 0.5em;
 +
                }
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
+
                div.tabContent.hide
-
<a href="https://2014.igem.org/Team:Gaston_Day_School"style="color:#000000">Home </a> </td>
+
                {
 +
                        display: none;
 +
                }
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
        </style>
-
<a href="https://2014.igem.org/Team:Gaston_Day_School/Team"style="color:#000000"> Team </a> </td>
+
-
<td style="border:1px solid black;" align="center"  height ="45px"  onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-
<a href="https://igem.org/Team.cgi?year=2014&team_name=Gaston_Day_School"style="color:#000000"> Official Team Profile </a></td>
+
-
<td style="border:1px solid black" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
+
        <script>
-
<a href="https://2014.igem.org/Team:Gaston_Day_School/Project"style="color:#000000"> Project</a></td>
+
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
<!-- Tabs -->
-
<a href="https://2014.igem.org/Team:Gaston_Day_School/Parts"style="color:#000000"> Parts</a></td>
+
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
                var tabLinks = new Array();
-
<a href="https://2014.igem.org/Team:Gaston_Day_School/Modeling"style="color:#000000"> Modeling</a></td>
+
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7> 
+
                var contentDivs = new Array();
-
<a href="https://2014.igem.org/Team:Gaston_Day_School/Notebook"style="color:#000000"> Notebook</a></td>
+
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
                function init()
-
<a href="https://2014.igem.org/Team:Gaston_Day_School/Safety"style=" color:#000000"> Safety </a></td>
+
                {
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
// Grab the tab links and content divs from the page
-
<a href="https://2014.igem.org/Team:Gaston_Day_School/Attributions"style="color:#000000"> Attributions </a></td>
+
 +
                        var tabListItems = document.getElementById('tabs').childNodes;
-
<td align ="center"> <a href="https://2014.igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
+
                        for ( var i = 0; i < tabListItems.length; i++ )
-
</tr>
+
                        {
-
</table>
+
                                if ( tabListItems[i].nodeName == "LI" )
 +
                                      {
 +
                                              var tabLink = getFirstChildWithTagName( tabListItems[i], 'A' );                                    var id = getHash( tabLink.getAttribute('href') );
-
<!--end navigation menu -->
+
                                              tabLinks[id] = tabLink;
-
</tr>
+
 +
                                              contentDivs[id] = document.getElementById( id );
 +
                                      }
-
</tr>
+
                        }
-
+
 +
// Assign onclick events to the tab links, and
 +
// highlight the first tab
 +
                        var i = 0;
-
</td>
+
                        for ( var id in tabLinks )
 +
                        {
 +
                                tabLinks[id].onmouseover = showTab;
 +
                                tabLinks[id].onfocus = function() { this.blur() };
 +
                                if ( i == 0 ) tabLinks[id].className = 'selected';
-
<tr> <td colspan="3"  height="15px"> </td></tr>
+
                                i++;
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
+
                        }
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
 +
// Hide all content divs except the first
-
<!--Parts Submitted to the Registry  -->
+
                        var i = 0;
-
<tr><td > <h3> Parts Submitted to the Registry </h3></td>
+
-
<td ></td >
+
-
<td > <h3>What information do I need to start putting my parts on the Registry? </h3></td>
+
-
</tr>
+
-
<tr>
+
-
<td width="45%"  valign="top">
+
-
<p>
+
-
An important aspect of the iGEM competition is the use and creation of standard  biological parts. Each team will make new parts during iGEM and will submit them to the <a href="http://partsregistry.org"> Registry of Standard Biological Parts</a>. The iGEM software provides an easy way to present the parts your team has created. The "groupparts" tag will generate a table with all of the parts that your team adds to your team sandbox. 
+
-
<p>
+
                        for ( var id in contentDivs )
-
<strong>Note that if you want to document a part you need to document it on the <a href="http://partsregistry.org Registry"> Registry</a>, not on your team wiki.</strong> Future teams and other users and are much more likely to find parts on the Registry than on your team wiki.  
+
                        {
-
</p>
+
                                if ( i != 0 ) contentDivs[id].className = 'tabContent hide'; 
 +
                                i++;
 +
                        }
-
<p>
+
                }
-
Remember that the goal of proper part documentation is to describe and define a part, so that it can be used without a need to refer to the primary literature. Registry users in future years should be able to read your documentation and be able to use the part successfully. Also, you should provide proper references to acknowledge previous authors and to provide for users who wish to know more.
+
-
</p>
+
 +
  function showTab()
 +
  {
-
<h3>When should you put parts into the Registry?</h3>
+
    var selectedId = getHash( this.getAttribute('href') );
-
<p>
+
    // Highlight the selected tab, and dim all others.
-
As soon as possible! We encourage teams to start completing documentation for their parts on the Registry as soon as you have it available. The sooner you put up your parts, the better recall you will have of all details surrounding your parts. Remember you don't need to send us the DNA to create an entry for a part on the Registry. However, you must send us the sample/DNA before the Jamboree. Only parts for which you have sent us samples/DNA are eligible for awards and medal requirements.
+
-
</p>
+
-
</td>
+
-
<td > </td>
+
    // Also show the selected content div, and hide all others.
-
<td width="45%" valign="top">
+
-
<p>
+
    for ( var id in contentDivs )
-
The information needed to initially create a part on the Registry is:
+
-
</p>
+
-
<ol>
+
-
<li>Part Name</li>
+
    {
-
<li>Part type</li>
+
-
<li>Creator</li>
+
-
<li>Sequence</li>
+
-
<li>Short Description (60 characters on what the DNA does)</li>
+
-
<li>Long Description (Longer description of what the DNA does)</li>
+
-
<li>Design considerations</li>
+
-
</ol>
+
-
<p>
+
    if ( id == selectedId )
-
We encourage you to put up <em>much more</em> information as you gather it over the summer. If you have images, plots, characterization data and other information, please also put it up on the part page. Check out part <a href="http://parts.igem.org/Part:BBa_K404003">BBa_K404003</a> for an excellent example of a highly characterized part.
+
-
</p>
+
-
<p>
+
    {
-
You can add parts to the Registry at our <a href="http://parts.igem.org/Add_a_Part_to_the_Registry"> Add a Part to the Registry</a> link.
+
-
</p>
+
-
</td>
+
-
</tr>
+
 +
      tabLinks[id].className = 'selected';
-
<tr> <td colspan="3"  height="15px"> </td></tr>
+
      contentDivs[id].className = 'tabContent';
-
<tr><td colspan="3" > <h3> Parts Table</h3></td></tr>
+
    }
 +
    else
-
<tr><td width="45%" colspan="3"  valign="top">
+
    {
-
Any parts your team has created will appear in this table below:</td></tr>
+
-
</table>
+
      tabLinks[id].className = '';
-
</html>
+
-
<groupparts>iGEM013 Gaston_Day_School</groupparts>
+
      contentDivs[id].className = 'tabContent hide';
 +
 
 +
    }
 +
 
 +
    }
 +
 
 +
    // Stop the browser following the link
 +
 
 +
    return false;
 +
 
 +
  }
 +
 
 +
  function getFirstChildWithTagName( element, tagName )
 +
 
 +
  {
 +
 
 +
    for ( var i = 0; i < element.childNodes.length; i++ )
 +
 
 +
    {
 +
 
 +
    if ( element.childNodes[i].nodeName == tagName )
 +
 
 +
    return element.childNodes[i];
 +
 
 +
    }
 +
 
 +
  }
 +
 
 +
  function getHash( url )
 +
 
 +
  {
 +
 
 +
    var hashPos = url.lastIndexOf ( '#' );
 +
 
 +
    return url.substring( hashPos + 1 );
 +
 
 +
  }
 +
 
 +
  </script>
 +
 
 +
</head>
 +
 
 +
 
 +
 
 +
<body onload="init()" background-image=" url("http://images.dailytech.com/nimage/Nyan_Cat_Wide.jpg")">
 +
 
 +
  <!--main content →
 +
 
 +
 
 +
  <!--Tabs(NOT SLIDESHOW!) -->
 +
 
 +
<div style="padding-left: 10px;">
 +
 
 +
  <ul id="tabs">
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School#home">Home</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Team#team">Members</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Project#project">Project</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Measurementtrack#measure">Measurement Track</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Parts#parts">Parts</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Modeling#models">Models</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Notebook#notebook">Notebook</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Safety#safety">Safety</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Team:Gaston_Day_School/Attributions#attrib">Attributions</a></li>
 +
 
 +
    <li><a href="https://2014.igem.org/Main_Page#igem"><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px" position="absolute"></a></li>
 +
 
 +
  </ul>
 +
 
 +
  <!--Tab Content-->
 +
 
 +
  <div class="tabContent" id="home">
 +
 
 +
    <h2>Home</h2>
 +
 
 +
                  <p> in tha hizzle</p>
 +
 
 +
  </div>
 +
 
 +
  <div class="tabContent" id="team">
 +
 
 +
    <h2>Team</h2>
 +
 
 +
    <p>Teem stuff</p>
 +
 
 +
  </div>
 +
 
 +
  <div class="tabContent" id="project">
 +
 
 +
    <h2>Project</h2>
 +
 
 +
    <p>Project things </p>
 +
 
 +
  </div>
 +
 
 +
  <div class="tabContent" id="measure">
 +
 
 +
    <h2>Measurement Track</h2>
 +
 
 +
    <p>Measurement stuff </p>
 +
 
 +
  </div>
 +
 
 +
  <div class="tabContent" id="parts">
 +
 
 +
  <h2>Parts</h2>
 +
 
 +
    <p>Parts </p>
 +
 
 +
  </div>
 +
 
 +
<div class="tabContent" id="models">
 +
 
 +
<h2>Models</h2>
 +
<p>Models </p>
 +
</div>
 +
 
 +
<div class="tabContent" id="notebook">
 +
<h2>Notebook</h2>
 +
<p>Notebook writings </p>
 +
</div>
 +
 
 +
<div class="tabContent" id="safety">
 +
<h2>Safety</h2>
 +
<p>Safety shloop  </p>
 +
</div>
 +
 
 +
<div class="tabContent" id="attrib">
 +
<h2>Attributions</h2>
 +
<p>Attributes 'n shiz </p>
 +
</div>
 +
 
 +
<div class="tabContent" id="igem">
 +
<h2>Homepage</h2>
 +
<p>Go to, ja!</p>
 +
</div>
 +
 +
</html>

Revision as of 13:35, 14 July 2014

Home

in tha hizzle

Team

Teem stuff

Project

Project things

Measurement Track

Measurement stuff

Parts

Parts

Models

Models

Notebook

Notebook writings

Safety

Safety shloop

Attributions

Attributes 'n shiz

Homepage

Go to, ja!