chat-list.js 7.4 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11
var ChatList = {};

$("#tabDM").on("click", function (e) {
  ChatList.refreshRoomList(ChatRoomType.DM);
});

$("#tabGroup").on("click", function (e) {
  ChatList.refreshRoomList(ChatRoomType.GROUP);
});

document.addEventListener("DOMContentLoaded", function () {
12
  ChatList.bindChatSearch();
13 14
});

15
ChatList.bindChatSearch = function () {
16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31
  const chatSearchInput = $('#chat .search_form input[type="search"]');
  const chatSearchCancel = $("#chat .search_form .cancel");
  chatSearchInput.click(function () {
    let roomListTitle = getLocalizedString("room_search_placeholder");
    $("#chatTitle").text(roomListTitle);
  });

  chatSearchCancel.click(function () {
    let roomListTitle = getLocalizedString("roomListTitle");
    $("#chatTitle").text(roomListTitle);
  });

  // チャットメンバー検索
  chatSearchInput.keyup(function (e) {
    var rooms;
    var keyword = chatSearchInput.val();
32 33
    const enterKeyPressed = e.KeyCode == 13 || e.key == "Enter";
    if (enterKeyPressed) {
34 35 36 37 38 39 40 41
      if (keyword.length != 0 && keyword != "") {
        chatSearchInput.blur();
        return;
      }
    } else if (keyword == "" || keyword.length < 2) {
      $(".overlay_src_msg").empty();
      return;
    }
42 43
    ChatList.searchRoom(keyword, rooms);
    if (enterKeyPressed) {
44 45 46 47
      chatSearchInput.blur();
      return;
    }
  });
48

49
  // iOSキーボード変換検知用
50
  chatSearchInput.on("compositionend", function () {
onuma committed
51
    if (deviceInfo.isiOS()) {
52 53 54
      var rooms;
      var keyword = chatSearchInput.val();
      ChatList.searchRoom(keyword, rooms);
55
    }
56 57
  });
};
58 59

ChatList.refreshRoomList = function (roomType) {
60
  if (serverInfo.isOnline == true) {
61 62 63 64
    Common.refreshForOnline();
  } else {
    Common.refreshForOffline();
  }
65

66
  const selectedRoomTypeInRoomList = NativeBridgeDataSource.getBeforeRoomType();
67

68 69
  if (selectedRoomTypeInRoomList != null) {
    roomType = selectedRoomTypeInRoomList;
70 71 72 73
    NativeBridgeDelegate.clearBeforeRoomType();
  }
  Common.showLoadingIndicator();

74 75 76 77
  // select tab as room type
  ChatList.selectTab(roomType);

  // update room info in native db
78
  if (serverInfo.isOnline == true) {
79 80
    NativeBridgeDelegate.updateRoomList();
  }
81 82 83 84 85 86 87 88 89 90 91

  // get room list from native db
  const rooms = NativeBridgeDataSource.getRoomList(roomType, null);

  // Room list 初期化
  ChatList.initializeRoomList();

  // set room title
  ChatList.setRoomTitle();

  // メッセージがない時、最新メッセージにempty messageを追加
92
  if (rooms.length === 0) {
93
    ChatList.addEmptyRoomListLabel(roomType);
94 95
  }

96 97
  // リストにルームを追加
  ChatList.appendRoomList(rooms);
98 99 100 101

  Common.dismissLoadingIndicator();
};

102
ChatList.addEmptyRoomListLabel = function (roomType) {
103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119
  // 検索結果がない場合のメッセージを追加
  const emptyListString = getLocalizedString("roomListEmptyString");
  switch (roomType) {
    case ChatRoomType.GROUP:
      $("#groupChatList").append(
        `<center class="text-secondary">${emptyListString}</center>`
      );
      break;
    case ChatRoomType.DM:
      $("#dmChatList").append(
        `<center class="text-secondary">${emptyListString}</center>`
      );
      break;
    default:
  }
};

120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153
ChatList.selectTab = function (roomType) {
  if (roomType == ChatRoomType.DM) {
    $("#tabDM").prop("checked", true);
  } else {
    $("#tabGroup").prop("checked", true);
  }
};

ChatList.initializeRoomList = function () {
  // #36146に対応
  $("#groupChatList").empty();
  $("#dmChatList").empty();
};

ChatList.setRoomTitle = function () {
  let roomListTitle = getLocalizedString("roomListTitle");
  $("#chatTitle").text(roomListTitle);
};

ChatList.appendRoomList = function (rooms) {
  const template = getTemplate(TemplateURL.ROOM_LIST);

  rooms.forEach(function (room) {
    let html = ChatList.renderRoom(template, room);
    let obj = jQuery.parseHTML(html);
    if (room.type.toString() == ChatRoomType.GROUP) {
      $("#groupChatList").append(obj);
    } else if (room.type.toString() == ChatRoomType.DM) {
      $("#dmChatList").append(obj);
    }
  });
};

ChatList.getDefaultChatRoomName = function (roomAttendUsers) {
154 155 156 157 158 159 160 161 162
  let attendUserName = [];
  roomAttendUsers.forEach(function (user) {
    user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
    attendUserName.push(user.shopMemberName);
  });

  return attendUserName.join(", ");
};

163
ChatList.getUnreadCount = function (roomUnreadCount) {
164 165 166 167 168 169 170 171
  if (roomUnreadCount == 0) {
    return "";
  } else if (roomUnreadCount > 999) {
    return "999+";
  }
  return roomUnreadCount;
};

172
// チャットルーム検索
173
ChatList.searchRoom = function (keyword, rooms) {
174 175 176 177 178 179
  const overlayMessage = $(".overlay_src_msg");
  overlayMessage.empty();
  rooms = NativeBridgeDataSource.getRoomList(ChatRoomType.ALL, keyword);
  let roomListTitle = getLocalizedString("room_search_placeholder");
  $("#chatTitle").text(roomListTitle);

180
  const template = getTemplate(TemplateURL.ROOM_LIST);
181
  rooms.forEach(function (room) {
182
    let html = ChatList.renderRoom(template, room);
183 184 185 186 187 188 189 190 191 192 193 194

    // Click event
    let obj = jQuery.parseHTML(html);
    overlayMessage.append(obj);
  });

  if (rooms.length == 0) {
    const noResultMsg = getNoResultMessage();
    overlayMessage.append(noResultMsg);
  }
};

195
ChatList.getRoomMessage = function (message) {
196 197 198 199 200 201 202
  if (message) {
    return message.toString();
  } else {
    return getLocalizedString("noMessages");
  }
};

203
ChatList.getDisplayMessage = function (messageType, roomMessage) {
204 205 206 207 208 209 210 211 212 213 214 215 216 217
  switch (messageType) {
    case MessageType.TEXT:
      return roomMessage;
    case MessageType.SYSTEM:
      return roomMessage;
    case MessageType.IMAGE:
      return getLocalizedString("image");
    case MessageType.VIDEO:
      return getLocalizedString("video");
    case MessageType.COMMUNICATIONSTART:
      return getLocalizedString("collaboration_start");
    case MessageType.COMMUNICATIONEND:
      return getLocalizedString("collaboration_end");
    default:
218
      return roomMessage;
219 220 221
  }
};

222 223 224 225 226 227 228 229 230 231
ChatList.renderRoom = function (template, room) {
  // thumbnail counts
  const thumbnailCount = Math.min(room.attendUsers.length, 4);

  // set room name
  if (room.chatRoomName == "") {
    room.chatRoomName = ChatList.getDefaultChatRoomName(room.attendUsers);
  }

  // set profile images
232
  room.profileImagePath = "./images/user-profile.png";
233 234 235 236 237 238 239 240 241 242
  room.attendUsers.forEach(function (user) {
    user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
  });

  // set room messages
  const roomMessage = ChatList.getRoomMessage(room.message);
  const displayMessage = ChatList.getDisplayMessage(
    room.messageType,
    roomMessage
  );
243

244
  // set date string
245 246 247
  const time = room.insertDate
    ? CHAT_UTIL.formatDate(room.insertDate).createdAt
    : "";
248 249

  const messageUnreadCount = ChatList.getUnreadCount(room.unreadCount);
250

251 252 253 254 255 256 257
  return Mustache.render(template, {
    thumbnailCount: thumbnailCount,
    roomName: room.chatRoomName,
    roomId: room.chatRoomId,
    profileImage: room.profileImagePath,
    lastMessage: displayMessage,
    time: time,
258
    unreadMsgCnt: messageUnreadCount,
259
    userCnt: room.attendUsers.length + 1,
260
    attendUsers: room.attendUsers.splice(0, thumbnailCount),
261 262 263
  });
};

264 265
ChatList.refreshForOnline = function () {
  $(".craeteRoomButton").off("click", ChatList.offlineHandler);
266 267 268
  $(".craeteRoomButton").css("opacity", "1.0");
};

269 270
ChatList.refreshForOffline = function () {
  $(".craeteRoomButton").on("click", ChatList.offlineHandler);
271
  $(".craeteRoomButton").css("opacity", "0.3");
272
};
273

274
ChatList.offlineHandler = function (e) {
275 276
  e.preventDefault();
};