BenjGonzaga (Talk | contribs) |
BenjGonzaga (Talk | contribs) |
||
| Line 9: | Line 9: | ||
<style> | <style> | ||
| + | |||
| + | /*dropdown*/ | ||
| + | |||
| + | .usydbuttoncontainer { | ||
| + | width: 90%; | ||
| + | margin: auto; | ||
| + | padding: 5px; | ||
| + | } | ||
| + | |||
| + | |||
| + | .keyusydaccordion { | ||
| + | font-family: 'Montserrat', sans-serif; | ||
| + | background-color: #6AB4FB; | ||
| + | color: #fff; | ||
| + | cursor: pointer; | ||
| + | padding: 25px; | ||
| + | width: 100%; | ||
| + | border: #fff 4px solid; | ||
| + | border-radius: 15px; | ||
| + | text-align: left; | ||
| + | outline: none; | ||
| + | font-size: 3vh; | ||
| + | transition: 0.6s; | ||
| + | } | ||
| + | |||
| + | .keyusydaccordion:after { | ||
| + | content: '\002B'; | ||
| + | color: #fff; | ||
| + | font-weight: bold; | ||
| + | float: right; | ||
| + | } | ||
| + | |||
| + | .panel { | ||
| + | font-family: 'Quicksand', sans-serif; | ||
| + | font-size: 0.8vw; | ||
| + | padding: 0 18px; | ||
| + | background-color: white; | ||
| + | border: 0px; | ||
| + | border-radius: 15px; | ||
| + | max-height: 0; | ||
| + | overflow: hidden; | ||
| + | transition: max-height 0.2s ease-out; | ||
| + | } | ||
#codonwrapper { | #codonwrapper { | ||
| Line 68: | Line 111: | ||
table, td { | table, td { | ||
| − | + | border: 1px solid #6AB4FB; | |
} | } | ||
| Line 158: | Line 201: | ||
</div> | </div> | ||
| − | + | ||
<h1 class="mainH"> Documentation </h1> | <h1 class="mainH"> Documentation </h1> | ||
| + | <div class="usydbuttoncontainer"> | ||
| + | <button class="keyusydaccordion"> Baby of Documents</button> | ||
| + | <div class="panel"> | ||
| + | <h1> Title </h1> | ||
| + | <p> | ||
| + | </p> | ||
| + | </div> | ||
| + | </div> | ||
| + | |||
| + | <div class="spacerboi"></div> | ||
</body> | </body> | ||
| Line 316: | Line 369: | ||
{ | { | ||
var codonRank = document.getElementById('codonRank'); | var codonRank = document.getElementById('codonRank'); | ||
| − | + | var tableText = '<tr><th>Amino Acid</th><th>Codon</th><th>Codon Usage: ' + sourceOrganismData.speciesName + ' (‰)</th><th>Codon Usage: ' + destOrganismData.speciesName + ' (‰)</th><th>Residue: ' + sourceOrganismData.speciesName + ' (%)</th><th>Residue: ' + destOrganismData.speciesName + ' %</th></tr>'; | |
nbCodonsSrc = sourceOrganismData.nbCodons; | nbCodonsSrc = sourceOrganismData.nbCodons; | ||
nbCodonsDest = destOrganismData.nbCodons; | nbCodonsDest = destOrganismData.nbCodons; | ||
| Line 331: | Line 384: | ||
} | } | ||
| − | + | tableText = tableText + '<tr><td>' + aa + '</td><td>'; | |
| − | + | for (cod in sourceOrganismData.AminoAcids[aa]) | |
| − | + | { | |
| − | + | tableText = tableText + cod + '<br>'; | |
| − | + | } | |
| − | + | tableText = tableText + '</td><td>' | |
| − | + | for (cod in sourceOrganismData.AminoAcids[aa]) | |
| − | + | { | |
| − | + | tableText = tableText + (1000*sourceOrganismData.AminoAcids[aa][cod]/nbCodonsSrc).toFixed(2)+ '<br>'; | |
| − | + | } | |
| − | + | tableText = tableText + '</td><td>' | |
| − | + | for (cod in destOrganismData.AminoAcids[aa]) | |
| − | + | { | |
| − | + | tableText = tableText + (1000*destOrganismData.AminoAcids[aa][cod]/nbCodonsDest).toFixed(2)+ '<br>'; | |
| − | + | } | |
tableText = tableText + '</td><td>' | tableText = tableText + '</td><td>' | ||
for (cod in sourceOrganismData.AminoAcids[aa]) | for (cod in sourceOrganismData.AminoAcids[aa]) | ||
| Line 356: | Line 409: | ||
tableText = tableText + (100*destOrganismData.AminoAcids[aa][cod]/destSumOverAcid).toFixed(2)+ '<br>'; | tableText = tableText + (100*destOrganismData.AminoAcids[aa][cod]/destSumOverAcid).toFixed(2)+ '<br>'; | ||
} | } | ||
| − | + | tableText = tableText + '</td></tr>' | |
} | } | ||
codonRank.innerHTML = tableText; | codonRank.innerHTML = tableText; | ||
| Line 563: | Line 616: | ||
} | } | ||
} | } | ||
| + | </script> | ||
| + | <script type="text/javascript"> | ||
| + | var acc = document.getElementsByClassName("keyusydaccordion"); | ||
| + | var i; | ||
| + | for (i = 0; i < acc.length; i++) { | ||
| + | acc[i].addEventListener("click", function() { | ||
| + | this.classList.toggle("active"); | ||
| + | var panel = this.nextElementSibling; | ||
| + | if (panel.style.maxHeight){ | ||
| + | panel.style.maxHeight = null; | ||
| + | } else { | ||
| + | panel.style.maxHeight = panel.scrollHeight + "px"; | ||
| + | } | ||
| + | }); | ||
| + | } | ||
</script> | </script> | ||
</html> | </html> | ||
Revision as of 02:45, 21 October 2019
Software
Codonator 3000
Enter your gene sequence:
Search source organism
Search destination organism
Set minimum codon frequency threshold per thousand