Team:Dundee/dnaapp

From 2011.igem.org

(Difference between revisions)
(Created page with "<html> <head> <link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="https://2011.igem.org/Team:Dundee...")
Line 35: Line 35:
<div id="container">
<div id="container">
<div id="content">
<div id="content">
-
       
+
<div id="menu">
-
                <div class="imagepost">
+
<button type="button" class="currentTab" onclick="showTab(this, 'dnaFunctions')">DNA -> Amino Acids</button>
-
        </div>
+
<button type="button" onclick="showTab(this, 'dnaToProtein')">DNA -> Protein</button>
-
 
+
<button type="button" onclick="showTab(this, 'aminoToCodon')">DNA Codon Table</button>
-
       
+
<button type="button" onclick="showTab(this, 'backTranslate')">Back Translate</button>
-
 
+
</div>
-
 
+
<div id="frameOptions">
-
 
+
<h2>Frame - </h2>
-
+
<label for="firstFrameCheck">1st:</label><input type="radio" id="firstFrameCheck" onclick="setFrame(1)">
-
<div class="navigation">
+
<label for="secondFrameCheck">2nd:</label><input type="radio" id="secondFrameCheck" onclick="setFrame(2)">
-
  </div>
+
<label for="thirdFrameCheck">3rd:</label><input type="radio" id="thirdFrameCheck" onclick="setFrame(3)">
 +
</div>
 +
<div id="dnaFunctions" class="tabDiv">
 +
<canvas id="dnaVis" height="150" width="800">
 +
</canvas>
 +
<div id="inputFields">
 +
<input type="text" name="first" id="firstInput" maxlength="1" onkeyup="moveInput(this, 'secondInput')" autofocus />
 +
<input type="text" name="second" id="secondInput" maxlength="1" onkeyup="moveInput(this, 'thirdInput')" />
 +
<input type="text" name="third" id="thirdInput" maxlength="1" onkeyup="updateInputCodons()" />
 +
</div>
 +
<div id="buttons">
 +
<button type="button" onclick="clearDNA()">Clear</button>
 +
<button type="button" onclick="showPasteArea()">Paste Sequence</button>
 +
</div>
 +
<div>
 +
<textarea id="pasteArea" rows="5" onkeyup="pasteDNA()"></textarea>
 +
</div>
 +
<div id="functions">
 +
<div id="normal">
 +
<h1 class="activeFunction" onclick="mapToAminoAcids('normal')">Normal:</h1>
 +
<p id="normal-p"></p>
 +
</div>
 +
<div id="reverse">
 +
<h1 onclick="mapToAminoAcids('reverse')">Reverse:</h1>
 +
<p id="reverse-p"></p>
 +
</div>
 +
<div id="comp">
 +
<h1 onclick="mapToAminoAcids('comp')">Complementary:</h1>
 +
<p id="comp-p"></p>
 +
</div>
 +
<div id="reverseComp">
 +
<h1 onclick="mapToAminoAcids('reverseComp')">Reverse Complimentary:</h1>
 +
<p id="reverseComp-p"></p>
 +
</div>
 +
<div id="aminoTable">
 +
<table>
 +
<thead>
 +
<th class="tbCodonNumber">#</th>
 +
<th class="tbCodon">Codon</th>
 +
<th class="tbAmino">Amino Acid</th>
 +
<th class="tbCodonNumber">#</th>
 +
<th class="tbCodon">Codon</th>
 +
<th class="tbAmino">Amino Acid</th>
 +
<th class="tbCodonNumber">#</th>
 +
<th class="tbCodon">Codon</th>
 +
<th class="tbAmino">Amino Acid</th>
 +
</thead>
 +
<tbody id="tBody">
 +
</tbody>
 +
</table>
 +
</div>
 +
</div>
 +
</div>
 +
<div id="dnaToProtein" class="tabDiv">
 +
<label>Enter your DNA sequence:</label><br />
 +
<textarea rows="5" id="sequence"></textarea>
 +
<button type="button" onclick="lookup()">Convert</button>
 +
<h1>Results:</h1>
 +
<div id="dnaToProteinResults"></div>
 +
</div>
 +
<div id="aminoToCodon" class="tabDiv">
 +
<input id="aminoAcidInput" type="text" onkeyup="showAminoAcid(this.value)" />
 +
<table id="dnaCodonTable">
 +
<tbody>
 +
<tr>
 +
<th rowspan="2" colspan="2" class="greyTd"></th>
 +
<th colspan="8" class="greyTd">2nd Base</th>
 +
</tr>
 +
<tr>
 +
<th colspan="2" class="greyTd">T</th>
 +
<th colspan="2" class="greyTd">C</th>
 +
<th colspan="2" class="greyTd">A</th>
 +
<th colspan="2" class="greyTd">G</th>
 +
</tr>
 +
<tr>
 +
<th rowspan="17" class="greyTd">1st Base</th>
 +
<td rowspan="5" class="greyTd">T</th>
 +
</tr>
 +
<tr>
 +
<td>TTT</td>
 +
<td class="ac-ph">(Phe/F) Phenylalanine</td>
 +
<td>TCT</td>
 +
<td class="ac-se">(Ser/S) Serine</td>
 +
<td>TAT</td>
 +
<td class="ac-ty">(Tyr/Y) Tyrosine</td>
 +
<td>TGT</td>
 +
<td class="ac-cy">(Cys/C) Cysteine</td>
 +
</tr>
 +
<tr>
 +
<td>TTC</td>
 +
<td class="ac-ph">(Phe/F) Phenylalanine</td>
 +
<td>TCC</td>
 +
<td class="ac-se">(Ser/S) Serine</td>
 +
<td>TAC</td>
 +
<td class="ac-ty">(Tyr/Y) Tyrosine</td>
 +
<td>TGC</td>
 +
<td class="ac-cy">(Cys/C) Cysteine</td>
 +
</tr>
 +
<tr>
 +
<td>TTA</td>
 +
<td class="ac-le">(Leu/L) Leucine</td>
 +
<td>TCA</td>
 +
<td class="ac-se">(Ser/S) Serine</td>
 +
<td>TAA</td>
 +
<td class="ac-st">Stop (Ochre)</td>
 +
<td>TGA</td>
 +
<td class="ac-st">Stop (Opal)</td>
 +
</tr>
 +
<tr>
 +
<td>TTG</td>
 +
<td class="ac-le">(Leu/L) Leucine</td>
 +
<td>TCG</td>
 +
<td class="ac-se">(Ser/S) Serine</td>
 +
<td>TAG</td>
 +
<td class="ac-st">Stop (Amber)</td>
 +
<td>TGG</td>
 +
<td class="ac-tr">(Trp/W) Tryptophan</td>
 +
</tr>
 +
<tr>
 +
<td rowspan="4" class="greyTd">C</td>
 +
<td>CTT</td>
 +
<td class="ac-le">(Leu/L) Leucine</td>
 +
<td>CCT</td>
 +
<td class="ac-pr">(Pro/P) Proline</td>
 +
<td>CAT</td>
 +
<td class="ac-hi">(His/H) Histidine</td>
 +
<td>CGT</td>
 +
<td class="ac-ar">(Arg/R) Arginine</td>
 +
</tr>
 +
<tr>
 +
<td>CTC</td>
 +
<td class="ac-le">(Leu/L) Leucine</td>
 +
<td>CCC</td>
 +
<td class="ac-pr">(Pro/P) Proline</td>
 +
<td>CAC</td>
 +
<td class="ac-hi">(His/H) Histidine</td>
 +
<td>CGC</td>
 +
<td class="ac-ar">(Arg/R) Arginine</td>
 +
</tr>
 +
<tr>
 +
<td>CTA</td>
 +
<td class="ac-le">(Leu/L) Leucine</td>
 +
<td>CCA</td>
 +
<td class="ac-pr">(Pro/P) Proline</td>
 +
<td>CAA</td>
 +
<td class="ac-gl">(Gln/Q) Glutamine</td>
 +
<td>CGA</td>
 +
<td class="ac-ar">(Arg/R) Arginine</td>
 +
</tr>
 +
<tr>
 +
<td>CTG</td>
 +
<td class="ac-le">(Leu/L) Leucine</td>
 +
<td>CCG</td>
 +
<td class="ac-pr">(Pro/P) Proline</td>
 +
<td>CAG</td>
 +
<td class="ac-gl">(Gln/Q) Glutamine</td>
 +
<td>CGG</td>
 +
<td class="ac-ar">(Arg/R) Arginine</td>
 +
</tr>
 +
<tr>
 +
<td rowspan="4" class="greyTd">A</td>
 +
<td>ATT</td>
 +
<td class="ac-is">(Ile/I) Isoleucine</td>
 +
<td>ACT</td>
 +
<td class="ac-th">(Thr/T) Threonine</td>
 +
<td>AAT</td>
 +
<td class="ac-as">(Asn/N) Asparagine</td>
 +
<td>AGT</td>
 +
<td class="ac-se">(Ser/S) Serine</td>
 +
</tr>
 +
<tr>
 +
<td>ACT</td>
 +
<td class="ac-is">(Ile/I) Isoleucine</td>
 +
<td>ACC</td>
 +
<td class="ac-th">(Thr/T) Threonine</td>
 +
<td>AAC</td>
 +
<td class="ac-as">(Asn/N) Asparagine</td>
 +
<td>AGC</td>
 +
<td class="ac-se">(Ser/S) Serine</td>
 +
</tr>
 +
<tr>
 +
<td>ATA</td>
 +
<td class="ac-is">(Ile/I) Isoleucine</td>
 +
<td>ACA</td>
 +
<td class="ac-th">(Thr/T) Threonine</td>
 +
<td>AAA</td>
 +
<td class="ac-ly">(Lys/K) Lysine</td>
 +
<td>AGA</td>
 +
<td class="ac-ar">(Arg/R) Arginine</td>
 +
</tr>
 +
<tr>
 +
<td>ATG</td>
 +
<td class="ac-me">(Met/M) Methionine</td>
 +
<td>ACG</td>
 +
<td class="ac-th">(Thr/T) Threonine</td>
 +
<td>AAG</td>
 +
<td class="ac-ly">(Lys/K) Lysine</td>
 +
<td>AGG</td>
 +
<td class="ac-ar">(Arg/R) Arginine</td>
 +
</tr>
 +
<tr>
 +
<td rowspan="4" class="greyTd">G</td>
 +
<td>GTT</td>
 +
<td class="ac-va">(Val/V) Valine</td>
 +
<td>GCT</td>
 +
<td class="ac-al">(Ala/A) Alanine</td>
 +
<td>GAT</td>
 +
<td class="ac-as">(Asp/D) Aspartic Acid</td>
 +
<td>GGT</td>
 +
<td class="ac-gl">(Gly/G) Glycine</td>
 +
</tr>
 +
<tr>
 +
<td>GTC</td>
 +
<td class="ac-va">(Val/V) Valine</td>
 +
<td>GCC</td>
 +
<td class="ac-al">(Ala/A) Alanine</td>
 +
<td>GAC</td>
 +
<td class="ac-as">(Asp/D) Aspartic Acid</td>
 +
<td>GGC</td>
 +
<td class="ac-gl">(Gly/G) Glycine</td>
 +
</tr>
 +
<tr>
 +
<td>GTA</td>
 +
<td class="ac-va">(Val/V) Valine</td>
 +
<td>GCA</td>
 +
<td class="ac-al">(Ala/A) Alanine</td>
 +
<td>GAA</td>
 +
<td class="ac-gl">(Glu/E) Glutamic Acid</td>
 +
<td>GGA</td>
 +
<td class="ac-gl">(Gly/G) Glycine</td>
 +
</tr>
 +
<tr>
 +
<td>GTG</td>
 +
<td class="ac-va">(Val/V) Valine</td>
 +
<td>GCG</td>
 +
<td class="ac-al">(Ala/A) Alanine</td>
 +
<td>GAG</td>
 +
<td class="ac-gl">(Glu/E) Glutamic Acid</td>
 +
<td>GGG</td>
 +
<td class="ac-gl">(Gly/G) Glycine</td>
 +
</tr>
 +
</tbody>
 +
</table>
 +
</div>
 +
<div id="backTranslate" class="tabDiv">
 +
<label>Enter your protein chain:</label><br />
 +
<textarea rows="5" id="proteinChain" onkeyup="backTranslate(this.value)"></textarea>
 +
<h1>Results:</h1>
 +
<div id="backTranslateResults"></div>
 +
</div>

Revision as of 09:35, 7 July 2011

Frame -

Normal:

Reverse:

Complementary:

Reverse Complimentary:

# Codon Amino Acid # Codon Amino Acid # Codon Amino Acid

Results:

2nd Base
T C A G
1st Base T
TTT (Phe/F) Phenylalanine TCT (Ser/S) Serine TAT (Tyr/Y) Tyrosine TGT (Cys/C) Cysteine
TTC (Phe/F) Phenylalanine TCC (Ser/S) Serine TAC (Tyr/Y) Tyrosine TGC (Cys/C) Cysteine
TTA (Leu/L) Leucine TCA (Ser/S) Serine TAA Stop (Ochre) TGA Stop (Opal)
TTG (Leu/L) Leucine TCG (Ser/S) Serine TAG Stop (Amber) TGG (Trp/W) Tryptophan
C CTT (Leu/L) Leucine CCT (Pro/P) Proline CAT (His/H) Histidine CGT (Arg/R) Arginine
CTC (Leu/L) Leucine CCC (Pro/P) Proline CAC (His/H) Histidine CGC (Arg/R) Arginine
CTA (Leu/L) Leucine CCA (Pro/P) Proline CAA (Gln/Q) Glutamine CGA (Arg/R) Arginine
CTG (Leu/L) Leucine CCG (Pro/P) Proline CAG (Gln/Q) Glutamine CGG (Arg/R) Arginine
A ATT (Ile/I) Isoleucine ACT (Thr/T) Threonine AAT (Asn/N) Asparagine AGT (Ser/S) Serine
ACT (Ile/I) Isoleucine ACC (Thr/T) Threonine AAC (Asn/N) Asparagine AGC (Ser/S) Serine
ATA (Ile/I) Isoleucine ACA (Thr/T) Threonine AAA (Lys/K) Lysine AGA (Arg/R) Arginine
ATG (Met/M) Methionine ACG (Thr/T) Threonine AAG (Lys/K) Lysine AGG (Arg/R) Arginine
G GTT (Val/V) Valine GCT (Ala/A) Alanine GAT (Asp/D) Aspartic Acid GGT (Gly/G) Glycine
GTC (Val/V) Valine GCC (Ala/A) Alanine GAC (Asp/D) Aspartic Acid GGC (Gly/G) Glycine
GTA (Val/V) Valine GCA (Ala/A) Alanine GAA (Glu/E) Glutamic Acid GGA (Gly/G) Glycine
GTG (Val/V) Valine GCG (Ala/A) Alanine GAG (Glu/E) Glutamic Acid GGG (Gly/G) Glycine

Results:

twitter bird

Find us on Facebook

Follow us on Twitter


Retrieved from "http://2011.igem.org/Team:Dundee/dnaapp"