Submission form from OpenHuntingData repo

.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["es2015", "stage-0"]
+}

.eslintrc

@@ -0,0 +1,10 @@
+{
+  "parser": "babel-eslint",
+  "rules": {
+    "strict": 0
+  },
+  "extends": "eslint:recommended",
+  "env": {
+    "browser": true
+  }
+}

README.md

@@ -1,2 +1,3 @@
-# SubmissionForm
-Web form for contributing data to OpenBounds projects
+## OpenBounds Data Submission
+
+A Javascript app running on Github Pages for data submission via pull request.

package.json

@@ -0,0 +1,36 @@
+{
+  "name": "openboundsdata",
+  "version": "1.0.0",
+  "description": "OpenBounds Data Submission",
+  "main": "src/index.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OpenBounds/OpenHuntingData.git"
+  },
+  "scripts": {
+    "lint": "eslint src/*.js",
+    "build-css": "cleancss --output dist/submission.min.css src/css/*.css",
+    "build-js": "webpack && uglifyjs dist/submission.js -c -o dist/submission.min.js",
+    "build": "npm run build-js && npm run build-css"
+  },
+  "author": "OpenBounds",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/OpenBounds/OpenHuntingData/issues"
+  },
+  "homepage": "https://github.com/OpenBounds/OpenHuntingData",
+  "dependencies": {
+    "nanoajax": "^0.4.0"
+  },
+  "devDependencies": {
+    "babel-core": "^6.1.2",
+    "babel-eslint": "^4.1.4",
+    "babel-loader": "^6.0.1",
+    "babel-preset-es2015": "^6.1.2",
+    "babel-preset-stage-0": "^6.1.18",
+    "clean-css": "^3.4.7",
+    "eslint": "^1.9.0",
+    "uglify": "^0.1.5",
+    "webpack": "^1.12.3"
+  }
+}

src/css/dropdown.css

@@ -0,0 +1,74 @@
+
+.dropdown-btn:focus,
+.dropdown-btn:focus:hover,
+.dropdown-btn.selected:focus {
+    border-color: #b5b5b5;
+}
+
+.dropdown-btn:focus,
+.dropdown-btn:focus:hover {
+    box-shadow: none;
+}
+
+.dropdown-btn.selected, .dropdown-btn.selected:focus {
+    background-color: #dcdcdc;
+    box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
+}
+
+.dropdown-btn::after {
+    display: inline-block;
+    width: 0;
+    height: 0;
+    content: "";
+    vertical-align: -2px;
+    margin-left: 5px;
+    border: 4px solid;
+    border-right-color: transparent;
+    border-left-color: transparent;
+    border-bottom-color: transparent;
+}
+
+.dropdown-menu {
+    width: 180px;
+    position: absolute;
+    right: 10px;
+    top: 45px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    background-clip: padding-box;
+    box-shadow: 0 3px 12px rgba(0,0,0,0.15);
+}
+
+.dropdown-menu::before {
+    position: absolute;
+    display: inline-block;
+    content: "";
+    border: 8px solid transparent;
+    border-bottom-color: rgba(0,0,0,0.15);
+    top: -16px;
+    left: auto;
+    right: 9px;
+}
+
+.dropdown-menu::after {
+    position: absolute;
+    display: inline-block;
+    content: "";
+    border: 7px solid transparent;
+    border-bottom-color: #fff;
+    top: -14px;
+    left: auto;
+    right: 10px;
+}
+
+.dropdown-item {
+    padding: 4px 10px 4px 15px;
+    color: #333;
+}
+
+.dropdown-item:hover {
+    color: #fff;
+    text-decoration: none;
+    text-shadow: none;
+    background-color: #4078c0;
+}

src/css/submission.css

@@ -0,0 +1,67 @@
+
+#main {
+    position: relative;
+    margin-top: 50px;
+}
+
+#manual textarea {
+    width: 100%;
+    font-family: monospace;
+}
+
+#doneerror {
+    float: right;
+}
+
+.form.form-inline {
+    display: inline-block;
+    margin-right: 10px;
+}
+
+.form.form-inline:last-child {
+    margin-right: 0;
+}
+
+dl.form > dd input[type="text"] {
+    width: 100%;
+}
+
+h2 {
+    margin-top: 5px;
+    margin-bottom: 30px;
+}
+
+.avatar {
+    width: 20px;
+    margin-right: 5px;
+}
+
+table {
+    width: 100%;
+    margin: 15px 0;
+}
+
+th,
+td {
+    text-align: left;
+    padding: 6px 15px;
+    border-bottom: 1px solid #E1E1E1;
+}
+
+tr:last-child td {
+    border-bottom: none;
+}
+
+td input {
+    width: 100%;
+}
+
+th:first-child,
+td:first-child {
+    padding-left: 0;
+}
+
+th:last-child,
+td:last-child {
+    padding-right: 0;
+}

src/dropdown.js

@@ -0,0 +1,39 @@
+
+/**
+ * Create dropdown with button
+ * 
+ */
+export default class Dropdown {
+    constructor (button) {
+        this.closed = true
+        this.button = button
+        this.button.classList.add('dropdown-btn')
+        this.button.addEventListener('click', this.open, true)
+    }
+
+    open = e => {
+        e.preventDefault()
+
+        if (this.closed) {
+            this.closed = false
+            this.button.nextElementSibling.style.display = 'block'
+            this.button.classList.add('selected')
+
+            window.setTimeout(() => {
+                window.document.addEventListener('click', this.close)
+            }, 50)
+        } else {
+            this.close()
+        }
+    }
+
+    close = e => {
+        e.preventDefault()
+
+        window.document.removeEventListener('click', this.close)
+
+        this.button.classList.remove('selected')
+        this.button.nextElementSibling.style.display = 'none'
+        this.closed = true
+    }
+}