From 02752704ef52bb2c2068e8586c9d4062a7fdcadd Mon Sep 17 00:00:00 2001
From: BonfaceKilz
Date: Sat, 25 Apr 2020 19:34:55 +0300
Subject: Put CSS code into it's own separate CSS file
---
bh20simplewebuploader/static/main.css | 155 ++++++++++++++++++++++++++++++++++
1 file changed, 155 insertions(+)
create mode 100644 bh20simplewebuploader/static/main.css
(limited to 'bh20simplewebuploader/static')
diff --git a/bh20simplewebuploader/static/main.css b/bh20simplewebuploader/static/main.css
new file mode 100644
index 0000000..30b1d04
--- /dev/null
+++ b/bh20simplewebuploader/static/main.css
@@ -0,0 +1,155 @@
+hr {
+ margin: auto 0;
+}
+
+body {
+ color: #101010;
+ background-color: #F9EDE1;
+ margin: 0;
+}
+
+h1, h2, h3, h4 {
+ font-family: 'Roboto Slab', serif;
+ color: darkblue;
+}
+
+h1 {
+ text-align: center;
+}
+
+p {
+ color: #505050;
+ font-style: italic;
+}
+.header {
+ background-color: white;
+ margin: 0 auto;
+ padding: 20px;
+ text-align: center;
+ height: 150px;
+}
+
+.logo {
+ float: right;
+}
+
+p, form, .about, .footer {
+ font-family: 'Raleway', sans-serif;
+ line-height: 1.5;
+}
+
+form h4 {
+ text-transform: 'uppercase';
+}
+
+.intro, form {
+ padding: 20px;
+}
+
+.intro {
+ background-color: lightgrey;
+ margin: 0 auto;
+ padding: 20px;
+}
+
+.about {
+ background-color: lightgrey;
+ margin: 0 auto;
+ padding: 20px;
+}
+.footer {
+ background-color: white;
+ margin: 0 auto;
+}
+
+span.dropt {border-bottom: thin dotted; background: #ffeedd;}
+span.dropt:hover {text-decoration: none; background: #ffffff; z-index: 6; }
+
+.grid-container {
+ display: grid;
+ grid-template-columns: repeat(4, 1fr);
+ grid-template-rows: auto;
+ row-gap:5px;
+ grid-template-areas:
+ "a a b b"
+ "a a c c"
+ "a a d d"
+ "e e e e"
+ "f f f f";
+ grid-auto-flow: column;
+}
+
+.intro {
+ grid-area: a;
+}
+
+.fasta-file-select {
+ padding: 1em;
+ grid-area: b;
+}
+
+.metadata {
+ padding: 1em;
+ grid-area: c;
+}
+.metadata_upload_form {
+ padding: 1em;
+ grid-area: c;
+}
+
+#metadata_upload_form_spot {
+ grid-area: d;
+}
+
+#metadata_fill_form_spot {
+ grid-area: e;
+}
+
+#metadata_fill_form {
+ column-count: 4;
+ margin-top: 0.5em;
+ column-width: 250px;
+}
+
+.record {
+ display: flex;
+ flex-direction: column;
+ border: solid 1px #808080;
+ padding: 1em;
+ background: #F8F8F8;
+ margin-bottom: 1em;
+ -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
+ page-break-inside: avoid; /* Firefox */
+ break-inside: avoid;
+}
+
+.record label {
+ font-size: small;
+ margin-top: 10px;
+}
+
+.submit {
+ grid-area: f;
+ width: 17em;
+ justify-self: center;
+}
+
+footer {
+ display: block;
+ width: 100%;
+}
+
+.sponsors {
+ width: inherit;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: space-around;
+}
+
+@media only screen and (max-device-width: 480px) {
+ .grid-container {
+ display: flex;
+ flex-direction: column;
+ }
+}
--
cgit v1.2.3
From d3d16604a4d78442baffa47aca9a6a5ee49a5ed0 Mon Sep 17 00:00:00 2001
From: BonfaceKilz
Date: Sat, 25 Apr 2020 19:40:56 +0300
Subject: Put JS code in its own JS file
---
bh20simplewebuploader/static/main.js | 37 +++++++++++++++++++++++++++++
bh20simplewebuploader/templates/form.html | 39 ++-----------------------------
2 files changed, 39 insertions(+), 37 deletions(-)
create mode 100644 bh20simplewebuploader/static/main.js
(limited to 'bh20simplewebuploader/static')
diff --git a/bh20simplewebuploader/static/main.js b/bh20simplewebuploader/static/main.js
new file mode 100644
index 0000000..ab810cd
--- /dev/null
+++ b/bh20simplewebuploader/static/main.js
@@ -0,0 +1,37 @@
+let r = new XMLHttpRequest();
+let test;
+r.open("GET", scriptRoot + "/api/getAllaccessions", true);
+r.onreadystatechange = function () {
+ if (r.readyState != 4 || r.status != 200) return;
+ test = r.responseText;
+ console.log(JSON.parse(test));
+};
+r.send();
+let uploadForm = document.getElementById('metadata_upload_form')
+let uploadFormSpot = document.getElementById('metadata_upload_form_spot')
+let fillForm = document.getElementById('metadata_fill_form')
+let fillFormSpot = document.getElementById('metadata_fill_form_spot')
+
+function setUploadMode() {
+ // Make the upload form the one in use
+ uploadFormSpot.appendChild(uploadForm)
+ fillFormSpot.removeChild(fillForm)
+}
+
+function setFillMode() {
+ // Make the fillable form the one in use
+ uploadFormSpot.removeChild(uploadForm)
+ fillFormSpot.appendChild(fillForm)
+}
+
+function setMode() {
+ // Pick mode based on radio
+ if (document.getElementById('metadata_upload').checked) {
+ setUploadMode()
+ } else {
+ setFillMode()
+ }
+}
+
+// Start in mode appropriate to selected form item
+setMode()
diff --git a/bh20simplewebuploader/templates/form.html b/bh20simplewebuploader/templates/form.html
index 9c272a0..7b1fd98 100644
--- a/bh20simplewebuploader/templates/form.html
+++ b/bh20simplewebuploader/templates/form.html
@@ -151,43 +151,8 @@
+
+