//
// let senderName = localStorage.getItem('senderName');
// if (!senderName) {
//   localStorage.setItem('senderName', senderName);
// }
//
//
// }
// let form = document.getElementById('form')
// form.addEventListener('submit', (e) => {
//   e.preventDefault()
//   let message = e.target.message.value
//   chatSocket.send(JSON.stringify({
//     'message': message,
//     'sender': senderName
//   }))
//   form.reset()
// })




// let url = `ws://localhost:8000/ws/socket-server/`;
//
// const chatSocket = new WebSocket(url);

// chatSocket.onmessage = function (e) {
//   let data = JSON.parse(e.data)
//   console.log('Data: ', data)
// }

// chatSocket.onopen = function () {
//     console.log("open")
// }
// // function open_socket () {
// chatSocket.onopen = function(){
//     console.log("open")
//     // chatSocket
// }
// }

// var i = 0


url = `ws://localhost:8000/ws/socket-server/?user_id=${user_id}`;

const chatSocket = new WebSocket(url);

function sendMessageSocket (data) {
    chatSocket.send(JSON.stringify(data));
}


chatSocket.onmessage = function (e) {
    let data = JSON.parse(e.data);
    console.log('Data:', data);
    console.log("return")
    if (data.type === 'chat'){
        document.querySelector(".container-messages").innerHTML = data.html;
        document.querySelector(".enter-message-inp").focus()
    } else if (data.type === "echo"){
        console.log(data)
    }
}


// let url = `ws://localhost:8000/ws/socket-server/`;
//
// const chatSocket = new WebSocket(url);
//
// chatSocket.onmessage = function (e) {
//   let data = JSON.parse(e.data)
//   console.log('Data: ', data)
//
//   if (data.type === 'chat') {
//     // let messages = document.getElementById('messages')
//     //
//     // messages.insertAdjacentHTML('beforeend', `<div>
//     //                                             <p>${data.message}</p>
//     //                                           </div>`
//     // )
//       document.querySelector(".container-messages").innerHTML = data.html;
//       document.querySelector(".enter-message-inp").focus()
//   }
//
// }

// function send_ws_msg(data) {
//     chatSocket.send(JSON.stringify(data));
// }

// window.onload = function () {
//
//     let btn = document.querySelector(".send-message")
//
//     btn.addEventListener('click', (e) => {
//       e.preventDefault()
//       // let message = e.target.message.value
//       chatSocket.send(JSON.stringify({
//         'data':'data'
//       }))
//       // btn.reset()
//     })
// }
// let form = document.getElementById('form')