Team:Heidelberg/Modeling/miGUI

From 2010.igem.org

(Difference between revisions)
(Replacing page with '{{:Team:Heidelberg/Single}} {{:Team:Heidelberg/Single_Pagetop|miGUI}} <html> <iframe id="frame_migui" border="1" frameborder="1" style="border:none; background:transparent; wi...')
 
(6 intermediate revisions not shown)
Line 1: Line 1:
-
{{:Team:Heidelberg/Template}}
+
{{:Team:Heidelberg/Single}}
 +
{{:Team:Heidelberg/Single_Pagetop|miGUI}}
<html>
<html>
-
<head>
+
<iframe id="frame_migui" border="1" frameborder="1" style="border:none; background:transparent; width:900px; height:1800px;" src="http://igem.bioquant.uni-heidelberg.de/igem_2010/gui.htm">Please enable iframes in your browser or use this link to <a href="http://igem.bioquant.uni-heidelberg.de/igem_2010/gui.html">miBEAT</a>
-
<style type="text/css">
+
</iframe>
-
#main_page {width: 635px; height: 900px; background:transparent;}
+
-
#area_map {width: 635px; height: 400px; }
+
-
.forms {display:none;}
+
-
.lowerinputform {display:none;}
+
-
#rightformtable {background:transparent;align:center;}
+
-
</style>
+
-
<script type="text/javascript">
+
-
var dataarray = new Array(11);
+
-
d = document
+
-
dforms = d.forms
+
-
+
-
function sendall() {
+
-
for(var i=1;i<=12;i++) {
+
-
if(document.getElementById("lowerinputform"+i).style.display = "none") {
+
-
+
-
+
-
}
+
-
}
+
-
}
+
-
+
-
+
-
function specialcorrections() {
+
-
var dform = document.forms["giveinput7"];
+
-
var dformofftarget = dform.elements["miRBSofftarget[]"]
+
-
var targetmir = document.forms["giveinput7"].elements["miRBStarget"].value
+
-
for (var j=0;j<dformofftarget.length;j++){
+
-
if (dformofftarget[j].value == targetmir ) {
+
-
dformofftarget[j].selected = false;
+
-
}
+
-
}
+
-
}
+
-
+
-
function readvar(num) {
+
-
var r = 0;
+
-
var countinput=dforms["giveinput"+num].length-2;
+
-
dataarray[num] = new Array(countinput);
+
-
d.getElementById("lowerinputform"+num).style.display = "block";
+
-
dformsnr = dforms["giveinput"+num];
+
-
+
-
for (var i=0; i<=countinput; i++) {
+
-
var r = 0;
+
-
dformsnrelement = dformsnr.elements[i];
+
-
+
-
if(dformsnrelement.type == 'radio') {
+
-
if (dformsnrelement.checked == true) {
+
-
dataarray[num][i-r] = dformsnrelement.value;
+
-
}
+
-
else { r++ }
+
-
}
+
-
else if (dformsnrelement.type == 'select-multiple') {
+
-
var subarraycount = dformsnrelement.length;
+
-
var countentries = 0;
+
-
dataarray[num][i-r] = "";
+
-
for (var j=0;j<subarraycount;j++){
+
-
if (dformsnrelement[j].selected == true ) {
+
-
if (dataarray[num][i-r] == "") {
+
-
dataarray[num][i-r] += dformsnrelement[j].value;
+
-
}
+
-
else {
+
-
dataarray[num][i-r] += ";" + dformsnrelement[j].value;
+
-
}
+
-
}
+
-
}
+
-
}
+
-
else {
+
-
dataarray[num][i-r] = dformsnrelement.value;
+
-
}
+
-
}
+
-
}
+
-
 
+
-
function writevar(num, scriptoutput) {
+
-
var countoutput=dforms["formout"+num].length-1;
+
-
for (var i=0; i<=countoutput; i++) {
+
-
var r = 0;
+
-
dformsnr = dforms["formout"+num];
+
-
dformsnrelement = dformsnr.elements[i];
+
-
if(dformsnrelement.type == 'radio') {
+
-
if (dformsnrelement.value == dataarray[num][i-r]) {
+
-
dformsnrelement.checked = "checked";
+
-
}
+
-
else { r++ }
+
-
}
+
-
else if (dformsnrelement.type == 'select-multiple') {
+
-
var multiples = dataarray[num][i-r].split(";");
+
-
var countmulti = 0;
+
-
for (var j=0;j<dformsnrelement.length;j++){
+
-
if (dformsnrelement[j].value == multiples[countmulti] ) {
+
-
dformsnrelement[j].selected = "selected";
+
-
countmulti++;
+
-
}
+
-
else { dformsnrelement[j].selected = false;
+
-
}
+
-
}
+
-
}
+
-
else {
+
-
document.forms["formout"+num].elements[i-r].value = dataarray[num][i-r];
+
-
}
+
-
+
-
}
+
-
document.getElementById("targetselection").src = scriptoutput;
+
-
}
+
-
+
-
function getvar (num) {
+
-
var scriptoutput;
+
-
specialcorrections();
+
-
readvar(num);
+
-
switch (num) {
+
-
case 7: scriptoutput = 'http://igem.bioquant.uni-heidelberg.de/cgi-bin/igem_2010/aastha.pl?miRBStarget=' + dataarray[num][0] + '&miRBSofftarget=' + dataarray[num][1] + '&miRBSonofftarget=' + dataarray[num][2] + '&outmiRBStreshold=' + dataarray[num][4];
+
-
break;
+
-
+
-
case 6: scriptoutput = 'http://igem.bioquant.uni-heidelberg.de/cgi-bin/igem_2010/test1.pl?input1=' + dataarray[num][4];
+
-
break;
+
-
}
+
-
+
-
writevar(num, scriptoutput);
+
-
 
+
-
+
-
 
+
-
}
+
-
+
-
+
-
function showoptions(num)
+
-
{ for (var i=1; i<=12; i++) {
+
-
document.getElementById("rightinputform"+i).style.display = "none";
+
-
}
+
-
document.getElementById("rightinputform"+num).style.display = "block";
+
-
}
+
-
 
+
-
</script>
+
-
</head>
+
</html>
</html>
-
{{:Team:Heidelberg/Pagetop|miGUI}}
 
-
<html>
+
{{:Team:Heidelberg/Single_Bottom}}
-
<body>
+
-
 
+
-
<div id="main_page">
+
-
<div id="area_map">
+
-
<img style="border:none" src="https://static.igem.org/mediawiki/2010/7/7c/MiGUI.png" alt="GUI_Picture" usemap="#gui-functions" />
+
-
+
-
<map name="gui-functions">
+
-
<area shape="poly" coords="193,52,193,52,197,45,201,42,206,39,214,38,219,40,224,42,229,46,232,51,241,54,250,58,260,63,266,68,268,73,261,87,254,91,250,90,242,85,233,80,231,80,223,76,219,79,214,79,210,80,206,79,202,77,198,74,194,67,192,58,193,56"
+
-
href="javascript:showoptions(1)" alt="shRNAmir" />
+
-
<area shape="poly" coords="264,97,265,98,267,123,273,118,288,138,291,140,295,139,322,125,323,122,323,118,319,114,315,114,311,115,295,124,292,119,284,109,289,104,265,97"
+
-
href="javascript:showoptions(2)" alt="Promoter_1" />
+
-
<area shape="poly" coords="296,152,297,153,298,149,325,138,330,138,333,140,337,151,339,159,342,172,348,172,339,199,321,175,328,175,326,167,325,162,323,155,319,155,306,161,300,161,296,159,296,154"
+
-
href="javascript:showoptions(3)" alt="Promoter_2" />
+
-
<area shape="poly" coords="305,213,306,214,307,210,311,209,346,212,349,215,349,220,348,230,346,238,342,240,335,242,335,244,338,247,342,253,339,262,336,268,333,274,328,275,313,267,297,259,294,256,296,252,299,244,302,235,304,225,306,215"
+
-
href="javascript:showoptions(4)" alt="Operator" />
+
-
<area shape="poly" coords="287,268,290,268,304,276,313,282,313,289,304,300,296,311,283,322,270,331,256,339,259,345,259,349,211,338,240,297,244,308,251,304,260,297,269,290,277,281,286,269"
+
-
href="javascript:showoptions(5)" alt="miGene" />
+
-
<area shape="poly" coords="134,316,135,317,149,321,162,323,167,327,170,325,183,325,193,324,197,326,199,329,200,339,201,355,197,357,177,357,176,360,174,363,172,365,167,366,161,367,157,365,154,361,152,358,152,354,143,353,134,351,126,348,123,346,121,342,123,336,127,325,130,319,132,317"
+
-
href="javascript:showoptions(6)" alt="shR_BS" />
+
-
<area shape="poly" coords="72,268,73,269,79,275,85,282,92,290,97,294,97,297,100,297,106,301,117,308,121,312,121,316,110,337,106,339,102,338,87,327,85,330,80,331,75,331,72,329,69,327,66,323,65,318,67,314,68,311,62,306,58,301,54,296,50,291,48,286,51,282,58,278,66,271,70,269"
+
-
href="javascript:showoptions(7)" alt="miR_BS" />
+
-
<area shape="poly" coords="96,83,97,84,87,130,79,124,77,126,75,129,72,134,69,140,66,146,63,152,60,160,58,170,55,176,52,179,46,178,38,176,31,176,28,174,25,171,25,162,28,153,32,141,37,130,43,119,49,109,56,100,48,92,90,84"
+
-
href="javascript:showoptions(8)" alt="Reference" />
+
-
<area shape="poly" coords="444,112,445,113,445,107,444,104,439,101,432,97,425,93,419,89,415,87,412,88,407,93,406,98,403,104,401,110,400,117,399,124,392,124,403,152,420,127,414,127,414,122,414,117,415,113,417,106,417,104,420,105,425,108,431,111,436,115,441,114"
+
-
href="javascript:showoptions(9)" alt="tet-R_Promoter" />
+
-
<area shape="poly" coords="410,168,411,169,412,165,434,158,438,157,440,159,444,166,447,171,452,177,458,183,464,187,468,191,475,194,478,194,478,183,520,212,478,239,478,228,472,227,465,225,460,222,455,220,449,217,441,212,433,205,426,198,422,192,417,186,413,178,410,172,409,169"
+
-
href="javascript:showoptions(10)" alt="tet-Repressor" />
+
-
<area shape="poly" coords="527,191,528,192,535,186,542,181,547,176,550,172,554,172,553,167,556,163,559,155,561,148,561,146,577,148,592,152,593,157,591,163,589,167,588,171,587,174,587,176,590,180,590,185,590,189,589,193,587,196,585,198,582,200,579,202,576,202,572,200,569,200,566,203,564,206,561,209,558,211,552,215,547,217,543,220,541,221,538,219,536,214,533,210,530,203,527,198,527,193"
+
-
href="javascript:showoptions(11)" alt="tet-miR_BS" />
+
-
<area shape="poly" coords="421,303,422,304,446,311,462,332,462,359,448,380,422,388,397,380,381,359,381,332,397,311,421,303"
+
-
href="javascript:showoptions(12)" alt="Virus" />
+
-
</map>
+
-
<p id="desc"></p>
+
-
</div>
+
-
 
+
-
<div id="chooseoptions">
+
-
<form name="totaloutput">
+
-
<table>
+
-
<tr id="lowerinputform1" class="lowerinputform"><td>shRNAmir:<form name="formout1">
+
-
<input name="output1" type="text" size="30" maxlength="30">
+
-
</form>
+
-
 
+
-
<input id="output111" name="output11" type="text" size="30" maxlength="30">
+
-
</td></tr>
+
-
<tr id="lowerinputform2" class="lowerinputform"><td>Promoter 1:<form name="formout2">
+
-
<input name="output2" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr id="lowerinputform3" class="lowerinputform"><td>Promoter 2:<form name="formout3">
+
-
<input name="output3" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr id="lowerinputform4" class="lowerinputform"><td>Operator:<form name="formout4">
+
-
<input name="output4" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr id="lowerinputform5" class="lowerinputform"><td>miGene:<form name="formout5">
+
-
<input name="output5" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr id="lowerinputform6" class="lowerinputform"><td>shR_BS:<form name="formout6">
+
-
<input name="output6" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr id="lowerinputform7" class="lowerinputform"><td>miRNA_BS:<form name="formout7">
+
-
Target: <br/><select name="miRBStarget">
+
-
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
+
-
<option value='hsa_AML-Kas1'>hsa_AML-Kas1</option>
+
-
<option value='hsa_AML-THP1'>hsa_AML-THP1</option>
+
-
<option value='hsa_AML1-d0'>hsa_AML1-d0</option>
+
-
<option value='hsa_AML1-d29'>hsa_AML1-d29</option>
+
-
<option value='hsa_AML2-d0'>hsa_AML2-d0</option>
+
-
<option value='hsa_AML2-d29'>hsa_AML2-d29</option>
+
-
<option value='hsa_AML3-d0'>hsa_AML3-d0</option>
+
-
<option value='hsa_AML3-d29'>hsa_AML3-d29</option>
+
-
</select><br/>
+
-
Off-Target: <br/><select name="miRBSofftarget[]" size="4" multiple>
+
-
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
+
-
<option value='hsa_AML-Kas1'>hsa_AML-Kas1</option>
+
-
<option value='hsa_AML-THP1'>hsa_AML-THP1</option>
+
-
<option value='hsa_AML1-d0'>hsa_AML1-d0</option>
+
-
<option value='hsa_AML1-d29'>hsa_AML1-d29</option>
+
-
<option value='hsa_AML2-d0'>hsa_AML2-d0</option>
+
-
<option value='hsa_AML2-d29'>hsa_AML2-d29</option>
+
-
<option value='hsa_AML3-d0'>hsa_AML3-d0</option>
+
-
<option value='hsa_AML3-d29'>hsa_AML3-d29</option>
+
-
</select><br/>
+
-
On: <input type="radio" name="miRBSonofftarget" value="on" >
+
-
Off:<input type="radio" name="miRBSonofftarget" value="off"><br/>
+
-
Treshold: <br><input name="outmiRBStreshold" type="text" size="30" maxlength="30">
+
-
</form>
+
-
+
-
<iframe id="targetselection" name="targetselection" style="border:none"></iframe> </td></tr>
+
-
<tr id="lowerinputform8" class="lowerinputform"><td>Reference:<form name="formout8">
+
-
<input name="output8" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr id="lowerinputform9" class="lowerinputform"><td>tet-Promotor:<form name="formout9">
+
-
<input name="output9" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr id="lowerinputform10" class="lowerinputform"><td>tet-Repressor:<form name="formout10">
+
-
<input name="output10" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr  id="lowerinputform11" class="lowerinputform"><td>tet-miR_BS:<form name="formout11">
+
-
<input name="output11" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
<tr  id="lowerinputform12" class="lowerinputform"><td>Virus:<form name="formout12">
+
-
<input name="output12" type="text" size="30" maxlength="30">
+
-
</form></td></tr>
+
-
</table>
+
-
<input type="button" value="Submit" onClick="sendall()">
+
-
</form>
+
-
</div>
+
-
</div>
+
-
</html>
+
-
{{:Team:Heidelberg/Pagemiddle}}
+
-
<html>
+
-
 
+
-
 
+
-
<table id="rightformtable" cellpadding="0" cellspacing="0">
+
-
<tr id="rightinputform1" class="forms"><td>
+
-
asdfasdfText Text Text Text <br> Text Text Text Text
+
-
<form name="giveinput1">
+
-
Variable1
+
-
<forFm>
+
-
<select name="selectshRNA">
+
-
<option value="aaaa">aaaa</option>
+
-
<option value="bbbb">bbbb</option>
+
-
<option value="cccc">cccc</option>
+
-
<option value="dddd">dddd</option>
+
-
<option value="eeee">eeee</option>
+
-
</select>
+
-
<input type="button" value="Submit" onClick="getvar(1)"></form></td>
+
-
</tr>
+
-
<tr id="rightinputform2" class="forms"><td>
+
-
<form name="giveinput2">
+
-
<p>Choose your first promoter</p>
+
-
<select name="menu">
+
-
<option value="possibility_1a">possibility_1a</option>
+
-
<option value="possibility_2a">possibility_2a</option>
+
-
<option value="possibility_3a">possibility_3a</option>
+
-
<option value="possibility_4a">possibility_4a</option>
+
-
<option value="possibility_5a">possibility_5a</option>
+
-
</select>
+
-
<input type="button" value="Submit" onClick="getvar(2);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform3" class="forms"><td>
+
-
<form name="giveinput3">
+
-
<p>Choose your second promoter</p>
+
-
<select name="menu">
+
-
<option value="possibility_1b">possibility_1b</option>
+
-
<option value="possibility_2b">possibility_2b</option>
+
-
<option value="possibility_3b">possibility_3b</option>
+
-
<option value="possibility_4b">possibility_4b</option>
+
-
<option value="possibility_5b">possibility_5b</option>
+
-
</select>
+
-
<input type="button" value="Submit" onClick="getvar(3);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform4" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput4">
+
-
<p>Variable3<br><input name="variable3" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(4)"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform5" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput5">
+
-
<p>Variable4<br><input name="variable4" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(5);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform6" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput6">
+
-
<p>Variable5<br><input name="variable6" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(6);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform7" class="forms"><td>
+
-
<p>miRBS<br></p>
+
-
<form name="giveinput7">
+
-
<p>Choose your Target:<br><select name="miRBStarget">
+
-
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
+
-
<option value='hsa_AML-Kas1'>hsa_AML-Kas1</option>
+
-
<option value='hsa_AML-THP1'>hsa_AML-THP1</option>
+
-
<option value='hsa_AML1-d0'>hsa_AML1-d0</option>
+
-
<option value='hsa_AML1-d29'>hsa_AML1-d29</option>
+
-
<option value='hsa_AML2-d0'>hsa_AML2-d0</option>
+
-
<option value='hsa_AML2-d29'>hsa_AML2-d29</option>
+
-
<option value='hsa_AML3-d0'>hsa_AML3-d0</option>
+
-
<option value='hsa_AML3-d29'>hsa_AML3-d29</option>
+
-
 
+
-
</select></p>
+
-
<p>Choose your Off-Targets:<br><select name="miRBSofftarget[]" size="4" multiple>
+
-
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
+
-
<option value='hsa_AML-Kas1'>hsa_AML-Kas1</option>
+
-
<option value='hsa_AML-THP1'>hsa_AML-THP1</option>
+
-
<option value='hsa_AML1-d0'>hsa_AML1-d0</option>
+
-
<option value='hsa_AML1-d29'>hsa_AML1-d29</option>
+
-
<option value='hsa_AML2-d0'>hsa_AML2-d0</option>
+
-
<option value='hsa_AML2-d29'>hsa_AML2-d29</option>
+
-
<option value='hsa_AML3-d0'>hsa_AML3-d0</option>
+
-
<option value='hsa_AML3-d29'>hsa_AML3-d29</option>
+
-
 
+
-
</select></p>
+
-
<p> <input type="radio" name="miRBSonofftarget" value="on"> On-Targeting
+
-
<input type="radio" name="miRBSonofftarget" value="off"> Off-Targeting
+
-
</p>
+
-
<p>Set relative miRNA treshold<br><input name="miRBStreshold" type="text" size="20" maxlength="20" value="0.001"></p>
+
-
<input type="button" value="Submit" onClick="getvar(7);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform8" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput8">
+
-
<p>Variable6<br><input name="variable7" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(8);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform9" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput9">
+
-
<p>Variable7<br><input name="variable8" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(9);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform10" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput10">
+
-
<p>Variable8<br><input name="variable9" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(10);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform11" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput11">
+
-
<p>Variable9<br><input name="variable10" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(11);"></form>
+
-
</td></tr>
+
-
<tr id="rightinputform12" class="forms"><td>
+
-
<p>Text Text Text Text <br> Text Text Text Text <br></p>
+
-
<form name="giveinput12">
+
-
<p>Variable10<br><input name="variable11" type="text" size="30" maxlength="30"></p>
+
-
<input type="button" value="Submit" onClick="getvar(12);"></form>
+
-
</td></tr>
+
-
</table>
+
-
 
+
-
</body>
+
-
</html>
+
-
{{:Team:Heidelberg/Bottom}}
+

Latest revision as of 02:49, 28 October 2010