Commit MVP

3 files changed, 149 insertions, 19 deletions

diff --git a/src/views/About.vue b/src/views/About.vue
index 3fa2807..ab4725e 100644
--- a/src/views/About.vue
+++ b/src/views/About.vue
@@ -1,5 +1,30 @@
 <template>
   <div class="about">
-    <h1>This is an about page</h1>
+    <router-link to="/editor">Create new database</router-link>
+    <file-upload
+      :accept="'application/json'"
+      @file-changed="handleDatabaseChange">Use existing database</file-upload>
   </div>
 </template>
+
+<script>
+import FileUpload from '../components/FileUpload.vue';
+
+import { parsePtDatabase } from '../features/parser';
+
+export default {
+  name: 'About',
+  components: {
+    FileUpload,
+  },
+  methods: {
+    handleDatabaseChange(files) {
+      parsePtDatabase(files[0]).then((result) => {
+        this.$store.commit('setLabs', result.labs);
+        this.$store.commit('setPeerTeachers', result.peerTeachers);
+        this.$router.push({ name: 'Editor' });
+      });
+    },
+  },
+};
+</script>
diff --git a/src/views/Editor.vue b/src/views/Editor.vue
new file mode 100644
index 0000000..5ef0131
--- /dev/null
+++ b/src/views/Editor.vue
@@ -0,0 +1,123 @@
+<template>
+  <div id="home">
+    <action-bar />
+    <div id="editor">
+      <div class="column">
+        <list :items="peerTeachers" @selection-changed="handlePtClick" #default="pt">
+          {{ pt.item.name }} <button @click.stop="deletePeerTeacher(pt.item.id)">X</button>
+        </list>
+      </div>
+      <div class="column">
+        <list :items="compatibleLabs" #default="lab">
+          {{ lab.item.fullInfo }} <button @click.stop="assignLab(lab.item.id)">+</button>
+        </list>
+      </div>
+      <div class="column">
+        <list :items="selectedPeerTeacherAssignments" #default="lab">
+          {{ lab.item.fullInfo }} <button @click.stop="unassignLab(lab.item.id)">X</button>
+        </list>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import ActionBar from '@/components/ActionBar.vue';
+import List from '@/components/List.vue';
+import PeerTeacher from '@/models/PeerTeacher';
+
+export default {
+  name: 'Editor',
+  components: {
+    ActionBar,
+    List,
+  },
+  computed: {
+    labs() {
+      return Array.from(this.$store.state.labs.values()).sort((a, b) => a.id
+        .localeCompare(b.id));
+    },
+    peerTeachers() {
+      return Array.from(this.$store.state.peerTeachers.values()).sort((a, b) => a.lastname
+        .toUpperCase().localeCompare(b.lastname.toUpperCase()));
+    },
+    compatibleLabs() {
+      const temp = this.labs.filter((lab) => (!this.selectedPeerTeacher.assignedLabs.has(lab.id)
+        && !this.selectedPeerTeacher.conflictsWith(lab.event)));
+
+      const currentAssignments = this.selectedPeerTeacherAssignments;
+      return temp.filter((lab) => {
+        let compatible = true;
+        currentAssignments.every((assignedLab) => {
+          if (lab.event.conflictsWith(assignedLab.event)) {
+            compatible = false;
+            return false;
+          }
+          return true;
+        });
+        return compatible;
+      });
+    },
+    selectedPeerTeacherAssignments() {
+      return [...this.selectedPeerTeacher.assignedLabs.values()].map((id) => this.$store.state.labs
+        .get(id)).sort((a, b) => {
+        if (a.course < b.course) {
+          return -1;
+        }
+        if (b.course < a.course) {
+          return 1;
+        }
+
+        if (a.section < b.section) {
+          return -1;
+        }
+        if (b.section < a.section) {
+          return 1;
+        }
+
+        return 0;
+      });
+    },
+  },
+  data() {
+    return {
+      selectedPeerTeacher: new PeerTeacher(),
+    };
+  },
+  methods: {
+    handlePtClick(peerTeacher) {
+      this.selectedPeerTeacher = peerTeacher;
+    },
+    deletePeerTeacher(id) {
+      if (this.selectedPeerTeacher.id === id) {
+        this.selectedPeerTeacher = new PeerTeacher();
+      }
+      this.$store.commit('deletePeerTeacher', id);
+    },
+    assignLab(id) {
+      if (this.selectedPeerTeacher.id !== 0) {
+        this.selectedPeerTeacher.assignedLabs.add(id);
+      }
+    },
+    unassignLab(id) {
+      this.selectedPeerTeacher.assignedLabs.delete(id);
+    },
+  },
+};
+</script>
+
+<style>
+#home {
+  max-height: inherit;
+}
+
+#editor {
+  display: flex;
+  max-height: inherit;
+}
+
+.column {
+  flex: 1;
+  overflow: auto;
+}
+</style>
diff --git a/src/views/Home.vue b/src/views/Home.vue
deleted file mode 100644
index e91ef23..0000000
--- a/src/views/Home.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<template>
-  <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
-  </div>
-</template>
-
-<script>
-// @ is an alias to /src
-import HelloWorld from '@/components/HelloWorld.vue';
-
-export default {
-  name: 'Home',
-  components: {
-    HelloWorld,
-  },
-};
-</script>