lavkach3

1
$(function () {
2
  var chatarea = $("#chat");
3

4
  $("#chat .message-center a").on("click", function () {
5
    var name = $(this).find(".mail-contnet h5").text();
6
    var img = $(this).find(".user-img img").attr("src");
7
    var id = $(this).attr("data-user-id");
8
    var status = $(this).find(".profile-status").attr("data-status");
9

10
    if ($(this).hasClass("active")) {
11
      $(this).toggleClass("active");
12
      $(".chat-windows #user-chat" + id).hide();
13
    } else {
14
      $(this).toggleClass("active");
15
      if ($(".chat-windows #user-chat" + id).length) {
16
        $(".chat-windows #user-chat" + id)
17
          .removeClass("mini-chat")
18
          .show();
19
      } else {
20
        var msg = msg_receive(
21
          "I watched the storm, so beautiful yet terrific."
22
        );
23
        msg += msg_sent("That is very deep indeed!");
24
        var html =
25
          "<div class='user-chat' id='user-chat" +
26
          id +
27
          "' data-user-id='" +
28
          id +
29
          "'>";
30
        html +=
31
          "<div class='chat-head'><img src='" +
32
          img +
33
          "' data-user-id='" +
34
          id +
35
          "'><span class='status " +
36
          status +
37
          "'></span><span class='name'>" +
38
          name +
39
          "</span><span class='opts'><i class='material-icons closeit' data-user-id='" +
40
          id +
41
          "'>clear</i><i class='material-icons mini-chat' data-user-id='" +
42
          id +
43
          "'>remove</i></span></div>";
44
        html +=
45
          "<div class='chat-body'><ul class='chat-list'>" + msg + "</ul></div>";
46
        html +=
47
          "<div class='chat-footer'><input type='text' data-user-id='" +
48
          id +
49
          "' placeholder='Type & Enter' class='form-control'></div>";
50
        html += "</div>";
51
        $(".chat-windows").append(html);
52
      }
53
    }
54
  });
55
});
56

57
// *******************************************************************
58
// Chat Application
59
// *******************************************************************
60

61
$(".search-chat").on("keyup", function () {
62
  var value = $(this).val().toLowerCase();
63
  $(".chat-users li").filter(function () {
64
    $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1);
65
  });
66
});
67

68
$(".app-chat .chat-user ").on("click", function (event) {
69
  if ($(this).hasClass(".active")) {
70
    return false;
71
  } else {
72
    var findChat = $(this).attr("data-user-id");
73
    var personName = $(this).find(".chat-title").text();
74
    var personImage = $(this).find("img").attr("src");
75
    var hideTheNonSelectedContent = $(this)
76
      .parents(".chat-application")
77
      .find(".chat-not-selected")
78
      .hide()
79
      .siblings(".chatting-box")
80
      .show();
81
    var showChatInnerContent = $(this)
82
      .parents(".chat-application")
83
      .find(".chat-container .chat-box-inner-part")
84
      .show();
85

86
    if (window.innerWidth <= 767) {
87
      $(".chat-container .current-chat-user-name .name").html(
88
        personName.split(" ")[0]
89
      );
90
    } else if (window.innerWidth > 767) {
91
      $(".chat-container .current-chat-user-name .name").html(personName);
92
    }
93
    $(".chat-container .current-chat-user-name img").attr("src", personImage);
94
    $(".chat").removeClass("active-chat");
95
    $(".user-chat-box .chat-user").removeClass("bg-light-subtle");
96
    $(this).addClass("bg-light-subtle");
97
    $(".chat[data-user-id = " + findChat + "]").addClass("active-chat");
98
  }
99
  if ($(this).parents(".user-chat-box").hasClass("user-list-box-show")) {
100
    $(this).parents(".user-chat-box").removeClass("user-list-box-show");
101
  }
102
  $(".chat-meta-user").addClass("chat-active");
103
  $(".chat-send-message-footer").addClass("chat-active");
104
});
105

106
// Send Messages
107
$(".message-type-box").on("keydown", function (event) {
108
  if (event.key === "Enter") {
109
    // Start getting time
110
    var now = new Date();
111
    var hh = now.getHours();
112
    var min = now.getMinutes();
113

114
    var ampm = hh >= 12 ? "pm" : "am";
115
    hh = hh % 12;
116
    hh = hh ? hh : 12;
117
    hh = hh < 10 ? "0" + hh : hh;
118
    min = min < 10 ? "0" + min : min;
119

120
    var time = hh + ":" + min + " " + ampm;
121
    // End
122

123
    var chatInput = $(this);
124
    var chatMessageValue = chatInput.val();
125
    if (chatMessageValue === "") {
126
      return;
127
    }
128
    $messageHtml =
129
      '<div class="text-end mb-3"> <div class="p-2 bg-info-subtle text-dark rounded-1 d-inline-block fs-3">' +
130
      chatMessageValue +
131
      '</div> <div class="d-block fs-2">' +
132
      time +
133
      "</div>  </div>";
134
    var appendMessage = $(this)
135
      .parents(".chat-application")
136
      .find(".active-chat")
137
      .append($messageHtml);
138
    var clearChatInput = chatInput.val("");
139
  }
140
});
141

142
// *******************************************************************
143
// Email Application
144
// *******************************************************************
145

146
$(document).ready(function () {
147
  $(".back-btn").click(function () {
148
    $(".app-email-chatting-box").hide();
149
  });
150
  $(".chat-user").click(function () {
151
    $(".app-email-chatting-box").show();
152
  });
153
});
154

155
// *******************************************************************
156
// chat Offcanvas
157
// *******************************************************************
158

159
$("body").on("click", ".chat-menu", function () {
160
  $(".parent-chat-box").toggleClass("app-chat-right");
161
  $(this).toggleClass("app-chat-active");
162
});
163