|
|
| (85 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| - | {{:Team:Heidelberg/Template}} | + | {{:Team:Heidelberg/Double}} |
| - | {{:Team:Heidelberg/Pagetop|home}} | + | {{:Team:Heidelberg/Pagetop|mibsdesigner}} |
| | <!--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">--> | | <!--<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">--> |
| | <html> | | <html> |
| Line 7: |
Line 7: |
| | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
| | <style type="text/css"> | | <style type="text/css"> |
| - | div.wrapper {width: 320px; padding:15px; border-width:5px; margin:auto; border-style:solid; border-color:#11526f; height: 340px; text-align:center; background-color:#ffaf58;}
| + | .wrapper {width: 260px; text-align:center;} |
| - | div.wrapper2 {width: 550px; padding:25px; border-width:5px; margin:auto; border-style:solid; border-color:#11526f; height: 550px; text-align:left; background-color:#ffaf58;}
| + | .wrapper2 {margin:auto; height: 700px; text-align:left; } |
| - | div.title {text-indent:30px;}
| + | .title {padding-left:0px; line-height:2; font-weight:bold; font-size:17px;} |
| - | div.option {text-indent:50px; white-space:pre-wrap;}
| + | .option {padding-left:10px; white-space:pre-wrap;} |
| - | div.optionl {text-indent:50px; white-space:pre-wrap; float:left;}
| + | .optionl {padding-left:10px; white-space:pre-wrap; float:left; font-size:15px;} |
| - | div.optionr {display:inline; white-space:pre-wrap; margin-right: 45px; float:right;}
| + | .optionr {display:inline; white-space:pre-wrap; margin-right: 45px; float:right; font-size:15px;} |
| - | div.suboption {text-indent:80px;}
| + | .suboption {padding-left:20px; font-size:15px;} |
| - | div.clear {clear: both;}
| + | .clear {clear: both;} |
| - | div.reswrap2 {width: 550px; padding:25px; border-width:5px; margin:auto; border-style:solid; border-color:#11526f; height: 140px; text-align:left; background-color:#ffaf58; display:none;}
| + | .reswrap2 {padding:5px; width: 240px; margin:auto; text-align:left; display:none; font-size:12pt;} |
| | + | .variaresult {font-size: 16px; color: #11526f; font-weight: bold;} |
| | + | .largetext {font-size: 17px;} |
| | + | td {vertical-align:top;} |
| | </style> | | </style> |
| - | <script type="text/javascript">
| |
| - | if (top.location != self.location)
| |
| - | top.location = self.location;
| |
| - | // global functions
| |
| - | var seedval = 0;
| |
| - | var compval = 0;
| |
| - |
| |
| - | // function main option (just enable or disable)
| |
| - |
| |
| - | function chMd() {
| |
| - | for (var i = 0; i < document.forms[0].AU.length; i++) {
| |
| - | document.forms[0].AU[i].checked = false;
| |
| - | }
| |
| - | document.forms[0].AU[2].disabled = true;
| |
| - | document.forms[0].AU[3].disabled = true;
| |
| - | document.forms[0].AU[4].disabled = true;
| |
| - | document.forms[0].AU[5].disabled = true;
| |
| - |
| |
| - | for (var i = 0; i < document.forms[0].elements.length; i++) {
| |
| - | if (document.forms[0].elements[i].value == "perfect" && document.forms[0].elements[i].checked == true) {
| |
| - | document.forms[0].seed.disabled = true;
| |
| - | document.forms[0].comp.disabled = true;
| |
| - | }
| |
| - | else if (document.forms[0].elements[i].value == "bulge" && document.forms[0].elements[i].checked == true) {
| |
| - | document.forms[0].seed.disabled = true;
| |
| - | document.forms[0].comp.disabled = true;
| |
| - | document.forms[0].AU[2].disabled = false;
| |
| - | document.forms[0].AU[4].disabled = false;
| |
| - | document.forms[0].AU[5].disabled = false;
| |
| - | }
| |
| - | else if (document.forms[0].elements[i].value == "personal" && document.forms[0].elements[i].checked == true) {
| |
| - | document.forms[0].seed.disabled = false;
| |
| - | document.forms[0].comp.disabled = false;
| |
| - | for (var j = 0; j < document.forms[0].AU.length; j++) {
| |
| - | document.forms[0].AU[j].disabled = false;
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - |
| |
| - | // function seed design (enable or disable and assign seedval)
| |
| - |
| |
| - | function chMd1() {
| |
| - | for (var i = 0; i < document.forms[0].AU.length; i++) {
| |
| - | document.forms[0].AU[i].checked = false;
| |
| - | }
| |
| - | document.forms[0].AU[2].disabled = false;
| |
| - | document.forms[0].AU[3].disabled = false;
| |
| - | document.forms[0].AU[4].disabled = false;
| |
| - | document.forms[0].AU[5].disabled = false;
| |
| - | document.forms[0].mis.disabled = true;
| |
| - | var seed1 = document.seqIn.seed.selectedIndex;
| |
| - | seedval = document.seqIn.seed.options[seed1].value;
| |
| - |
| |
| - | if (seedval == "7merA1") {
| |
| - | document.forms[0].AU[2].disabled = true;
| |
| - | }
| |
| - | else if (seedval == "7merm8") {
| |
| - | document.forms[0].AU[3].disabled = true;
| |
| - | }
| |
| - | else if (seedval == "8mer") {
| |
| - | document.forms[0].AU[2].disabled = true;
| |
| - | document.forms[0].AU[3].disabled = true;
| |
| - | }
| |
| - | else if (seedval == "custom") {
| |
| - | document.forms[0].mis.disabled = false;
| |
| - | }
| |
| - | }
| |
| - |
| |
| - | // function supplementary design (enable or disable and compval assignment)
| |
| - |
| |
| - | function chMd2() {
| |
| - | document.forms[0].match.disabled = true;
| |
| - | var comp1 = document.seqIn.comp.selectedIndex;
| |
| - | compval = document.seqIn.comp.options[comp1].value;
| |
| - | if (compval == "custom") {
| |
| - | document.forms[0].match.disabled = false;
| |
| - | }
| |
| - | }
| |
| - |
| |
| - | function chMd3() {
| |
| - | var elements3 = document.getElementsByName("stickyends");
| |
| - | for (var i = 0; i <= elements3.length; i++) {
| |
| - | if (elements3[i].value == "custom") {
| |
| - | document.forms[0].end5.disabled = false;
| |
| - | document.forms[0].end3.disabled = false;
| |
| - | }
| |
| - | else {
| |
| - | document.forms[0].end5.value = "";
| |
| - | document.forms[0].end3.value = "";
| |
| - | document.forms[0].end5.disabled = true;
| |
| - | document.forms[0].end3.disabled = true;
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - |
| |
| - | // function to convert U into T and remove strange characters
| |
| - |
| |
| - | function cleaning(str) {
| |
| - | str = str.replace (/[().,?! _\s,]/g, "");
| |
| - | str = str.replace (/[0-9]/g, "");
| |
| - | str = str.toUpperCase();
| |
| - | var mi_array = new Array();
| |
| - | mi_array = str.split('');
| |
| - | var result = new Array();
| |
| - | var n = 0;
| |
| - | for (n == 0; n < str.length; n++) {
| |
| - | if (mi_array[n] == "U") {
| |
| - | mi_array[n] = "T";
| |
| - | }
| |
| - | result.push(mi_array[n]);
| |
| - | }
| |
| - | result = result.join("");
| |
| - | return (result);
| |
| - | }
| |
| - |
| |
| - | // function to create complementary
| |
| - |
| |
| - | function comp(str) {
| |
| - | var mi_array = new Array();
| |
| - | mi_array = str.split('');
| |
| - | var complementary = new Array();
| |
| - | var n = 0;
| |
| - | for (n == 0; n < str.length; n++) {
| |
| - | if (mi_array[n] == "A") {
| |
| - | mi_array[n] = "T";
| |
| - | }
| |
| - | else if (mi_array[n] == "T") {
| |
| - | mi_array[n] = "A";
| |
| - | }
| |
| - | else if (mi_array[n] == "C") {
| |
| - | mi_array[n] = "G";
| |
| - | }
| |
| - | else if (mi_array[n] == "G") {
| |
| - | mi_array[n] = "C";
| |
| - | }
| |
| - | complementary.push(mi_array[n]);
| |
| - | }
| |
| - | complementary = complementary.join("");
| |
| - | return (complementary);
| |
| - | }
| |
| - |
| |
| - | // function to create reverse complementary
| |
| - |
| |
| - | function revcomp(str) {
| |
| - | revcomplementary = str.split('').reverse().join('');
| |
| - | revcomplementary = comp(revcomplementary);
| |
| - | return (revcomplementary);
| |
| - | }
| |
| - |
| |
| - | // function to create mismatches
| |
| - |
| |
| - | function mismatcher(str) {
| |
| - | var mi_array = new Array();
| |
| - | mi_array = str.split('');
| |
| - | var random = new Array();
| |
| - | var n = 0;
| |
| - | for (n == 0; n < str.length; n++) {
| |
| - | if (mi_array[n] == "A") {
| |
| - | mi_array[n] = "G";
| |
| - | }
| |
| - | else if (mi_array[n] == "T") {
| |
| - | mi_array[n] = "C";
| |
| - | }
| |
| - | else if (mi_array[n] == "C") {
| |
| - | mi_array[n] = "T";
| |
| - | }
| |
| - | else if (mi_array[n] == "G") {
| |
| - | mi_array[n] = "A";
| |
| - | }
| |
| - |
| |
| - | random.push(mi_array[n]);
| |
| - | }
| |
| - | random = random.join("");
| |
| - | return (random);
| |
| - | }
| |
| - |
| |
| - | // function to show results
| |
| - |
| |
| - | function showDiv(res1,res2,res3,res4) {
| |
| - | document.getElementById('resultdiv').style.display='block';
| |
| - | document.getElementById('NamA').innerHTML = res1;
| |
| - | document.getElementById('seqA').innerHTML = res2;
| |
| - | document.getElementById('NamB').innerHTML = res3;
| |
| - | document.getElementById('seqB').innerHTML = res4;
| |
| - | }
| |
| - |
| |
| - | // MAIN FUNCTION. When button Go! is pressed
| |
| - |
| |
| - | function SBS() {
| |
| - |
| |
| - | // local variables assignments
| |
| - | var nombre = document.getElementById('name').value;
| |
| - | var mir = document.getElementById('mir').value;
| |
| - | var spacer = document.getElementById('spacer').value;
| |
| - | var mis = document.getElementById('mis').value;
| |
| - | var mat = document.getElementById('match').value;
| |
| - | var end1 = document.seqIn.stickyends.selectedIndex;
| |
| - | var endings = document.seqIn.stickyends.options[end1].value;
| |
| - | var end5 = document.getElementById('end5').value;
| |
| - | var end3 = document.getElementById('end3').value;
| |
| - | var length = mir.length;
| |
| - | var newseed = 0;
| |
| - | var newcomp = 0;
| |
| - | var resfin = 0;
| |
| - | var rcresult = 0;
| |
| - | var charac = 0;
| |
| - |
| |
| - | // Retrotranscription and cleaning of RNA sequences
| |
| - | mir = cleaning(mir);
| |
| - | spacer = cleaning(spacer);
| |
| - | end5 = cleaning(end5);
| |
| - | end3 = cleaning(end3);
| |
| - | document.getElementById('mir').value = mir;
| |
| - | document.getElementById('spacer').value = spacer;
| |
| - | document.getElementById('end5').value = end5;
| |
| - | document.getElementById('end3').value = end3;
| |
| - |
| |
| - | mir = mir.split('').reverse().join('');
| |
| - | var seedstring = mir.substring(14, 22);
| |
| - | var compstring = mir.substring(0, 14);
| |
| - |
| |
| - | // Alert error messages
| |
| - | if (mir.match(/[^ACTG]/g)) {
| |
| - | alert('The format of the miRNA is not acceptable');
| |
| - | return;
| |
| - | }
| |
| - | if (!(length == 22)) {
| |
| - | alert('The miRNA sequence is not 22 nt long');
| |
| - | return;
| |
| - | }
| |
| - | if (spacer.match(/[^ACTGN]/g)) {
| |
| - | alert('The format of the spacer is not acceptable')
| |
| - | return;
| |
| - | }
| |
| - | if (end5.match(/[^ACTG]/g)) {
| |
| - | alert("The format of the extreme custom sequence in 5' is not acceptable. Please input a DNA or RNA sequence");
| |
| - | return;
| |
| - | }
| |
| - | if (end3.match(/[^ACTG]/g)) {
| |
| - | alert("The format of the extreme custom sequence in 3' is not acceptable. Please input a DNA or RNA sequence");
| |
| - | return;
| |
| - | }
| |
| - |
| |
| - | // perfect binding site constructor
| |
| - | if (document.seqIn.quality[0].checked == true) {
| |
| - | resfin = comp(mir);
| |
| - | charac = "perf";
| |
| - | }
| |
| - |
| |
| - | // nucleotide 9-12 randomizer
| |
| - | else if (document.seqIn.quality[1].checked == true) {
| |
| - | var seed1 = mir.charAt(21);
| |
| - | seed1 = mismatcher(seed1);
| |
| - | var seed = mir.substring(14, 21);
| |
| - | seed = comp(seed);
| |
| - | newseed = (seed + seed1);
| |
| - | var rest1 = mir.substring(10, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest = mir.substring(0, 10);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest + rest1);
| |
| - | resfin = newcomp.concat(newseed);
| |
| - | charac = "bulge 9-12";
| |
| - | }
| |
| - |
| |
| - | // customized BS
| |
| - | else if (document.seqIn.quality[2].checked == true) {
| |
| - | if (seedval == 0 || compval == 0) {
| |
| - | alert('Please select one seed type and one supplementary region');}
| |
| - |
| |
| - | // design 6mer seed
| |
| - | if (seedval == "6mer") {
| |
| - | var seed1 = mir.charAt(21);
| |
| - | seed1 = mismatcher(seed1);
| |
| - | var seed8 = mir.charAt(14);
| |
| - | seed8 = mismatcher(seed8);
| |
| - | var seed = mir.substring(15, 21);
| |
| - | seed = comp(seed);
| |
| - | newseed = (seed8 + seed + seed1);
| |
| - | }
| |
| - |
| |
| - | // design 7merA1 seed
| |
| - | else if (seedval == "7merA1") {
| |
| - | var seed8 = mir.charAt(14);
| |
| - | seed8 = mismatcher(seed8);
| |
| - | var seed = mir.substring(15, 22);
| |
| - | seed = comp(seed);
| |
| - | newseed = (seed8 + seed);
| |
| - | }
| |
| - |
| |
| - | // design 7merm8 seed
| |
| - | else if (seedval == "7merm8") {
| |
| - | var seed1 = mir.charAt(21);
| |
| - | seed1 = mismatcher(seed1);
| |
| - | var seed = mir.substring(14, 21);
| |
| - | seed = comp(seed);
| |
| - | newseed = (seed + seed1);
| |
| - | }
| |
| - |
| |
| - | // design 8mer seed
| |
| - | else if (seedval == "8mer") {
| |
| - | newseed = comp(seedstring);
| |
| - | }
| |
| - |
| |
| - | // design custom seed
| |
| - | else if (seedval == "custom") {
| |
| - | if (mis.length > 1 || mis.match(/\D/g)) {
| |
| - | alert('The format of the input mismatches is not acceptable. Input only one number between 2 and 7');
| |
| - | return;
| |
| - | }
| |
| - | var result = new Array();
| |
| - | var cuseed = seedstring.split('');
| |
| - | cuseed = cuseed.reverse();
| |
| - | var mis_array = new Array();
| |
| - | mis_array = mis.split(', ');
| |
| - | for (var nj = 0; nj < mis_array.length; nj++) {
| |
| - | mis_array[nj] = mis_array[nj] - 1;
| |
| - | }
| |
| - | for (var i = 0; i < cuseed.length; i++) {
| |
| - | var flag = 0;
| |
| - | for (var j = 0; j < mis_array.length; j++) {
| |
| - | if (i == mis_array[j]) {
| |
| - | result[i] = mismatcher(cuseed[i]);
| |
| - | flag = 1;
| |
| - | }
| |
| - | }
| |
| - | if (!(flag == 1)) {
| |
| - | result[i] = comp(cuseed[i]);
| |
| - | }
| |
| - | }
| |
| - | newseed = result.reverse();
| |
| - | newseed = newseed.join('');
| |
| - | if (mis.length > 0) {
| |
| - | }
| |
| - | }
| |
| - |
| |
| - | // design 3 comp
| |
| - | if (compval == 3) {
| |
| - | var rest1 = mir.substring(9, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest3 = mir.substring(0, 6);
| |
| - | rest3 = mismatcher(rest3);
| |
| - | var rest = mir.substring(6, 9);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest3 + rest + rest1);
| |
| - | }
| |
| - |
| |
| - | // design 4 comp
| |
| - | else if (compval == 4) {
| |
| - | var rest1 = mir.substring(10, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest3 = mir.substring(0, 6);
| |
| - | rest3 = mismatcher(rest3);
| |
| - | var rest = mir.substring(6, 10);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest3 + rest + rest1);
| |
| - | }
| |
| - |
| |
| - | // design 5 comp
| |
| - | else if (compval == 5) {
| |
| - | var rest1 = mir.substring(10, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest3 = mir.substring(0, 5);
| |
| - | rest3 = mismatcher(rest3);
| |
| - | var rest = mir.substring(5, 10);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest3 + rest + rest1);
| |
| - | }
| |
| - |
| |
| - | // design 6 comp
| |
| - | else if (compval == 6) {
| |
| - | var rest1 = mir.substring(10, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest3 = mir.substring(0, 4);
| |
| - | rest3 = mismatcher(rest3);
| |
| - | var rest = mir.substring(4, 10);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest3 + rest + rest1);
| |
| - | }
| |
| - |
| |
| - | // design 7 comp
| |
| - | else if (compval == 7) {
| |
| - | var rest1 = mir.substring(10, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest3 = mir.substring(0, 3);
| |
| - | rest3 = mismatcher(rest3);
| |
| - | var rest = mir.substring(3, 10);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest3 + rest + rest1);
| |
| - | }
| |
| - |
| |
| - | // design 8 comp
| |
| - | else if (compval == 8) {
| |
| - | var rest1 = mir.substring(10, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest3 = mir.substring(0, 2);
| |
| - | rest3 = mismatcher(rest3);
| |
| - | var rest = mir.substring(2, 10);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest3 + rest + rest1);
| |
| - | }
| |
| - |
| |
| - | // design Total comp
| |
| - | else if (compval == "total") {
| |
| - | var rest1 = mir.substring(10, 14);
| |
| - | rest1 = mismatcher(rest1);
| |
| - | var rest = mir.substring(0, 10);
| |
| - | rest = comp(rest);
| |
| - | newcomp = (rest + rest1);
| |
| - | }
| |
| - |
| |
| - | // design custom comp
| |
| - | else if (compval == "custom") {
| |
| - |
| |
| - | var result = new Array();
| |
| - | var cucomp = compstring.split('');
| |
| - | cucomp = cucomp.reverse();
| |
| - | var match_array = new Array();
| |
| - | match_array = mat.split(', ');
| |
| - | for (var nj = 0; nj < match_array.length; nj++) {
| |
| - | match_array[nj] = match_array[nj] - 9;
| |
| - | }
| |
| - | for (var i = 0; i < cucomp.length; i++) {
| |
| - | var flag = 0;
| |
| - | for (var j = 0; j < match_array.length; j++) {
| |
| - | if (i == match_array[j]) {
| |
| - | result[i] = comp(cucomp[i]);
| |
| - | flag = 1;
| |
| - | }
| |
| - | }
| |
| - | if (!(flag == 1)) {
| |
| - | result[i] = mismatcher(cucomp[i]);
| |
| - | }
| |
| - | }
| |
| - | newcomp = result.reverse();
| |
| - | newcomp = newcomp.join('');
| |
| - | match_array = match_array.join('');
| |
| - | if (match_array.length > compstring.length || match_array.match(/\D/g)) {
| |
| - | alert('The format of the input matches is not acceptable. Input only numbers separated by commas');
| |
| - | return;
| |
| - | }
| |
| - | }
| |
| - |
| |
| - | // put together seed and compensatory regions
| |
| - | charac = "seed" + seedval + " compens" + compval;
| |
| - | resfin = newcomp.concat(newseed);
| |
| - | }
| |
| - |
| |
| - | //Addition of extra AUs
| |
| - |
| |
| - | // A/U in position 1
| |
| - | if (document.seqIn.AU[2].checked) {
| |
| - | var result = new Array();
| |
| - | for (var i = 0; i < resfin.length; i++) {
| |
| - | if (!(i == 21)) {
| |
| - | result[i] = resfin[i];
| |
| - | }
| |
| - | else {
| |
| - | if (mir[21] == "T") {
| |
| - | result[21] = "T";
| |
| - | }
| |
| - | else {
| |
| - | result[21] = "A";
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - | resfin = result.join('');
| |
| - | }
| |
| - |
| |
| - | // A/U in position 8
| |
| - | if (document.seqIn.AU[3].checked) {
| |
| - | var result = new Array();
| |
| - | for (var i = 0; i < resfin.length; i++) {
| |
| - | if (!(i == 14)) {
| |
| - | result[i] = resfin[i];
| |
| - | }
| |
| - | else {
| |
| - | if (mir[14] == "T") {
| |
| - | result[14] = "T";
| |
| - | }
| |
| - | else {
| |
| - | result[14] = "A";
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - | resfin = result.join('');
| |
| - | }
| |
| - |
| |
| - | // A/U in position 9
| |
| - | if (document.seqIn.AU[4].checked) {
| |
| - | var result = new Array();
| |
| - | for (var i = 0; i < resfin.length; i++) {
| |
| - | if (!(i == 13)) {
| |
| - | result[i] = resfin[i];
| |
| - | }
| |
| - | else {
| |
| - | if (mir[13] == "T") {
| |
| - | result[13] = "T";
| |
| - | }
| |
| - | else {
| |
| - | result[13] = "A";
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - | resfin = result.join('');
| |
| - | }
| |
| - |
| |
| - | // A/U in position 10
| |
| - | if (document.seqIn.AU[5].checked) {
| |
| - | var result = new Array();
| |
| - | for (var i = 0; i < resfin.length; i++) {
| |
| - | if (!(i == 12)) {
| |
| - | result[i] = resfin[i];
| |
| - | }
| |
| - | else {
| |
| - | if (mir[12] == "T") {
| |
| - | result[12] = "T";
| |
| - | }
| |
| - | else {
| |
| - | result[12] = "A";
| |
| - | }
| |
| - | }
| |
| - | }
| |
| - | resfin = result.join('');
| |
| - | }
| |
| - |
| |
| - | // position -1 and 0
| |
| - | var AU1 = "";
| |
| - | if (document.seqIn.AU[0].checked && document.seqIn.AU[1].checked) {
| |
| - | AU1 = "AA";
| |
| - | }
| |
| - | else if (!document.seqIn.AU[0].checked && document.seqIn.AU[1].checked) {
| |
| - | AU1 = "A";
| |
| - | }
| |
| - | else if (document.seqIn.AU[0].checked && !document.seqIn.AU[1].checked) {
| |
| - | AU1 = "CA";
| |
| - | }
| |
| - |
| |
| - | // addition of sticky ends
| |
| - | var leading5 = "";
| |
| - | var complem3 = "";
| |
| - | var leading3 = "";
| |
| - | var complem5 = "";
| |
| - |
| |
| - | if (endings == "BBB") {
| |
| - | leading5 = "AATTCGCGGCCGCACTAGT";
| |
| - | complem3 = "ACTAGTGCGGCCGCG";
| |
| - | leading3 = "GCTAGCGCGGCCGCTGCA";
| |
| - | complem5 = "GCGGCCGCGCTAGC";
| |
| - | }
| |
| - | if (endings == "XX") {
| |
| - | leading5 = "CCGGG";
| |
| - | complem3 = "C";
| |
| - | leading3 = "C";
| |
| - | complem5 = "TCGAG";
| |
| - | }
| |
| - | else if (endings == "custom") {
| |
| - | leading5 = end5;
| |
| - | leading3 = end3;
| |
| - | complem3 = revcomp(leading5);
| |
| - | complem5 = revcomp(leading3);
| |
| - | }
| |
| - |
| |
| - | // creation of reverse complementary strand
| |
| - | resfin = spacer.concat(resfin);
| |
| - | resfin = resfin.concat(AU1);
| |
| - | rcresult = revcomp(resfin);
| |
| - | leading5 = leading5.toLowerCase();
| |
| - | complem5 = complem5.toLowerCase();
| |
| - | leading3 = leading3.toLowerCase();
| |
| - | complem3 = complem3.toLowerCase();
| |
| - | var output1 = ("> " + nombre + ", " + charac);
| |
| - | var output2 = (leading5 + resfin + leading3);
| |
| - | var output3 = ("> " + nombre + ", " + charac + " comp strand");
| |
| - | var output4 = (complem5 + rcresult + complem3);
| |
| - |
| |
| - | // output sequences
| |
| - | showDiv(output1,output2,output3,output4);
| |
| - |
| |
| - | //End
| |
| - | }
| |
| - | </script>
| |
| | </head> | | </head> |
| | <body> | | <body> |
| | <form name="seqIn" action=""> | | <form name="seqIn" action=""> |
| - | | + | |
| - | <img style="border-width: 0px;" src="miBSdesigner.png" width="300" height="182" /> | + | <center> |
| - | <br> | + | <div class="t1"> |
| - | <span style="font-family: Arial; color: #11526f; font-size: 18.0px; "> | + | Construction of microRNA binding sites </div><br> |
| - | Construction of microRNA binding sites </span>
| + | <div style="width:350px; text-align:right;"><span class="help"><a href="https://2010.igem.org/Team:Heidelberg/Modeling/trainingset#Input" target="_blank" title="Input help">?</a><span></div> |
| - | <br>
| + | <div class="largetext" style="width:450px;"> |
| - | <span style="font-size: 17.0px;">
| + | Sequence name<br> |
| - | Sequence name </span> | + | |
| - | <br>
| + | |
| | <input type="text" name="name" id="name" size="40" value="hsa-miR122"/><br> | | <input type="text" name="name" id="name" size="40" value="hsa-miR122"/><br> |
| - | <span style="font-size: 17.0px;">microRNA Sequence ( 5' -> 3')</span><br> | + | microRNA Sequence ( 5' -> 3')<br> |
| | <input type="text" name="mir" id="mir" size="40" value="UCAGUUUACUAGUGCCAUUUGU"/><br> | | <input type="text" name="mir" id="mir" size="40" value="UCAGUUUACUAGUGCCAUUUGU"/><br> |
| - | <span style="font-size: 17.0px;">
| + | Spacer (inert sequence)<br> |
| - | Spacer (inert sequence) </span><br> | + | |
| | <input type="text" name="spacer" id="spacer" size="40" value="TTATATTTTATGACA"/> | | <input type="text" name="spacer" id="spacer" size="40" value="TTATATTTTATGACA"/> |
| | + | </center><br><br> |
| | + | <div class="largetext" style="width:400px;"> |
| | + | <input name="quality" value="perfect" onchange="chMd()" checked="checked" type="radio"> |
| | + | Perfect Binding Site <br> |
| | + | <input name="quality" value="bulge" onchange="chMd()" type="radio"> |
| | + | Imperfect Binding Site with 4 nt bulge (9-12)<br> |
| | + | <input name="quality" value="personal" onchange="chMd()" type="radio"> |
| | + | Personalized Binding Site |
| | </div> | | </div> |
| | <br> | | <br> |
| - | <div class="wrapper2">
| + | <table> |
| - | <input name="quality" value="perfect" onclick="chMd()" checked="checked" type="radio"> | + | <tr height=120px> |
| - | <span style="font-size: 18.0px;">
| + | <td width=290px> |
| - | Perfect Binding Site </span>
| + | <div class="title"> |
| - | <br>
| + | Seed sequence (1-8) <span class="help"><a href="https://2010.igem.org/Team:Heidelberg/Modeling/trainingset#Seed_Types" target="_blank" title="Seed sequence help">?</a></span> |
| - | <input name="quality" value="bulge" onclick="chMd()" type="radio">
| + | </div> |
| - | <span style="font-size: 18.0px;">
| + | <div class="option"><SELECT name="seed" onchange="chMd1()" disabled="disabled"> |
| - | Imperfect Binding Site with 4 nt bulge (9-12) </span>
| + | <OPTION value="0"> |
| - | <br>
| + | <OPTION value="6mer">6mer (2-7 paired) |
| - | <input name="quality" value="personal" onclick="chMd()" type="radio">
| + | <OPTION value="7merA1">7merA1 (1-7 paired) |
| - | <span style="font-size: 18.0px;">
| + | <OPTION value="7merm8">7merm8 (2-8 paired) |
| - | Personalized Binding Site </span>
| + | <OPTION value="8mer">8mer (1-8 paired) |
| - | <br>
| + | <OPTION value="custom">Custom |
| - | <br>
| + | </SELECT></div> |
| - | <div class="title">
| + | |
| - | <span style="font-size: 18.0px; text-decoration: underline;">
| + | Customized <span style="color:#11526f; font-weight:bold;">MISMATCH</span> position |
| - | Seed sequence (1-8) </span></div>
| + | <input type="text" id="mis" size="29" disabled="disabled" value="2"/> |
| - | | + | </div> |
| - | <SELECT name="seed" onclick="chMd1()" disabled="disabled">
| + | </td> |
| - | <OPTION value="6mer">6mer (2-7 paired)
| + | <td> |
| - | <OPTION value="7merA1">7merA1 (1-7 paired)
| + | |
| - | <OPTION value="7merm8">7merm8 (2-8 paired)
| + | Supplementary region <span class="help"><a href="https://2010.igem.org/Team:Heidelberg/Modeling/trainingset#Supplementary_Region" title="Supplementary region help" target="_blank">?</a></span></div> |
| - | <OPTION value="8mer">8mer (1-8 paired)
| + | <div class="option"><SELECT name="comp" onchange="chMd2()" disabled="disabled"> |
| - | <OPTION value="custom">Custom
| + | <OPTION value="0"> |
| - | </SELECT></div>
| + | <OPTION value="3">3 (14-16 paired) |
| - | | + | <OPTION value="4">4 (13-16 paired) |
| - | Customized <span style="color: #11526f; font-weight: bold; ">MISMATCH </span>position</div>
| + | <OPTION value="5">5 (13-17 paired) |
| - | <div class="suboption">
| + | <OPTION value="6">6 (13-18 paired) |
| - | <input type="text" id="mis" size="30" disabled="disabled" value="2"/>
| + | <OPTION value="7">7 (13-19 paired) |
| - | </div>
| + | <OPTION value="8">8 (13-20 paired) |
| - | <br>
| + | <OPTION value="total">Total (13-22 paired) |
| - | | + | <OPTION value="custom">Custom |
| - | <span style="font-size: 18.0px; text-decoration: underline;">
| + | </SELECT></div> |
| - | Supplementary region </span>
| + | |
| - | </div>
| + | Customized <span style="color: #11526f; font-weight:bold;">MATCH</span> positions |
| - | | + | <input type="text" id="match" size="29" disabled="disabled" value="10, 15, 16, 17, 18, 19, 20"/> |
| - | <SELECT name="comp" onclick="chMd2()" disabled="disabled">
| + | </div> |
| - | <OPTION value="3">3 (14-16 paired)
| + | </td> |
| - | <OPTION value="4">4 (13-16 paired)
| + | </tr> |
| - | <OPTION value="5">5 (13-17 paired)
| + | <tr> |
| - | <OPTION value="6">6 (13-18 paired)
| + | <td> |
| - | <OPTION value="7">7 (13-19 paired)
| + | |
| - | <OPTION value="8">8 (13-20 paired)
| + | Modify AU content <span class="help"><a href="https://2010.igem.org/Team:Heidelberg/Modeling/trainingset#AU_Content" target="_blank" title="AU help">?</a></span></div> |
| - | <OPTION value="total">Total (13-22 paired)
| + | <table style="line-height:2; font-size:12px;"> |
| - | <OPTION value="custom">Custom
| + | <tr> |
| - | </SELECT></div>
| + | <td width=130px> |
| - | | + | <input name="AU" value="-1" type="checkbox">A in position -1<br> |
| - | Customized <span style="color: #11526f; font-weight: bold; ">MATCH </span>positions (input numbers from 9 to 22)</div>
| + | <input name="AU" value="1" disabled="disabled" type="checkbox">A in position 1<br> |
| - | <div class="suboption">
| + | <input name="AU" value="9" disabled="disabled" type="checkbox">A in position 9<br> |
| - | <input type="text" id="match" size="30" disabled="disabled" value="10, 15, 16, 17, 18, 19, 20"/></div>
| + | </td> |
| - | <br> | + | <td> |
| - | <br>
| + | <input name="AU" value="0" type="checkbox">A in position 0<br> |
| - | | + | <input name="AU" value="8" disabled="disabled" type="checkbox">A in position 8<br> |
| - | <span style="font-size: 18.0px; text-decoration: underline;">
| + | <input name="AU" value="10" disabled="disabled" type="checkbox">A in position 10<br> |
| - | Modify AU content </span>
| + | </td> |
| - | </div>
| + | </tr> |
| - | <div class="optionl"><input name="AU" value="-1" type="checkbox">A in position -1</div>
| + | </table> |
| - | <div class="optionr"><input name="AU" value="0" type="checkbox">A in position 0 </div>
| + | </td> |
| - | <div class="clear">
| + | <td> |
| - | <div class="optionl"><input name="AU" value="1" disabled="disabled" type="checkbox">A in position 1</div>
| + | <div class="title">Sticky ends for integration into plasmid <span class="help"><a href="https://2010.igem.org/Team:Heidelberg/Modeling/trainingset#Sticky_Ends target="_blank" title="ends help"">?</a></span></div></div> |
| - | <div class="optionr"><input name="AU" value="8" disabled="disabled" type="checkbox">A in position 8 </div>
| + | <div class="option"><SELECT id="stickyends" name="stickyends" onchange="chMd3()"> |
| - | <div class="clear">
| + | |
| - | <div class="optionl"><input name="AU" value="9" disabled="disabled" type="checkbox">A in position 9</div>
| + | |
| - | <div class="optionr"><input name="AU" value="10" disabled="disabled" type="checkbox">A in position 10 </div> <br>
| + | |
| - | <div class="clear">
| + | |
| - | <br>
| + | |
| - | <div class="option"><span style="font-size: 18.0px; text-decoration: underline;">Sticky ends for integration in plasmid: </span></div> | + | |
| - | <div class="option"> <SELECT name="stickyends" onclick="chMd3()"> | + | |
| | <OPTION SELECTED value="none">None | | <OPTION SELECTED value="none">None |
| | <OPTION value="BBB">Biobricks Standard RFC-12 | | <OPTION value="BBB">Biobricks Standard RFC-12 |
| | + | <OPTION value="XX">Xma1 / Xho1 |
| | <OPTION value="custom">Custom sequence | | <OPTION value="custom">Custom sequence |
| | </SELECT></div> | | </SELECT></div> |
| - | <div class="option"> Customized: 5'<input type="text" id="end5" size="15" disabled="disabled"/> 3'<input type="text" id="end3" size="15" disabled="disabled"/> | + | <div class="suboption">Customized:<br> |
| | + | 5' <input type="text" id="end5" size="15" disabled="disabled"/><br> |
| | + | 3' <input type="text" id="end3" size="15" disabled="disabled"/> |
| | </div> | | </div> |
| | + | </td> |
| | + | </tr> |
| | + | </table> |
| | + | <br> |
| | <center> | | <center> |
| - | <input value=" Get your Binding Site! " type="button" onClick="SBS(seqIn)"> | + | <input value=" Generate your Binding Site! " type="button" onclick="SBS(seqIn)"> |
| - | </center> | + | </center> |
| - | <br>
| + | </div> |
| - | </div>
| + | |
| | </form> | | </form> |
| - | <div class="clear">
| |
| - | <br>
| |
| - | <div class="reswrap2" id="resultdiv">
| |
| - | <span>Name of primer 1</span><br>
| |
| - | <span id="NamA" style="font-size: 18.0px; color: #11526f; font-weight: bold;"></span><br>
| |
| - | <span>Sequence of primer 1</span><br>
| |
| - | <span id="seqA" style="font-size: 18.0px; color: #11526f; font-weight: bold;"></span><br>
| |
| - | <span>Name of primer 2</span><br>
| |
| - | <span id="NamB" style="font-size: 18.0px; color: #11526f; font-weight: bold;"></span><br>
| |
| - | <span>Sequence of primer 2</span><br>
| |
| - | <span id="seqB" style="font-size: 18.0px; color: #11526f; font-weight: bold;"></span><br>
| |
| - | </div>
| |
| | </body> | | </body> |
| | + | <script type="text/javascript" src="https://static.igem.org/mediawiki/2010/3/3a/Very_final_code_miBS_HD2010.txt"> </script> |
| | </html> | | </html> |
| | {{:Team:Heidelberg/Pagemiddle}} | | {{:Team:Heidelberg/Pagemiddle}} |
| | + | <html> |
| | + | <div class="wrapper"> |
| | + | <img style="border-width: 0px;" src="https://static.igem.org/mediawiki/2010/c/c0/MiBSdesigner.png" width="260" height="147" /> |
| | + | <br><br> |
| | + | <div class="reswrap2" id="resultdiv"> |
| | + | <div class="variaresult">Name of primer 1</div> |
| | + | <textarea name="NamA" cols=25 rows=1 id="NamA" wrap=SOFT></textarea><br><br> |
| | + | <div class="variaresult">Sequence of primer 1</div> |
| | + | <textarea name="seqA" cols=25 rows=3 id="seqA" wrap=SOFT></textarea><br><br> |
| | + | <div class="variaresult">Name of primer 2</div> |
| | + | <textarea name="NamB" cols=25 rows=1 id="NamB" wrap=SOFT></textarea><br><br> |
| | + | <div class="variaresult">Sequence of primer 2</div> |
| | + | <textarea name="seqB" cols=25 rows=3 id="seqB" wrap=SOFT></textarea><br> |
| | + | </div></div> |
| | + | </html> |
| | {{:Team:Heidelberg/Bottom}} | | {{:Team:Heidelberg/Bottom}} |
"
