diff --git a/index.php b/index.php index c2dd5149f7ab73d2ae96b92a8619c808c180db56..b3ecc45e70b0ba364c5a69d8ca43d4e5968f7b28 100644 --- a/index.php +++ b/index.php @@ -34,5 +34,57 @@ <?php require_once('src/html/channels.html'); ?> <?php require_once('src/html/channel.html'); ?> </main> + + <!-- This is a hack : https://git.happy-dev.fr/happy-dev/xmpp-chat-component/issues/24 --> + <hd-chat-window + id="chat-singleton" + data-authentication="anonymous" + data-auto-login="true" + data-bosh-service-url="https://conversejs.org/http-bind/" + data-debug="true" + data-jid="nomnom.im" + data-locales-url="http://hd-app.local/dist/lib/xmpp-chat-component/node_modules/converse.js/locale/{{{locale}}}/LC_MESSAGES/converse.json", + data-room-jid="anonymous@conference.nomnom.im"> + </hd-chat-window> + <script> + // Store url on load + var currentRoute = getCurrentRoute(); + console.log(currentRoute); + var chatSingleton = document.querySelector("#chat-singleton"); + var body = document.querySelector("body"); + + function getCurrentRoute() { + var pathnameSegments = window.location.pathname.split("/"); + + return pathnameSegments[1]; + } + + // Listen for changes + setInterval(function() { + if (currentRoute != window.location.href) { + currentRoute = getCurrentRoute(); + + insertChatIfNeeded(); + } + }, 150); + + // Inserts a chat in the current view if needed + function insertChatIfNeeded() { + if (["project", "project-chat", "channel", "channel-chat", "member", "member-chat"].indexOf(currentRoute) > -1) { + if (currentRoute.indexOf("chat") == -1) { + currentRoute += "-chat"; + } + console.log(currentRoute); + var currentView = document.querySelector("#" + currentRoute); + if (currentView.querySelector("hd-chat-window") == null) { + currentView.appendChild(chatSingleton); + currentView.style.display = 'block'; + } + } + else { + body.appendChild(chatSingleton); + } + } + </script> </body> </html> diff --git a/src/html/channel.html b/src/html/channel.html index 1db0ba6b718f9a93607dcd96863cdb03bf8c5a6b..850f2ca233b9edade6c4fec5130f8afc025a46da 100644 --- a/src/html/channel.html +++ b/src/html/channel.html @@ -29,6 +29,7 @@ </ldp-route> </ldp-router> + <div id="channel-chat" class="chat-wrapper"></div> <div id="channel-detail" style="display: none"> <ldp-display diff --git a/src/html/member.html b/src/html/member.html index aea669178ea15eeb8c5e17e84b1abdc32524a3b7..21a20e77d423d506e8fbed04924a5323642a832e 100644 --- a/src/html/member.html +++ b/src/html/member.html @@ -8,16 +8,7 @@ </ldp-route> </ldp-router> - <hd-chat-window - id="chat-singleton" - data-authentication="anonymous" - data-auto-login="true" - data-bosh-service-url="https://conversejs.org/http-bind/" - data-debug="true" - data-jid="nomnom.im" - data-locales-url="http://hd-app.local/dist/lib/xmpp-chat-component/node_modules/converse.js/locale/{{{locale}}}/LC_MESSAGES/converse.json", - data-room-jid="anonymous@conference.nomnom.im"> - </hd-chat-window> + <div id="member-chat" class="chat-wrapper"></div> <div id="member-detail" style="display: none"> <ldp-display diff --git a/src/html/project.html b/src/html/project.html index f64a9ef660dac01830c28fce53737ce89fdc7360..22cf9961c3de7a786ef14d6bc8946903b24e32f2 100644 --- a/src/html/project.html +++ b/src/html/project.html @@ -8,6 +8,7 @@ </ldp-route> </ldp-router> + <div id="project-chat" class="chat-wrapper"></div> <div id="project-detail" style="display: none"> <ldp-display diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss index 9efb0d907c29610608dd2f15168d2cf68d42cab3..5a0da003bf8fc4acea0d50c3c76128b5855a2b7d 100644 --- a/src/scss/_mixins.scss +++ b/src/scss/_mixins.scss @@ -68,15 +68,3 @@ display: table; } } - -hd-chat-window { - position: absolute; - top: 0px; - bottom: 0px; - left: 0px; - right: 0px; - margin: auto; - padding-top: $menu-height; - padding-right: $vertical-menu-width; - display: block; -} diff --git a/src/scss/_styles.scss b/src/scss/_styles.scss index 14d9c6e6407277defbec36e90a8b2fb04b32eb50..2e54f3b50389aa620b7c6c63b2a66181d36d0c15 100644 --- a/src/scss/_styles.scss +++ b/src/scss/_styles.scss @@ -17,3 +17,20 @@ html, body, #mainContainer { font-family: 'Righteous', cursive; text-decoration-line: underline; } + +hd-chat-window { + position: absolute; + top: 0px; + bottom: 0px; + left: 0px; + right: 0px; + margin: auto; + padding-top: $menu-height; + padding-right: $vertical-menu-width; + display: none; +} +.chat-wrapper { + hd-chat-window { + display: block; + } +}