rav4s
/
wasm-dna-transcription-translation
mirror of https://github.com/Rav4s/wasm-dna-transcription-translation
1
1
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

insert codons in correct div

pull/1/head
Ravi Shah 5 years ago
parent
cf5f100e04
commit
7456dc105a
4 changed files with 44 additions and 7 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      src/lib.rs
  2. 11
      www/app.html
  3. 26
      www/css/styles.css
  4. 8
      www/index.html

6
src/lib.rs
View File

@ -159,16 +159,16 @@ pub fn main(mut strand: String) {
// window object. // window object.
let window = web_sys::window().expect("no global `window` exists"); let window = web_sys::window().expect("no global `window` exists");
let document = window.document().expect("should have a document on window"); let document = window.document().expect("should have a document on window");
let body = document.body().expect("document should have a body");
let codons_div = document.get_element_by_id("codons").expect("codons div should exist");
let val = document.create_element("h2").unwrap(); let val = document.create_element("h2").unwrap();
val.set_text_content(Some("Codons:")); val.set_text_content(Some("Codons:"));
body.append_child(&val).unwrap();
codons_div.append_with_node_1(&val).unwrap();
print!("The translated amino acids are: "); print!("The translated amino acids are: ");
for i in amino_acids_list { for i in amino_acids_list {
let val = document.create_element("p").unwrap(); let val = document.create_element("p").unwrap();
val.set_text_content(Some(&i)); val.set_text_content(Some(&i));
body.append_child(&val).unwrap();
codons_div.append_with_node_1(&val).unwrap();
} }
} }

11
www/app.html
View File

@ -1,12 +1,21 @@
<!DOCTYPE html> <!DOCTYPE html>
<html>
<html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="description" content="Easily transcribe and translate DNA into messenger RNA and amino acids">
<title>DNA Transcription &amp; Translation</title> <title>DNA Transcription &amp; Translation</title>
<link rel="stylesheet" href="/css/styles.css">
</head> </head>
<body> <body>
<noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript> <noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
<script src="./bootstrap.js"></script> <script src="./bootstrap.js"></script>
<h1>DNA Transcription &amp; Translation</h1> <h1>DNA Transcription &amp; Translation</h1>
<div id="codons">
</div>
<div id="footer">
<p>© 2021 Ravi Shah</p>
</div>
</body> </body>
</html> </html>

26
www/css/styles.css
View File

@ -1,3 +1,18 @@
:root {
--primary-bg-color: #568ea3;
--secondary-bg-color: #E96400;
--main-highlight-color: #a40e4c;
}
::selection {
background: var(--main-highlight-color); /* WebKit/Blink Browsers */
}
::-moz-selection {
background: var(--main-highlight-color); /* Gecko Browsers */
}
* { * {
box-sizing: border-box; box-sizing: border-box;
} }
@ -10,13 +25,20 @@ body {
margin: 0; margin: 0;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
height: 100%; height: 100%;
background-color: var(--primary-bg-color);
color: white;
} }
h1 {
h1, h2 {
all: initial; all: initial;
} }
h1 {
h1, h2 {
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
font-size: 23.5px; font-size: 23.5px;
color: white;
}
.input-div {
} }

8
www/index.html
View File

@ -1,8 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html>
<html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="description" content="Easily transcribe and translate DNA into messenger RNA and amino acids">
<title>DNA Transcription &amp; Translation</title> <title>DNA Transcription &amp; Translation</title>
<link rel="stylesheet" href="/css/styles.css">
</head> </head>
<body> <body>
<noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript> <noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
@ -11,5 +14,8 @@
<input type="text" name="strand"> <input type="text" name="strand">
<input type="submit" value="Submit"> <input type="submit" value="Submit">
</form> </form>
<div id="footer">
<p>© 2021 Ravi Shah</p>
</div>
</body> </body>
</html> </html>
Write Preview
Loading…
Cancel
Save