Merge branch 'main' of https://github.com/uclab-potsdam/syllabus-site

index.html

@@ -36,6 +36,7 @@
             <div id="content"></div>
         </div>
     </div>
+    <footer></footer>
     <script>
         window.mobileCheck = (function () {
             let check = false;
@@ -49,15 +50,26 @@
 	        document.querySelector("body").style.fontSize = 7+.7*vw+.3*vh+"px";
         }
         window.onresize = setFontSize;
-        setFontSize();
 
-        //get the data and parse it
-        fetch(`data.json`)
-            .then(data => data.json())
-            .then((json) => {
-                //create the data representation
-                createBaseData(json);
-            })</script>
+        setFontSize();
+        fetch('data.md')
+        .then(data => data.text())
+        .then(text => {
+            let data = []
+            let sessions = text.split("\n\n\n\n")
+            let footer  = sessions.slice(-1)[0]
+            document.querySelector("footer").innerHTML = marked.parse(footer)
+            sessions.slice(0,-1).map(session => {
+                let sessionObject = {}
+                let sessionData = session.split("\n\n\n")
+                sessionObject.text = sessionData[0]
+                sessionData = sessionData.slice(1)
+                sessionObject.content = sessionData.map(content => { return {"markdown" : content}})
+                data.push(sessionObject)
+            })
+            createBaseData(data)
+        })
+            </script>
 </body>
 
 </html>

js/data.js

@@ -68,6 +68,9 @@ async function updateView(){
     document.querySelectorAll('.actors').forEach(n => {
         n.style.visibility = 'visible'
     })
+    document.querySelector('footer').style.visibility = 'visible';
+
+
     animation()
 }
 function updateItemPosition(item) {

js/links.js

@@ -4,22 +4,12 @@ function updateLinks(currentSession,cursorPosition,cursorDimensions) {
         let anchor1 = [window.innerWidth/2,  cursorPosition+cursorDimensions.height/2]
         currentSession.items.map((item) => {
             //first anchor is the cursor 
-            let anchor4 = []
-            if(item.left){
-                anchor4 = [item.x + item.bounding.width/2,item.y + item.bounding.height/2]
-            }else{
-                anchor4 = [item.x - item.bounding.width/2,item.y + item.bounding.height/2]
-            }    
+            let bounding = item.domObject.getBoundingClientRect()
+            let anchor4 = [bounding.left + item.bounding.width/2,item.y + item.bounding.height/2]  
             let distance = calculateDistanceY(anchor1, anchor4)
-            // if (distance < window.innerHeight*1.5) {
-            if (true) {
-                item.visible = true
-                item.distance = remapRange(distance, 0, window.innerHeight*1.5, 1, 0)
-                item.linePath = [...anchor1,...anchor4]
-            }
-            else{
-                item.visible = false
-            }
+            item.visible = true
+            item.distance = remapRange(distance, 0, window.innerHeight*1.5, 1, 0)
+            item.linePath = [...anchor1,...anchor4]
         })
         drawLinks(currentSession.items)
 }

style.css

@@ -136,7 +136,7 @@ p + p {
 a{
     text-decoration:underline;
     line-height: 0.1em;
-    color: inherit;
+    color: var(--font);
 }
 a[href^="#"] {
     text-decoration: none;
@@ -195,6 +195,13 @@ a[href^="#"] {
 #menu .active{
     font-weight: bold;
 }
+footer{
+    visibility: hidden;
+    display:flex;
+    justify-content: space-between;
+    padding: 2em;
+    font-size: 1em;
+}
 @media screen and (orientation: portrait) and (max-width: 767px) {
     body {
         font-size: 14px !important;