[pull] develop from harvard-lil:develop

capstone/config/urls.py

@@ -20,7 +20,7 @@
 urlpatterns = [
     path('admin/', admin.site.urls),
     path('', include('capweb.urls')),
-    path('labs/', include('labs.urls')),
+    path('labs/', include(('labs.urls', 'labs'), namespace="labs")),
 ]
 
 # use django-debug-toolbar if installed

capstone/labs/templates/lab/chronolawgic/timeline.html

@@ -17,14 +17,15 @@
     // This is essentially each endpoint with its API interface
     // eslint-disable-next-line
     const urls = {
-        api_root: "{% api_url 'api-root' %}v1/",
+        chronolawgic_api_create: "{% url 'labs:chronolawgic-api-create' %}v1/",
+        chronolawgic_api_retrieve: "{% url 'labs:chronolawgic-api-retrieve' %}v1/",
+        chronolawgic_api_update: "{% url 'labs:chronolawgic-api-update' %}v1/",
+        chronolawgic_api_delete: "{% url 'labs:chronolawgic-api-delete' %}v1/",
         static: "{% static '' %}"
     };
 </script>
 <noscript>
-  This search interface requires javascript, even for basic functionality. If you can not or will not use
-  javascript, your best bet is to directly use <a href="{% api_url 'api-root' %}">the API this search interface
-  queries.</a> There is no data available in this search interface that is not available through the API.
+  This experimental interface requires javascript, even for basic functionality.
 </noscript>
 {% render_bundle 'labs-chronolawgic' %}
 {% endblock %}

capstone/labs/urls.py

@@ -18,7 +18,6 @@
              name='chronolawgic'),
         path('chronolawgic/timeline/', views.chronolawgic, name='chronolawgic-dashboard'),
         # your timeline list, create, delete
-        path('chronolawgic/timeline/:timeline_id', views.chronolawgic, name='chronolawgic-view'),  # view one timeline
         path('chronolawgic/api/create', views.chronolawgic_api_create, name='chronolawgic-api-create'),
         path('chronolawgic/api/retrieve/:timeline_id', views.chronolawgic_api_retrieve, name='chronolawgic-api-retrieve'),
         path('chronolawgic/api/update/:timeline_id', views.chronolawgic_api_update, name='chronolawgic-api-update'),

capstone/package.json

@@ -11,6 +11,7 @@
   "dependencies": {
     "acorn": "^6.4.1",
     "awesome-charts": "^1.0.0",
+    "axios": "^0.21.1",
     "chart.js": "^2.8.0",
     "commander": "^2.20.0",
     "core-js": "^3.6.5",

capstone/static/js/labs/chronolawgic/admin.vue

@@ -0,0 +1,22 @@
+<template>
+  <main>
+    This is a lovely world in which people can see their timelines, delete their timelines, and create their timelines.
+  </main>
+
+</template>
+
+<script>
+
+export default {
+  name: 'Admin',
+  components: {
+  },
+
+  data() {
+    return {
+    }
+  },
+  methods: {
+  }
+};
+</script>

capstone/static/js/labs/chronolawgic/main.js

@@ -1,8 +1,27 @@
 import Vue from 'vue'
+import VueRouter from "vue-router";
 import Timeline from './timeline'
+import Admin from './admin'
+import store from "./store";
+
+
+Vue.config.devtools = true;
+Vue.config.productionTip = false;
+
+Vue.use(VueRouter);
+const router = new VueRouter({
+  routes: [
+    { path: '/', component: Admin, name: 'admin'},
+    { path: '/:timeline', component: Timeline, name: 'timeline' },
+    { path: '*', redirect: '/' },
+  ]
+});
 
 new Vue({
     el: '#app',
+    store: store,
     template: '<Timeline/>',
-    components: {Timeline}
-})
+    components: {Timeline},
+    router
+})
+

capstone/static/js/labs/chronolawgic/store.js

@@ -0,0 +1,123 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+import axios from "axios";
+
+
+// eslint-disable-next-line
+const import_urls = urls; // defined in timeline.html
+
+Vue.use(Vuex)
+const store = new Vuex.Store({
+    state: {
+        urls: { // Doing this the long way to make it a little easier to see what's going on.
+            chronolawgic_api_create: import_urls.chronolawgic_api_create,
+            chronolawgic_api_retrieve: import_urls.chronolawgic_api_retrieve,
+            chronolawgic_api_update: import_urls.chronolawgic_api_update,
+            chronolawgic_api_delete: import_urls.chronolawgic_api_delete,
+            static: import_urls.static
+        },
+        available_timelines: [
+            //TODO: store a list of timeline titles/ids available on the server
+        ],
+        id: 1,
+        title: "Timeline Title",
+        CreatedBy: "Editable Text", // (user accts are for auth/logging purposes)
+        categories: {
+            Case: {id: "1", color: "#FF9911"},
+            Legislation: {id: "2", color: "#99FF11"},
+            ExecutiveOrder: {id: "3", color: "#FF9988"},
+            Anarchism: {id: "4", color: "#11FF99"},
+            Police: {id: "5", color: "#8899FF"},
+            Fascism: {id: "6", color: "#1199FF"},
+        },
+        events: [ {
+                name: "Event 1",
+                url: "https://cite.case.law/ill/1/176/",
+                description: "Between some time and some other time, this thing happened.",
+                start_year: 1880,
+                start_month: 1,
+                start_day: 15,
+                end_year: 1889,
+                categories: [2, 4],
+                end_month: 1,
+                end_day: 15,
+        }],
+        cases: [
+            {
+                name: "Case 1",
+                subhead: "Case 1",
+                description: "Though the Court upheld a conviction for membership in a group that advocated the overthrow of the state, Justice Brandeis explained, in a separate opinion, that under the \"clear and present danger test\" the strong presumption must be in favor of \"more speech, not enforced silence.\" That view, which ultimately prevailed, laid the groundwork for modern First Amendment law.",
+                decision_date: "",
+                categories: [1, 3],
+                url: "https://cite.case.law/ill/1/176/",
+                jurisdiction: "Ill.",
+                reporter:  "Ill.",
+                isCap: true,
+                year: 1885,
+                month: 12,
+                day: 30,
+            },
+        ]
+    },
+    mutations: {
+        writeTimeline(state) {
+            //TODO: Do any data transformations necessary
+            //TODO: Check credentials
+            //TODO: Send updated timeline to server
+            state.placeholder = 9;
+        },
+        createTimeline(state) {
+            //TODO: Check credentials
+            //TODO: Get new timeline ID from server
+            state.placeholder = 9;
+        },
+        deleteTimeline(state) {
+            //TODO: Do any data transformations necessary
+            state.placeholder = 9;
+        },
+        setTimeline(state) {
+            //TODO: Do any data transformations necessary
+            // state.timeline = state.timeline;
+            console.log("setTimeline", state.timeline)
+        }
+    },
+    getters: {
+        readTimeline(state) {
+            state.placeholder++
+        },
+        getEvents(state) {
+            return state.timeline.events;
+        },
+    },
+    actions: {
+        deserialize: (json) => {
+            this.state.id = json.id
+            this.state.title = json.title
+            this.state.CreatedBy = json.CreatedBy
+            this.state.categories = json.categories
+            this.state.events = json.events
+            this.state.cases = json.cases
+        },
+        serialize: () => {
+            return {
+                id: this.state.id,
+                title: this.state.title,
+                CreatedBy: this.state.CreatedBy,
+                categories: this.state.categories,
+                events: this.state.events,
+                cases: this.state.cases,
+            }
+        },
+        getTimeLine: function ({commit}) {
+            //TODO make this work with vue router so it gets the new timeine as the route changes
+            axios
+                .get(this.state.urls.chronolawgic_api_retrieve)
+                .then(response => response.data)
+                .then(timeline => {
+                    console.log(timeline);
+                    commit('setTimeline', timeline)
+                })
+        },
+    },
+})
+export default store;

capstone/yarn.lock

@@ -1871,6 +1871,13 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.11.0.tgz#d61f46d83b2519250e2784daf5b09479a8b41c59"
   integrity sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==
 
+axios@^0.21.1:
+  version "0.21.1"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.1.tgz#22563481962f4d6bde9a76d516ef0e5d3c09b2b8"
+  integrity sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==
+  dependencies:
+    follow-redirects "^1.10.0"
+
 babel-eslint@^10.1.0:
   version "10.1.0"
   resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232"
@@ -4449,6 +4456,11 @@ follow-redirects@^1.0.0:
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.0.tgz#b42e8d93a2a7eea5ed88633676d6597bc8e384db"
   integrity sha512-aq6gF1BEKje4a9i9+5jimNFIpq4Q1WiwBToeRK5NvZBd/TRsmW8BsJfOEGkr76TbOyPVD3OVDN910EcUNtRYEA==
 
+follow-redirects@^1.10.0:
+  version "1.13.2"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.2.tgz#dd73c8effc12728ba5cf4259d760ea5fb83e3147"
+  integrity sha512-6mPTgLxYm3r6Bkkg0vNM0HTjfGrOEtsfbhagQvbxDEsEkpNhw582upBaoRZylzen6krEmxXJgt9Ju6HiI4O7BA==
+
 for-in@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"