Merge remote-tracking branch 'origin/developer' into developer

public/home.js

@@ -1,23 +1,4 @@
-Vue.component('Home', {
+_messages = [
-    template: `<div id="message-list">
-                <div class="om-card card">
-                <h6 class="msg-head">
-                <b>{{ subject }}</b>
-                <img src="favicon.ico" width=20px height=20px>
-                </h6>
-                {{ message }}<br><br>
-                <a href="#">{{ tag }}</a></p>
-                <div class="om-user-line">
-                <i class="material-icons">account_circle</i>
-                Erstellt von {{ user }}
-                </div></div></div>`,
-    props: ['subject', 'message', 'tag', 'user']
-})
-
-new Vue({
-    el: '#message-list',
-    data: {
-        messages: [
     {
         id: 1,
         subject: 'Betreff',
@@ -38,35 +19,37 @@ new Vue({
         message: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.',
         tag: '#efi #bei #wichtig',
         user: 'user_3'
-              }
-            ],
     },
-})
+];
 
 
-/* First try of vue-componetn -> does not work
+Vue.component('MsgCard', {
-Vue.component('home', {
+    template: `<div class="om-card card">
-  data: function () {
-    return {
-    }
-  },
-  template:
-	`<div id="sample">
-		<div v-for="msgs in private.messages">
-    		<div  class="om-card card" v-for="elements in msgs.message">
                 <h6 class="msg-head">
-					<b>{{elements.subject}}</b>
+                <b>{{ msg.subject }}</b>
                 <img src="favicon.ico" width=20px height=20px>
                 </h6>
-				<p>{{elements.msg}}<br>
+                {{ msg.message }}<br><br>
-				<a href="#">{{elements.tags}}</a></p>
+                <a href="#">{{ msg.tag }}</a></p>
                 <div class="om-user-line">
                 <i class="material-icons">account_circle</i>
-					Erstellt von {{elements.user}}
+                Erstellt von {{ msg.user }}
-				</div>
+                </div></div>`,
-			</div>
+    props: ['msg']
-    	</div>
+});
-	</div>`
-})
 
-*/
+const HomeRouter = {
+    template: `
+<div>
+    <MsgCard
+        v-for="(msg, index) in messages"
+        :key="msg.id"
+        :msg="msg"
+    ></MsgCard>
+</div>`,
+    data: function () {
+        return { messages: _messages };
+    },
+    methods: {
+    },
+};

public/index.html

@@ -17,12 +17,18 @@
 	<link rel="stylesheet" href="https://unpkg.com/bootstrap-material-design@4.1.1/dist/css/bootstrap-material-design.min.css" integrity="sha384-wXznGJNEXNG1NFsbm0ugrLFMQPWswR3lds2VeinahP8N0zJw9VWSopbjv2x7WCvX" crossorigin="anonymous">
 
     <!-- NOTE: VUE.js und VueRouter -->
+    <script src=lib/jquery-3.3.1.min.js></script>
     <script src=lib/vue.js></script>
     <script src=lib/vue-router.js></script>
-    <script src=lib/jquery-3.3.1.min.js></script>
 
 	<!-- CSS_Custom Design -->
 	<link rel="stylesheet" type="text/css" href="style.css">
+    <!-- NOTE: Call Vue Components -->
+    <script src="home.js"></script>
+    <!-- <script src="files.js"></script> -->
+    <script src="createMessage.js"></script>
+    <script src="bookmark.js"></script>
+    <script src="profil.js"></script>
 
 
 	<title>OMApp</title>
@@ -42,16 +48,7 @@
 
 
         <div class="om-content">
-        <div id="message-list">
+            <router-view></router-view>
-                <Home
-                    v-for="(msg, index) in messages"
-                    :key="msg.id"
-                    :subject="msg.subject"
-                    :message="msg.message"
-                    :tag="msg.tag"
-                    :user="msg.user"
-                ></Home>
-        </div>
         </div>
         <nav class="nav nav-tabs nav-justified om-nav ">
             <router-link to="/home" class="nav-item nav-link"><i class="material-icons">home</i></router-link>
@@ -61,17 +58,16 @@
             <router-link to="/profil" class="nav-item nav-link"><i class="material-icons">person</i></router-link>
         </nav>
     </div>
-        <!--<router-view></router-view> -->
+
-<!--
     <script>
 
-
         const routes = [
-            { path: "/home",            component: Home },
+            { path: "/",                component: HomeRouter },
-            { path: "/files",           component: Files },
+            { path: "/home",            component: HomeRouter },
+/*            { path: "/files",           component: Files },
             { path: "/createMessage",   component: CreateMsg },
             { path: "/bookmark",        component: Bookmark },
-            { path: "/profil",          component: Profil },
+            { path: "/profil",          component: Profil },*/
         ];
         const router = new VueRouter({
 			routes
@@ -82,20 +78,14 @@
         });
 
     </script>
--->
+
 	<!-- NOTE: JavaScript Libs & Files -->
-    <!-- NOTE: Call Vue Components -->
-    <script src="home.js"></script>
-    <!-- <script src="files.js"></script> -->
-    <script src="createMessage.js"></script>
-    <script src="bookmark.js"></script>
-    <script src="profil.js"></script>
 	<!-- CDN_Vue.js developmement lib -->
-	<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
+	<!--<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>-->
 	<!-- CDN_Vue.js minified lib -->
 	<!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.min.js"></script> -->
 	<!-- CDN_jQuery minified lib -->
-	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
+	<!--<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>-->
 	<!-- CDN_Popper.js lib -->
 	<script src="https://unpkg.com/popper.js@1.12.6/dist/umd/popper.js" integrity="sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U" crossorigin="anonymous"></script>
 	<!-- CDN_Bootstrap JS lib -->