From 687afddf50ad27ae27cb09350bb5d41d96cc3efc Mon Sep 17 00:00:00 2001
From: Alexandre Bourlier <alexandre@happy-dev.fr>
Date: Thu, 12 Jul 2018 15:18:39 +0200
Subject: [PATCH] feature - network pages cleaned up

---
 index.php                      |  4 +--
 src/html/channel-chat.html     |  4 +++
 src/html/channel-create.html   |  9 ++++++
 src/html/channel-creation.html |  8 -----
 src/html/channel-edit.html     |  8 +++++
 src/html/channel-edition.html  |  7 -----
 src/html/channel-profile.html  | 38 +++++++++++++++++++++++
 src/html/channel.html          | 56 ----------------------------------
 src/html/channel.php           | 23 ++++++++++++++
 src/html/client-creation.html  |  2 +-
 src/html/menu.html             |  5 ++-
 11 files changed, 86 insertions(+), 78 deletions(-)
 create mode 100644 src/html/channel-chat.html
 create mode 100644 src/html/channel-create.html
 delete mode 100644 src/html/channel-creation.html
 create mode 100644 src/html/channel-edit.html
 delete mode 100644 src/html/channel-edition.html
 create mode 100644 src/html/channel-profile.html
 delete mode 100644 src/html/channel.html
 create mode 100644 src/html/channel.php

diff --git a/index.php b/index.php
index f3fd076..8c9fab9 100644
--- a/index.php
+++ b/index.php
@@ -33,9 +33,7 @@
       <?php require_once('src/html/project.php'); ?>
       <?php require_once('src/html/client-creation.html'); ?>
       <?php require_once('src/html/channels.html'); ?>
-      <?php require_once('src/html/channel.html'); ?>
-      <?php require_once('src/html/channel-edition.html'); ?>
-      <?php require_once('src/html/channel-creation.html'); ?>
+      <?php require_once('src/html/channel.php'); ?>
       <?php require_once('src/html/search.html'); ?>
     </main>
   </body>
diff --git a/src/html/channel-chat.html b/src/html/channel-chat.html
new file mode 100644
index 0000000..eadce53
--- /dev/null
+++ b/src/html/channel-chat.html
@@ -0,0 +1,4 @@
+<div id="channel-chat" style="display: none">
+  <i>Chat coming soon...</i>
+</div>
+
diff --git a/src/html/channel-create.html b/src/html/channel-create.html
new file mode 100644
index 0000000..ef9e711
--- /dev/null
+++ b/src/html/channel-create.html
@@ -0,0 +1,9 @@
+<div id="channel-create" style="display: none">
+  <sib-form 
+    data-src="http://localhost:8000/channels/" 
+    range-owner="<?php echo $sdn; ?>/members/"
+    widget-members="sib-form-multiple-dropdown"
+    range-members="<?php echo $sdn; ?>/members/"
+  ></sib-form>
+</div>
+
diff --git a/src/html/channel-creation.html b/src/html/channel-creation.html
deleted file mode 100644
index 33b81b6..0000000
--- a/src/html/channel-creation.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<div id="new-channel" style="display: none">
-  <h1>NEW CHANNEL</h1>
-  <sib-form 
-    data-src="http://localhost:8000/channels/" 
-    data-fields="name, address, logo"
-  ></sib-form>
-</div>
-
diff --git a/src/html/channel-edit.html b/src/html/channel-edit.html
new file mode 100644
index 0000000..b3c66e1
--- /dev/null
+++ b/src/html/channel-edit.html
@@ -0,0 +1,8 @@
+<div id="channel-edit" style="display: none">
+  <sib-form 
+    range-owner="<?php echo $sdn; ?>/members/"
+    widget-members="sib-form-multiple-dropdown"
+    range-members="<?php echo $sdn; ?>/members/"
+    bind-resources
+  ></sib-form>
+</div>
diff --git a/src/html/channel-edition.html b/src/html/channel-edition.html
deleted file mode 100644
index f6c9ff4..0000000
--- a/src/html/channel-edition.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<div id="channel-edition" style="display: none">
-  <ldp-form 
-    class="edit-form"
-    data-src="<?php echo $sdn; ?>/channels/1/" 
-    bind-resources
-  ></ldp-form>
-</div>
diff --git a/src/html/channel-profile.html b/src/html/channel-profile.html
new file mode 100644
index 0000000..2186fc5
--- /dev/null
+++ b/src/html/channel-profile.html
@@ -0,0 +1,38 @@
+<script>
+  document.addEventListener("WebComponentsReady", function(event) { 
+    class HDAppMember extends SIBWidget {
+      get template() {
+        return `
+          <div name="${this.name}">
+            <img src="${this.value.avatar}"/>
+          </div>
+        `;
+      }
+
+      render() {
+        store.get(this.value).then( (value) => {
+          this._value = value;
+          this.innerHTML = this.template;
+        });
+      }
+    }
+    customElements.define("hdapp-member", HDAppMember);
+  });
+</script>
+
+<div id="channel-profile" style="display: none">
+  <sib-display 
+    data-fields="name, description, owner"
+    widget-owner="hdapp-member"
+    bind-resources
+  ></sib-display>
+
+  <h2 class="section skills">Participants</h2>
+  <sib-display 
+    id-suffix="members"
+    data-fields="avatar, user"
+    widget-avatar="sib-display-img"
+    widget-user="hdapp-userinfo"
+    bind-resources
+  ></sib-display>
+</div>
diff --git a/src/html/channel.html b/src/html/channel.html
deleted file mode 100644
index 5434e53..0000000
--- a/src/html/channel.html
+++ /dev/null
@@ -1,56 +0,0 @@
-<script>
-  document.addEventListener("WebComponentsReady", function(event) { 
-    class LDPDisplayMember extends SIBWidget {
-      get template() {
-        return `
-          <div name="${this.name}">
-            <img src="${this.value.avatar}"/>
-            <span>${this.value.firstname} ${this.value.lastname}</span>
-          </div>
-        `;
-      }
-
-      render() {
-        store.get(this.value).then( (value) => {
-          this._value = value;
-          this.innerHTML = this.template;
-        });
-      }
-    }
-    customElements.define("ldp-display-member", LDPDisplayMember);
-  });
-</script>
-
-<div id="channel" class="view-with-vertical-menu" style="display: none">
-  <ldp-router id="channel-page-router" class="vertical-menu border-left" default-route="channel-chat">
-    <ldp-route name="channel-chat">
-      <i class="fa fa-comment" aria-hidden="true"></i>
-    </ldp-route>
-    <ldp-route name="channel-detail">
-      <i class="fa fa-user" aria-hidden="true"></i>
-    </ldp-route>
-  </ldp-router>
-
-  <div id="channel-chat" class="chat-wrapper"></div>
-
-  <div id="channel-detail" style="display: none">
-    <ldp-display 
-      id="channel-info" 
-      data-fields="name, description, admin, owner"
-      value-admin="Administrateur"
-      widget-owner="ldp-display-member"
-      bind-resources
-    ></ldp-display>
-
-    <h2 class="section skills">Participants</h2>
-    <ldp-display 
-      id="chat-members" 
-      id-suffix="members"
-      set-name="firstname, name-separator, lastname"
-      value-name-separator="&nbsp;"
-      data-fields="avatar, name"
-      widget-avatar="ldp-display-img"
-      bind-resources
-      ></ldp-display>
-  </div>
-</div>
diff --git a/src/html/channel.php b/src/html/channel.php
new file mode 100644
index 0000000..612396f
--- /dev/null
+++ b/src/html/channel.php
@@ -0,0 +1,23 @@
+<div id="channel" style="display: none">
+  <sib-router id="channel-router" default-route="channel-profile">
+    <sib-route name="channel-chat">
+      <button>Chat</button>
+    </sib-route>
+    <sib-route name="channel-profile">
+      <button>Info</button>
+    </sib-route>
+    <sib-route name="channel-edit">
+      <button>Éditer</button>
+    </sib-route>
+    <sib-route name="channel-create">
+      <button>Nouveau</button>
+    </sib-route>
+  </sib-router>
+
+  <div id="network-views-container">
+    <?php require_once('channel-chat.html'); ?>
+    <?php require_once('channel-profile.html'); ?>
+    <?php require_once('channel-edit.html'); ?>
+    <?php require_once('channel-create.html'); ?>
+  </div>
+</div>
diff --git a/src/html/client-creation.html b/src/html/client-creation.html
index 9ee6fc0..693520b 100644
--- a/src/html/client-creation.html
+++ b/src/html/client-creation.html
@@ -1,4 +1,4 @@
-<div id="new-client" style="display: none">
+<div id="client-create" style="display: none">
   <sib-form 
     data-src="http://localhost:8000/clients/" 
     data-fields="name, address, logo"
diff --git a/src/html/menu.html b/src/html/menu.html
index 6f18722..892a10f 100644
--- a/src/html/menu.html
+++ b/src/html/menu.html
@@ -17,12 +17,11 @@
         <span class="d-none d-md-inline"> Projets</span>
       </sib-route>
       <sib-route class="d-none" name="project" id-prefix="<?php echo $sdn; ?>/projects/"></sib-route>
-      <sib-route name="new-client">New client</sib-route>
-      <sib-route class="d-none" name="project-edition" id-prefix="<?php echo $sdn; ?>/channels/"></sib-route>
+      <sib-route name="client-create">New client</sib-route>
 
       <sib-route class="nav-item pb-2 align-self-stretch text-center text-md-left" name="channels">
         <i class="fa fa-comments" aria-hidden="true"></i>
-        <span class="d-none d-md-inline"> Channels</span>
+        <span class="d-none d-md-inline"> Network</span>
       </sib-route>
       <sib-route class="d-none" name="channel" id-prefix="<?php echo $sdn; ?>/channels/"></sib-route>
       <sib-route class="d-none" name="channel-edition" id-prefix="<?php echo $sdn; ?>/channels/"></sib-route>