Add link for recording

Added couple helper methods
Fixed not clearing recording link on "New Note"
add retrieveReferenceType method for reference editor

public/css/style.css

@@ -48,7 +48,7 @@ body {
 }
 
 .ref {
-  width: 35%;
+  width: 36%;
 }
 
 .ref > div#ref {
@@ -90,7 +90,7 @@ body {
 }
 
 .notes {
-  width: 55%;
+  width: 57%;
 }
 
 textarea#notes {
@@ -239,4 +239,10 @@ div#refQuery #referenceSearch {
 
 #referenceBook {
   display: none;
+}
+
+.recording-link {
+  font-size: 8pt;
+  color: blue;
+  text-decoration: none;
 }/*# sourceMappingURL=style.css.map */

public/css/style.css.map

@@ -1 +1 @@
-{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA,kCAAA;AACA;EACI,SAAA;ACCJ;;ADEA,6BAAA;AAEA;EACI,aAAA;EACA,mBAAA;EACA,eAAA;EACA,6BAAA;EACA,oBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iCAAA;EACA,cAAA;ACAJ;;ADGA;EACI,WAAA;EACA,4BAAA;ACAJ;;ADGA;EACI,SAAA;EACA,UAAA;ACAJ;;ADGA;EACI,gBAAA;EACA,qBAAA;ACAJ;;ADGA;EACI,kBAAA;ACAJ;;ADGA,GAAA;AACA;EACI,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,YAAA;EACA,WAAA;EACA,kBAAA;EACA,eAAA;EACA,kBAAA;ACAJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;EACI,mBAAA;EACA,2BAAA;EACA,yBAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,uBAAA;EACA,kBAAA;EACA,wCAAA;ACDJ;;ADIA;EACI,wBAAA;ACDJ;;ADIA;EACI,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,cAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;EACI,WAAA;EACA,YAAA;EACA,eAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,kBAAA;ACDJ;;ADIA;;EAEI,2BAAA;ACDJ;;ADIA;;;;EAII,oCAAA;EACA,uBAAA;ACDJ;;ADIA;EACI,oBAAA;EACA,mBAAA;EACA,UAAA;ACDJ;;ADIA;EACI,oBAAA;EACA,2BAAA;EACA,UAAA;ACDJ;;ADIA;EACI,iBAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;EACA,kBAAA;ACDJ;;ADIA;EACI,SAAA;EACA,UAAA;EACA,qBAAA;EACA,gBAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,oCAAA;EACA,YAAA;EACA,aAAA;ACDJ;;ADIA;EACI,YAAA;EACA,kBAAA;EACA,kBAAA;EACA,eAAA;EACA,gBAAA;EACA,WAAA;EACA,yBAAA;EACA,YAAA;EACA,YAAA;EACA,eAAA;EACA,aAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,sBAAA;EACA,YAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,wCAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;ACDJ;;ADIA;EACI,UAAA;EACA,iBAAA;EACA,eAAA;EACA,iBAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;;EAEI,YAAA;EACA,qBAAA;ACDJ;;ADIA;EACI,2BAAA;EACA,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,qBAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;;EAEI,2BAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ","file":"style.css"}
+{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA,kCAAA;AACA;EACI,SAAA;ACCJ;;ADEA,6BAAA;AAEA;EACI,aAAA;EACA,mBAAA;EACA,eAAA;EACA,6BAAA;EACA,oBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iCAAA;EACA,cAAA;ACAJ;;ADGA;EACI,WAAA;EACA,4BAAA;ACAJ;;ADGA;EACI,SAAA;EACA,UAAA;ACAJ;;ADGA;EACI,gBAAA;EACA,qBAAA;ACAJ;;ADGA;EACI,kBAAA;ACAJ;;ADGA,GAAA;AACA;EACI,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,YAAA;EACA,WAAA;EACA,kBAAA;EACA,eAAA;EACA,kBAAA;ACAJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;EACI,mBAAA;EACA,2BAAA;EACA,yBAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,uBAAA;EACA,kBAAA;EACA,wCAAA;ACDJ;;ADIA;EACI,wBAAA;ACDJ;;ADIA;EACI,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,cAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;EACI,WAAA;EACA,YAAA;EACA,eAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,kBAAA;ACDJ;;ADIA;;EAEI,2BAAA;ACDJ;;ADIA;;;;EAII,oCAAA;EACA,uBAAA;ACDJ;;ADIA;EACI,oBAAA;EACA,mBAAA;EACA,UAAA;ACDJ;;ADIA;EACI,oBAAA;EACA,2BAAA;EACA,UAAA;ACDJ;;ADIA;EACI,iBAAA;ACDJ;;ADIA;EACI,aAAA;EACA,YAAA;EACA,kBAAA;ACDJ;;ADIA;EACI,SAAA;EACA,UAAA;EACA,qBAAA;EACA,gBAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,oCAAA;EACA,YAAA;EACA,aAAA;ACDJ;;ADIA;EACI,YAAA;EACA,kBAAA;EACA,kBAAA;EACA,eAAA;EACA,gBAAA;EACA,WAAA;EACA,yBAAA;EACA,YAAA;EACA,YAAA;EACA,eAAA;EACA,aAAA;ACDJ;;ADIA;EACI,aAAA;EACA,kBAAA;EACA,YAAA;EACA,sBAAA;EACA,YAAA;EACA,aAAA;EACA,sBAAA;EACA,kBAAA;EACA,wCAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;ACDJ;;ADIA;EACI,UAAA;EACA,iBAAA;EACA,eAAA;EACA,iBAAA;EACA,YAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,UAAA;ACDJ;;ADIA;;EAEI,YAAA;EACA,qBAAA;ACDJ;;ADIA;EACI,2BAAA;EACA,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;EACI,qBAAA;ACDJ;;ADIA;EACI,eAAA;ACDJ;;ADIA;;EAEI,2BAAA;ACDJ;;ADIA;EACI,aAAA;ACDJ;;ADIA;EACI,cAAA;EACA,WAAA;EACA,qBAAA;ACDJ","file":"style.css"}

public/css/style.min.css

@@ -1 +1 @@
-body{margin:0}.inner{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;align-items:stretch;align-content:flex-start;max-width:1060px;margin:0 auto}.ref-tab{width:60px;padding-top:75px !important}.ref-tab ul{margin:0;padding:0}.ref-tab ul li{list-style:none;list-style-type:none}.tab{margin-bottom:3px}.tab button{display:flex;justify-content:center;align-items:center;height:80px;width:100%;text-align:center;font-size:14px;margin-bottom:3px}.ref{width:35%}.ref>div#ref{vertical-align:top;justify-content:flex-start;align-content:flex-start;overflow-y:scroll;width:100%;height:100%;border:#000 solid 1px;border-radius:3px;box-shadow:0 2px 5px rgba(0,0,0,.3)}#ref{padding:3px 3px 3px 3px}#passage{width:100px}#newSpeaker{display:none;width:110px}#newSeries{display:none;width:110px}#fields-container{display:none}#fields-container.show{display:block}.notes{width:55%}textarea#notes{width:100%;height:100%;font-size:14pt}#notePreview{display:none;overflow-x:scroll;padding-left:10px}#notePreview ul,#notePreview ol{list-style-position:inside}#previewBtn.active,#show-hide-btn.active,.tab button.active,#openRefBtn.active{background-color:#f56a6a !important;color:#fff !important}#note-header-left{display:inline-flex;flex-direction:row;width:25%}#note-header-right{display:inline-flex;flex-direction:row-reverse;width:74%}#note-header-left h2.dirty{color:#ff8c00}#note-list{display:none;height:100%;overflow-y:scroll}#note-list ul{margin:0;padding:0;list-style-type:none;list-style:none}div#refQuery{display:none;position:absolute;z-index:100;background-color:rgba(0,0,0,.8);width:400px;height:200px}div#refQuery #referenceSearch{border:none;border-radius:5px;padding:10px 20px;font-size:16px;line-height:1.5;color:#333;background-color:#f4f4f4;width:150px;height:25px;cursor:pointer;display:none}#passage-popup{display:none;position:absolute;z-index:100;background-color:#fff;color:#000;padding:10px;border:1px solid #ccc;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.3);width:300px;height:300px;overflow-x:scroll}#save-check{opacity:0;text-align:right;font-size:20pt;margin-left:15px;color:green}#save-check.saving{color:orange}#save-check.error{color:red}#fields-container input,#fields-container select{width:32.5%;display:inline-block}#old-notes article p:first-child{margin-bottom:0 !important;font-size:10pt}#old-notes article a{font-size:12pt}#old-notes article p:last-child{font-size:12pt}.inner{padding-left:0}.ref h2{display:inline-block}#ref{font-size:12pt}#ref ol,#ref ul{list-style-position:inside}#referenceBook{display:none}/*# sourceMappingURL=style.min.css.map */
+body{margin:0}.inner{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;align-items:stretch;align-content:flex-start;max-width:1060px;margin:0 auto}.ref-tab{width:60px;padding-top:75px !important}.ref-tab ul{margin:0;padding:0}.ref-tab ul li{list-style:none;list-style-type:none}.tab{margin-bottom:3px}.tab button{display:flex;justify-content:center;align-items:center;height:80px;width:100%;text-align:center;font-size:14px;margin-bottom:3px}.ref{width:36%}.ref>div#ref{vertical-align:top;justify-content:flex-start;align-content:flex-start;overflow-y:scroll;width:100%;height:100%;border:#000 solid 1px;border-radius:3px;box-shadow:0 2px 5px rgba(0,0,0,.3)}#ref{padding:3px 3px 3px 3px}#passage{width:100px}#newSpeaker{display:none;width:110px}#newSeries{display:none;width:110px}#fields-container{display:none}#fields-container.show{display:block}.notes{width:57%}textarea#notes{width:100%;height:100%;font-size:14pt}#notePreview{display:none;overflow-x:scroll;padding-left:10px}#notePreview ul,#notePreview ol{list-style-position:inside}#previewBtn.active,#show-hide-btn.active,.tab button.active,#openRefBtn.active{background-color:#f56a6a !important;color:#fff !important}#note-header-left{display:inline-flex;flex-direction:row;width:25%}#note-header-right{display:inline-flex;flex-direction:row-reverse;width:74%}#note-header-left h2.dirty{color:#ff8c00}#note-list{display:none;height:100%;overflow-y:scroll}#note-list ul{margin:0;padding:0;list-style-type:none;list-style:none}div#refQuery{display:none;position:absolute;z-index:100;background-color:rgba(0,0,0,.8);width:400px;height:200px}div#refQuery #referenceSearch{border:none;border-radius:5px;padding:10px 20px;font-size:16px;line-height:1.5;color:#333;background-color:#f4f4f4;width:150px;height:25px;cursor:pointer;display:none}#passage-popup{display:none;position:absolute;z-index:100;background-color:#fff;color:#000;padding:10px;border:1px solid #ccc;border-radius:5px;box-shadow:0 2px 5px rgba(0,0,0,.3);width:300px;height:300px;overflow-x:scroll}#save-check{opacity:0;text-align:right;font-size:20pt;margin-left:15px;color:green}#save-check.saving{color:orange}#save-check.error{color:red}#fields-container input,#fields-container select{width:32.5%;display:inline-block}#old-notes article p:first-child{margin-bottom:0 !important;font-size:10pt}#old-notes article a{font-size:12pt}#old-notes article p:last-child{font-size:12pt}.inner{padding-left:0}.ref h2{display:inline-block}#ref{font-size:12pt}#ref ol,#ref ul{list-style-position:inside}#referenceBook{display:none}.recording-link{font-size:8pt;color:blue;text-decoration:none}/*# sourceMappingURL=style.min.css.map */

public/css/style.min.css.map

@@ -1 +1 @@
-{"version":3,"sources":["style.scss"],"names":[],"mappings":"AACA,KACI,QAAA,CAKJ,OACI,YAAA,CACA,kBAAA,CACA,cAAA,CACA,4BAAA,CACA,mBAAA,CACA,wBAAA,CACA,gBAAA,CAEA,aAAA,CAGJ,SACI,UAAA,CACA,2BAAA,CAGJ,YACI,QAAA,CACA,SAAA,CAGJ,eACI,eAAA,CACA,oBAAA,CAGJ,KACI,iBAAA,CAIJ,YACI,YAAA,CACA,sBAAA,CACA,kBAAA,CACA,WAAA,CACA,UAAA,CACA,iBAAA,CACA,cAAA,CACA,iBAAA,CAIJ,KACI,SAAA,CAGJ,aACI,kBAAA,CACA,0BAAA,CACA,wBAAA,CACA,iBAAA,CACA,UAAA,CACA,WAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CAGJ,KACI,uBAAA,CAGJ,SACI,WAAA,CAGJ,YACI,YAAA,CACA,WAAA,CAGJ,WACI,YAAA,CACA,WAAA,CAGJ,kBACI,YAAA,CAGJ,uBACI,aAAA,CAGJ,OACI,SAAA,CAGJ,eACI,UAAA,CACA,WAAA,CACA,cAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CACA,iBAAA,CAGJ,gCAEI,0BAAA,CAGJ,+EAII,mCAAA,CACA,qBAAA,CAGJ,kBACI,mBAAA,CACA,kBAAA,CACA,SAAA,CAGJ,mBACI,mBAAA,CACA,0BAAA,CACA,SAAA,CAGJ,2BACI,aAAA,CAGJ,WACI,YAAA,CACA,WAAA,CACA,iBAAA,CAGJ,cACI,QAAA,CACA,SAAA,CACA,oBAAA,CACA,eAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,+BAAA,CACA,WAAA,CACA,YAAA,CAGJ,8BACI,WAAA,CACA,iBAAA,CACA,iBAAA,CACA,cAAA,CACA,eAAA,CACA,UAAA,CACA,wBAAA,CACA,WAAA,CACA,WAAA,CACA,cAAA,CACA,YAAA,CAGJ,eACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,qBAAA,CACA,UAAA,CACA,YAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CACA,WAAA,CACA,YAAA,CACA,iBAAA,CAGJ,YACI,SAAA,CACA,gBAAA,CACA,cAAA,CACA,gBAAA,CACA,WAAA,CAGJ,mBACI,YAAA,CAGJ,kBACI,SAAA,CAGJ,iDAEI,WAAA,CACA,oBAAA,CAGJ,iCACI,0BAAA,CACA,cAAA,CAGJ,qBACI,cAAA,CAGJ,gCACI,cAAA,CAGJ,OACI,cAAA,CAGJ,QACI,oBAAA,CAGJ,KACI,cAAA,CAGJ,gBAEI,0BAAA,CAGJ,eACI,YAAA","file":"style.min.css"}
+{"version":3,"sources":["style.scss"],"names":[],"mappings":"AACA,KACI,QAAA,CAKJ,OACI,YAAA,CACA,kBAAA,CACA,cAAA,CACA,4BAAA,CACA,mBAAA,CACA,wBAAA,CACA,gBAAA,CAEA,aAAA,CAGJ,SACI,UAAA,CACA,2BAAA,CAGJ,YACI,QAAA,CACA,SAAA,CAGJ,eACI,eAAA,CACA,oBAAA,CAGJ,KACI,iBAAA,CAIJ,YACI,YAAA,CACA,sBAAA,CACA,kBAAA,CACA,WAAA,CACA,UAAA,CACA,iBAAA,CACA,cAAA,CACA,iBAAA,CAIJ,KACI,SAAA,CAGJ,aACI,kBAAA,CACA,0BAAA,CACA,wBAAA,CACA,iBAAA,CACA,UAAA,CACA,WAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CAGJ,KACI,uBAAA,CAGJ,SACI,WAAA,CAGJ,YACI,YAAA,CACA,WAAA,CAGJ,WACI,YAAA,CACA,WAAA,CAGJ,kBACI,YAAA,CAGJ,uBACI,aAAA,CAGJ,OACI,SAAA,CAGJ,eACI,UAAA,CACA,WAAA,CACA,cAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CACA,iBAAA,CAGJ,gCAEI,0BAAA,CAGJ,+EAII,mCAAA,CACA,qBAAA,CAGJ,kBACI,mBAAA,CACA,kBAAA,CACA,SAAA,CAGJ,mBACI,mBAAA,CACA,0BAAA,CACA,SAAA,CAGJ,2BACI,aAAA,CAGJ,WACI,YAAA,CACA,WAAA,CACA,iBAAA,CAGJ,cACI,QAAA,CACA,SAAA,CACA,oBAAA,CACA,eAAA,CAGJ,aACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,+BAAA,CACA,WAAA,CACA,YAAA,CAGJ,8BACI,WAAA,CACA,iBAAA,CACA,iBAAA,CACA,cAAA,CACA,eAAA,CACA,UAAA,CACA,wBAAA,CACA,WAAA,CACA,WAAA,CACA,cAAA,CACA,YAAA,CAGJ,eACI,YAAA,CACA,iBAAA,CACA,WAAA,CACA,qBAAA,CACA,UAAA,CACA,YAAA,CACA,qBAAA,CACA,iBAAA,CACA,mCAAA,CACA,WAAA,CACA,YAAA,CACA,iBAAA,CAGJ,YACI,SAAA,CACA,gBAAA,CACA,cAAA,CACA,gBAAA,CACA,WAAA,CAGJ,mBACI,YAAA,CAGJ,kBACI,SAAA,CAGJ,iDAEI,WAAA,CACA,oBAAA,CAGJ,iCACI,0BAAA,CACA,cAAA,CAGJ,qBACI,cAAA,CAGJ,gCACI,cAAA,CAGJ,OACI,cAAA,CAGJ,QACI,oBAAA,CAGJ,KACI,cAAA,CAGJ,gBAEI,0BAAA,CAGJ,eACI,YAAA,CAGJ,gBACI,aAAA,CACA,UAAA,CACA,oBAAA","file":"style.min.css"}

public/css/style.scss

@@ -50,7 +50,7 @@ body {
 
 
 .ref {
-    width: 35%;
+    width: 36%;
 }
 
 .ref>div#ref {
@@ -92,7 +92,7 @@ body {
 }
 
 .notes {
-    width: 55%
+    width: 57%
 }
 
 textarea#notes {
@@ -241,4 +241,10 @@ div#refQuery #referenceSearch {
 
 #referenceBook {
     display: none;
+}
+
+.recording-link {
+    font-size: 8pt;
+    color: blue;
+    text-decoration: none;
 }

public/js/script.js

@@ -9,34 +9,60 @@ var to = null;
 let controller;
 var BOOKS = {};
 
-fetch('/js/data.json')
+$(function () {
-    .then((res) => {
+    setHeight();
-        if (!res.ok) {
+    setBooks();
-            throw new Error('HTTP Error: Status: ${res.status}');
+    setEventListeners();
+    $('#note-table').DataTable({
+        paging: false,
+        ajax: {
+            url: '/index.php/get-notes',
+            type: 'POST'
+        },
+        columns: [
+            { data: 'link' },
+            { data: 'speaker.name' },
+            { data: 'passage' },
+            {
+                data: 'date.date',
+                render: DataTable.render.date("L")
+            },
+        ]
+    });
+});
+
+function setBooks() {
+    fetch('/js/data.json')
+        .then((res) => {
+            if (!res.ok) {
+                throw new Error('HTTP Error: Status: ${res.status}');
+            }
+            return res.json();
+        })
+        .then((data) => {
+            BOOKS = data;
+        })
+        .catch((error) => {
+            console.log(error);
+        })
+}
+
+function setEventListeners() {
+    document.addEventListener('keyup', function (event) {
+        if (event.key == "F3") {
+            openRef(false);
         }
-        return res.json();
+    });
-    })
-    .then((data) => {
-        BOOKS = data;
-    })
-    .catch((error) => {
-        console.log(error);
-    })
 
-document.addEventListener('keyup', function (event) {
+    document.querySelector('#notes').addEventListener('keyup', function (event) {
-    if (event.key == "F3") {
+        let key = event.keyCode;
-        openRef(false);
-    }
-});
 
-document.querySelector('#notes').addEventListener('keyup', function (event) {
+        if (key >= 48 && key <= 90 || key >= 96 && key <= 111 || key >= 186 && key <= 222) {
-    let key = event.keyCode;
+            textDirty = true;
-
+            document.querySelector('#note-header-left h2').classList.add('dirty');
-    if (key >= 48 && key <= 90 || key >= 96 && key <= 111 || key >= 186 && key <= 222) {
+        }
-        textDirty = true;
+    });
-        document.querySelector('#note-header-left h2').classList.add('dirty');
+}
-    }
-});
 
 function setHeight() {
     md = new markdownit({
@@ -133,7 +159,7 @@ function newNote() {
     document.querySelector('#series').value = 0;
     document.querySelector('#template').value = 0;
     document.querySelector('#passage').value = '';
-    document.querySelector('#noteId').value = uuidv4();
+    document.querySelector('#recording').value = '';
 
     document.querySelector('#ref-list').innerHTML = '';
     document.querySelector('#ref').innerHTML = '';
@@ -658,6 +684,30 @@ function filterVerse() {
     verseRange.innerText = 'Verse: ' + verse;
 }
 
+function retrieveReferenceType(el) {
+    fetch('/index.php/reference/' + el.value, {
+        method: 'GET',
+        header: {
+            'Content-Type': 'application/json'
+        }
+    })
+        .then(response => response.json())
+        .then(results => {
+            document.querySelector('#referenceSeries').innerHTML = '';
+            var none = document.createElement('option');
+            none.value = '';
+            none.text = '-- Select --';
+            document.querySelector('#referenceSeries').appendChild(none);
+
+            for (var x in results) {
+                var newSeries = document.createElement('option');
+                newSeries.value = results[x].id;
+                newSeries.text = results[x].label;
+                document.querySelector('#referenceSeries').appendChild(newSeries);
+            }
+        })
+}
+
 function retrieveReference(el) {
     if (el.value == 'new') {
         document.querySelector('#refName').style.display = 'inline-block';
@@ -669,8 +719,7 @@ function retrieveReference(el) {
             "Content-Type": "application/json"
         },
         body: JSON.stringify({
-            file: el.value,
+            id: el.value
-            type: el.options[el.selectedIndex].getAttribute('type')
         })
     })
         .then(response => response.json())

public/theme/assets/css/main.css

@@ -3086,13 +3086,13 @@ button:disabled,
 }
 
 #main>.inner {
-    padding: 0 0.5em 0.1em 0.5em;
+    padding: 0 0.25em 0.1em 0.25em;
     margin: 0 auto;
     max-width: 110em;
 }
 
 #main>.inner>section {
-    padding: 0.5em 0 0.5em 0;
+    padding: 0.25em 0 0.25em 0;
     border-top: solid 2px rgba(210, 215, 217, 0.75);
 }
 
@@ -3102,13 +3102,13 @@ button:disabled,
 
 @media screen and (max-width: 1680px) {
     #main>.inner {
-        padding: 0 0 0 2em;
+        padding: 0 0 0 0;
     }
 }
 
 @media screen and (max-width: 1280px) {
     #main>.inner {
-        padding: 0 0 0 2em;
+        padding: 0 0 0 0;
     }
 }
 

src/Controller/AjaxController.php

@@ -198,7 +198,7 @@ class AjaxController extends AbstractController
     {
         $res = new Response();
         $data = json_decode($req->getContent());
-        $ref = $emi->getRepository(Reference::class)->find($data->file);
+        $ref = $emi->getRepository(Reference::class)->find($data->id);
 
         if (!is_a($ref, Reference::class)) {
             $ref = new Reference();
@@ -247,6 +247,18 @@ class AjaxController extends AbstractController
         return $res;
     }
 
+    #[Route('/get-notes', name: 'app_get_notes')]
+    public function getNotes(EntityManagerInterface $emi): Response
+    {
+        /** @var User $user */
+        $user = $this->getUser();
+        $notes = $emi->getRepository(Note::class)->reverseNoteSort($user);
+        $res = new Response();
+        $res->setContent(json_encode(['data'=> $notes]));
+
+        return $res;
+    }
+
     #[Route('/get-note', name: 'app_get_note')]
     public function getNote(Request $req, EntityManagerInterface $emi): Response
     {

src/Controller/DefaultController.php

@@ -40,25 +40,7 @@ class DefaultController extends AbstractController
     {
         $this->denyAccessUnlessGranted('ROLE_ADMIN');
 
-        $creeds = $emi->getRepository(Reference::class)->findByType('creed');
+        return $this->render('editors/reference-editor.html.twig');
-        $belgic = $emi->getRepository(Reference::class)->findByType('belgic');
-        $heidelberg = $emi->getRepository(Reference::class)->findByType('hc');
-        $dort = $emi->getRepository(Reference::class)->findByType('cd');
-        $wcf = $emi->getRepository(Reference::class)->findByType('wcf');
-        $wsc = $emi->getRepository(Reference::class)->findByType('wsc');
-        $wlc = $emi->getRepository(Reference::class)->findByType('wlc');
-        $lbc = $emi->getRepository(Reference::class)->findByType('lbc');
-
-        return $this->render('editors/reference-editor.html.twig', [
-            'creeds' => ($creeds),
-            'belgic' => ($belgic),
-            'heidelberg' => ($heidelberg),
-            'dort' => ($dort),
-            'wcf' => ($wcf),
-            'wsc' => ($wsc),
-            'wlc' => ($wlc),
-            'lbc' => ($lbc),
-        ]);
     }
 
     #[Route('/template-editor', name: 'app_template_editor')]

src/Controller/ReferenceController.php

@@ -146,6 +146,9 @@ class ReferenceController extends AbstractController
     public static function retrieveWSC($ref): Reference
     {
         $r = self::$emi->getRepository(Reference::class)->findBy(['type' => $ref->getType(), 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
         return $r[0];
     }
 
@@ -159,6 +162,9 @@ class ReferenceController extends AbstractController
     public static function retrieveWLC($ref): Reference
     {
         $r = self::$emi->getRepository(Reference::class)->findBy(['type' => $ref->getType(), 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
         return $r[0];
     }
 
@@ -172,12 +178,54 @@ class ReferenceController extends AbstractController
     public static function retrieveWCF($ref): Reference
     {
         $r = self::$emi->getRepository(Reference::class)->findBy(['type' => $ref->getType(), 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
         return $r[0];
     }
 
     public static function retrieveLBC($ref): Reference
     {
         $r = self::$emi->getRepository(Reference::class)->findBy(['type' => 'lbc', 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
+        return $r[0];
+    }
+
+    public static function retrieveAGC($ref): Reference
+    {
+        $r = self::$emi->getRepository(Reference::class)->findBy(['type' => 'agc', 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
+        return $r[0];
+    }
+
+    public static function retrieve1HC($ref): Reference
+    {
+        $r = self::$emi->getRepository(Reference::class)->findBy(['type' => '1hc', 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
+        return $r[0];
+    }
+
+    public static function retrieve2HC($ref): Reference
+    {
+        $r = self::$emi->getRepository(Reference::class)->findBy(['type' => '2hc', 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
+        return $r[0];
+    }
+
+    public static function retrieveSD($ref): Reference
+    {
+        $r = self::$emi->getRepository(Reference::class)->findBy(['type' => 'sd', 'ndx' => $ref->getNdx()]);
+        if (!$r) {
+            return new Reference();
+        }
         return $r[0];
     }
 
@@ -186,4 +234,14 @@ class ReferenceController extends AbstractController
         $notes = self::$emi->getRepository(Note::class)->findBy(['user' => $user], ['date' => 'DESC']);
         return $notes;
     }
+
+    #[Route('/reference/{type}', name: 'app_reference_by_type', methods: ['GET'])]
+    public function retrieveReferenceByType(string $type, EntityManagerInterface $emi): Response
+    {
+        $res = new Response();
+        $data = $emi->getRepository(Reference::class)->findByType($type);
+
+        $res->setContent(json_encode($data));
+        return $res;
+    }
 }

src/Entity/Note.php

@@ -169,7 +169,13 @@ class Note implements JsonSerializable
     {
         return "<a href='#' onclick=\"retrieveNote('{$this->id}')\">".
             $this->title.
-            "</a>";
+            "</a>".
+            (
+                $this->recording ? "<br/>".
+                "<a href='{$this->recording}' target='_blank' class='recording-link'>".
+                    "<i class='fa fa-play-circle'></i>".
+                "</a>" : null
+            );
     }
 
     public function toTableRow(): string
@@ -186,6 +192,7 @@ class Note implements JsonSerializable
     {
         return [
             'id' => $this->getId(),
+            'link' => $this->toLink(),
             'title' => $this->getTitle(),
             'date' => $this->getDate(),
             'passage' => $this->getPassage(),

templates/base.html.twig

@@ -12,7 +12,7 @@
         <title>{% block title %}Welcome!{% endblock %}</title>
         {% block stylesheets %}{% endblock %}
     </head>
-    <body class='is-preload' onload='setHeight()' onresize='setHeight()'>
+    <body class='is-preload' onresize='setHeight()'>
         {% block body %}{% endblock %}
         {% block javascripts %}{% endblock %}
     </body>

templates/default/home.html.twig

@@ -7,17 +7,20 @@
 <link href='/theme/assets/css/jquery-ui.theme.css' rel='stylesheet' />
 <link href='/theme/assets/css/jquery-ui.structure.css' rel='stylesheet' />
 <link href='/css/style.css' rel='stylesheet' />
+<link href='//cdn.datatables.net/2.0.8/css/dataTables.dataTables.min.css' rel='stylesheet' />
 {% endblock %}
 
 {% block javascripts %}
-<script src='/js/script.js'></script>
 <script src="/theme/assets/js/jquery.min.js"></script>
 <script src='/theme/assets/js/jquery-ui.js'></script>
 <script src="/theme/assets/js/browser.min.js"></script>
 <script src="/theme/assets/js/breakpoints.min.js"></script>
 <script src="/theme/assets/js/util.js"></script>
 <script src="/theme/assets/js/main.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/13.0.2/markdown-it.min.js" integrity="sha512-ohlWmsCxOu0bph1om5eDL0jm/83eH09fvqLDhiEdiqfDeJbEvz4FSbeY0gLJSVJwQAp0laRhTXbUQG+ZUuifUQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src='//momentjs.com/downloads/moment-with-locales.js'></script>
+<script src="//cdnjs.cloudflare.com/ajax/libs/markdown-it/13.0.2/markdown-it.min.js" integrity="sha512-ohlWmsCxOu0bph1om5eDL0jm/83eH09fvqLDhiEdiqfDeJbEvz4FSbeY0gLJSVJwQAp0laRhTXbUQG+ZUuifUQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src='//cdn.datatables.net/2.0.8/js/dataTables.min.js'></script>
+<script src='/js/script.js'></script>
 {% endblock %}
 
 {% block body %}
@@ -38,7 +41,7 @@
                 </div>
                 <div id="ref" style='font-size:12pt;'></div>
                 <div id='note-list'>
-                    <table>
+                    <table id='note-table' data-order='[[ 3, "desc" ]]'>
                         <thead>
                             <tr>
                                 <th>Title</th>
@@ -47,11 +50,11 @@
                                 <th>Date</th>
                             </tr>
                         </thead>
-                        <tbody>
+                        {#<tbody>
                         {% for n in reverseNoteSort %}
                         {{ n.toTableRow()|raw }}
                         {% endfor %}
-                        </tbody>
+                        </tbody>#}
                     </table>
                 </div>
             </section>

templates/editors/reference-editor.html.twig

@@ -5,49 +5,24 @@
     </head>
 
     <body>
-        <select id='references' onchange='retrieveReference(this)'>
+        <select id='referenceTypes' onchange='retrieveReferenceType(this)'>
             <option value=''>-- Select Reference --</option>
             <option value='new'>-- Insert New --</option>
-            <optgroup id='creeds' label='Creeds'>
+            <option value='creed'>Creed</option>
-                {% for c in creeds %}
+            <option value='belgic'>Belgic Confession</option>
-                <option type='creed' value='{{ c.id }}'>{{ c.name }}</option>
+            <option value='hc'>Heidelberg Catechism</option>
-                {% endfor %}
+            <option value='cd'>Canons of Dort</option>
-            </optgroup>
+            <option value='wcf'>Westminster Confession of Faith</option>
-            <optgroup id='belgic' label='Belgic Confession'>
+            <option value='wsc'>Westminster Shorter Catechism</option>
-                {% for c in belgic %}
+            <option value='wlc'>Westminster Larger Catechism</option>
-                <option type='bc' value='{{ c.id }}'>{{ c.label }}</option>
+            <option value='agc'>Augsberg Confession</option>
-                {% endfor %}
+            <option value='1hc'>First Helvetic Confession</option>
-            </optgroup>
+            <option value='2hc'>Second Helvetic Confession</option>
-            <optgroup id='heidelberg' label='Heidelberg Catechism'>
+            <option value='sd'>Savoy Declaration</option>
-                {% for c in heidelberg %}
+            <option value='39a'>Thirty-Nine Articles</option>
-                <option type='hc' value='{{ c.id }}'>{{ c.label }}</option>
+            <option value='lbc'>London Baptist Confession</option>
-                {% endfor %}
+        </select>&nbsp;&nbsp;
-            </optgroup>
+        <select id='referenceSeries' onchange='retrieveReference(this)'>
-            <optgroup id='dort' label='Canons of Dort'>
-                {% for c in dort %}
-                <option type='cd' value='{{ c.id }}'>{{ c.label }}</option>
-                {% endfor %}
-            </optgroup>
-            <optgroup id='wcf' label='Westminster Confession of Faith'>
-                {% for c in wcf %}
-                <option type='wcf' value='{{ c.id }}'>{{ c.label }}</option>
-                {% endfor %}
-            </optgroup>
-            <optgroup id='wsc' label='Westminster Short Catechism'>
-                {% for c in wsc %}
-                <option type='wsc' value='{{ c.id }}'>{{ c.label }}</option>
-                {% endfor %}
-            </optgroup>
-            <optgroup id='wlc' label='Westminster Larger Catechism'>
-                {% for c in wlc %}
-                <option type='wlc' value='{{ c.id }}'>{{ c.label }}</option>
-                {% endfor %}
-            </optgroup>
-            <optgroup id='lbc' label='London Baptist Confession'>
-                {% for c in lbc %}
-                <option type='lbc' value='{{ c.id }}'>{{ c.label }}</option>
-                {% endfor %}
-            </optgroup>
         </select>&nbsp;&nbsp;
         <input type='text' name='name' id='refName' style='display:none;' />&nbsp;&nbsp;
         <button id='save' name='save' onclick='saveReference()'>Save</button>