From 510009979024efc6de4acc82389eaaae584b74e2 Mon Sep 17 00:00:00 2001
From: InesSuess <suess936i@htl-ottakring.ac.at>
Date: Tue, 22 Jan 2019 16:25:45 +0100
Subject: [PATCH] groups und items werden ordentlich angezeigt + farbe wird
 angezeigt

---
 express-server/public/javascripts/ajax.js   | 22 ++++++++++++++++-----
 express-server/public/stylesheets/style.css |  7 +++++++
 express-server/views/dash.ejs               |  2 +-
 3 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/express-server/public/javascripts/ajax.js b/express-server/public/javascripts/ajax.js
index 0fafd6a8..7e9cfebb 100644
--- a/express-server/public/javascripts/ajax.js
+++ b/express-server/public/javascripts/ajax.js
@@ -261,7 +261,7 @@ function Detail(){
                                             <i class="fas fa-caret-left"></i>
                                         </a>
                                         <button class="itemadd">
-                                        <i class="fas fa-plus"></i>
+                                        <i class="fas fa-ellipsis-v"></i>
                                         </button>
                                         <h1 class="text-center">
                                             ${neu[0].name}
@@ -269,9 +269,19 @@ function Detail(){
                                     `);
                                     for (let i = 0; i < res.groups.length; i++) {
                                         const el = res.groups[i];
-                                        $(".card-body").append(`
-                                        <h5 class="card-title text-center">${el.name}: ${el.content[0].name}</h5>
+                                        $(".gruppeninhalt").append(`<div class="card mb-3" style="max-width: 18rem;background-color:${el.color};">
+                                        <div class="card-header"><h5 class="card-title">${el.name}</h5><button class="btn seemore" type="button" data-toggle="collapse" data-target="#${el.name}" aria-expanded="false" aria-controls="${el.name}"><i class="fas fa-caret-down"></i></button>
+                                        <div class="${el.name}">
+                                        </div>
+                                        </div>
+                                      </div>
                                         `);
+                                        for(let x = 0; x < el.content.length; x++){
+                                            const el2 = el.content[x]
+                                        $(`.${el.name}`).append(`<div class="collapse" id="${el.name}"><ul><li>${el2.name}</li></ul></div>
+                                          
+                                        `);
+                                    }
                                     }
                                     ItemAdden()
                                 },
@@ -300,7 +310,7 @@ function ItemAdden(){
         let id = getid.attr('id'); 
         globaleAddZwischenID = id;
         console.log(id);
-        $('.custom-select-groups').remove('#select-group');
+        $('.select').remove();
 
         $('.GroupItemAdd').modal('show');
 
@@ -354,6 +364,8 @@ $(".itemhinzu").click(function(){
         },error(err){
 
         }
-    })
+    });
+
+    Detail();
 
 });
\ No newline at end of file
diff --git a/express-server/public/stylesheets/style.css b/express-server/public/stylesheets/style.css
index f418d6cf..863bbcb0 100644
--- a/express-server/public/stylesheets/style.css
+++ b/express-server/public/stylesheets/style.css
@@ -49,4 +49,11 @@
     position: absolute;
     right:5px;
     border: 0px;
+}
+.seemore{
+    background: transparent;
+    position: absolute;
+    right:5px;
+    margin-top:-40px;
+    border: 0px;
 }
\ No newline at end of file
diff --git a/express-server/views/dash.ejs b/express-server/views/dash.ejs
index 77108eb4..bd02fb31 100644
--- a/express-server/views/dash.ejs
+++ b/express-server/views/dash.ejs
@@ -44,7 +44,7 @@
         <div class="card border-light mb-3 detailcardausgabe" style="width: 50rem;">
             <div class="card-header"></div>
 
-            <div class="card-body text-dark"></div>
+            <div class="card-body text-dark gruppeninhalt"></div>
                 
         </div>
     </div>