Team:LMU-Munich/Primer Design/Design Primers

From 2011.igem.org

(Difference between revisions)
(mathias: javascript enzyme selector (it's not pretty, but it appears to work…))
 
(9 intermediate revisions not shown)
Line 36: Line 36:
#content-full label {
#content-full label {
clear: both;
clear: both;
 +
}
 +
 +
.radios {
 +
clear: right;
 +
}
 +
 +
.radios div {
 +
width: 180px;
 +
float: right;
 +
}
 +
 +
.radios input {
 +
float: none;
 +
width: auto;
 +
}
 +
 +
.radios label {
 +
clear: none;
}
}
</style>
</style>
<form action="http://wrtlprnft.ath.cx/~igem/primer_designer/primer_designer.php" method="post" enctype="multipart/form-data" target="result">
<form action="http://wrtlprnft.ath.cx/~igem/primer_designer/primer_designer.php" method="post" enctype="multipart/form-data" target="result">
-
<div class="leftbox" style="width: 630px">
+
<div class="rightbox" style="width: 290px;">
 +
<h2>Options</h2>
 +
<div class="radios">
 +
Mode:
 +
<div>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="cmode" value="coding" id="radio-coding" />Coding
 +
  </label>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="cmode" value="noncoding" checked="checked" id="radio-noncoding" />Non-Coding
 +
  </label>
 +
</div>
 +
</div>
 +
<div class="radios">
 +
Standard:
 +
<div>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="standard" value="biobrick" checked="checked" />Classic Biobrick
 +
  </label>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="standard" value="freiburg" />Freiburg
 +
  </label>
 +
</div>
 +
</div>
 +
<div class="radios">
 +
Check for restriction sites?
 +
<div>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="restriction" value="yes"  />Yes
 +
  </label>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="restriction" value="only" checked="checked"/>Only used for Biobricks
 +
  </label>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="restriction" value="no" />No
 +
  </label>
 +
</div>
 +
</div>
 +
<!--
 +
<div class="radios">
 +
Melting point:
 +
<div>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="melting" value="wallace" checked="checked" id="wallace" />Wallace
 +
  </label>
 +
  <label style="clear: none;">
 +
  <input type="radio" name="melting" value="entropy" id="entropy" />Entropy based
 +
  </label>
 +
</div>
 +
</div>
 +
<label>Na<sup>+</sup> concentration: <input type="text" name="na" id="na" value="0.8" /></label>
 +
-->
 +
</div>
 +
<div id="coding1" class="leftbox" style="width: 630px">
<input type="hidden" name="mode" value="primer" />
<input type="hidden" name="mode" value="primer" />
-
<p><label><h2>Before 5'</h2>
+
<p><label for="seq_n"><h2>Upstream region</h2></label>
-
<textarea name="seq_n" cols="40" rows="6" style="width: 98%; margin: 0; padding: 0;"></textarea></label></p>
+
<label>Primer Length: <input type="text" id="length_n" name="length_n" value="20" /></label>
 +
<textarea name="seq_n" id="seq_n" cols="40" rows="6" style="width: 98%; margin: 0; padding: 0;"></textarea></p>
<p><label>You can also upload a FASTA file: <input type="file" name="seq_n-file" /></label></p>
<p><label>You can also upload a FASTA file: <input type="file" name="seq_n-file" /></label></p>
</div>
</div>
 +
<div id="coding2" class="leftbox" style="width: 630px">
 +
<p><label for="seq_c"><h2>Downstream region</h2></label>
 +
<label>Primer Length: <input type="text" id="length_c" name="length_c" value="20" /></label>
 +
<textarea name="seq_c" id="seq_c" cols="40" rows="6" style="width: 98%; margin: 0; padding: 0;"></textarea></p>
 +
<p><label>You can also upload a FASTA file: <input type="file" name="seq_c-file" /></label></p>
 +
</div>
 +
<!--
<div class="rightbox" style="width: 290px;">
<div class="rightbox" style="width: 290px;">
<h3>Options</h3>
<h3>Options</h3>
Line 50: Line 129:
<label>Primer Length: <input type="text" name="length_n" value="20" /></label>
<label>Primer Length: <input type="text" name="length_n" value="20" /></label>
</div>
</div>
-
<div class="leftbox" style="width: 630px">
+
-->
-
<p><label><h2>After 3'</h2>
+
<div id="noncoding" class="leftbox" style="width: 630px">
-
<textarea name="seq_c" cols="40" rows="6" style="width: 98%; margin: 0; padding: 0;"></textarea></label></p>
+
<p><label><h2>Coding Sequence</h2>
-
<p><label>You can also upload a FASTA file: <input type="file" name="seq_c-file" /></label></p>
+
-
</div>
+
-
<div class="rightbox" style="width: 290px;">
+
-
<h3>Options</h3>
+
-
<label>Restriction Enzyme: <input type="text" name="enzyme_c" id="enzyme_c" /></label>
+
-
<label>Primer Length: <input type="text" name="length_c" value="20" /></label>
+
-
</div>
+
-
<div class="leftbox" style="width: 630px">
+
-
<p><label><h2>Surrounding Region</h2>
+
<textarea name="seq" cols="40" rows="6" style="width: 98%; margin: 0; padding: 0;"></textarea></label></p>
<textarea name="seq" cols="40" rows="6" style="width: 98%; margin: 0; padding: 0;"></textarea></label></p>
<p><label>You can also upload a FASTA file: <input type="file" name="seq-file" /></label></p>
<p><label>You can also upload a FASTA file: <input type="file" name="seq-file" /></label></p>
</div>
</div>
<div class="rightbox" style="width: 290px;">
<div class="rightbox" style="width: 290px;">
-
<h2>Options</h2>
+
<input type="submit" style="width: 99%;" value="Submit" />
-
Melting point:<div style="width:150px; float:right"><label style="clear: none;"><input type="radio" name="melting" value="wallace" checked="checked" style="float: none; width: auto" id="wallace" />Wallace</label><label style="clear: none;"><input type="radio" name="melting" value="entropy" style="float: none; width: auto;" id="entropy" />Entropy based</label></div>
+
</div>
-
<label>Na<sup>+</sup> concentration: <input type="text" name="na" id="na" value="0.8" /></label>
+
<script type="text/javascript">
<script type="text/javascript">
-
document.getElementById('entropy').onclick = function() {
+
//document.getElementById('entropy').onclick = function() {
-
document.getElementById('na').disabled = false;
+
//document.getElementById('na').disabled = false;
 +
//}
 +
//document.getElementById('wallace').onclick = function() {
 +
//document.getElementById('na').disabled = true;
 +
//}
 +
//document.getElementById('na').disabled = true;
 +
 
 +
document.getElementById('radio-noncoding').onclick = function() {
 +
document.getElementById('coding1').style.display = "block";
 +
document.getElementById('coding2').style.display = "block";
 +
document.getElementById('noncoding').style.display = "none";
}
}
-
document.getElementById('wallace').onclick = function() {
+
document.getElementById('radio-coding').onclick = function() {
-
document.getElementById('na').disabled = true;
+
document.getElementById('noncoding').style.display = "block";
 +
document.getElementById('coding1').style.display = "none";
 +
document.getElementById('coding2').style.display = "none";
}
}
-
document.getElementById('na').disabled = true;
+
document.getElementById('noncoding').style.display = "none";
var enzymes = [
var enzymes = [
Line 108: Line 189:
};
};
-
populate(document.getElementById('enzyme_n'));
+
//populate(document.getElementById('enzyme_n'));
-
populate(document.getElementById('enzyme_c'));
+
//populate(document.getElementById('enzyme_c'));
</script>
</script>
-
</div>
 
-
<div class="rightbox" style="width: 290px;">
 
-
<input type="submit" style="width: 99%;" value="Submit" />
 
-
</div>
 
</form>
</form>

Latest revision as of 21:25, 21 September 2011


Options

Mode:
Standard:
Check for restriction sites?

Upstream region

Downstream region

Coding Sequence