diff --git a/chat-window-component.html b/chat-window-component.html
new file mode 100644
index 0000000000000000000000000000000000000000..1cc9b2c73fbada311f5e6d86cfe73d284a1b0800
--- /dev/null
+++ b/chat-window-component.html
@@ -0,0 +1,89 @@
+<template>
+ <!--<link rel="stylesheet" type="text/css" media="screen" href="https://cdn.conversejs.org/css/converse.min.css">-->
+ <link type="text/css" rel="stylesheet" media="screen" href="node_modules/conversejs/node_modules/bootstrap/dist/css/bootstrap.min.css" />
+ <link type="text/css" rel="stylesheet" media="screen" href="node_modules/conversejs/node_modules/font-awesome/css/font-awesome.min.css" />
+ <link type="text/css" rel="stylesheet" media="screen" href="node_modules/conversejs/css/theme.css" />
+ <link type="text/css" rel="stylesheet" media="screen" href="node_modules/conversejs/css/converse.css"/>
+
+ <h1>BOOM</h1>
+</template>
+
+<!--<script id="conversejs" src="https://cdn.conversejs.org/dist/converse.min.js"></script>-->
+<script id="require-js" src="node_modules/conversejs/node_modules/requirejs/require.js"></script>
+<script id="config-js" src="node_modules/conversejs/src/config.js"></script>
+<script>
+ // Importing Converse lib into the main document
+ var currentDoc = document.currentScript.ownerDocument;
+ var mainDoc = document;
+ var conversejs = currentDoc.querySelector("#require-js", "#config-js");
+
+ mainDoc.head.appendChild(conversejs.cloneNode(true));
+
+
+ // Declaring Custom chat element
+ class ChatWindow extends HTMLElement {
+ constructor() {
+ super();
+
+ const shadowRoot = this.attachShadow({mode: "open"});
+ const template = currentDoc.querySelector("template");
+ const instance = template.content.cloneNode(true);
+
+ shadowRoot.appendChild(instance);
+ }
+ }
+ window.customElements.define("hd-chat-window", ChatWindow);
+
+
+ // ConverseJS init
+ require.config({
+ baseUrl: 'node_modules/conversejs',
+ });
+ require(['converse'], function (converse) {
+ converse.initialize({
+ //allow_otr: true,
+ //auto_login: true,
+ //auto_away: 300,// 5 minutes
+ //auto_reconnect: true,
+ //auto_join_on_invite: true,
+ //auto_join_rooms: [{"jid": "bordel@chat.component.local"}],
+ blacklisted_plugins: [
+ "converse-bookmarks",
+ "converse-chatview",
+ "converse-controlbox",
+ "converse-core",
+ "converse-dragresize",
+ "converse-headline",
+ "converse-mam",
+ "converse-minimize",
+ "converse-muc",
+ "converse-notification",
+ "converse-otr",
+ "converse-ping",
+ "converse-register",
+ "converse-rosterview",
+ "converse-vcard",
+ ],
+ //credentials_url: "/credentials.php",
+ //csi_waiting_time: 300,// 5 minutes
+ debug: true,
+ //// default_domain: "some.default.domain",
+ //domain_placeholder: "happy-dev.fr",
+ //forward_messages: true,
+ //message_archiving: "always",
+ //message_carbons: true,
+ //muc_domain: "conference.chat.component.local",
+ //muc_nickname_from_jid: true,
+ //play_sounds: true,
+ //show_controlbox_by_default: true,
+ //show_send_button: true,
+ //visible_toolbar_buttons: {
+ // call: false,
+ // clear: false,
+ // emoji: true,
+ // toggle_occupants: true
+ //},
+ websocket_url: "ws://"+ location.hostname +":5280/ws/",
+ });
+ });
+</script>
diff --git a/converse.html b/converse.html
index af434c0d7090553f2412648645fb3caa74c6aaef..2810cc1735d781c32e7327f63bd5600841662823 100644
--- a/converse.html
+++ b/converse.html
@@ -18,32 +18,32 @@
});
require(['converse'], function (converse) {
converse.initialize({
- allow_otr: false,
- auto_login: true,
- auto_away: 300,// 5 minutes
- auto_reconnect: true,
- auto_join_on_invite: true,
- //auto_join_rooms: [{'jid': 'bordel@chat.component.local'}],
- credentials_url: "/credentials.php",
- csi_waiting_time: 300,// 5 minutes
- debug: true,
- //default_domain: "some.default.domain",
- domain_placeholder: "happy-dev.fr",
- forward_messages: true,
- message_archiving: "always",
- message_carbons: true,
- muc_domain: "conference.chat.component.local",
- muc_nickname_from_jid: true,
- play_sounds: true,
- show_controlbox_by_default: true,
- show_send_button: true,
- visible_toolbar_buttons: {
- call: false,
- clear: false,
- emoji: true,
- toggle_occupants: true
- },
- websocket_url: "ws://"+ location.hostname +":5280/ws/",
+ // allow_otr: true,
+ // auto_login: true,
+ // auto_away: 300,// 5 minutes
+ // auto_reconnect: true,
+ // auto_join_on_invite: true,
+ // //auto_join_rooms: [{'jid': 'bordel@chat.component.local'}],
+ // credentials_url: "/credentials.php",
+ // csi_waiting_time: 300,// 5 minutes
+ // debug: true,
+ // //default_domain: "some.default.domain",
+ // domain_placeholder: "happy-dev.fr",
+ // forward_messages: true,
+ // message_archiving: "always",
+ // message_carbons: true,
+ // muc_domain: "conference.chat.component.local",
+ // muc_nickname_from_jid: true,
+ // play_sounds: true,
+ // show_controlbox_by_default: false,
+ // show_send_button: true,
+ // visible_toolbar_buttons: {
+ // call: false,
+ // clear: false,
+ // emoji: true,
+ // toggle_occupants: true
+ // },
+ websocket_url: "ws://"+ location.hostname +":5280/ws/",
});
});
</script>
diff --git a/index.html b/index.html
index 4902205a9bc70b112bbb2061ac589233282b1fc0..77d32a583c711d0543a581ea52823c0e0d00b120 100644
--- a/index.html
+++ b/index.html
@@ -4,12 +4,13 @@
<meta charset="UTF-8">
<script src="node_modules/webcomponentsjs/full.js"></script>
- <link rel="import" href="converse.html"/>
+ <link rel="import" href="chat-window-component.html">
+ <!--<link rel="import" href="converse.html"/>-->
<title>XMPP chat</title>
</head>
<body>
- <p>Hello World !</p>
+ <hd-chat-window jid="sylvain@chat.component.local"></hd-chat-window>
</body>
</html>