diff --git a/src/main/webapp/chat.html b/src/main/webapp/chat.html
new file mode 100644
index 0000000..eba2a1d
--- /dev/null
+++ b/src/main/webapp/chat.html
@@ -0,0 +1,22 @@
+
+
+
+
+
+
+ Chat en REST
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/main/webapp/js/main.js b/src/main/webapp/js/main.js
new file mode 100644
index 0000000..7df7834
--- /dev/null
+++ b/src/main/webapp/js/main.js
@@ -0,0 +1,66 @@
+document.addEventListener("DOMContentLoaded", () => {
+ const rootURL = "http://localhost:8080/pr.tp.services/api";
+ let lastID = 0;
+
+ const updateMessages = async () => {
+ try {
+ const response = await fetch(`${rootURL}/messages/after/${lastID}`, {
+ method: 'GET'
+ });
+ const data = await response.json();
+ if (data !== null) {
+ const messages = Array.isArray(data) ? data : [data];
+ console.log(messages.length > 1 ? "append each message" : "append one message");
+ messages.forEach(appendMessage);
+ }
+ console.log("call update again in 1s");
+ setTimeout(updateMessages, 1000);
+ } catch (error) {
+ console.error(`updateMessages error: ${error}`);
+ }
+ };
+
+ const appendMessage = (message) => {
+ console.log(message);
+ const messageElement = document.createElement("p");
+ messageElement.textContent = `${message.id}:${message.date}>${message.content}`;
+ document.querySelector('#chatContent').appendChild(messageElement);
+
+ lastID = parseInt(message.id) + 1;
+ console.log(`${lastID} computed from ${message.id}`);
+ };
+
+ const sendMessage = async (messageContent) => {
+ try {
+ const response = await fetch(`${rootURL}/messages`, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify({ content: messageContent })
+ });
+ const data = await response.json();
+ console.log(`create message ${data.id}`);
+ } catch (error) {
+ console.error(`sendMessage error: ${error}`);
+ }
+ };
+
+ const sendContent = () => {
+ const input = document.querySelector("#ligne");
+ const messageContent = input.value;
+ input.value = "";
+ sendMessage(messageContent);
+ };
+
+ document.querySelector("#submitButton").addEventListener("click", sendContent);
+
+ window.addEventListener("keydown", (event) => {
+ if (event.keyCode === 13) {
+ event.preventDefault();
+ sendContent();
+ }
+ });
+
+ updateMessages();
+});