Комментарии пользователя Danya Wyse

Как инициализировать переменную множество раз в js?

Danya Wyse @Wyse Автор вопроса

Вадим,
Я тогда по другому вопрос поставлю
Как мне выводить элемент с временем, которое будет означать отправку сообщения ?
Я сделал такую функцию timeMark
https://iwyse.github.io/ChatBot/
Но выводится время только один раз.

вот весь скрипт чата

const showDate = document.getElementById("showDate");
const firstMessage = document.getElementById("firstMessage");
setTimeout(() => {
  firstMessage.style.display = "flex";
  showDate.style.display = "block";
}, 3000);

const printDate = document.getElementById("todayDate");
const spendTime = document.getElementById("spendTime");

function printDay(todayHours) {
  if (todayHours >= 6 && todayHours < 12) {
    return "утра";
  } else if (todayHours >= 12 && todayHours < 18) {
    return "дня";
  } else if (todayHours >= 18 && todayHours <= 23) {
    return "вечера";
  } else {
    return "ночи";
  }
}
function spendMyTime(todayHours) {
  if (todayHours >= 6 && todayHours < 12) {
    return "утро";
  } else if (todayHours >= 12 && todayHours < 18) {
    return "день";
  } else if (todayHours >= 18 && todayHours <= 23) {
    return "вечер";
  } else {
    return "ночь";
  }
}

//* вывод текущего времени (часы + минуты)
let todayDate = new Date();
let todayMinuts = (todayDate.getMinutes() < 10 ? "0" : "") + todayDate.getMinutes();
let todayHours = todayDate.getHours();
let todayDateNow = todayHours + ":" + todayMinuts + " " + printDay(todayHours);
printDate.innerHTML = todayDateNow;
spendTime.innerHTML = spendMyTime(todayHours);


//* Функционал чата
const chatWrapper = document.querySelector(".chat__wrapper");
const sendMessage = document.querySelector(".send-message");
let inputMessage = document.querySelector(".input-message");


sendMessage.addEventListener("click", function (e) {
  if (inputMessage.value == 0) {
    e.preventDefault();
  }
  chatWrapper.insertAdjacentHTML(
    "beforeend",
    '<div class="chat-user chat-body"><div class="chat-user__image"><img src="img/person2.png" alt=""></div><div class="chat-user__message chat-message"><p class="chat-user__text">' +
      inputMessage.value +
      '</p><div class="chat-user__time chat-time logtime like-counter"></div></div></div>'
  );
  timeMark();
  presetLoading(); //* вызов эмуляции записи сообщения

  setTimeout(() => {
    let message;
    if (inputMessage.value.toLowerCase() == "привет, смотрю сериал") {
      message = `Здорово, я вот жду 3 сезон сериала "видеть"`;
    } 
    else if (inputMessage.value.toLowerCase() == "как твои дела?") {
      message = "Недавно ходили на море, тебе нравится море?";
    } 
    else if (inputMessage.value.toLowerCase() == "нравится море, люблю плавать") {
      message = "Вода щас очень теплая, людей правда много";
    }
    else if (inputMessage.value.toLowerCase() == "не фанат ходить на море") {
      message = "А мне нравится";
    }
    else if (inputMessage.value.toLowerCase() == "что у тебя нового?") {
      message = "Неделю назад приобрел машину";
    }
    else if (inputMessage.value.toLowerCase() == "что за машина?") {
      message = "Toyota Soarer, люблю быстро ездить";
    }
    else if (inputMessage.value.toLowerCase() == "главное ездить с умом") {
      message = "Обязательно";
    }
    else if (inputMessage.value == "") {
      message = "Не вижу что написано";
    }
    else {
      message = "Прости, появились срочные дела. До встречи!";
    }
    chatWrapper.insertAdjacentHTML(
      "beforeend",
      '<div class="chat-bot chat-body"><div class="chat-bot__image"><img src="img/person1.png" alt=""></div><div class="chat-bot__message chat-message"><p class="chat-bot__text">' +
        message +
        '</p><div class="chat-bot__time chat-time logtime"></div></div></div>'
    );
  }, 1500);
});

//* Эмуляция набора сообщения от собеседника
let loadingChat = document.createElement("div");
loadingChat.className = "chat-bot chat-body chat-loading";
loadingChat.innerHTML =
  '<div class="chat-bot__image"><img src="img/person1.png" alt=""></div><div class="chat-bot__loading chat-message"><span class="loading loading-1"></span><span class="loading loading-2"></span><span class="loading loading-3"></span></div>';
function presetLoading() {
  chatWrapper.append(loadingChat);
  setTimeout(() => {
    loadingChat.remove();
  }, 1500);
}


//* Вывод временной точки
function timeMark() {
  let logMessage = document.querySelector(".logtime");
  let sendDate = new Date();
  let sendMinuts = (sendDate.getMinutes() < 10 ? "0" : "") + sendDate.getMinutes();
  let sendHours = sendDate.getHours();
  let sendMessageDate = sendHours + ":" + sendMinuts;
  logMessage.innerHTML = sendMessageDate;
}
timeMark();

Войдите на сайт