Team:Heidelberg/Modeling/miGUI

From 2010.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{:Team:Heidelberg/Top}}
+
{{:Team:Heidelberg/Template}}
-
{{:Team:Heidelberg/Key}}
+
-
{{:Team:Heidelberg/Frame}}
+
<html>
<html>
Line 9: Line 7:
#area_map {width: 635px; height: 400px; }
#area_map {width: 635px; height: 400px; }
.forms {display:none;}
.forms {display:none;}
-
.formoutput {display:none;}
+
.lowerinputform {display:none;}
-
#inputformtable {background:transparent;align:center;}
+
#rightformtable {background:transparent;align:center;}
</style>
</style>
<script type="text/javascript">
<script type="text/javascript">
-
var dataarray = new Array(12);
+
var dataarray = new Array(11);
 +
d = document
 +
dforms = d.forms
-
function getvar (num) //umbenennen in readvar
+
function sendall() {
-
{
+
for(var i=0;i<=12;i++) {
 +
if(document.getElementById("rightinputform"+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 r = 0;
-
var count=document.forms["form"+num].length-2;
+
var countinput=dforms["giveinput"+num].length-2;
-
dataarray[num] = new Array(count);
+
dataarray[num] = new Array(countinput);
-
document.getElementById("outform"+num).style.display = "block";
+
d.getElementById("lowerinputform"+num).style.display = "block";
-
for (var i=0; i<=count; i++) {
+
for (var i=0; i<=countinput; i++) {
-
if(document.forms["form"+num].elements[i].type == 'radio') {
+
var r = 0;
-
if (document.forms["form"+num].elements[i].checked == true) {
+
dformsnr = dforms["giveinput"+num];
-
dataarray[num][i-r] = document.forms["form"+num].elements[i].value;}  
+
dformsnrelement = dformsnr.elements[i];
-
else { r++ }}
+
if(dformsnrelement.type == 'radio') {
-
else if (document.forms["form"+num].elements[i].type == 'select-multiple') {
+
if (dformsnrelement.checked == true) {
-
dataarray[num][i-r] = ""
+
dataarray[num][i-r] = dformsnrelement.value;
-
for (var j=0;j<document.forms["form"+num].elements[i].length;j++){
+
}  
-
if (document.forms["form"+num].elements[i][j].selected == true ) {
+
else { r++ }
-
dataarray[num][i-r] += document.forms["form"+num].elements[i][j].value + ";";}}}
+
}
 +
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 {
else {
-
dataarray[num][i-r] = document.forms["form"+num].elements[i].value;}
+
dataarray[num][i-r] = dformsnrelement.value;
-
if (document.forms["formout"+num].elements[i-r].type =='radio') {
+
}
-
if(document.forms["formout"+num].elements[i-r].value = 'on'){
+
}
-
document.forms["formout"+num].elements[i-r].checked="checked";}
+
}
-
if (document.forms["formout"+num].elements[i-r].value = 'off'){
+
 
-
document.forms["formout"+num].elements[i-r].checked = "checked";}}
+
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 {
else {
-
document.forms["formout"+num].elements[i-r].value = dataarray[num][i-r];}}}
+
document.forms["formout"+num].elements[i-r].value = dataarray[num][i-r];
-
+
}
-
// function writevar (num)
+
-
// {
+
}
-
//
+
document.all.targetselection.src = scriptoutput;
-
//
+
}
-
//
+
 +
function getvar (num) {
 +
var scriptoutput;
 +
specialcorrections();
 +
readvar(num);
 +
writevar(num, scriptoutput);
 +
 
 +
 +
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][3];
 +
break;
 +
}
 +
}
function showoptions(num)
function showoptions(num)
{ for (var i=1; i<=12; i++) {
{ for (var i=1; i<=12; i++) {
-
document.getElementById(i).style.display = "none";
+
document.getElementById("rightinputform"+i).style.display = "none";
}
}
-
document.getElementById(num).style.display = "block";
+
document.getElementById("rightinputform"+num).style.display = "block";
}
}
Line 63: Line 133:
<html>
<html>
<body>
<body>
-
<a href="javascript:klick()">klick</a>
+
 
<div id="main_page">
<div id="main_page">
<div id="area_map">
<div id="area_map">
Line 97: Line 167:
</div>
</div>
-
<div id="anzeige">
+
<div id="chooseoptions">
 +
<form name="totaloutput">
<table>
<table>
-
<tr id="outform1" class="formoutput"><td>shRNAmir:<form name="formout1">
+
<tr id="lowerinputform1" class="lowerinputform"><td>shRNAmir:<form name="formout1">
<input name="output1" type="text" size="30" maxlength="30">
<input name="output1" type="text" size="30" maxlength="30">
-
</form></td></tr>
+
</form>
-
<tr id="outform2" class="formoutput"><td>Promoter 1:<form name="formout2">
+
 
 +
<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">
<input name="output2" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr id="outform3" class="formoutput"><td>Promoter 2:<form name="formout3">
+
<tr id="lowerinputform3" class="lowerinputform"><td>Promoter 2:<form name="formout3">
<input name="output3" type="text" size="30" maxlength="30">
<input name="output3" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr id="outform4" class="formoutput"><td>Operator:<form name="formout4">
+
<tr id="lowerinputform4" class="lowerinputform"><td>Operator:<form name="formout4">
<input name="output4" type="text" size="30" maxlength="30">
<input name="output4" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr id="outform5" class="formoutput"><td>miGene:<form name="formout5">
+
<tr id="lowerinputform5" class="lowerinputform"><td>miGene:<form name="formout5">
<input name="output5" type="text" size="30" maxlength="30">
<input name="output5" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr id="outform6" class="formoutput"><td>shR_BS:<form name="formout6">
+
<tr id="lowerinputform6" class="lowerinputform"><td>shR_BS:<form name="formout6">
<input name="output6" type="text" size="30" maxlength="30">
<input name="output6" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr id="outform7" class="formoutput"><td>miRNA_BS:<form name="formout7">
+
<tr id="lowerinputform7" class="lowerinputform"><td>miRNA_BS:<form name="formout7">
Target: <br/><select name="miRBStarget">
Target: <br/><select name="miRBStarget">
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
Line 143: Line 217:
Off:<input type="radio" name="miRBSonofftarget" value="off"><br/>
Off:<input type="radio" name="miRBSonofftarget" value="off"><br/>
Treshold: <br><input name="outmiRBStreshold" type="text" size="30" maxlength="30">
Treshold: <br><input name="outmiRBStreshold" type="text" size="30" maxlength="30">
-
</form></td></tr>
+
</form>
-
<tr id="outform8" class="formoutput"><td>Reference:<form name="formout8">
+
 +
<iframe 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">
<input name="output8" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr id="outform9" class="formoutput"><td>tet-Promotor:<form name="formout9">
+
<tr id="lowerinputform9" class="lowerinputform"><td>tet-Promotor:<form name="formout9">
<input name="output9" type="text" size="30" maxlength="30">
<input name="output9" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr id="outform10" class="formoutput"><td>tet-Repressor:<form name="formout10">
+
<tr id="lowerinputform10" class="lowerinputform"><td>tet-Repressor:<form name="formout10">
<input name="output10" type="text" size="30" maxlength="30">
<input name="output10" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr  id="outform11" class="formoutput"><td>tet-miR_BS:<form name="formout11">
+
<tr  id="lowerinputform11" class="lowerinputform"><td>tet-miR_BS:<form name="formout11">
<input name="output11" type="text" size="30" maxlength="30">
<input name="output11" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
<tr  id="outform12" class="formoutput"><td>Virus:<form name="formout12">
+
<tr  id="lowerinputform12" class="lowerinputform"><td>Virus:<form name="formout12">
<input name="output12" type="text" size="30" maxlength="30">
<input name="output12" type="text" size="30" maxlength="30">
</form></td></tr>
</form></td></tr>
-
</table></div>
+
</table>
 +
<input type="button" value="Submit" onClick="sendall()">
 +
</form>
 +
</div>
</div>
</div>
</html>
</html>
Line 166: Line 245:
-
<table id="inputformtable" cellpadding="0" cellspacing="0">
+
<table id="rightformtable" cellpadding="0" cellspacing="0">
-
<tr id="1" class="forms"><td>
+
<tr id="rightinputform1" class="forms"><td>
-
Text Text Text Text <br> Text Text Text Text
+
asdfasdfText Text Text Text <br> Text Text Text Text
-
<form name="form1">
+
<form name="giveinput1">
Variable1
Variable1
<forFm>
<forFm>
-
<select name="menu">
+
<select name="selectshRNA">
<option value="aaaa">aaaa</option>
<option value="aaaa">aaaa</option>
<option value="bbbb">bbbb</option>
<option value="bbbb">bbbb</option>
Line 181: Line 260:
<input type="button" value="Submit" onClick="getvar(1)"></form></td>
<input type="button" value="Submit" onClick="getvar(1)"></form></td>
</tr>
</tr>
-
<tr id="2" class="forms"><td>
+
<tr id="rightinputform2" class="forms"><td>
-
<form name="form2">
+
<form name="giveinput2">
<p>Choose your first promoter</p>
<p>Choose your first promoter</p>
<select name="menu">
<select name="menu">
Line 193: Line 272:
<input type="button" value="Submit" onClick="getvar(2);"></form>
<input type="button" value="Submit" onClick="getvar(2);"></form>
</td></tr>
</td></tr>
-
<tr id="3" class="forms"><td>
+
<tr id="rightinputform3" class="forms"><td>
-
<form name="form3">
+
<form name="giveinput3">
<p>Choose your second promoter</p>
<p>Choose your second promoter</p>
<select name="menu">
<select name="menu">
Line 205: Line 284:
<input type="button" value="Submit" onClick="getvar(3);"></form>
<input type="button" value="Submit" onClick="getvar(3);"></form>
</td></tr>
</td></tr>
-
<tr id="4" class="forms"><td>
+
<tr id="rightinputform4" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form4">
+
<form name="giveinput4">
<p>Variable3<br><input name="variable3" type="text" size="30" maxlength="30"></p>
<p>Variable3<br><input name="variable3" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(4)"></form>
<input type="button" value="Submit" onClick="getvar(4)"></form>
</td></tr>
</td></tr>
-
<tr id="5" class="forms"><td>
+
<tr id="rightinputform5" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form5">
+
<form name="giveinput5">
<p>Variable4<br><input name="variable4" type="text" size="30" maxlength="30"></p>
<p>Variable4<br><input name="variable4" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(5);"></form>
<input type="button" value="Submit" onClick="getvar(5);"></form>
</td></tr>
</td></tr>
-
<tr id="6" class="forms"><td>
+
<tr id="rightinputform6" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form6">
+
<form name="giveinput6">
<p>Variable5<br><input name="variable6" type="text" size="30" maxlength="30"></p>
<p>Variable5<br><input name="variable6" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(6);"></form>
<input type="button" value="Submit" onClick="getvar(6);"></form>
</td></tr>
</td></tr>
-
<tr id="7" class="forms"><td>
+
<tr id="rightinputform7" class="forms"><td>
<p>miRBS<br></p>
<p>miRBS<br></p>
-
<form name="form7">
+
<form name="giveinput7">
<p>Choose your Target:<br><select name="miRBStarget">
<p>Choose your Target:<br><select name="miRBStarget">
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
<option value='hsa_AML-HL60'>hsa_AML-HL60</option>
Line 256: Line 335:
<input type="button" value="Submit" onClick="getvar(7);"></form>
<input type="button" value="Submit" onClick="getvar(7);"></form>
</td></tr>
</td></tr>
-
<tr id="8" class="forms"><td>
+
<tr id="rightinputform8" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form8">
+
<form name="giveinput8">
<p>Variable6<br><input name="variable7" type="text" size="30" maxlength="30"></p>
<p>Variable6<br><input name="variable7" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(8);"></form>
<input type="button" value="Submit" onClick="getvar(8);"></form>
</td></tr>
</td></tr>
-
<tr id="9" class="forms"><td>
+
<tr id="rightinputform9" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form9">
+
<form name="giveinput9">
<p>Variable7<br><input name="variable8" type="text" size="30" maxlength="30"></p>
<p>Variable7<br><input name="variable8" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(9);"></form>
<input type="button" value="Submit" onClick="getvar(9);"></form>
</td></tr>
</td></tr>
-
<tr id="10" class="forms"><td>
+
<tr id="rightinputform10" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form10">
+
<form name="giveinput10">
<p>Variable8<br><input name="variable9" type="text" size="30" maxlength="30"></p>
<p>Variable8<br><input name="variable9" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(10);"></form>
<input type="button" value="Submit" onClick="getvar(10);"></form>
</td></tr>
</td></tr>
-
<tr id="11" class="forms"><td>
+
<tr id="rightinputform11" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form11">
+
<form name="giveinput11">
<p>Variable9<br><input name="variable10" type="text" size="30" maxlength="30"></p>
<p>Variable9<br><input name="variable10" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(11);"></form>
<input type="button" value="Submit" onClick="getvar(11);"></form>
</td></tr>
</td></tr>
-
<tr id="12" class="forms"><td>
+
<tr id="rightinputform12" class="forms"><td>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
<p>Text Text Text Text <br> Text Text Text Text <br></p>
-
<form name="form12">
+
<form name="giveinput12">
<p>Variable10<br><input name="variable11" type="text" size="30" maxlength="30"></p>
<p>Variable10<br><input name="variable11" type="text" size="30" maxlength="30"></p>
<input type="button" value="Submit" onClick="getvar(12);"></form>
<input type="button" value="Submit" onClick="getvar(12);"></form>

Revision as of 18:22, 23 October 2010

GUI_Picture shRNAmir Promoter_1 Promoter_2 Operator miGene shR_BS miR_BS Reference tet-R_Promoter tet-Repressor tet-miR_BS Virus

shRNAmir:
Promoter 1:
Promoter 2:
Operator:
miGene:
shR_BS:
miRNA_BS:
Target:

Off-Target:

On: Off:
Treshold:
Reference:
tet-Promotor:
tet-Repressor:
tet-miR_BS:
Virus:
asdfasdfText Text Text Text
Text Text Text Text
Variable1

Choose your first promoter

Choose your second promoter

Text Text Text Text
Text Text Text Text

Variable3

Text Text Text Text
Text Text Text Text

Variable4

Text Text Text Text
Text Text Text Text

Variable5

miRBS

Choose your Target:

Choose your Off-Targets:

On-Targeting Off-Targeting

Set relative miRNA treshold

Text Text Text Text
Text Text Text Text

Variable6

Text Text Text Text
Text Text Text Text

Variable7

Text Text Text Text
Text Text Text Text

Variable8

Text Text Text Text
Text Text Text Text

Variable9

Text Text Text Text
Text Text Text Text

Variable10

Retrieved from "http://2010.igem.org/Team:Heidelberg/Modeling/miGUI"