Commit 51b89259 by Kim Peace

WIP: removing chat.js and chat-ui.js

parent f75d3558
......@@ -117,9 +117,7 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- view -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/archive.js"></script>
<script src="./js/views/archive/archive.js"></script>
<!-- Template archive -->
<script id="archive-template" type="text/template">
......@@ -149,7 +147,6 @@
return this.split(org).join(dest);
}
$("#chatMenuModal").load("./modal_chat_menu.html");
$("#loadingArea").load("./loading.html");
NativeBridgeDelegate.getLoginParameter();
......
......@@ -74,9 +74,7 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- view -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/archive.js"></script>
<script src="./js/views/archive/archive.js"></script>
<!-- Template archive-detail -->
<script id="archive-detail-template" type="text/template">
......@@ -123,67 +121,6 @@
</li>
</script>
<!-- Template archive-namecard -->
<script id="archive-namecard-template" type="text/template">
<div class="modal fade profile_modal" id="userNameCard" tabindex="-1" role="dialog" aria-labelledby="userNameCard" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header border-0">
<div class="profile_desc d-flex flex-row">
<img src="{{profileImage}}" onError="this.src='./img/noImage.png'"/>
<div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
</div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
{{#groupPathList}}
<li style="display: block;">{{.}}</li>
{{/groupPathList}}
</div>
<div class="modal-footer border-0 justify-content-center">
{{#isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.removeFavoriteUser({{shopMemberId}})">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite.png" alt="お気に入り">
</div>
<span>お気に入り解除</span>
</div>
</button>
{{/isFavorite}}
{{^isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.insertFavoriteUser({{shopMemberId}})">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite_white.png" alt="お気に入り">
</div>
<span>お気に入り登録</span>
</div>
</button>
{{/isFavorite}}
<button type="button" class="border-0 bg_green" >
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_phone.png" alt="通話">
</div>
<span>通話</span>
</div>
</button>
<button type="button" class="border-0 bg_blue">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_chat.png" alt="チャット">
</div>
<span>チャット</span>
</div>
</button>
</div>
</div>
</div>
</div>
</script>
<script>
var archiveId;
......
......@@ -123,8 +123,7 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/views/chats/chat-list.js"></script>
<script>
String.prototype.replaceAll = function (org, dest) {
......@@ -144,8 +143,8 @@
alert(getLocalizedString("inform_exit_host_collaboration"));
}
}
CHAT_UI.refreshRoomList(ChatRoomType.GROUP);
CHAT_UI.dismissLoadingIndicator();
ChatList.refreshRoomList(ChatRoomType.GROUP);
Common.dismissLoadingIndicator();
};
</script>
</body>
......
......@@ -151,9 +151,8 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/chat-add-user.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/chats/management/chat-add-user.js"></script>
<script src="./js/common/loading.js"></script>
<script>
......@@ -168,12 +167,12 @@
const selectedUsers = NativeBridgeDataSource.loadSelectedUsers();
if (selectedUsers != "") {
selectedUsers.forEach(function (user) {
CHAT.globalSelectedUserList.push(user.shopMemberId);
ChatManagementCommon.selectedUserList.push(user.shopMemberId);
})
};
if (CHAT.globalSelectedUserList.length > 0) {
$('.select_member_num').text(CHAT.globalSelectedUserList.length);
if (ChatManagementCommon.selectedUserList.length > 0) {
$('.select_member_num').text(ChatManagementCommon.selectedUserList.length);
} else {
$('.select_member_num').text('0');
}
......
......@@ -81,8 +81,7 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/common/loading.js"></script>
<script>
......@@ -93,7 +92,7 @@
NativeBridgeDelegate.getGlobalParameter();
function getGlobalParam() {
CHAT_UI.showAddUserConfirmView();
ChatManagementCommon.showAddUserConfirmView();
};
</script>
</body>
......
......@@ -80,9 +80,8 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/chat-room.js"></script>
<script src="./js/views/chats/chat-room.js"></script>
<script src="./js/views/chats/management/chat-room-change.js"></script>
<script>
String.prototype.replaceAll = function (org, dest) {
......
......@@ -152,9 +152,8 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/chatMakeRoom.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/chats/management/chat-make-room.js"></script>
<script src="./js/common/loading.js"></script>
<script>
......@@ -169,12 +168,12 @@
if (NativeBridgeDataSource.loadSelectedUsers() != "") {
let selectedUsers = NativeBridgeDataSource.loadSelectedUsers();
selectedUsers.forEach(function (user) {
CHAT.globalSelectedUserList.push(user.shopMemberId);
ChatManagementCommon.selectedUserList.push(user.shopMemberId);
})
};
if (CHAT.globalSelectedUserList.length > 0) {
$('.select_member_num').text(CHAT.globalSelectedUserList.length);
if (ChatManagementCommon.selectedUserList.length > 0) {
$('.select_member_num').text(ChatManagementCommon.selectedUserList.length);
} else {
$('.select_member_num').text('0');
}
......
......@@ -88,8 +88,7 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/common/loading.js"></script>
<script>
......@@ -101,9 +100,9 @@
NativeBridgeDelegate.getGlobalParameter();
$("#newRoomName").attr("placeholder", getLocalizedString("newRoomName"));
function getGlobalParam() {
CHAT_UI.showMakeRoomConfirmView();
ChatManagementCommon.showMakeRoomConfirmView();
};
</script>
</body>
......
......@@ -168,10 +168,8 @@
<script src="./js/sockets/chat-websocket.js"></script>
<script src="./js/sockets/chat-websocket-message.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/utils/chat-media-handler.js"></script>
<script src="./js/chat-room.js"></script>
<script src="./js/views/chats/chat-room.js"></script>
<script src="./js/common/loading.js"></script>
<script>
......
......@@ -156,11 +156,11 @@
<script src="./js/sockets/chat-websocket.js"></script>
<script src="./js/sockets/chat-websocket-message.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/collaboration/collaboration.js"></script>
<script src="https://biztaskyell.abookcloud.com/coview_api.js"></script>
<script src="./js/share.js"></script>
<script src="./js/views/collaboration/share.js"></script>
<script src="./js/views/contact/namecard.js"></script>
<script>
$("#footer_collabo").load("./footer_collabo.html");
......@@ -206,24 +206,16 @@
alert(getLocalizedString('not_support_version'));
if (typeof android != "undefined") {
NativeBridgeDelegate.openCommunicationHome();
NativeBridgeDelegate.openCommunicationHome();
NativeBridgeDelegate.openCommunicationHome();
}
}
}
initCollaborationUI(joinCollaborationType);
globalUserInfo.coWorkType = CHAT_UTIL.getCoviewTypeFromCollaborationType(joinCollaborationType);
globalUserInfo.coWorkType = CHAT_UTIL.getCoviewTypeFromCollaborationType(joinCollaborationType);
if (collaborationJoinFlg != '2') {
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
CHAT_SOCKET.initialJoin();
}
};
</script>
......
......@@ -98,10 +98,10 @@
<script src="./js/sockets/chat-websocket.js"></script>
<script src="./js/sockets/chat-websocket-message.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/collaboration/collaboration.js"></script>
<script src="./js/common/loading.js"></script>
<script src="./js/views/contact/namecard.js"></script>
<script>
$("#footer_collabo").load("./footer_collabo.html");
......@@ -126,16 +126,7 @@
collaborationJoinFlg = NativeBridgeDataSource.getCollaborationJoinFlg();
globalUserInfo.coWorkType = CollaborationTypeKey.DOCUMENT;
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
CHAT_SOCKET.initialJoin();
};
</script>
</body>
......
......@@ -160,11 +160,11 @@
<script src="./js/sockets/chat-websocket.js"></script>
<script src="./js/sockets/chat-websocket-message.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/collaboration/collaboration.js"></script>
<script src="https://biztaskyell.abookcloud.com/coview_api.js"></script>
<script src="./js/share.js"></script>
<script src="./js/views/collaboration/share.js"></script>
<script src="./js/views/contact/namecard.js"></script>
<script>
$("#footer_collabo").load("./footer_collabo.html");
......@@ -191,17 +191,7 @@
globalUserInfo.coWorkType = CollaborationTypeKey.CAMERA;
if (collaborationJoinFlg != '2') {
CHAT_SOCKET.connectSocket();
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
CHAT_SOCKET.initialJoin();
}
};
</script>
......
......@@ -149,11 +149,11 @@
<script src="./js/sockets/chat-websocket.js"></script>
<script src="./js/sockets/chat-websocket-message.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/collaboration/collaboration.js"></script>
<script src="https://biztaskyell.abookcloud.com/coview_api.js"></script>
<script src="./js/share.js"></script>
<script src="./js/views/collaboration/share.js"></script>
<script src="./js/views/contact/namecard.js"></script>
</body>
<script>
......@@ -181,16 +181,7 @@
globalUserInfo.coWorkType = CollaborationTypeKey.VIDEO;
if (collaborationJoinFlg != '2') {
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
CHAT_SOCKET.initialJoin();
}
};
</script>
......
......@@ -94,11 +94,11 @@
<script src="./js/sockets/chat-websocket.js"></script>
<script src="./js/sockets/chat-websocket-message.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/collaboration/collaboration.js"></script>
<script src="https://biztaskyell.abookcloud.com/coview_api.js"></script>
<script src="./js/share.js"></script>
<script src="./js/views/collaboration/share.js"></script>
<script src="./js/views/contact/namecard.js"></script>
<script>
$("#footer_collabo").load("./footer_collabo.html");
......@@ -125,16 +125,7 @@
globalUserInfo.coWorkType = CollaborationTypeKey.AUDIO;
if (collaborationJoinFlg != '2') {
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
CHAT_SOCKET.initialJoin();
}
};
</script>
......
......@@ -151,11 +151,11 @@
<script src="./js/sockets/chat-websocket.js"></script>
<script src="./js/sockets/chat-websocket-message.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/views/chats/management/chat-management-common.js"></script>
<script src="./js/views/collaboration/collaboration.js"></script>
<script src="https://biztaskyell.abookcloud.com/coview_api.js"></script>
<script src="./js/share.js"></script>
<script src="./js/views/collaboration/share.js"></script>
<script src="./js/views/contact/namecard.js"></script>
<script>
$("#footer_collabo").load("./footer_collabo.html");
......@@ -183,16 +183,7 @@
globalUserInfo.coWorkType = CollaborationTypeKey.BOARD;
if (collaborationJoinFlg != '2') {
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
CHAT_SOCKET.initialJoin();
}
};
</script>
......
......@@ -200,9 +200,7 @@
<script src="./js/Models/serverinfo.js"></script>
<script src="./js/Models/userinfo.js"></script>
<!-- View -->
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/contact.js"></script>
<script src="./js/views/contact/contact.js"></script>
<script src="./js/common/loading.js"></script>
<script>
......
jQuery("#homeButton").on("click", function () {
NativeBridgeDelegate.goHome();
});
\ No newline at end of file
var lastscrollvalue;
window.onscroll = function () {
if (beforeScroll == window.scrollY) {
return;
}
beforeScroll = window.scrollY;
const beforeHeight = $(".room_container").height();
messageCount = $(".chat_message").length;
if ($(this).scrollTop() === 0 && messageCount >= PagingSize.MESSAGE) {
if (!$("#chatLoader").is(":visible")) {
let loader = $(
'<div id="chatLoader" class="text-center"><div class="spinner-grow spinner-grow-sm" role="status" /></div>'
);
$("#messages").prepend(loader);
const messageId = $($(".chat_message").get(0)).data("messageid");
NativeBridgeDelegate.updatePreMessage(messageId);
let messages = NativeBridgeDataSource.getMessagesWithMessageId(messageId);
CHAT_UI.prependMessage(messages);
loader.remove();
var afterHeight = $(".room_container").height();
window.scroll(0, afterHeight - beforeHeight);
}
}
};
$("#roomNameChangeBtn").click(function () {
var changeRoomName = $("#roomNameInput").val();
var trimmedRoomName = $("#roomNameInput").val().trim();
if (trimmedRoomName.length == 0) {
alert(getLocalizedString("error_empty_room_name"));
return;
}
NativeBridgeDelegate.changeRoomName(changeRoomName);
});
//メッセージ送信
$("#messageInput").on("keypress", function (event) {
if (event.which == 13) {
// Enterキーの処理
$("#messageSend").click();
}
});
$("#tabDM").on("click", function (e) {
CHAT_UI.refreshRoomList(ChatRoomType.DM);
});
$("#tabGroup").on("click", function (e) {
CHAT_UI.refreshRoomList(ChatRoomType.GROUP);
});
$("#tabAllGroup").on("click", function (e) {
CHAT_UI.refreshAllGroupSearch("0");
});
$("#tabMyGroup").on("click", function (e) {
$("#contactSearch").attr("placeholder", getLocalizedString("userSearch"));
CHAT_UI.refreshContactScreen();
});
$("#tabMyGroupOnMakeRoom").on("click", function (e) {
CHAT_UI.refreshMyGroupForMakeRoom();
});
$("#tabAllGroupOnMakeRoom").on("click", function (e) {
CHAT_UI.refreshAllGroupForMakeRoom("0");
});
$("#tabMyGroupOnAddUser").on("click", function (e) {
CHAT_UI.refreshMyGroupForAddUser();
});
$("#tabAllGroupOnAddUser").on("click", function (e) {
CHAT_UI.refreshAllGroupForAddUser("0");
});
$("#tabMyGroupOnAddUserInCollaboration").on("click", function (e) {
CHAT_UI.refreshMyGroupForAddUserInCollaboration();
});
$("#tabAllGroupOnAddUserInCollaboration").on("click", function (e) {
CHAT_UI.refreshAllGroupForAddUserInCollaboration("0");
});
$("#makeRoomConfirmBtn").on("click", function (e) {
const selectedUserList = CHAT.globalSelectedUserList.join(",");
NativeBridgeDelegate.saveSelectedUserList(selectedUserList);
$("#makeRoomForm").submit();
});
$("#addUserConfirmBtn").on("click", function (e) {
const selectedUserList = CHAT.globalSelectedUserList.join(",");
NativeBridgeDelegate.saveSelectedUserList(selectedUserList);
$("#addUserForm").submit();
});
CHAT_UI.startCollaboration = function (collaborationType) {
if (deviceInfo.isAndroid()) {
if (
collaborationType == COLLABORATION_TYPE.DOCUMENT &&
androidVersion < ANDROID_SDK_VERSION.O
) {
alert(getLocalizedString("not_support_version"));
return;
}
}
if ($(".collabo_area.start").length != 0) {
if (!confirm(getLocalizedString("already_exist_collaboration"))) {
CHAT_UI.dismissLoadingIndicator();
return;
}
const sendData = DATA_MESSAGE_SCHEME + FINISH_ALL_COLLABORATION_SIGNAL;
CHAT_SOCKET.emitCreateMessage(sendData, 0);
NativeBridgeDelegate.finishAllCollaboration();
}
NativeBridgeDelegate.startCollaboration(collaborationType);
};
CHAT_UI.refreshJoinedCollaboration = function (loginIdList) {
for (var count = 0; count < loginIdList.length; count++) {
loginIdList[count] = loginIdList[count].replaceAll(
globalUserInfo.shopName + "_",
""
);
}
CHAT_UI.showLoadingIndicator();
$("#collaboration_overlay_user_list").html("");
var joinedUserListTemplate;
$.get(
{ url: "./collaboration_overlay_user_list.html", async: false },
function (text) {
joinedUserListTemplate = text;
}
);
var joinedUserList = NativeBridgeDataSource.getUserListByLoginId(loginIdList);
var sortedUserList = new Array();
loginIdList.forEach(function (userId) {
joinedUserList.forEach(function (user) {
if (userId == user.loginId) {
sortedUserList.push(user);
}
});
});
sortedUserList.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(joinedUserListTemplate, {
joinedUserList: sortedUserList,
});
let obj = jQuery.parseHTML(html);
$("#collaboration_overlay_user_list").append(obj);
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.refreshMyGroupForAddUserInCollaboration = function () {
if (CHAT.globalSelectedUserList.length > 0) {
$(".select_member_num").text(CHAT.globalSelectedUserList.length);
} else {
$(".select_member_num").text("0");
}
$("#favoriteListForAddUserInCollaboration").html("");
$("#myGroupListForAddUserInCollaboration").html("");
$("#tabMyGroupOnAddUserInCollaboration").prop("checked", true);
// グループの様式を読み込む
var groupTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_LIST_IN_COLLABORATION
);
// ユーザの様式を読み込む
var userTemplate = getTemplate(
TemplateURL.ADD_USER_USER_LIST_IN_COLLABORATION
);
var groupUserTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_USER_LIST_IN_COLLABORATION
);
NativeBridgeDelegate.updateContactInfo();
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteListForAddUserInCollaboration").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsersNotInRoom();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = CHAT.getProfileImgUrl(favoriteUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == favoriteUser.shopMemberId;
});
if (findObj) {
favoriteUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteListForAddUserInCollaboration").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsersNotInRoom();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupListForAddUserInCollaboration").append(obj);
});
$("#addUserInCollaboration").modal("show");
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.refreshAllGroupForAddUserInCollaboration = function (paramGroupId) {
var groupId = paramGroupId;
$(".content").removeClass("none");
$("#tabAllGroupOnAddUserInCollaboration").prop("checked", true);
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#parentGroupBtnForAddUserInCollaboration").off();
$("#rootGroupBtnForAddUserInCollaboration").off();
$("#childGroupListAreaForAddUserInCollaboration").html("");
$("#userInGroupListForAddUserInCollaboration").html("");
$("#groupPathAreaForAddUserInCollaboration").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfoForAddUser(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtnForAddUserInCollaboration").on("click", function () {
CHAT_UI.refreshAllGroupForAddUserInCollaboration(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtnForAddUserInCollaboration").on("click", function () {
CHAT_UI.refreshAllGroupForAddUserInCollaboration(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupAreaInCollaboration").addClass("none");
$("#parentGroupAreaInCollaboration").addClass("none");
} else {
$("#rootGroupAreaInCollaboration").removeClass("none");
$("#parentGroupAreaInCollaboration").removeClass("none");
}
//該当グループのパースを表示。
var groupPathTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_PATH_IN_COLLABORATION
);
var groupPathCount = 0;
result.groupPathList.forEach(function (groupPath) {
if (!(groupPathCount < result.groupPathList.length - 3)) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathAreaForAddUserInCollaboration").append(obj);
}
groupPathCount++;
});
//該当グループの下位グループ表示。
var groupTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_LIST_IN_COLLABORATION
);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListAreaForAddUserInCollaboration").append(obj);
});
//該当グループの所属ユーザを表示。
var userTemplate = getTemplate(
TemplateURL.ADD_USER_USER_LIST_IN_COLLABORATION
);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupListForAddUserInCollaboration").append(obj);
};
CHAT_UI.makeNameCardInCollaboration = function (shopMemberId) {
if (currentUserInfo.shopMemberId == shopMemberId) {
return;
}
var nameCardInfo = NativeBridgeDataSource.getNameCardData(shopMemberId);
var namecardTemplate;
var changeHostTemplate;
$.get({ url: "./modal_collabo_profile.html", async: false }, function (text) {
namecardTemplate = text;
});
let isCollaborationHost = coview_api.getRoomUsers();
nameCardInfo.profileUrl = CHAT.getProfileImgUrl(nameCardInfo.profileUrl);
let whosHost = $("#collaboration_user_" + nameCardInfo.loginId).hasClass(
"host"
);
let namecardHtml = Mustache.render(namecardTemplate, {
shopMemberId: nameCardInfo.shopMemberId,
profileUrl: nameCardInfo.profileUrl,
loginId: nameCardInfo.loginId,
name: nameCardInfo.shopMemberName,
groupPathList: nameCardInfo.groupPathList,
isFavorite: nameCardInfo.isFavorite,
isHost: isCollaborationHost,
whosHost: whosHost,
});
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on(
"click",
function () {}
);
$("#userProfileModalInCollaboration").html(namecardObj);
$("#userNameCardInCollaboration").modal("show");
};
CHAT_UI.removeFavoriteUserInCollaboration = function (shopMemberId) {
CHAT_UI.showLoadingIndicator();
$("#userNameCardInCollaboration").modal("hide");
NativeBridgeDataSource.removeFavoriteUser(shopMemberId);
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.insertFavoriteUserInCollaboration = function (shopMemberId) {
$("#userNameCardInCollaboration").modal("hide");
NativeBridgeDataSource.addFavoriteUser(shopMemberId);
CHAT_UI.dismissLoadingIndicator();
};
// 名前空間
var CHAT_UI = {};
includeJs("./js/chat-ui-clickEvents.js");
includeJs("./js/chat-ui-collaboration.js");
// Rotate
$(window).on("resize", function () {
if (deviceInfo.isMobile()) {
return;
}
console.log(`width : ${$(this).width()}` + `height : ${$(this).height()}`);
if (deviceInfo.isiOS()) {
if (isLandscape == true) {
$(".mesgs").addClass("landscape_mesgs");
} else if (isLandscape == false) {
$(".mesgs").removeClass("landscape_mesgs");
}
}
});
//上にスクロールすると新しいメッセージを呼ぶ処理。
$("#messages").scroll(function () {
if ($(this).scrollTop() === 0) {
if (!$("#chatLoader").is(":visible")) {
// 現在、メッセージの個数以前をメッセージを読み込む
// ローディングアイコンを追加する
let loader = $(
'<div id="chatLoader" class="text-center"><div class="spinner-grow spinner-grow-sm" role="status" /></div>'
);
$("#messages").prepend(loader);
loader.remove();
}
}
});
// 端末の向きを記録(キーボード出現時にLandscapeModeと判定する対策)
var isLandscape;
CHAT_UI.setOrientation = function (isLandscapeMode) {
if (isLandscapeMode == "false") {
$(".mesgs").removeClass("landscape_mesgs");
isLandscape = false;
} else {
$(".mesgs").addClass("landscape_mesgs");
isLandscape = true;
}
};
CHAT_UI.sendMessage = function (e) {
const messageTextBox = $("#messageInput");
const message =
messageTextBox.val().length > 0
? encodeURIComponent(messageTextBox.val())
: "";
messageTextBox.val("");
if (message.length > 0) {
const sendData = message + messageSeperator + MessageType.TEXT;
CHAT_SOCKET.emitCreateMessage(sendData, 0);
}
$(".message_input_form").focus();
};
CHAT_UI.scrollToBottom = function () {
const messages = $(".room_contents");
const scrollHeight = messages.prop("scrollHeight");
//messages.scrollTop(scrollHeight);
$("html, body").animate(
{
scrollTop: scrollHeight,
},
100
);
};
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator = function () {
var h = $(window).height();
$("#loader-bg ,#loader").height(h).css("display", "block");
};
//loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator = function () {
var h = $(window).height();
$("#loader-bg ,#loader").height(h).css("display", "none");
};
//画面の方向をcheck
CHAT_UI.isLandscapeMode = function () {
if (deviceInfo.isMobile()) {
return false;
}
return $(window).width() > $(window).height();
};
CHAT_UI.htmlElementTextInitialize = function () {
$("#newRoomName").attr("placeholder", getLocalizedString("newRoomName"));
$(".ttl_detail").text(getLocalizedString("detail"));
$("#archiveFileName").text(getLocalizedString("archiveFileName"));
$("#archiveInsertDate").text(getLocalizedString("archiveInsertDate"));
$("#archiveRoomName").text(getLocalizedString("archiveRoomName"));
$("#archiveSaveUser").text(getLocalizedString("archiveSaveUser"));
$("#archiveAttendUser").text(getLocalizedString("archiveAttendUser"));
};
// 画像の読み込みが全て終わったタイミングでコールバック実行
// FIXME 追加読み込みの場合は差分の画像のみ監視すべきだが、現状新規入室時にしか対応出来ていない。
CHAT_UI.waitForLoadingVideo = function (div, callback) {
CHAT_UI.showLoadingIndicator();
// var imgs = document.getElementsByTagName("video");
var video = div.find("video");
var count = video.length;
if (count == 0) callback();
var loaded = 0;
video.each(function () {
this.addEventListener("loadeddata", function (e) {
loaded++;
if (loaded === count) {
callback();
CHAT_UI.dismissLoadingIndicator();
}
});
});
};
CHAT_UI.waitForLoadingImage = function (div, callback) {
var imgs = div.find("img");
var count = imgs.length;
if (count == 0) callback();
var loaded = 0;
imgs
.one("load", function (e) {
// イメージが読み込まれた
loaded++;
if (loaded === count) {
callback();
}
})
.each(function () {
if (this.complete || this.readyState === readyState.COMPLETED) {
$(this).trigger("load");
}
});
};
CHAT_UI.refreshContactScreen = function () {
CHAT_UI.showLoadingIndicator();
$("#userNameCard").modal("hide");
$("#favoriteList").html("");
$("#myGroupList").html("");
//画面タイトル設定
let contactListTitle = getLocalizedString("contactListTitle");
$("#title").text(contactListTitle);
// グループの様式を読み込む
const groupTemplate = getTemplate(TemplateURL.GROUP_LIST);
// ユーザの様式を読み込む
var userTemplate = getTemplate(TemplateURL.USER_LIST);
var myNamecardTemplate = getTemplate(TemplateURL.MY_NAME_CARD);
var groupUserTemplate = getTemplate(TemplateURL.GROUP_USER_LIST);
NativeBridgeDelegate.updateContactInfo();
var myInfo = NativeBridgeDataSource.getMyInfo();
myInfo.profileImagePath = CHAT.getProfileImgUrl(myInfo.profileUrl);
let myNamecardHtml = Mustache.render(myNamecardTemplate, {
loginId: myInfo.shopMemberId,
profileImage: myInfo.profileImagePath,
name: myInfo.shopMemberName,
groupPathList: myInfo.groupPathList,
});
let myNamecardObj = $(jQuery.parseHTML(myNamecardHtml)).on(
"click",
function () {}
);
$("#myProfileModal").html(myNamecardObj);
$("#myName").text(myInfo.shopMemberName);
$("#myImg").attr("src", myInfo.profileImagePath);
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
isFavorite: true,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteList").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsers();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = CHAT.getProfileImgUrl(favoriteUser.profileUrl);
favoriteUser.isFavorite = true;
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteList").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsers();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupList").append(obj);
});
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.refreshRoomList = function (roomType) {
if (serverInfo.isOnline == "true") {
CHAT_UI.refreshForOnline();
} else {
CHAT_UI.refreshForOffline();
}
const beforeRoomType = NativeBridgeDataSource.getBeforeRoomType();
if (beforeRoomType != null) {
roomType = beforeRoomType;
NativeBridgeDelegate.clearBeforeRoomType();
}
CHAT_UI.showLoadingIndicator();
if (roomType == ChatRoomType.DM) {
$("#tabDM").prop("checked", true);
} else {
$("#tabGroup").prop("checked", true);
}
if (serverInfo.isOnline == "true") {
NativeBridgeDelegate.updateRoomList();
}
var rooms = NativeBridgeDataSource.getRoomList(roomType, null);
CHAT.globalIsInvite = false;
// #36146に対応
$("#groupChatList").empty();
$("#dmChatList").empty();
let roomListTitle = getLocalizedString("roomListTitle");
$("#chatTitle").text(roomListTitle);
if (rooms.length === 0) {
// 検索結果がない場合のメッセージを追加
let 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:
}
}
var template = getTemplate(TemplateURL.ROOM_LIST);
rooms.forEach(function (room) {
room.profileImagePath = "./images/user-profile.png";
if (room.message) {
room.message = room.message.toString();
} else {
room.message = getLocalizedString("noMessages");
}
var displayMsg;
//TODO 協業の場合処理追加必要
switch (room.messageType) {
case MessageType.TEXT:
displayMsg = room.message;
break;
case MessageType.IMAGE:
displayMsg = getLocalizedString("image");
break;
case MessageType.VIDEO:
displayMsg = getLocalizedString("video");
break;
case MessageType.COMMUNICATIONSTART:
displayMsg = getLocalizedString("collaboration_start");
break;
case MessageType.COMMUNICATIONEND:
displayMsg = getLocalizedString("collaboration_end");
break;
default:
break;
}
var attendUserName = [];
room.attendUsers.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
attendUserName.push(user.shopMemberName);
});
var thumbnailCount =
room.attendUsers.length > 4 ? 4 : room.attendUsers.length;
if (room.chatRoomName == "") {
room.chatRoomName = attendUserName.join(", ");
}
var unreadMessageCount = room.unreadCount == 0 ? "" : room.unreadCount;
if (unreadMessageCount > 999) {
unreadMessageCount = "999+";
}
let html = Mustache.render(template, {
thumbnailCount: thumbnailCount,
roomName: room.chatRoomName,
roomId: room.chatRoomId,
profileImage: room.profileImagePath,
lastMessage: displayMsg,
time: room.insertDate
? CHAT_UTIL.formatDate(room.insertDate).createdAt
: "",
unreadMsgCnt: unreadMessageCount,
userCnt: room.attendUsers.length + 1,
attendUsers: room.attendUsers,
});
// Click event
let obj = $(jQuery.parseHTML(html)).on("click", function () {
//TODO ルームに入る処理追加必要
});
// ルームグループごとに追加。
switch (roomType) {
case ChatRoomType.GROUP:
$("#groupChatList").append(obj);
break;
case ChatRoomType.DM:
$("#dmChatList").append(obj);
break;
default:
}
});
console.log("DONE");
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.loadMessages = function (roomId, joinRoomName) {
roomName = joinRoomName;
if (serverInfo.isOnline == "true") {
CHAT_UI.refreshForOnline();
NativeBridgeDelegate.updateMessages(roomId);
} else {
CHAT_UI.refreshForOffline();
}
const roomType = NativeBridgeDataSource.getRoomType();
if (roomType == ChatRoomType.DM) {
$("#roomMenu").removeClass("none");
}
var messages = NativeBridgeDataSource.getMessages(roomId);
var usersInRoom = NativeBridgeDataSource.getUsersInRoom(roomId);
$("#roomTitle").text(roomName).data("roomName", roomName);
let jQueryMessages = $("#messages");
// スクロールの変化を防ぐため以前画面の高さを保存する
let beforeHeight = jQueryMessages.prop("scrollHeight");
var userTemplate = getTemplate(TemplateURL.USER_LIST);
var topUserListTemplate = getTemplate(TemplateURL.CHATROOM_USER_LIST);
var filterUserListTemplate = getTemplate(
TemplateURL.CHATROOM_USER_FILTER_LIST
);
usersInRoom.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(topUserListTemplate, {
userList: usersInRoom,
});
let obj = jQuery.parseHTML(html);
$("#user_list").append(obj);
let filterHtml = Mustache.render(filterUserListTemplate, {
userList: usersInRoom,
});
let filterObj = jQuery.parseHTML(filterHtml);
$("#filter").append(filterObj);
CHAT_UI.prependMessage(messages);
CHAT_UI.waitForLoadingImage(jQueryMessages, CHAT_UI.scrollToBottom);
CHAT_UI.waitForLoadingVideo(jQueryMessages, CHAT_UI.scrollToBottom);
if (deviceInfo.isiOS()) {
$(window).on("load", function () {
CHAT_UI.scrollToBottom();
});
}
};
CHAT_UI.prependMessage = function (messages) {
var now = new Date();
let jQueryMessages = $("#messages");
// スクロールの変化を防ぐため以前画面の高さを保存する
let beforeHeight = jQueryMessages.prop("scrollHeight");
// メッセージ文字列の生成
let workVal = "";
var userTemplate = getTemplate(TemplateURL.USER_LIST);
var userMessageTemplate = getTemplate(TemplateURL.USER_MESSAGE);
var myMessageTemplate = getTemplate(TemplateURL.MY_MESSAGE);
var systemMessageTemplate = getTemplate(TemplateURL.SYSTEM_MESSAGE);
var openCollaborationMessageTemplate = getTemplate(
TemplateURL.OPEN_COLLABORATION_MESSAGE
);
var checkBeforeDate = "";
var beforeDate = "";
messages.forEach(function (message) {
let template = userMessageTemplate;
if (message.shopMemberId == currentUserInfo.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == MessageType.SYSTEM) {
template = systemMessageTemplate;
}
if (
message.messageType == MessageType.COMMUNICATIONSTART ||
message.messageType == MessageType.COMMUNICATIONEND
) {
template = openCollaborationMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
// ユーザの様式を読み込む
if (message.profileUrl) {
message.profileUrl = CHAT.getProfileImgUrl(message.profileUrl);
} else {
message.profileUrl = CHAT.getProfileImgUrl("");
}
// #36147
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll(
"?fileName=",
"?sid=" + currentUserInfo.sid + "&fileName="
);
message.message = replacePath;
/* if (message.message contain) {
}*/
var isOtherYear = false;
var isToday = false;
if (messageTime.createdAt.includes(":")) {
isToday = true;
}
if (now.getFullYear() != message.insertDate.substring(0, 4)) {
isOtherYear = true;
}
if (messageTime.createdAtDay != checkBeforeDate && checkBeforeDate != "") {
let messageDay = CHAT_UTIL.systemDay(beforeDate);
let html = Mustache.render(systemMessageTemplate, {
year: messageDay.year + getLocalizedString("year"),
month: messageDay.month + getLocalizedString("month"),
day: messageDay.day + getLocalizedString("day"),
dow: CHAT_UTIL.findDow(messageDay.dow),
});
workVal = html + workVal;
}
checkBeforeDate = messageTime.createdAtDay;
beforeDate = message.insertDate;
if (
message.messageType == MessageType.COMMUNICATIONSTART ||
message.messageType == MessageType.COMMUNICATIONEND
) {
const collaborationInfo = JSON.parse(message.message);
const userInCollaboration = JSON.parse(
NativeBridgeDataSource.getUserInfoList(collaborationInfo.userList)
);
var meetingId = 0;
if (typeof collaborationInfo.meetingId != "undefined") {
meetingId = collaborationInfo.meetingId;
}
userInCollaboration.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(template, {
messageId: message.messageId,
roomName: roomName,
userCount: userInCollaboration.length,
userList:
userInCollaboration.length > 3
? userInCollaboration.slice(0, 3)
: userInCollaboration,
insertDate: message.insertDate,
collaborationType: collaborationInfo.collaborationType,
meetingId: meetingId,
isToday: isToday,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
createdAtYear:
message.insertDate.substring(0, 4) + getLocalizedString("year") + " ",
isOtherYear: isOtherYear,
isEnded:
message.messageType == MessageType.COMMUNICATIONEND ? true : false,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
} else {
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
messageId: message.messageId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
createdAtYear:
message.insertDate.substring(0, 4) + getLocalizedString("year") + " ",
unreadCount: message.unreadCount,
isOtherYear: isOtherYear,
isToday: isToday,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
}
});
// メッセージの画面描画
jQueryMessages.prepend(workVal);
};
CHAT_UI.favoriteUserChange = function (shopMemberId, star) {
if ($(star).hasClass("active")) {
CHAT_UI.removeFavoriteUser(shopMemberId);
} else if ($(star).hasClass("disable")) {
CHAT_UI.insertFavoriteUser(shopMemberId);
}
};
CHAT_UI.favoriteGroupChange = function (groupId, star) {
if ($(star).hasClass("active")) {
CHAT_UI.removeFavoriteGroup(groupId);
} else if ($(star).hasClass("disable")) {
CHAT_UI.insertFavoriteGroup(groupId);
}
};
CHAT_UI.removeFavoriteUser = function (shopMemberId) {
CHAT_UI.showLoadingIndicator();
$("#userNameCard").modal("hide");
$("#myNameCard").modal("hide");
const result = NativeBridgeDataSource.removeFavoriteUser(shopMemberId);
if (result) {
$(".shopmember_" + shopMemberId).removeClass("active");
$(".shopmember_" + shopMemberId).addClass("disable");
} else {
$(".shopmember_" + shopMemberId).addClass("active");
$(".shopmember_" + shopMemberId).removeClass("disable");
}
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.insertFavoriteUser = function (shopMemberId) {
$("#userNameCard").modal("hide");
$("#myNameCard").modal("hide");
const result = NativeBridgeDataSource.addFavoriteUser(shopMemberId);
if (result) {
$(".shopmember_" + shopMemberId).removeClass("disable");
$(".shopmember_" + shopMemberId).addClass("active");
} else {
$(".shopmember_" + shopMemberId).addClass("disable");
$(".shopmember_" + shopMemberId).removeClass("active");
}
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.removeFavoriteGroup = function (groupId) {
CHAT_UI.showLoadingIndicator();
var result = NativeBridgeDataSource.removeFavoriteGroup(groupId);
if (result) {
$(".group_" + groupId).removeClass("active");
$(".group_" + groupId).addClass("disable");
} else {
$(".group_" + groupId).addClass("active");
$(".group_" + groupId).removeClass("disable");
}
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.insertFavoriteGroup = function (groupId) {
CHAT_UI.showLoadingIndicator();
const result = NativeBridgeDataSource.addFavoriteGroup(groupID);
if (result) {
$(".group_" + groupId).removeClass("disable");
$(".group_" + groupId).addClass("active");
} else {
$(".group_" + groupId).addClass("disable");
$(".group_" + groupId).removeClass("active");
}
CHAT_UI.dismissLoadingIndicator();
};
//全グループ検索画面表示。
CHAT_UI.refreshAllGroupSearch = function (paramGroupId) {
var groupId = paramGroupId;
if (window.location.pathname.includes("chat_room")) {
if (groupId == "") return;
NativeBridgeDelegate.setToMoveGroupId(groupId);
window.location.href = "contact.html";
}
CHAT_UI.showLoadingIndicator();
$("#userNameCard").modal("hide");
$(".cancel").addClass("none");
$(".search_form input").removeClass("focus");
$(".search_form input").val("");
$(".search_form form").removeClass();
$(".content").removeClass("none");
$(".overlay_src_msg").empty();
$("#contactSearch").attr(
"placeholder",
getLocalizedString("searchUserAndGroup")
);
$("#tabAllGroup").prop("checked", true);
//オンライン状態であればサーバから情報更新。
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#rootGroupBtn").off();
$("#parentGroupBtn").off();
$("#childGroupListArea").html("");
$("#userInGroupList").html("");
$("#groupPathArea").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfo(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtn").on("click", function () {
CHAT_UI.refreshAllGroupSearch(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtn").on("click", function () {
CHAT_UI.refreshAllGroupSearch(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupArea").addClass("none");
$("#parentGroupArea").addClass("none");
} else {
$("#rootGroupArea").removeClass("none");
$("#parentGroupArea").removeClass("none");
}
//該当グループのパースを表示。
const groupPathTemplate = getTemplate(TemplateURL.GROUP_PATH);
result.groupPathList.forEach(function (groupPath) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathArea").append(obj);
});
//該当グループの下位グループ表示。
const groupTemplate = getTemplate(TemplateURL.GROUP_LIST);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
isFavorite: childGroup.isFavorite,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListArea").append(obj);
});
//該当グループの所属ユーザを表示。
const userTemplate = getTemplate(TemplateURL.USER_LIST);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupList").append(obj);
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.startChat = function (userShopMemberId, userName) {
CHAT_UI.showLoadingIndicator();
var userIdList = [];
userIdList.push(userShopMemberId);
// 参加ユーザ名でルーム名を生成
let newRoomName = currentUserInfo.loginId + "," + userName;
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
newRoomName,
MakeRoomFlag.NAME_CARD,
false
);
};
CHAT_UI.startVoice = function (userShopMemberId, userName) {
CHAT_UI.showLoadingIndicator();
var userIdList = [];
userIdList.push(userShopMemberId);
// 参加ユーザ名でルーム名を生成
let newRoomName = currentUserInfo.loginId + "," + userName;
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
newRoomName,
MakeRoomFlag.NAME_CARD,
true
);
};
CHAT_UI.makeNameCard = function (shopMemberId) {
if (currentUserInfo.shopMemberId == shopMemberId) {
return;
}
var nameCardInfo = NativeBridgeDataSource.getNameCardData(shopMemberId);
var namecardTemplate = getTemplate(TemplateURL.USER_NAME_CARD);
nameCardInfo.profileUrl = CHAT.getProfileImgUrl(nameCardInfo.profileUrl);
let namecardHtml = Mustache.render(namecardTemplate, {
shopMemberId: nameCardInfo.shopMemberId,
profileUrl: nameCardInfo.profileUrl,
name: nameCardInfo.shopMemberName,
groupPathList: nameCardInfo.groupPathList,
chat: getLocalizedString("chat"),
voice: getLocalizedString("voice"),
favorite: getLocalizedString("addFavorite"),
isFavorite: nameCardInfo.isFavorite,
});
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on(
"click",
function () {}
);
$("#userProfileModal").html(namecardObj);
$("#userNameCard").modal("show");
};
CHAT_UI.toggleCategory = function (category) {
$(category).toggleClass("open");
$(category).next().slideToggle();
};
// アーカイブ詳細
CHAT_UI.refreshArchiveDetailScreen = function (archiveId) {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
// 初期化
$("#archiveDetail").html("");
// アーカイブ詳細の様式を読み込む
const archiveDetailTemplate = $("#archive-detail-template").html();
if (serverInfo.isOnline == "true") {
NativeBridgeDelegate.updateArchiveDetail(archiveId);
}
// アーカイブ詳細取得
const archive = NativeBridgeDataSource.getArchiveDetail(archiveId);
// 保存ユーザ情報を取得
const userInfo = NativeBridgeDataSource.getUserInfo(archive.saveUserId);
userInfo.profileUrl = CHAT.getProfileImgUrl(userInfo.profileUrl);
// アーカイブ情報を表示
const html = Mustache.render(archiveDetailTemplate, {
fileName: archive.archiveName,
insertDate: archive.archiveDate,
chatRoomName: archive.roomName,
chatRoomId: archive.roomId,
profileImage: userInfo.profileUrl,
userName: userInfo.shopMemberName,
userId: userInfo.shopMemberId,
});
var obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#archiveDetail").append(obj);
// プレイヤーの切り替え
const archiveFilePath = CHAT.createGetDataUrl(
archive.filePath,
archive.roomId
);
switch (archive.archiveType) {
case "0": // 画像
case 0:
$("#archive_player").prepend(
'<img class="archive_player" src="' + archiveFilePath + '" />'
);
break;
case "1": // 動画
case 1:
if (deviceInfo.isiOS()) {
$("#archive_player").prepend(
'<video class="archive_player" controls autoplay muted playsinline controlsList="nodownload"><source src="' +
archiveFilePath +
'" type="video/mp4"><source src="' +
archiveFilePath +
'" type="video/ogv"><source src="' +
archiveFilePath +
'" type="video/webm"></video>'
);
} else {
$("#archive_player").prepend(
'<video class="archive_player" src=' +
archiveFilePath +
' controls autoplay muted playsinline controlsList="nodownload"></video>'
);
}
break;
case "2": // 音声
case 2:
if (deviceInfo.isiOS()) {
$("#archive_player").prepend(
'<audio class="archive_audio_player" controls controlsList="nodownload"><source src="' +
archiveFilePath +
'" type="audio/wav"><source src="' +
archiveFilePath +
'" type="audio/ogg"></audio>'
);
} else {
$("#archive_player").prepend(
'<audio class="archive_audio_player" src=' +
archiveFilePath +
' controls controlsList="nodownload"></audio>'
);
}
$("#archive_player").prepend(
'<img class="archive_player" src=' + "./img/capture.png" + " />"
);
break;
case "3": // 文書
case 3:
// リリースに文書とその他は含めないため今回は非表示
break;
default:
// リリースに文書とその他は含めないため今回は非表示
}
// ユーザの様式を読み込む
const archiveUserTemplate = $("#archive-user-template").html();
// 参加ユーザ情報を表示
let attendUserList = archive.attendUserIds;
if (typeof android != "undefined") {
// ios実装不要
attendUserList = JSON.parse(archive.attendUserIds);
}
attendUserList.forEach(function (user) {
if (user == "") {
return;
}
var userInfo = NativeBridgeDataSource.getUserInfo(user);
userInfo.profileUrl = CHAT.getProfileImgUrl(userInfo.profileUrl);
const html = Mustache.render(archiveUserTemplate, {
profileImage: userInfo.profileUrl,
userName: userInfo.shopMemberName,
});
const obj = $(jQuery.parseHTML(html)).on("click", function () {
// ネームカード表示
CHAT_UI.makeNameCard(user);
});
$("#attendUser").append(obj);
});
currentUserInfo.configureLanguage();
CHAT_UI.htmlElementTextInitialize();
// チャットルームへのリンク付け
document.getElementById("joinChatRoom").onclick = function () {
NativeBridgeDelegate.joinRoom(archive.roomId, archive.roomName);
};
// loadingIndicatorを非表示
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.refreshMyGroupForMakeRoom = function () {
$(".modal-backdrop").remove();
$("#favoriteListForMakeRoom").html("");
$("#myGroupListForMakeRoom").html("");
//画面タイトル設定
let contactListTitle = getLocalizedString("userSearch");
$("#title").text(contactListTitle);
// グループの様式を読み込む
var groupTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_LIST);
// ユーザの様式を読み込む
var userTemplate = getTemplate(TemplateURL.MAKE_ROOM_USER_LIST);
var groupUserTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_USER_LIST);
NativeBridgeDelegate.updateContactInfo();
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteListForMakeRoom").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsers();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = CHAT.getProfileImgUrl(favoriteUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == favoriteUser.shopMemberId;
});
if (findObj) {
favoriteUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteListForMakeRoom").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsers();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupListForMakeRoom").append(obj);
});
};
CHAT_UI.refreshAllGroupForMakeRoom = function (paramGroupId) {
var groupId = paramGroupId;
$(".cancel").addClass("none");
$(".search_form input").removeClass("focus");
$(".search_form input").val("");
$(".search_form form").removeClass();
$(".content").removeClass("none");
$(".overlay_src_msg").empty();
$("#tabAllGroupOnMakeRoom").prop("checked", true);
//オンライン状態であればサーバから情報更新。
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#parentGroupBtnForMakeRoom").off();
$("#rootGroupBtnForMakeRoom").off();
$("#childGroupListAreaForMakeRoom").html("");
$("#userInGroupListForMakeRoom").html("");
$("#groupPathAreaForMakeRoom").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfo(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtnForMakeRoom").on("click", function () {
CHAT_UI.refreshAllGroupForMakeRoom(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtnForMakeRoom").on("click", function () {
CHAT_UI.refreshAllGroupForMakeRoom(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupArea").addClass("none");
$("#parentGroupArea").addClass("none");
} else {
$("#rootGroupArea").removeClass("none");
$("#parentGroupArea").removeClass("none");
}
//該当グループのパースを表示。
var groupPathTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_PATH);
var groupPathCount = 0;
result.groupPathList.forEach(function (groupPath) {
if (!(groupPathCount < result.groupPathList.length - 3)) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathAreaForMakeRoom").append(obj);
}
groupPathCount++;
});
//該当グループの下位グループ表示。
var groupTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_LIST);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListAreaForMakeRoom").append(obj);
});
//該当グループの所属ユーザを表示。
var userTemplate = getTemplate(TemplateURL.MAKE_ROOM_USER_LIST);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupListForMakeRoom").append(obj);
};
CHAT_UI.checkForMakeChat = function (checkMemberId) {
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == checkMemberId;
});
if (findObj) {
// remove
CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function (
shopMemberId
) {
return checkMemberId != shopMemberId;
});
$(".checkbox" + checkMemberId)
.prop("checked", false)
.trigger("change");
} else {
// add
CHAT.globalSelectedUserList.push(checkMemberId);
$(".checkbox" + checkMemberId)
.prop("checked", true)
.trigger("change");
}
let cnt = CHAT.globalSelectedUserList.length;
if (CHAT.globalSelectedUserList.length > 0) {
$(".select_member_num").text(cnt);
} else {
$(".select_member_num").text("0");
}
};
// アーカイブ一覧
CHAT_UI.refreshArchiveScreen = function () {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
// 初期化
$("#archiveList").html("");
// アーカイブの様式を読み込む
const archiveTemplate = $("#archive-template").html();
// アーカイブ一覧取得
if (serverInfo.isOnline == "true") {
NativeBridgeDelegate.updateArchiveList();
}
// ローカルDBのデータを表示
var archiveList = NativeBridgeDataSource.getArchiveList();
if (typeof archiveList == "undefined") {
CHAT_UI.dismissLoadingIndicator();
return;
}
archiveList.forEach(function (archive) {
var typeImage = "";
switch (archive.archiveType) {
case 0: // 画像
typeImage = "icon/icon_collabo_picture.png";
break;
case 1: // 動画
typeImage = "icon/icon_collabo_videocam.png";
break;
case 2: // 音声
typeImage = "icon/icon_collabo_headset.png";
break;
case 3: // 文書
typeImage = "icon/icon_collabo_document.png";
break;
default:
// その他
typeImage = "";
}
let html = Mustache.render(archiveTemplate, {
archiveId: archive.archiveId,
fileName: archive.archiveName,
insertDate: archive.archiveDate,
typeImage: typeImage,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#archiveList").append(obj);
});
// loadingIndicatorを非表示
CHAT_UI.dismissLoadingIndicator();
};
CHAT_UI.showMakeRoomConfirmView = function () {
$("#selectedUserList").html("");
var userTemplate = getTemplate(TemplateURL.MAKE_ROOM_CONFIRM_USER_LIST);
var selectedUserList = NativeBridgeDataSource.loadSelectedUsers();
selectedUserList.forEach(function (user) {
let html = Mustache.render(userTemplate, {
id: user.shopMemberId,
profileImage: CHAT.getProfileImgUrl(user.profileUrl),
name: user.shopMemberName,
});
let obj = jQuery.parseHTML(html);
$("#selectedUserList").append(obj);
});
$("#makeRoomBtn")
.off()
.on("click", function () {
// #36130に対応
const trimmedRoomName = $("#newRoomName").val().trim();
if (trimmedRoomName.length == 0) {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let userIdList = new Array();
let userNameList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
userNameList.push(user.shopMemberName);
});
// 参加ユーザ名でルーム名を生成
let newRoomName =
currentUserInfo.loginId + "," + userNameList.join(",");
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
newRoomName,
MakeRoomFlag.MAKE_ROOM,
false
);
} else if (
trimmedRoomName.includes(";") ||
trimmedRoomName.includes("/") ||
trimmedRoomName.includes("?") ||
trimmedRoomName.includes(":") ||
trimmedRoomName.includes("@") ||
trimmedRoomName.includes("&") ||
trimmedRoomName.includes("=") ||
trimmedRoomName.includes("+") ||
trimmedRoomName.includes("$") ||
trimmedRoomName.includes(",") ||
trimmedRoomName.includes("-") ||
trimmedRoomName.includes("_") ||
trimmedRoomName.includes(".") ||
trimmedRoomName.includes("!") ||
trimmedRoomName.includes("~") ||
trimmedRoomName.includes("*") ||
trimmedRoomName.includes("'") ||
trimmedRoomName.includes("(") ||
trimmedRoomName.includes(")") ||
trimmedRoomName.includes("#") ||
trimmedRoomName.includes("\\") ||
trimmedRoomName.includes('"') ||
trimmedRoomName.includes("`")
) {
// #36147
// #36174
$("#customAlertTitle").text(getLocalizedString("invalidCharacter"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$("#customAlert")
.appendTo("body")
.modal({
backdrop: "static",
keyboard: false,
})
.on("click", "#customAlertOk", function (e) {});
} else if (trimmedRoomName.length > 20) {
// #36142
var inputText = $("#newRoomName").val().trim(); // #36142 文字列の前又は後の空白文字列を削除
// #36174
$("#customAlertTitle").text(getLocalizedString("nameTooLong"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$("#customAlert")
.appendTo("body")
.modal({
backdrop: "static",
keyboard: false,
})
.on("click", "#customAlertOk", function (e) {
$("#newRoomName").val(
inputText.substr(0, $("#newRoomName").prop("maxlength"))
);
});
} else {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let userIdList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
});
// TODO: check why here using trimmedroomname instead of encodedRoomName
// ルーム名のtrimmingした後、URIencodingを行う
const encodedRoomName = encodeURIComponent(trimmedRoomName);
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
trimmedRoomName,
MakeRoomFlag.MAKE_ROOM,
false
);
}
});
};
CHAT_UI.showAddUserConfirmView = function () {
$("#selectedUserList").html("");
var userTemplate = getTemplate(TemplateURL.ADD_USER_CONFIRM_USER_LIST);
var selectedUserList = NativeBridgeDataSource.loadSelectedUsers();
selectedUserList.forEach(function (user) {
let html = Mustache.render(userTemplate, {
id: user.shopMemberId,
profileImage: CHAT.getProfileImgUrl(user.profileUrl),
name: user.shopMemberName,
});
let obj = jQuery.parseHTML(html);
$("#selectedUserList").append(obj);
});
$("#addUserBtn")
.off()
.on("click", function () {
CHAT_UI.showLoadingIndicator();
let userIdList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
});
NativeBridgeDelegate.inviteUsers(userIdList.join(","));
});
};
CHAT_UI.refreshMyGroupForAddUser = function () {
$(".modal-backdrop").remove();
$("#favoriteListForMakeRoom").html("");
$("#myGroupListForMakeRoom").html("");
//画面タイトル設定
let contactListTitle = getLocalizedString("userSearch");
$("#title").text(contactListTitle);
// グループの様式を読み込む
var groupTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_LIST);
// ユーザの様式を読み込む
var userTemplate = getTemplate(TemplateURL.ADD_USER_USER_LIST);
var groupUserTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_USER_LIST);
NativeBridgeDelegate.updateContactInfo();
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteListForMakeRoom").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsersNotInRoom();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = CHAT.getProfileImgUrl(favoriteUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == favoriteUser.shopMemberId;
});
if (findObj) {
favoriteUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteListForMakeRoom").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsersNotInRoom();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupListForMakeRoom").append(obj);
});
};
CHAT_UI.refreshAllGroupForAddUser = function (paramGroupId) {
var groupId = paramGroupId;
$(".cancel").addClass("none");
$(".search_form input").removeClass("focus");
$(".search_form input").val("");
$(".search_form form").removeClass();
$(".content").removeClass("none");
$(".overlay_src_msg").empty();
$("#tabAllGroupOnAddUser").prop("checked", true);
//オンライン状態であればサーバから情報更新。
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#parentGroupBtnForAddUser").off();
$("#rootGroupBtnForAddUser").off();
$("#childGroupListAreaForAddUser").html("");
$("#userInGroupListForAddUser").html("");
$("#groupPathAreaForAddUser").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfoForAddUser(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtnForAddUser").on("click", function () {
CHAT_UI.refreshAllGroupForAddUser(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtnForAddUser").on("click", function () {
CHAT_UI.refreshAllGroupForAddUser(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupArea").addClass("none");
$("#parentGroupArea").addClass("none");
} else {
$("#rootGroupArea").removeClass("none");
$("#parentGroupArea").removeClass("none");
}
//該当グループのパースを表示。
var groupPathTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_PATH);
var groupPathCount = 0;
result.groupPathList.forEach(function (groupPath) {
if (!(groupPathCount < result.groupPathList.length - 3)) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathAreaForAddUser").append(obj);
}
groupPathCount++;
});
//該当グループの下位グループ表示。
var groupTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_LIST);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListAreaForAddUser").append(obj);
});
//該当グループの所属ユーザを表示。
const userTemplate = getTemplate(TemplateURL.ADD_USER_USER_LIST);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupListForAddUser").append(obj);
};
CHAT_UI.refreshForOnline = function () {
serverInfo.isOnline = "true";
$(".craeteRoomButton").off("click", CHAT_UI.offlineHandler);
$(".craeteRoomButton").css("opacity", "1.0");
$(".footer_item a").removeClass("ui-state-disabled");
$("#videoUploadButton").removeClass("ui-state-disabled");
$("#imageInputButton").removeClass("ui-state-disabled");
$("#messageSend").prop("disabled", false);
$("#messageInput").prop("disabled", false);
$("#messageInput").prop("placeholder", "メッセージを入力してください");
$("#favoriteButton").prop("disabled", false);
$("#room_name_change_button").removeClass("ui-state-disabled");
$("#add_user_button").removeClass("ui-state-disabled");
$(".fa-download").show();
if (typeof $("#roomTitle").val() != "undefined") {
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
}
};
CHAT_UI.refreshForOffline = function () {
serverInfo.isOnline = "false";
$(".craeteRoomButton").on("click", CHAT_UI.offlineHandler);
$(".craeteRoomButton").css("opacity", "0.3");
$(".footer_item a").addClass("ui-state-disabled");
$("#videoUploadButton").addClass("ui-state-disabled");
$("#imageInputButton").addClass("ui-state-disabled");
$("#messageSend").prop("disabled", true);
$("#messageInput").prop("disabled", true);
$("#messageInput").prop("placeholder", "");
$("#favoriteButton").prop("disabled", true);
$("#room_name_change_button").addClass("ui-state-disabled");
$("#add_user_button").addClass("ui-state-disabled");
$(".fa-download").hide();
if (typeof coview_api == "undefined") {
return;
}
var alertString = "";
if (g_isMainMan) {
alertString = getLocalizedString("err_weak_network_exit_collaboration");
} else {
alertString = getLocalizedString("err_weak_network_exit_collaboration");
}
alert(alertString);
NativeBridgeDelegate.finishCollaboration();
if (collaborationJoinFlg != "2") {
NativeBridgeDelegate.joinRoom(roomInfo.roomID, roomInfo.name);
} else {
NativeBridgeDelegate.openCommunicationHome();
}
};
CHAT_UI.offlineHandler = function (e) {
e.preventDefault();
};
// for android call
CHAT_UI.displayExistRoom = function (roomId) {
if (confirm("error_already_exist_same_user")) {
NativeBridgeDelegate.joinRoom(roomId);
}
return;
};
// 名前空間
var CHAT = {};
//招待するメンバーを保存する変数
CHAT.globalSelectedUserList = new Array();
CHAT.globalIsInvite = false;
var beforeHeight = window.innerHeight;
var beforeWidth = window.innerWidth;
var beforeScroll;
CHAT.saveRoomInfo = function (roomID, roomName) {
roomInfo.roomID = roomID;
roomInfo.roomName = roomName;
NativeBridgeDelegate.saveVisitRoomInfo(roomID, roomName);
};
// #36170 画像パスが存在しない場合はデフォルトの画像を返す
// 存在する場合はプロフィール画像取得用APIのURLを生成して返す
CHAT.getProfileImgUrl = function (path) {
if (path == undefined || path == "") {
return "./img/noImage.png";
} else {
if (path.includes("/mnt")) {
var userInfo = path.split("/").reverse();
return (
serverInfo.cmsURL +
"/chatapi/user?profileFileName=" +
userInfo[0] +
"&profileGetLoginId=" +
userInfo[1] +
"&sid=" +
currentUserInfo.sid +
"&cmd=12"
);
} else {
return path;
}
}
};
// Video のサムネイルファイル生成する
CHAT.createVideoThumbnailAndUpload = function (sourceImage, callback) {
var fileReader = new FileReader();
fileReader.onload = function () {
var blob = new Blob([fileReader.result], { type: sourceImage.type });
var url = URL.createObjectURL(blob);
var video = document.createElement("video");
var timeupdate = function () {
if (snapImage()) {
video.removeEventListener("timeupdate", timeupdate);
video.pause();
}
};
video.addEventListener("loadeddata", function () {
if (snapImage()) {
video.removeEventListener("timeupdate", timeupdate);
}
});
var snapImage = function () {
var canvas = document.createElement("canvas");
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
canvas
.getContext("2d")
.drawImage(video, 0, 0, canvas.width, canvas.height);
fetch(canvas.toDataURL("image/jpeg"))
.then(function (res) {
return res.arrayBuffer();
})
.then(function (buf) {
// 回転された画像をFormDataに保存
const newFile = new File([buf], sourceImage.name, {
type: "image/jpeg",
});
callback(newFile, true);
// ajax End
})
.catch((error) => {
// fetch Error catch Block
if (error) {
console.log(error);
}
});
return true;
};
video.addEventListener("timeupdate", timeupdate);
video.preload = "metadata";
video.src = url;
// Load video in Safari / IE11
video.muted = true;
video.playsInline = true;
video.pause();
};
fileReader.readAsArrayBuffer(sourceImage);
};
// Ajaxでイメージをアップロードする
CHAT.uploadImage = function (formData) {
formData.append("roomId", roomInfo.roomID);
formData.append("sid", currentUserInfo.sid);
jQuery
.ajax({
async: true,
url: serverInfo.cmsURL + "/chatapi/file/upload",
type: "post",
data: formData,
contentType: false,
processData: false,
error: function () {
alert("読み込み失敗");
CHAT_UI.dismissLoadingIndicator();
},
})
.done(function (res) {
var imgPath =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.fileName +
"&roomId=" +
roomInfo.roomID;
var imageName = res.fileName;
// uploadFileの判断
var extension = imageName
.substr(imageName.lastIndexOf(".") + 1)
.toLowerCase();
// 画像の処理
if (
res.fileType == "jpeg" ||
res.fileType == "jpg" ||
res.fileType == "png"
) {
if (res.thumbnailPath && res.thumbnailPath.length > 0) {
imgPath =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.thumbImageFileName +
"&roomId=" +
roomInfo.roomID;
imageName = res.thumbImageFileName;
}
let downloadPath =
serverInfo.cmsURL +
"/chatapi/file/download?fileName=" +
imageName +
"&roomId=" +
roomInfo.roomID;
// アップロードが終了した後ローディング画面から離れてメッセージをメッセージを転送する
const lightbox = $("<a/>", {
"data-lightbox": "attachedImages",
"data-title": imageName,
});
const image = $("<img/>", {
src: imgPath,
width: "auto",
style: "max-width:100%",
"data-toggle": "modal",
onclick: "imageModal(this);",
});
const downloadIcon = $("<a/>", {
href: downloadPath,
class: "fa fa-download",
download: res.fileName,
});
lightbox.append(image);
lightbox.append(downloadIcon);
let text = lightbox.prop("outerHTML");
let encodedText;
try {
encodedText = encodeURIComponent(text);
} catch (e) {
encodedText = text;
}
const sendData = encodedText + messageSeperator + MessageType.IMAGE;
CHAT_SOCKET.emitCreateMessage(sendData, 1);
} else {
// 動画の処理
if (res.thumbnailPath && res.thumbnailPath.length > 0) {
imgPath =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.thumbImageFileName +
"&roomId=" +
roomInfo.roomID;
}
let downloadPath =
serverInfo.cmsURL +
"/chatapi/file/download?fileName=" +
imageName +
"&roomId=" +
roomInfo.roomID;
var videoSrc =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.fileName +
"&roomId=" +
roomInfo.roomID;
const totalDiv = $("<div/>", { id: "attachedImages" });
const videoTag = $("<video/>", {
controls: "true",
width: "auto",
style: "max-width:100%",
});
const source = $("<source/>", { src: videoSrc });
const downloadIcon = $("<a/>", {
href: downloadPath,
class: "fa fa-download",
download: res.fileName,
});
videoTag.append(source);
totalDiv.append(videoTag);
totalDiv.append(downloadIcon);
let text = totalDiv.prop("outerHTML");
let encodedText;
try {
encodedText = encodeURIComponent(text);
} catch (e) {
encodedText = text;
}
const sendData = encodedText + messageSeperator + MessageType.VIDEO;
CHAT_SOCKET.emitCreateMessage(sendData, 1);
}
$(".overlay").removeClass("active undismissable");
$(".loader").removeClass("active");
CHAT_UI.dismissLoadingIndicator();
});
};
CHAT.createGetDataUrl = function (fileName, roomId) {
var filePath =
serverInfo.cmsURL +
"/chatapi/file/getImage?sid=" +
currentUserInfo.sid +
"&fileName=" +
fileName +
"&roomId=" +
roomId;
return filePath;
};
// Thumbnailのファイルを生成する。
CHAT.createThumbnailAndUpload = function (sourceImage, callback) {
const fileReader = new FileReader();
const img = new Image();
fileReader.onloadend = function () {
img.src = fileReader.result;
};
img.onload = function () {
const elem = document.createElement("canvas");
var rate;
var width = img.width;
var height = img.height;
if (img.width <= 500 && img.height <= 500) {
callback(undefined, false);
return;
}
if (img.width > img.height) {
rate = 500 / img.width;
} else {
rate = 500 / img.height;
}
elem.width = width * rate;
elem.height = height * rate;
const ctx = elem.getContext("2d");
ctx.drawImage(
img,
0,
0,
img.width,
img.height,
0,
0,
elem.width,
elem.height
);
// ctx.drawImage(img, 0, 0, width, height);
fetch(elem.toDataURL("image/jpeg"))
.then(function (res) {
return res.arrayBuffer();
})
.then(function (buf) {
const newFile = new File([buf], sourceImage.name, {
type: "image/jpeg",
});
callback(newFile, true);
})
.catch((error) => {
// fetch Error catch Block
if (error) {
console.log(error);
}
});
};
fileReader.readAsDataURL(sourceImage);
};
// 該当チャットルームに参加するためログイン情報をサーバに渡す
getLoginParameter = function () {
CHAT_UI.htmlElementTextInitialize();
CHAT_UI.dismissLoadingIndicator();
};
// for android native call
CHAT.leaveRoom = function () {
CHAT_SOCKET.emitLeaveRoom();
};
document.addEventListener("DOMContentLoaded", function () {
// ルーム名変更イベント
$(".change_room_name_btn button").click(function () {
$("form").submit();
});
// 検索アイコン押下イベント
$(".nav_item_wrap .search_menu").click(function () {
$(".nav_item_wrap").addClass("none");
$(".footer-wrap").addClass("none");
$(".chat_room_src_form").removeClass("none");
$(".room_container").addClass("none");
$(".overlay_src_msg").removeClass("none");
// フィルタ表示
$("#filter").removeClass("none");
$("#user_list").addClass("none");
$('.chat_room_src_form input[type="search"]').focus();
$("#searchMessage").addClass("onfocus");
$(".chat_list").removeClass("none");
});
$(".chat_room_src_form .cancel").click(function () {
$(".nav_item_wrap").removeClass("none");
$(".footer-wrap").removeClass("none");
$(".chat_room_src_form").addClass("none");
$(".chat_room_src_form input").val("");
$(".room_container").removeClass("none");
$(".overlay_src_msg").empty();
// ユーザーリスト表示
$("#filter").addClass("none");
$("#user_list").removeClass("none");
$('.chat_room_src_form input[type="search"]').blur();
$("#searchMessage").removeClass("onfocus");
$(".chat_list").addClass("none");
CHAT_UI.scrollToBottom();
});
$('.chat_room_src_form input[type="search"]').click(function () {
if ($("#searchMessage").hasClass("onfocus")) {
$("#searchMessage").removeClass("onfocus");
$("#searchMessage").blur();
} else {
$("#searchMessage").addClass("onfocus");
$("#searchMessage").focus();
}
});
$("#searchMessage").blur(function () {
$("#searchMessage").removeClass("onfocus");
});
// フィルタ選択イベント
$(document).on("click", "#filter .img_wrap", function (event) {
// チェックアイコン追加
$(this).toggleClass("filter");
});
$('#chat .search_form input[type="search"]').click(function () {
let roomListTitle = getLocalizedString("room_search_placeholder");
$("#chatTitle").text(roomListTitle);
});
$("#chat .search_form .cancel").click(function () {
let roomListTitle = getLocalizedString("roomListTitle");
$("#chatTitle").text(roomListTitle);
});
$("#chat_add_user .search_form .cancel").click(function () {
let roomListTitle = getLocalizedString("inviteUsersSubtitle");
$("#addUserTitle").text(roomListTitle);
});
$("#chatMakeRoom .search_form .cancel").click(function () {
let roomListTitle = getLocalizedString("createRoomTitle");
$("#makeRoomTitle").text(roomListTitle);
});
// チャットメンバー検索
$('#chat .search_form input[type="search"]').keyup(function (e) {
var rooms;
var keyword = $('#chat .search_form input[type="search"]').val();
if (e.KeyCode == 13 || e.key == "Enter") {
if (keyword.length != 0 && keyword != "") {
$('#chat .search_form input[type="search"]').blur();
return;
}
} else if (keyword == "" || keyword.length < 2) {
$(".overlay_src_msg").empty();
return;
}
CHAT.searchRoom(keyword, rooms);
if (e.KeyCode == 13 || e.key == "Enter") {
$('#chat .search_form input[type="search"]').blur();
return;
}
});
// iOSキーボード変換検知用
$('#chat .search_form input[type="search"]').on(
"compositionend",
function () {
if (deviceInfo.isIOS()) {
var rooms;
var keyword = $('#chat .search_form input[type="search"]').val();
CHAT.searchRoom(keyword, rooms);
}
}
);
var footerHeight = $(".footer-wrap").height();
window.addEventListener("resize", function () {
var afterHeight = window.innerHeight;
var afterWidth = window.innerWidth;
var moreScroll = beforeHeight - afterHeight;
if (beforeHeight > afterHeight && beforeHeight - afterHeight > 50) {
if (deviceInfo.isiOS()) {
window.scrollTo(0, beforeScroll + moreScroll);
} else if (beforeWidth == afterWidth) {
//キーボード表示時
$(".room_container").css("margin-bottom", 0);
window.scrollTo(
0,
beforeScroll + moreScroll - $(".footer_content_b").height()
);
} else {
//画面回転時
window.scrollTo(
0,
beforeScroll + moreScroll * 2 - $(".footer_content_b").height()
);
}
} else if (beforeHeight < afterHeight) {
$(".room_container").css("margin-bottom", footerHeight);
if (deviceInfo.isIOS()) {
window.scrollTo(0, beforeScroll + moreScroll);
} else if (beforeWidth == afterWidth) {
//キーボード非表示
window.scrollTo(
0,
beforeScroll + moreScroll + $(".footer_content_b").height()
);
} else {
//画面回転時
window.scrollTo(
0,
beforeScroll + moreScroll * 2 + $(".footer_content_b").height()
);
}
}
beforeHeight = window.innerHeight;
beforeWidth = window.innerWidth;
});
$("#messageInput").focusin(function (e) {
beforeHeight = window.innerHeight;
beforeWidth = window.innerWidth;
beforeScroll = window.scrollY;
});
// チャットルーム
// メッセージ検索イベント
$('.chat_room_src_form input[type="search"]').keyup(function (e) {
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
if (e.key == "Enter" || e.KeyCode == 13) {
if (keyword != "" && keyword.length != 0) {
$('.chat_room_src_form input[type="search"]').blur();
return;
}
} else if (keyword == "" || keyword.length < 2) {
$(".overlay_src_msg").empty();
return;
}
CHAT.searchMessage(keyword, workVal);
if (e.key == "Enter" || e.KeyCode == 13) {
$("#searchMessage").removeClass("onfocus");
$('.chat_room_src_form input[type="search"]').blur();
return;
}
});
// iOSキーボード変換検知用
$('.chat_room_src_form input[type="search"]').on(
"compositionend",
function () {
if (deviceInfo.isIOS()) {
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
CHAT.searchMessage(keyword, workVal);
}
}
);
$(document).on("click", ".filter_img", function (event) {
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
$(".overlay_src_msg").empty();
let checkedUserList = getCheckedUserList();
if (keyword.length == 1) {
return;
}
const messages = NativeBridgeDataSource.searchMessages(
keyword,
checkedUserList.join(",")
);
var userMessageTemplate = getTemplate(TemplateURL.USER_MESSAGE);
var myMessageTemplate = getTemplate(TemplateURL.MY_MESSAGE);
let jQueryMessages = $(".overlay_src_msg");
messages.forEach(function (message) {
let template = userMessageTemplate;
if (message.shopMemberId == currentUserInfo.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == MessageType.SYSTEM) {
template = systemMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
// ユーザの様式を読み込む
if (message.profileUrl) {
message.profileUrl = CHAT.getProfileImgUrl(message.profileUrl);
} else {
message.profileUrl = CHAT.getProfileImgUrl("");
}
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll(
"?fileName=",
"?sid=" + currentUserInfo.sid + "&fileName="
);
message.message = replacePath;
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
});
jQueryMessages.prepend(workVal);
});
});
var getCheckedUserList = function () {
let checkedUserList = [];
$(".img_wrap.filter").each(function (user) {
const selectedUser = $(".img_wrap.filter")[user];
checkedUserList.push($(selectedUser).data("user-id"));
});
return checkedUserList;
};
// チャットルーム検索
CHAT.searchRoom = function (keyword, rooms) {
const overlayMessage = $(".overlay_src_msg");
overlayMessage.empty();
rooms = NativeBridgeDataSource.getRoomList(ChatRoomType.ALL, keyword);
let roomListTitle = getLocalizedString("room_search_placeholder");
$("#chatTitle").text(roomListTitle);
var template = getTemplate(TemplateURL.ROOM_LIST);
rooms.forEach(function (room) {
room.profileImagePath = "./images/user-profile.png";
const roomMessage = getRoomMessage(room.message);
const displayMessage = getDisplayMessage(room.messageType, roomMessage);
let html = renderRoom(template, room, displayMessage);
// Click event
let obj = jQuery.parseHTML(html);
overlayMessage.append(obj);
});
if (rooms.length == 0) {
const noResultMsg = getNoResultMessage();
overlayMessage.append(noResultMsg);
}
};
var getRoomMessage = function (message) {
if (message) {
return message.toString();
} else {
return getLocalizedString("noMessages");
}
};
var getDisplayMessage = function (messageType, roomMessage) {
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:
return "";
}
};
var renderRoom = function (template, room, displayMessage) {
var attendUserName = [];
room.attendUsers.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
attendUserName.push(user.shopMemberName);
});
const thumbnailCount =
room.attendUsers.length > 4 ? 4 : room.attendUsers.length;
const time = room.insertDate
? CHAT_UTIL.formatDate(room.insertDate).createdAt
: "";
if (room.chatRoomName == "") {
room.chatRoomName = attendUserName.join(", ");
}
return Mustache.render(template, {
thumbnailCount: thumbnailCount,
roomName: room.chatRoomName,
roomId: room.chatRoomId,
profileImage: room.profileImagePath,
lastMessage: displayMessage,
time: time,
unreadMsgCnt: room.unreadCount == 0 ? "" : room.unreadCount,
userCnt: room.attendUsers.length + 1,
attendUsers: room.attendUsers,
});
};
// メッセージ検索
CHAT.searchMessage = function (keyword, workVal) {
$(".overlay_src_msg").empty();
var checkedUserList = [];
$(".img_wrap.filter").each(function (user) {
const selectedUser = $(".img_wrap.filter")[user];
checkedUserList.push($(selectedUser).data("user-id"));
});
var messages = NativeBridgeDataSource.searchMessages(
keyword,
checkedUserList.join(",")
);
var userMessageTemplate = getTemplate(TemplateURL.USER_MESSAGE);
var myMessageTemplate = getTemplate(TemplateURL.MY_MESSAGE);
let jQueryMessages = $(".overlay_src_msg");
messages.forEach(function (message) {
let template = userMessageTemplate;
if (message.shopMemberId == currentUserInfo.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == MessageType.SYSTEM) {
template = systemMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
if (message.profileUrl) {
message.profileUrl = CHAT.getProfileImgUrl(message.profileUrl);
} else {
message.profileUrl = CHAT.getProfileImgUrl("");
}
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll(
"?fileName=",
"?sid=" + currentUserInfo.sid + "&fileName="
);
message.message = replacePath;
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
});
jQueryMessages.prepend(workVal);
if (messages.length == 0) {
const noResultMsg = getNoResultMessage();
jQueryMessages.append(noResultMsg);
}
};
// 下スクロールでユーザーリストを非表示
var startPos = 0;
var winScrollTop = 0;
$(window).on("scroll", function () {
winScrollTop = $(this).scrollTop();
if (winScrollTop >= startPos) {
if (winScrollTop >= 200) {
$("#chat_room .user_list").addClass("hide");
}
} else {
$("#chat_room .user_list").removeClass("hide");
}
startPos = winScrollTop;
});
document.addEventListener("DOMContentLoaded", function () {
no_scroll();
// メニューオーバーレイ表示
$(".menu_btn").click(function () {
var w = $(this).width();
$(this).toggleClass("hide");
$("#overlay_menu .item").toggleClass("hide");
});
// ユーザーリストオーバーレイ表示
$(".user_btn").click(function () {
var w = $(this).width();
$(this).toggleClass("hide");
$("#overlay_user_list.overlay")
.toggleClass("slidein")
.css({ transform: "translateX(" & -w & ")" });
if ($(this).hasClass("hide")) {
return_scroll();
} else {
scrollTo(0, 0);
no_scroll();
}
});
// モーダルonモーダル(前のモーダルを非表示に)
// ホスト変更ボタン押下イベント
$(".ch_host_btn").click(function () {
var target = $(this).val();
changeModal(target, "changeHostModal");
});
/* モーダルの切り替え */
function changeModal(beforeModal, afterModal) {
$(beforeModal).modal("hide");
$(afterModal).modal("show");
}
// 閉じるイベント
$(".close_btn").click(function () {
$("#overlay_add_user_list").addClass("none");
no_scroll();
});
// ユーザー追加イベント
$(".inv_btn").click(function () {
$("#overlay_add_user_list").addClass("none");
});
// ユーザー招待メンバー検索
$(".add_user_btn").click(function () {
return_scroll();
CHAT_UI.showLoadingIndicator();
CHAT.globalSelectedUserList = [];
CHAT_UI.refreshMyGroupForAddUserInCollaboration();
$("#addUserConfirmBtnInCollaboration")
.off()
.on("click", function () {
$("#addUserInCollaboration").modal("hide");
const selectedUserList = CHAT.globalSelectedUserList.join(",");
NativeBridgeDelegate.saveSelectedUserList(selectedUserList);
CHAT_UI.confirmInviteUserListInCollaboration();
});
});
});
function penOff() {
if (!$("#penBtn .pen").hasClass("disable")) {
$("#coviewPenCtrBtn").click();
$("#penBtn .pen").addClass("disable");
}
}
function no_scroll() {
document.addEventListener("mousewheel", scroll_control, { passive: false });
document.addEventListener("touchmove", scroll_control, { passive: false });
}
// スクロール禁止解除
function return_scroll() {
document.removeEventListener("mousewheel", scroll_control, {
passive: false,
});
document.removeEventListener("touchmove", scroll_control, { passive: false });
}
function scroll_control(event) {
if (event.cancelable) {
event.preventDefault();
}
}
CHAT_UI.confirmInviteUserListInCollaboration = function () {
var selectedUsers = NativeBridgeDataSource.loadSelectedUsers();
if (selectedUsers != "") {
$("#selectedUserListinCollaboration").html("");
var selectedUserList = NativeBridgeDataSource.loadSelectedUsers();
selectedUserList.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
var modalTemplate;
$.get(
{ url: "./modal_add_user_confirm.html", async: false },
function (text) {
modalTemplate = text;
}
);
let html = Mustache.render(modalTemplate, {
userList: selectedUserList,
});
let obj = jQuery.parseHTML(html);
$("#modal_add_user_confirm").html(obj);
$("#modalAddUserConfirm").modal("show");
} else {
}
$("#cancelAddUserBtn")
.off()
.on("click", function () {
console.log("cancelClick");
$("#modalAddUserConfirm").modal("hide");
$("#addUserInCollaboration").modal("show");
});
$("#addUserBtn")
.off()
.on("click", function () {
CHAT_UI.showLoadingIndicator();
let userIdList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
});
const commaJoinedUserIDList = userIdList.join(",");
const collaborationType = CHAT_UTIL.getCollaborationType(
globalUserInfo.coWorkType
);
NativeBridgeDelegate.inviteCollaboration(
commaJoinedUserIDList,
collaborationType
);
CHAT_UI.dismissLoadingIndicator();
$("#modalAddUserConfirm").modal("hide");
});
};
......@@ -68,24 +68,50 @@ document.addEventListener("DOMContentLoaded", function () {
$(".overlay_src_msg").empty();
$(".craeteRoomButton").removeClass("none");
});
});
$(".message_input_form").on("focus", function (e) {
setTimeout(function () {
$(".message_input_send").removeClass("none");
$(".attach_file").addClass("none");
$(".footer_content_b").addClass("none");
}, 10);
});
var Common = {};
$(".message_input_form").on("focusout", function (e) {
setTimeout(function () {
if ($(e.relatedTarget).hasClass("message_input_send")) {
CHAT_UI.sendMessage();
} else {
$(".message_input_send").addClass("none");
$(".attach_file").removeClass("none");
$(".footer_content_b").removeClass("none");
}
}, 10);
});
});
//loadingIndicatorを表示
Common.showLoadingIndicator = function () {
var h = $(window).height();
$("#loader-bg ,#loader").height(h).css("display", "block");
};
//loadingIndicatorを表示しない
Common.dismissLoadingIndicator = function () {
var h = $(window).height();
$("#loader-bg ,#loader").height(h).css("display", "none");
};
Common.refreshForOnline = function () {
$(".footer_item a").removeClass("ui-state-disabled");
};
Common.refreshForOffline = function () {
$(".footer_item a").addClass("ui-state-disabled");
};
// #36170 画像パスが存在しない場合はデフォルトの画像を返す
// 存在する場合はプロフィール画像取得用APIのURLを生成して返す
Common.getProfileImgUrl = function (path) {
if (path == undefined || path == "") {
return "./img/noImage.png";
} else {
if (path.includes("/mnt")) {
var userInfo = path.split("/").reverse();
return (
serverInfo.cmsURL +
"/chatapi/user?profileFileName=" +
userInfo[0] +
"&profileGetLoginId=" +
userInfo[1] +
"&sid=" +
currentUserInfo.sid +
"&cmd=12"
);
} else {
return path;
}
}
};
\ No newline at end of file
......@@ -368,3 +368,25 @@ NativeBridgeDelegate.changeCollaboration = function (type, meetingID) {
android.changeCollaboration(type, meetingID);
}
};
var ReverseDelegate = {};
/* reverse delegates */
// for android native call
ReverseDelegate.leaveRoom = function () {
CHAT_SOCKET.emitLeaveRoom();
};
// 該当チャットルームに参加するためログイン情報をサーバに渡す
getLoginParameter = function () {
Common.dismissLoadingIndicator();
};
// for android call
CHAT_UI.displayExistRoom = function (roomId) {
if (confirm("error_already_exist_same_user")) {
NativeBridgeDelegate.joinRoom(roomId);
}
return;
};
......@@ -64,7 +64,7 @@ var addCollaborationMessage = function (
);
userInCollaboration.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
});
const openCollaborationMessageTemplate = getTemplate(
......@@ -127,7 +127,7 @@ var addTextMessage = function (messageText, message, socketID) {
);
const shopMemberName = messageSender[0].shopMemberName;
const textMessageTemplate = getTextMessageTemplate(message.id === socketID);
const profileImagePath = CHAT.getProfileImgUrl(message.profileImagePath);
const profileImagePath = Common.getProfileImgUrl(message.profileImagePath);
const html = renderTextMessage(
textMessageTemplate,
messageTextWithSID,
......
......@@ -50,9 +50,9 @@ var bindOnConnect = function () {
// socketが接続されたらチャット画面で画面を更新する
$(".overlay").removeClass("active undismissable");
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
Common.showLoadingIndicator();
NativeBridgeDelegate.getLoginParameter();
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
});
};
......@@ -60,13 +60,13 @@ var bindOnDisconnect = function () {
socket.on(SOCKET_KEY.DISCONNECT, function () {
//socketが切断されたら黒画面で画面を更新する
$(".overlay").addClass("active undismissable");
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
});
};
var bindOnConnectError = function () {
socket.on(SOCKET_KEY.CONNECT_ERROR, function () {
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
});
};
......@@ -125,10 +125,10 @@ var bindOnShowServerError = function () {
keyboard: false,
})
.on("click", "#customAlertOk", function (e) {});
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
if (message == "Room not found") {
CHAT.saveRoomInfo();
CHAT_SOCKET.saveRoomInfo();
}
});
};
......@@ -156,14 +156,14 @@ CHAT_SOCKET.emitJoin = function (
errorHandlingForEmitJoin();
}
if (needsDismissLoadingIndicator) {
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
}
return;
}
if (needsDismissLoadingIndicator) {
// loadingIndicatorを表示しない
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
}
});
};
......@@ -208,3 +208,22 @@ CHAT_SOCKET.emitGetGroupList = function (isInvite) {
CHAT_SOCKET.emitLeaveRoom = function () {
socket.emit(SOCKET_KEY.LEAVE_ROOM, function () {});
};
CHAT_SOCKET.saveRoomInfo = function (roomID, roomName) {
roomInfo.roomID = roomID;
roomInfo.roomName = roomName;
NativeBridgeDelegate.saveVisitRoomInfo(roomID, roomName);
};
CHAT_SOCKET.initialJoin = function() {
CHAT_SOCKET.connectSocket();
const joinInfo = new JoinInfo(
currentUserInfo.sid,
currentUserInfo.loginID,
currentUserInfo.shopName,
roomInfo.roomID,
roomInfo.roomName,
currentUserInfo.shopMembeID
);
CHAT_SOCKET.emitJoin(joinInfo, false, false);
}
......@@ -21,7 +21,7 @@ $("#image-form").on("submit", function (e) {
if (file) {
$(".overlay").addClass("active undismissable");
$(".loader").addClass("active");
CHAT_UI.showLoadingIndicator();
Common.showLoadingIndicator();
var fd = new FormData($(this)[0]);
console.log($(this)[0]);
//画像の大きさが500pixelより大きかったら、thumbnailを生成
......@@ -61,7 +61,7 @@ $("#video-form").on("submit", function (e) {
if (file) {
$(".overlay").addClass("active undismissable");
$(".loader").addClass("active");
CHAT_UI.showLoadingIndicator();
Common.showLoadingIndicator();
var fd = new FormData($(this)[0]);
if (!file.type.includes("image")) {
......@@ -82,7 +82,7 @@ $("#video-form").on("submit", function (e) {
// this method call from android only for now
CHAT_UI.videoEncodeFail = function () {
alert(getLocalizedString("error_send_video"));
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
};
// this method call from android only for now
......@@ -107,7 +107,7 @@ CHAT_UI.videoEncodeEnd = function (encodedUri) {
processData: false,
error: function () {
alert(getLocalizedString("error_send_video"));
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
},
})
.done(function (res) {
......@@ -174,8 +174,271 @@ CHAT_UI.videoEncodeEnd = function (encodedUri) {
$(".overlay").removeClass("active undismissable");
$(".loader").removeClass("active");
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
});
});
xhr.send();
};
// Video のサムネイルファイル生成する
CHAT.createVideoThumbnailAndUpload = function (sourceImage, callback) {
var fileReader = new FileReader();
fileReader.onload = function () {
var blob = new Blob([fileReader.result], { type: sourceImage.type });
var url = URL.createObjectURL(blob);
var video = document.createElement("video");
var timeupdate = function () {
if (snapImage()) {
video.removeEventListener("timeupdate", timeupdate);
video.pause();
}
};
video.addEventListener("loadeddata", function () {
if (snapImage()) {
video.removeEventListener("timeupdate", timeupdate);
}
});
var snapImage = function () {
var canvas = document.createElement("canvas");
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
canvas
.getContext("2d")
.drawImage(video, 0, 0, canvas.width, canvas.height);
fetch(canvas.toDataURL("image/jpeg"))
.then(function (res) {
return res.arrayBuffer();
})
.then(function (buf) {
// 回転された画像をFormDataに保存
const newFile = new File([buf], sourceImage.name, {
type: "image/jpeg",
});
callback(newFile, true);
// ajax End
})
.catch((error) => {
// fetch Error catch Block
if (error) {
console.log(error);
}
});
return true;
};
video.addEventListener("timeupdate", timeupdate);
video.preload = "metadata";
video.src = url;
// Load video in Safari / IE11
video.muted = true;
video.playsInline = true;
video.pause();
};
fileReader.readAsArrayBuffer(sourceImage);
};
// Ajaxでイメージをアップロードする
CHAT.uploadImage = function (formData) {
formData.append("roomId", roomInfo.roomID);
formData.append("sid", currentUserInfo.sid);
jQuery
.ajax({
async: true,
url: serverInfo.cmsURL + "/chatapi/file/upload",
type: "post",
data: formData,
contentType: false,
processData: false,
error: function () {
alert("読み込み失敗");
Common.dismissLoadingIndicator();
},
})
.done(function (res) {
var imgPath =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.fileName +
"&roomId=" +
roomInfo.roomID;
var imageName = res.fileName;
// uploadFileの判断
var extension = imageName
.substr(imageName.lastIndexOf(".") + 1)
.toLowerCase();
// 画像の処理
if (
res.fileType == "jpeg" ||
res.fileType == "jpg" ||
res.fileType == "png"
) {
if (res.thumbnailPath && res.thumbnailPath.length > 0) {
imgPath =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.thumbImageFileName +
"&roomId=" +
roomInfo.roomID;
imageName = res.thumbImageFileName;
}
let downloadPath =
serverInfo.cmsURL +
"/chatapi/file/download?fileName=" +
imageName +
"&roomId=" +
roomInfo.roomID;
// アップロードが終了した後ローディング画面から離れてメッセージをメッセージを転送する
const lightbox = $("<a/>", {
"data-lightbox": "attachedImages",
"data-title": imageName,
});
const image = $("<img/>", {
src: imgPath,
width: "auto",
style: "max-width:100%",
"data-toggle": "modal",
onclick: "imageModal(this);",
});
const downloadIcon = $("<a/>", {
href: downloadPath,
class: "fa fa-download",
download: res.fileName,
});
lightbox.append(image);
lightbox.append(downloadIcon);
let text = lightbox.prop("outerHTML");
let encodedText;
try {
encodedText = encodeURIComponent(text);
} catch (e) {
encodedText = text;
}
const sendData = encodedText + messageSeperator + MessageType.IMAGE;
CHAT_SOCKET.emitCreateMessage(sendData, 1);
} else {
// 動画の処理
if (res.thumbnailPath && res.thumbnailPath.length > 0) {
imgPath =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.thumbImageFileName +
"&roomId=" +
roomInfo.roomID;
}
let downloadPath =
serverInfo.cmsURL +
"/chatapi/file/download?fileName=" +
imageName +
"&roomId=" +
roomInfo.roomID;
var videoSrc =
serverInfo.cmsURL +
"/chatapi/file/getImage?fileName=" +
res.fileName +
"&roomId=" +
roomInfo.roomID;
const totalDiv = $("<div/>", { id: "attachedImages" });
const videoTag = $("<video/>", {
controls: "true",
width: "auto",
style: "max-width:100%",
});
const source = $("<source/>", { src: videoSrc });
const downloadIcon = $("<a/>", {
href: downloadPath,
class: "fa fa-download",
download: res.fileName,
});
videoTag.append(source);
totalDiv.append(videoTag);
totalDiv.append(downloadIcon);
let text = totalDiv.prop("outerHTML");
let encodedText;
try {
encodedText = encodeURIComponent(text);
} catch (e) {
encodedText = text;
}
const sendData = encodedText + messageSeperator + MessageType.VIDEO;
CHAT_SOCKET.emitCreateMessage(sendData, 1);
}
$(".overlay").removeClass("active undismissable");
$(".loader").removeClass("active");
Common.dismissLoadingIndicator();
});
};
// Thumbnailのファイルを生成する。
CHAT.createThumbnailAndUpload = function (sourceImage, callback) {
const fileReader = new FileReader();
const img = new Image();
fileReader.onloadend = function () {
img.src = fileReader.result;
};
img.onload = function () {
const elem = document.createElement("canvas");
var rate;
var width = img.width;
var height = img.height;
if (img.width <= 500 && img.height <= 500) {
callback(undefined, false);
return;
}
if (img.width > img.height) {
rate = 500 / img.width;
} else {
rate = 500 / img.height;
}
elem.width = width * rate;
elem.height = height * rate;
const ctx = elem.getContext("2d");
ctx.drawImage(
img,
0,
0,
img.width,
img.height,
0,
0,
elem.width,
elem.height
);
// ctx.drawImage(img, 0, 0, width, height);
fetch(elem.toDataURL("image/jpeg"))
.then(function (res) {
return res.arrayBuffer();
})
.then(function (buf) {
const newFile = new File([buf], sourceImage.name, {
type: "image/jpeg",
});
callback(newFile, true);
})
.catch((error) => {
// fetch Error catch Block
if (error) {
console.log(error);
}
});
};
fileReader.readAsDataURL(sourceImage);
};
\ No newline at end of file
......@@ -112,3 +112,213 @@ var renderArchiveTemplate = function (
typeImage: typeImageURL,
});
};
// アーカイブ詳細
CHAT_UI.refreshArchiveDetailScreen = function (archiveId) {
// loadingIndicatorを表示
Common.showLoadingIndicator();
// 初期化
$("#archiveDetail").html("");
// アーカイブ詳細の様式を読み込む
const archiveDetailTemplate = $("#archive-detail-template").html();
if (serverInfo.isOnline == "true") {
NativeBridgeDelegate.updateArchiveDetail(archiveId);
}
// アーカイブ詳細取得
const archive = NativeBridgeDataSource.getArchiveDetail(archiveId);
// 保存ユーザ情報を取得
const userInfo = NativeBridgeDataSource.getUserInfo(archive.saveUserId);
userInfo.profileUrl = Common.getProfileImgUrl(userInfo.profileUrl);
// アーカイブ情報を表示
const html = Mustache.render(archiveDetailTemplate, {
fileName: archive.archiveName,
insertDate: archive.archiveDate,
chatRoomName: archive.roomName,
chatRoomId: archive.roomId,
profileImage: userInfo.profileUrl,
userName: userInfo.shopMemberName,
userId: userInfo.shopMemberId,
});
var obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#archiveDetail").append(obj);
// プレイヤーの切り替え
const archiveFilePath = CHAT.createGetDataUrl(
archive.filePath,
archive.roomId
);
switch (archive.archiveType) {
case "0": // 画像
case 0:
$("#archive_player").prepend(
'<img class="archive_player" src="' + archiveFilePath + '" />'
);
break;
case "1": // 動画
case 1:
if (deviceInfo.isiOS()) {
$("#archive_player").prepend(
'<video class="archive_player" controls autoplay muted playsinline controlsList="nodownload"><source src="' +
archiveFilePath +
'" type="video/mp4"><source src="' +
archiveFilePath +
'" type="video/ogv"><source src="' +
archiveFilePath +
'" type="video/webm"></video>'
);
} else {
$("#archive_player").prepend(
'<video class="archive_player" src=' +
archiveFilePath +
' controls autoplay muted playsinline controlsList="nodownload"></video>'
);
}
break;
case "2": // 音声
case 2:
if (deviceInfo.isiOS()) {
$("#archive_player").prepend(
'<audio class="archive_audio_player" controls controlsList="nodownload"><source src="' +
archiveFilePath +
'" type="audio/wav"><source src="' +
archiveFilePath +
'" type="audio/ogg"></audio>'
);
} else {
$("#archive_player").prepend(
'<audio class="archive_audio_player" src=' +
archiveFilePath +
' controls controlsList="nodownload"></audio>'
);
}
$("#archive_player").prepend(
'<img class="archive_player" src=' + "./img/capture.png" + " />"
);
break;
case "3": // 文書
case 3:
// リリースに文書とその他は含めないため今回は非表示
break;
default:
// リリースに文書とその他は含めないため今回は非表示
}
// ユーザの様式を読み込む
const archiveUserTemplate = $("#archive-user-template").html();
// 参加ユーザ情報を表示
let attendUserList = archive.attendUserIds;
if (typeof android != "undefined") {
// ios実装不要
attendUserList = JSON.parse(archive.attendUserIds);
}
attendUserList.forEach(function (user) {
if (user == "") {
return;
}
var userInfo = NativeBridgeDataSource.getUserInfo(user);
userInfo.profileUrl = Common.getProfileImgUrl(userInfo.profileUrl);
const html = Mustache.render(archiveUserTemplate, {
profileImage: userInfo.profileUrl,
userName: userInfo.shopMemberName,
});
const obj = $(jQuery.parseHTML(html)).on("click", function () {
// ネームカード表示
CHAT_UI.makeNameCard(user);
});
$("#attendUser").append(obj);
});
currentUserInfo.configureLanguage();
// TODO: peacekim:: check localization works or not
$(".ttl_detail").text(getLocalizedString("detail"));
$("#archiveFileName").text(getLocalizedString("archiveFileName"));
$("#archiveInsertDate").text(getLocalizedString("archiveInsertDate"));
$("#archiveRoomName").text(getLocalizedString("archiveRoomName"));
$("#archiveSaveUser").text(getLocalizedString("archiveSaveUser"));
$("#archiveAttendUser").text(getLocalizedString("archiveAttendUser"));
// チャットルームへのリンク付け
document.getElementById("joinChatRoom").onclick = function () {
NativeBridgeDelegate.joinRoom(archive.roomId, archive.roomName);
};
// loadingIndicatorを非表示
Common.dismissLoadingIndicator();
};
CHAT.createGetDataUrl = function (fileName, roomId) {
var filePath =
serverInfo.cmsURL +
"/chatapi/file/getImage?sid=" +
currentUserInfo.sid +
"&fileName=" +
fileName +
"&roomId=" +
roomId;
return filePath;
};
// アーカイブ一覧
CHAT_UI.refreshArchiveScreen = function () {
// loadingIndicatorを表示
Common.showLoadingIndicator();
// 初期化
$("#archiveList").html("");
// アーカイブの様式を読み込む
const archiveTemplate = $("#archive-template").html();
// アーカイブ一覧取得
if (serverInfo.isOnline == "true") {
NativeBridgeDelegate.updateArchiveList();
}
// ローカルDBのデータを表示
var archiveList = NativeBridgeDataSource.getArchiveList();
if (typeof archiveList == "undefined") {
Common.dismissLoadingIndicator();
return;
}
archiveList.forEach(function (archive) {
var typeImage = "";
switch (archive.archiveType) {
case 0: // 画像
typeImage = "icon/icon_collabo_picture.png";
break;
case 1: // 動画
typeImage = "icon/icon_collabo_videocam.png";
break;
case 2: // 音声
typeImage = "icon/icon_collabo_headset.png";
break;
case 3: // 文書
typeImage = "icon/icon_collabo_document.png";
break;
default:
// その他
typeImage = "";
}
let html = Mustache.render(archiveTemplate, {
archiveId: archive.archiveId,
fileName: archive.archiveName,
insertDate: archive.archiveDate,
typeImage: typeImage,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#archiveList").append(obj);
});
// loadingIndicatorを非表示
Common.dismissLoadingIndicator();
};
var ChatList = {};
$("#tabDM").on("click", function (e) {
ChatList.refreshRoomList(ChatRoomType.DM);
});
$("#tabGroup").on("click", function (e) {
ChatList.refreshRoomList(ChatRoomType.GROUP);
});
document.addEventListener("DOMContentLoaded", function () {
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();
if (e.KeyCode == 13 || e.key == "Enter") {
if (keyword.length != 0 && keyword != "") {
chatSearchInput.blur();
return;
}
} else if (keyword == "" || keyword.length < 2) {
$(".overlay_src_msg").empty();
return;
}
CHAT.searchRoom(keyword, rooms);
if (e.KeyCode == 13 || e.key == "Enter") {
chatSearchInput.blur();
return;
}
});
// iOSキーボード変換検知用
chatSearchInput.on(
"compositionend",
function () {
if (deviceInfo.isIOS()) {
var rooms;
var keyword = chatSearchInput.val();
CHAT.searchRoom(keyword, rooms);
}
}
);
});
ChatList.refreshRoomList = function (roomType) {
if (serverInfo.isOnline == "true") {
Common.refreshForOnline();
} else {
Common.refreshForOffline();
}
const beforeRoomType = NativeBridgeDataSource.getBeforeRoomType();
if (beforeRoomType != null) {
roomType = beforeRoomType;
NativeBridgeDelegate.clearBeforeRoomType();
}
Common.showLoadingIndicator();
if (roomType == ChatRoomType.DM) {
$("#tabDM").prop("checked", true);
} else {
$("#tabGroup").prop("checked", true);
}
if (serverInfo.isOnline == "true") {
NativeBridgeDelegate.updateRoomList();
}
var rooms = NativeBridgeDataSource.getRoomList(roomType, null);
// #36146に対応
$("#groupChatList").empty();
$("#dmChatList").empty();
let roomListTitle = getLocalizedString("roomListTitle");
$("#chatTitle").text(roomListTitle);
if (rooms.length === 0) {
// 検索結果がない場合のメッセージを追加
let 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:
}
}
var template = getTemplate(TemplateURL.ROOM_LIST);
rooms.forEach(function (room) {
room.profileImagePath = "./images/user-profile.png";
if (room.message) {
room.message = room.message.toString();
} else {
room.message = getLocalizedString("noMessages");
}
var displayMsg;
//TODO 協業の場合処理追加必要
switch (room.messageType) {
case MessageType.TEXT:
displayMsg = room.message;
break;
case MessageType.IMAGE:
displayMsg = getLocalizedString("image");
break;
case MessageType.VIDEO:
displayMsg = getLocalizedString("video");
break;
case MessageType.COMMUNICATIONSTART:
displayMsg = getLocalizedString("collaboration_start");
break;
case MessageType.COMMUNICATIONEND:
displayMsg = getLocalizedString("collaboration_end");
break;
default:
break;
}
var attendUserName = [];
room.attendUsers.forEach(function (user) {
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
attendUserName.push(user.shopMemberName);
});
var thumbnailCount =
room.attendUsers.length > 4 ? 4 : room.attendUsers.length;
if (room.chatRoomName == "") {
room.chatRoomName = attendUserName.join(", ");
}
var unreadMessageCount = room.unreadCount == 0 ? "" : room.unreadCount;
if (unreadMessageCount > 999) {
unreadMessageCount = "999+";
}
let html = Mustache.render(template, {
thumbnailCount: thumbnailCount,
roomName: room.chatRoomName,
roomId: room.chatRoomId,
profileImage: room.profileImagePath,
lastMessage: displayMsg,
time: room.insertDate
? CHAT_UTIL.formatDate(room.insertDate).createdAt
: "",
unreadMsgCnt: unreadMessageCount,
userCnt: room.attendUsers.length + 1,
attendUsers: room.attendUsers,
});
// Click event
let obj = $(jQuery.parseHTML(html)).on("click", function () {
//TODO ルームに入る処理追加必要
});
// ルームグループごとに追加。
switch (roomType) {
case ChatRoomType.GROUP:
$("#groupChatList").append(obj);
break;
case ChatRoomType.DM:
$("#dmChatList").append(obj);
break;
default:
}
});
console.log("DONE");
Common.dismissLoadingIndicator();
};
// チャットルーム検索
CHAT.searchRoom = function (keyword, rooms) {
const overlayMessage = $(".overlay_src_msg");
overlayMessage.empty();
rooms = NativeBridgeDataSource.getRoomList(ChatRoomType.ALL, keyword);
let roomListTitle = getLocalizedString("room_search_placeholder");
$("#chatTitle").text(roomListTitle);
var template = getTemplate(TemplateURL.ROOM_LIST);
rooms.forEach(function (room) {
room.profileImagePath = "./images/user-profile.png";
const roomMessage = getRoomMessage(room.message);
const displayMessage = getDisplayMessage(room.messageType, roomMessage);
let html = renderRoom(template, room, displayMessage);
// Click event
let obj = jQuery.parseHTML(html);
overlayMessage.append(obj);
});
if (rooms.length == 0) {
const noResultMsg = getNoResultMessage();
overlayMessage.append(noResultMsg);
}
};
var getRoomMessage = function (message) {
if (message) {
return message.toString();
} else {
return getLocalizedString("noMessages");
}
};
var getDisplayMessage = function (messageType, roomMessage) {
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:
return "";
}
};
var renderRoom = function (template, room, displayMessage) {
var attendUserName = [];
room.attendUsers.forEach(function (user) {
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
attendUserName.push(user.shopMemberName);
});
const thumbnailCount =
room.attendUsers.length > 4 ? 4 : room.attendUsers.length;
const time = room.insertDate
? CHAT_UTIL.formatDate(room.insertDate).createdAt
: "";
if (room.chatRoomName == "") {
room.chatRoomName = attendUserName.join(", ");
}
return Mustache.render(template, {
thumbnailCount: thumbnailCount,
roomName: room.chatRoomName,
roomId: room.chatRoomId,
profileImage: room.profileImagePath,
lastMessage: displayMessage,
time: time,
unreadMsgCnt: room.unreadCount == 0 ? "" : room.unreadCount,
userCnt: room.attendUsers.length + 1,
attendUsers: room.attendUsers,
});
};
CHAT_UI.refreshForOnline = function () {
serverInfo.isOnline = "true";
$(".craeteRoomButton").off("click", CHAT_UI.offlineHandler);
$(".craeteRoomButton").css("opacity", "1.0");
};
CHAT_UI.refreshForOffline = function () {
serverInfo.isOnline = "false";
$(".craeteRoomButton").on("click", CHAT_UI.offlineHandler);
$(".craeteRoomButton").css("opacity", "0.3");
}
CHAT_UI.offlineHandler = function (e) {
e.preventDefault();
};
var lastscrollvalue;
var beforeHeight = window.innerHeight;
var beforeWidth = window.innerWidth;
var beforeScroll;
window.onscroll = function () {
if (beforeScroll == window.scrollY) {
return;
}
beforeScroll = window.scrollY;
const beforeHeight = $(".room_container").height();
messageCount = $(".chat_message").length;
if ($(this).scrollTop() === 0 && messageCount >= PagingSize.MESSAGE) {
if (!$("#chatLoader").is(":visible")) {
let loader = $(
'<div id="chatLoader" class="text-center"><div class="spinner-grow spinner-grow-sm" role="status" /></div>'
);
$("#messages").prepend(loader);
const messageId = $($(".chat_message").get(0)).data("messageid");
NativeBridgeDelegate.updatePreMessage(messageId);
let messages = NativeBridgeDataSource.getMessagesWithMessageId(messageId);
CHAT_UI.prependMessage(messages);
loader.remove();
var afterHeight = $(".room_container").height();
window.scroll(0, afterHeight - beforeHeight);
}
}
};
document.addEventListener("DOMContentLoaded", function () {
// 検索アイコン押下イベント
$(".nav_item_wrap .search_menu").click(function () {
$(".nav_item_wrap").addClass("none");
$(".footer-wrap").addClass("none");
$(".chat_room_src_form").removeClass("none");
$(".room_container").addClass("none");
$(".overlay_src_msg").removeClass("none");
// フィルタ表示
$("#filter").removeClass("none");
$("#user_list").addClass("none");
$('.chat_room_src_form input[type="search"]').focus();
$("#searchMessage").addClass("onfocus");
$(".chat_list").removeClass("none");
});
$(".chat_room_src_form .cancel").click(function () {
$(".nav_item_wrap").removeClass("none");
$(".footer-wrap").removeClass("none");
$(".chat_room_src_form").addClass("none");
$(".chat_room_src_form input").val("");
$(".room_container").removeClass("none");
$(".overlay_src_msg").empty();
// ユーザーリスト表示
$("#filter").addClass("none");
$("#user_list").removeClass("none");
$('.chat_room_src_form input[type="search"]').blur();
$("#searchMessage").removeClass("onfocus");
$(".chat_list").addClass("none");
CHAT_UI.scrollToBottom();
});
$('.chat_room_src_form input[type="search"]').click(function () {
if ($("#searchMessage").hasClass("onfocus")) {
$("#searchMessage").removeClass("onfocus");
$("#searchMessage").blur();
} else {
$("#searchMessage").addClass("onfocus");
$("#searchMessage").focus();
}
});
$("#searchMessage").blur(function () {
$("#searchMessage").removeClass("onfocus");
});
// フィルタ選択イベント
$(document).on("click", "#filter .img_wrap", function (event) {
// チェックアイコン追加
$(this).toggleClass("filter");
});
var footerHeight = $(".footer-wrap").height();
window.addEventListener("resize", function () {
var afterHeight = window.innerHeight;
var afterWidth = window.innerWidth;
var moreScroll = beforeHeight - afterHeight;
if (beforeHeight > afterHeight && beforeHeight - afterHeight > 50) {
if (deviceInfo.isiOS()) {
window.scrollTo(0, beforeScroll + moreScroll);
} else if (beforeWidth == afterWidth) {
//キーボード表示時
$(".room_container").css("margin-bottom", 0);
window.scrollTo(
0,
beforeScroll + moreScroll - $(".footer_content_b").height()
);
} else {
//画面回転時
window.scrollTo(
0,
beforeScroll + moreScroll * 2 - $(".footer_content_b").height()
);
}
} else if (beforeHeight < afterHeight) {
$(".room_container").css("margin-bottom", footerHeight);
if (deviceInfo.isIOS()) {
window.scrollTo(0, beforeScroll + moreScroll);
} else if (beforeWidth == afterWidth) {
//キーボード非表示
window.scrollTo(
0,
beforeScroll + moreScroll + $(".footer_content_b").height()
);
} else {
//画面回転時
window.scrollTo(
0,
beforeScroll + moreScroll * 2 + $(".footer_content_b").height()
);
}
}
beforeHeight = window.innerHeight;
beforeWidth = window.innerWidth;
});
$("#messageInput").focusin(function (e) {
beforeHeight = window.innerHeight;
beforeWidth = window.innerWidth;
beforeScroll = window.scrollY;
});
// チャットルーム
// メッセージ検索イベント
$('.chat_room_src_form input[type="search"]').keyup(function (e) {
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
if (e.key == "Enter" || e.KeyCode == 13) {
if (keyword != "" && keyword.length != 0) {
$('.chat_room_src_form input[type="search"]').blur();
return;
}
} else if (keyword == "" || keyword.length < 2) {
$(".overlay_src_msg").empty();
return;
}
CHAT.searchMessage(keyword, workVal);
if (e.key == "Enter" || e.KeyCode == 13) {
$("#searchMessage").removeClass("onfocus");
$('.chat_room_src_form input[type="search"]').blur();
return;
}
});
// iOSキーボード変換検知用
$('.chat_room_src_form input[type="search"]').on(
"compositionend",
function () {
if (deviceInfo.isIOS()) {
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
CHAT.searchMessage(keyword, workVal);
}
}
);
$(document).on("click", ".filter_img", function (event) {
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
$(".overlay_src_msg").empty();
let checkedUserList = getCheckedUserList();
if (keyword.length == 1) {
return;
}
const messages = NativeBridgeDataSource.searchMessages(
keyword,
checkedUserList.join(",")
);
var userMessageTemplate = getTemplate(TemplateURL.USER_MESSAGE);
var myMessageTemplate = getTemplate(TemplateURL.MY_MESSAGE);
let jQueryMessages = $(".overlay_src_msg");
messages.forEach(function (message) {
let template = userMessageTemplate;
if (message.shopMemberId == currentUserInfo.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == MessageType.SYSTEM) {
template = systemMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
// ユーザの様式を読み込む
if (message.profileUrl) {
message.profileUrl = Common.getProfileImgUrl(message.profileUrl);
} else {
message.profileUrl = Common.getProfileImgUrl("");
}
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll(
"?fileName=",
"?sid=" + currentUserInfo.sid + "&fileName="
);
message.message = replacePath;
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
});
jQueryMessages.prepend(workVal);
});
$(".message_input_form").on("focus", function (e) {
setTimeout(function () {
$(".message_input_send").removeClass("none");
$(".attach_file").addClass("none");
$(".footer_content_b").addClass("none");
}, 10);
});
$(".message_input_form").on("focusout", function (e) {
setTimeout(function () {
if ($(e.relatedTarget).hasClass("message_input_send")) {
CHAT_UI.sendMessage();
} else {
$(".message_input_send").addClass("none");
$(".attach_file").removeClass("none");
$(".footer_content_b").removeClass("none");
}
}, 10);
});
});
var getCheckedUserList = function () {
let checkedUserList = [];
$(".img_wrap.filter").each(function (user) {
const selectedUser = $(".img_wrap.filter")[user];
checkedUserList.push($(selectedUser).data("user-id"));
});
return checkedUserList;
};
// メッセージ検索
CHAT.searchMessage = function (keyword, workVal) {
$(".overlay_src_msg").empty();
var checkedUserList = [];
$(".img_wrap.filter").each(function (user) {
const selectedUser = $(".img_wrap.filter")[user];
checkedUserList.push($(selectedUser).data("user-id"));
});
var messages = NativeBridgeDataSource.searchMessages(
keyword,
checkedUserList.join(",")
);
var userMessageTemplate = getTemplate(TemplateURL.USER_MESSAGE);
var myMessageTemplate = getTemplate(TemplateURL.MY_MESSAGE);
let jQueryMessages = $(".overlay_src_msg");
messages.forEach(function (message) {
let template = userMessageTemplate;
if (message.shopMemberId == currentUserInfo.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == MessageType.SYSTEM) {
template = systemMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
if (message.profileUrl) {
message.profileUrl = Common.getProfileImgUrl(message.profileUrl);
} else {
message.profileUrl = Common.getProfileImgUrl("");
}
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll(
"?fileName=",
"?sid=" + currentUserInfo.sid + "&fileName="
);
message.message = replacePath;
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
});
jQueryMessages.prepend(workVal);
if (messages.length == 0) {
const noResultMsg = getNoResultMessage();
jQueryMessages.append(noResultMsg);
}
};
// 下スクロールでユーザーリストを非表示
var startPos = 0;
var winScrollTop = 0;
$(window).on("scroll", function () {
winScrollTop = $(this).scrollTop();
if (winScrollTop >= startPos) {
if (winScrollTop >= 200) {
$("#chat_room .user_list").addClass("hide");
}
} else {
$("#chat_room .user_list").removeClass("hide");
}
startPos = winScrollTop;
});
//メッセージ送信
$("#messageInput").on("keypress", function (event) {
if (event.which == 13) {
// Enterキーの処理
$("#messageSend").click();
}
});
//上にスクロールすると新しいメッセージを呼ぶ処理。
$("#messages").scroll(function () {
if ($(this).scrollTop() === 0) {
if (!$("#chatLoader").is(":visible")) {
// 現在、メッセージの個数以前をメッセージを読み込む
// ローディングアイコンを追加する
let loader = $(
'<div id="chatLoader" class="text-center"><div class="spinner-grow spinner-grow-sm" role="status" /></div>'
);
$("#messages").prepend(loader);
loader.remove();
}
}
});
CHAT_UI.startCollaboration = function (collaborationType) {
if (deviceInfo.isAndroid()) {
if (
collaborationType == COLLABORATION_TYPE.DOCUMENT &&
androidVersion < ANDROID_SDK_VERSION.O
) {
alert(getLocalizedString("not_support_version"));
return;
}
}
if ($(".collabo_area.start").length != 0) {
if (!confirm(getLocalizedString("already_exist_collaboration"))) {
Common.dismissLoadingIndicator();
return;
}
const sendData = DATA_MESSAGE_SCHEME + FINISH_ALL_COLLABORATION_SIGNAL;
CHAT_SOCKET.emitCreateMessage(sendData, 0);
NativeBridgeDelegate.finishAllCollaboration();
}
NativeBridgeDelegate.startCollaboration(collaborationType);
};
CHAT_UI.sendMessage = function (e) {
const messageTextBox = $("#messageInput");
const message =
messageTextBox.val().length > 0
? encodeURIComponent(messageTextBox.val())
: "";
messageTextBox.val("");
if (message.length > 0) {
const sendData = message + messageSeperator + MessageType.TEXT;
CHAT_SOCKET.emitCreateMessage(sendData, 0);
}
$(".message_input_form").focus();
};
CHAT_UI.loadMessages = function (roomId, joinRoomName) {
roomName = joinRoomName;
if (serverInfo.isOnline == "true") {
Common.refreshForOnline();
NativeBridgeDelegate.updateMessages(roomId);
} else {
Common.refreshForOffline();
}
const roomType = NativeBridgeDataSource.getRoomType();
if (roomType == ChatRoomType.DM) {
$("#roomMenu").removeClass("none");
}
var messages = NativeBridgeDataSource.getMessages(roomId);
var usersInRoom = NativeBridgeDataSource.getUsersInRoom(roomId);
$("#roomTitle").text(roomName).data("roomName", roomName);
let jQueryMessages = $("#messages");
// スクロールの変化を防ぐため以前画面の高さを保存する
let beforeHeight = jQueryMessages.prop("scrollHeight");
var userTemplate = getTemplate(TemplateURL.USER_LIST);
var topUserListTemplate = getTemplate(TemplateURL.CHATROOM_USER_LIST);
var filterUserListTemplate = getTemplate(
TemplateURL.CHATROOM_USER_FILTER_LIST
);
usersInRoom.forEach(function (user) {
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(topUserListTemplate, {
userList: usersInRoom,
});
let obj = jQuery.parseHTML(html);
$("#user_list").append(obj);
let filterHtml = Mustache.render(filterUserListTemplate, {
userList: usersInRoom,
});
let filterObj = jQuery.parseHTML(filterHtml);
$("#filter").append(filterObj);
CHAT_UI.prependMessage(messages);
CHAT_UI.waitForLoadingImage(jQueryMessages, CHAT_UI.scrollToBottom);
CHAT_UI.waitForLoadingVideo(jQueryMessages, CHAT_UI.scrollToBottom);
if (deviceInfo.isiOS()) {
$(window).on("load", function () {
CHAT_UI.scrollToBottom();
});
}
};
CHAT_UI.prependMessage = function (messages) {
var now = new Date();
let jQueryMessages = $("#messages");
// スクロールの変化を防ぐため以前画面の高さを保存する
let beforeHeight = jQueryMessages.prop("scrollHeight");
// メッセージ文字列の生成
let workVal = "";
var userTemplate = getTemplate(TemplateURL.USER_LIST);
var userMessageTemplate = getTemplate(TemplateURL.USER_MESSAGE);
var myMessageTemplate = getTemplate(TemplateURL.MY_MESSAGE);
var systemMessageTemplate = getTemplate(TemplateURL.SYSTEM_MESSAGE);
var openCollaborationMessageTemplate = getTemplate(
TemplateURL.OPEN_COLLABORATION_MESSAGE
);
var checkBeforeDate = "";
var beforeDate = "";
messages.forEach(function (message) {
let template = userMessageTemplate;
if (message.shopMemberId == currentUserInfo.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == MessageType.SYSTEM) {
template = systemMessageTemplate;
}
if (
message.messageType == MessageType.COMMUNICATIONSTART ||
message.messageType == MessageType.COMMUNICATIONEND
) {
template = openCollaborationMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
// ユーザの様式を読み込む
if (message.profileUrl) {
message.profileUrl = Common.getProfileImgUrl(message.profileUrl);
} else {
message.profileUrl = Common.getProfileImgUrl("");
}
// #36147
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll(
"?fileName=",
"?sid=" + currentUserInfo.sid + "&fileName="
);
message.message = replacePath;
/* if (message.message contain) {
}*/
var isOtherYear = false;
var isToday = false;
if (messageTime.createdAt.includes(":")) {
isToday = true;
}
if (now.getFullYear() != message.insertDate.substring(0, 4)) {
isOtherYear = true;
}
if (messageTime.createdAtDay != checkBeforeDate && checkBeforeDate != "") {
let messageDay = CHAT_UTIL.systemDay(beforeDate);
let html = Mustache.render(systemMessageTemplate, {
year: messageDay.year + getLocalizedString("year"),
month: messageDay.month + getLocalizedString("month"),
day: messageDay.day + getLocalizedString("day"),
dow: CHAT_UTIL.findDow(messageDay.dow),
});
workVal = html + workVal;
}
checkBeforeDate = messageTime.createdAtDay;
beforeDate = message.insertDate;
if (
message.messageType == MessageType.COMMUNICATIONSTART ||
message.messageType == MessageType.COMMUNICATIONEND
) {
const collaborationInfo = JSON.parse(message.message);
const userInCollaboration = JSON.parse(
NativeBridgeDataSource.getUserInfoList(collaborationInfo.userList)
);
var meetingId = 0;
if (typeof collaborationInfo.meetingId != "undefined") {
meetingId = collaborationInfo.meetingId;
}
userInCollaboration.forEach(function (user) {
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(template, {
messageId: message.messageId,
roomName: roomName,
userCount: userInCollaboration.length,
userList:
userInCollaboration.length > 3
? userInCollaboration.slice(0, 3)
: userInCollaboration,
insertDate: message.insertDate,
collaborationType: collaborationInfo.collaborationType,
meetingId: meetingId,
isToday: isToday,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
createdAtYear:
message.insertDate.substring(0, 4) + getLocalizedString("year") + " ",
isOtherYear: isOtherYear,
isEnded:
message.messageType == MessageType.COMMUNICATIONEND ? true : false,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
} else {
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
messageId: message.messageId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime,
createdAtYear:
message.insertDate.substring(0, 4) + getLocalizedString("year") + " ",
unreadCount: message.unreadCount,
isOtherYear: isOtherYear,
isToday: isToday,
});
html =
message.message.includes("attachedImages") ||
message.message.includes("attachedVideos")
? CHAT_UTIL.htmlDecode(html)
: html;
workVal = html + workVal;
}
});
// メッセージの画面描画
jQueryMessages.prepend(workVal);
};
// 画像の読み込みが全て終わったタイミングでコールバック実行
// FIXME 追加読み込みの場合は差分の画像のみ監視すべきだが、現状新規入室時にしか対応出来ていない。
CHAT_UI.waitForLoadingVideo = function (div, callback) {
Common.showLoadingIndicator();
// var imgs = document.getElementsByTagName("video");
var video = div.find("video");
var count = video.length;
if (count == 0) callback();
var loaded = 0;
video.each(function () {
this.addEventListener("loadeddata", function (e) {
loaded++;
if (loaded === count) {
callback();
Common.dismissLoadingIndicator();
}
});
});
};
CHAT_UI.waitForLoadingImage = function (div, callback) {
var imgs = div.find("img");
var count = imgs.length;
if (count == 0) callback();
var loaded = 0;
imgs
.one("load", function (e) {
// イメージが読み込まれた
loaded++;
if (loaded === count) {
callback();
}
})
.each(function () {
if (this.complete || this.readyState === readyState.COMPLETED) {
$(this).trigger("load");
}
});
};
CHAT_UI.scrollToBottom = function () {
const messages = $(".room_contents");
const scrollHeight = messages.prop("scrollHeight");
//messages.scrollTop(scrollHeight);
$("html, body").animate(
{
scrollTop: scrollHeight,
},
100
);
};
CHAT_UI.refreshForOnline = function () {
serverInfo.isOnline = "true";
$("#videoUploadButton").removeClass("ui-state-disabled");
$("#imageInputButton").removeClass("ui-state-disabled");
$("#messageSend").prop("disabled", false);
$("#messageInput").prop("disabled", false);
$("#messageInput").prop("placeholder", "メッセージを入力してください");
$("#room_name_change_button").removeClass("ui-state-disabled");
$("#add_user_button").removeClass("ui-state-disabled");
$(".fa-download").show();
if (typeof $("#roomTitle").val() != "undefined") {
CHAT_SOCKET.initialJoin();
}
};
CHAT_UI.refreshForOffline = function () {
serverInfo.isOnline = "false";
$("#videoUploadButton").addClass("ui-state-disabled");
$("#imageInputButton").addClass("ui-state-disabled");
$("#messageSend").prop("disabled", true);
$("#messageInput").prop("disabled", true);
$("#messageInput").prop("placeholder", "");
$("#room_name_change_button").addClass("ui-state-disabled");
$("#add_user_button").addClass("ui-state-disabled");
$(".fa-download").hide();
};
\ No newline at end of file
// 名前空間
var CHAT_ADD_USER = {};
var ChatAddUser = {};
document.addEventListener("DOMContentLoaded", function () {
// メンバー検索
bindMemberSearch();
// iOSキーボード変換検知用
bindiOSKeyBoardEvent();
$("#chat_add_user .search_form .cancel").click(function () {
let roomListTitle = getLocalizedString("inviteUsersSubtitle");
$("#addUserTitle").text(roomListTitle);
});
});
// ユーザー検索
CHAT_ADD_USER.searchUser = function (keyword) {
ChatAddUser.searchUser = function (keyword) {
const isAllGroup = $("#tabAllGroupOnAddUser").is(":checked");
const overlayMessage = $(".overlay_src_msg");
let hasNoData = false;
......@@ -22,13 +27,15 @@ CHAT_ADD_USER.searchUser = function (keyword) {
searchGroupData(groupList, overlayMessage);
//ユーザデータ検索
var userList = NativeBridgeDataSource.getAllGroupShopMemberNotInRoomByName(keyword);
var userList =
NativeBridgeDataSource.getAllGroupShopMemberNotInRoomByName(keyword);
searchUserData(userList, overlayMessage);
hasNoData = userList.length == 0 && groupList.length == 0;
//連絡先画面
} else {
var userList = NativeBridgeDataSource.getMyGroupShopMemberNotInRoomByName(keyword);
var userList =
NativeBridgeDataSource.getMyGroupShopMemberNotInRoomByName(keyword);
searchUserData(userList, overlayMessage);
hasNoData = userList.length == 0;
}
......@@ -65,7 +72,7 @@ var bindMemberSearch = function () {
return false;
}
CHAT_ADD_USER.searchUser(keyword);
ChatAddUser.searchUser(keyword);
if (enterKeyPressed) {
searchInput.blur();
......@@ -79,7 +86,7 @@ var bindiOSKeyBoardEvent = function () {
searchInput.on("compositionend", function () {
if (deviceInfo.isiOS()) {
var keyword = searchInput.val();
CHAT_ADD_USER.searchUser(keyword);
ChatAddUser.searchUser(keyword);
}
});
};
......@@ -118,11 +125,13 @@ var searchUserData = function (userList, overlayMessage) {
};
var setUserProfile = function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
};
var checkUser = function (user) {
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == user.shopMemberId;
});
if (findObj) {
......@@ -135,3 +144,181 @@ var renderUserTemplate = function (userTemplate, userList) {
userList: userList,
});
};
$("#addUserConfirmBtn").on("click", function (e) {
const selectedUserList =
ChatManagementCommon.selectedUserList.join(",");
NativeBridgeDelegate.saveSelectedUserList(selectedUserList);
$("#addUserForm").submit();
});
$("#tabAllGroupOnAddUser").on("click", function (e) {
CHAT_UI.refreshAllGroupForAddUser("0");
});
$("#tabMyGroupOnAddUser").on("click", function (e) {
CHAT_UI.refreshMyGroupForAddUser();
});
CHAT_UI.refreshMyGroupForAddUser = function () {
$(".modal-backdrop").remove();
$("#favoriteListForMakeRoom").html("");
$("#myGroupListForMakeRoom").html("");
//画面タイトル設定
let contactListTitle = getLocalizedString("userSearch");
$("#title").text(contactListTitle);
// グループの様式を読み込む
var groupTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_LIST);
// ユーザの様式を読み込む
var userTemplate = getTemplate(TemplateURL.ADD_USER_USER_LIST);
var groupUserTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_USER_LIST);
NativeBridgeDelegate.updateContactInfo();
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteListForMakeRoom").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsersNotInRoom();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = Common.getProfileImgUrl(favoriteUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == favoriteUser.shopMemberId;
});
if (findObj) {
favoriteUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteListForMakeRoom").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsersNotInRoom();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupListForMakeRoom").append(obj);
});
};
CHAT_UI.refreshAllGroupForAddUser = function (paramGroupId) {
var groupId = paramGroupId;
$(".cancel").addClass("none");
$(".search_form input").removeClass("focus");
$(".search_form input").val("");
$(".search_form form").removeClass();
$(".content").removeClass("none");
$(".overlay_src_msg").empty();
$("#tabAllGroupOnAddUser").prop("checked", true);
//オンライン状態であればサーバから情報更新。
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#parentGroupBtnForAddUser").off();
$("#rootGroupBtnForAddUser").off();
$("#childGroupListAreaForAddUser").html("");
$("#userInGroupListForAddUser").html("");
$("#groupPathAreaForAddUser").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfoForAddUser(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtnForAddUser").on("click", function () {
CHAT_UI.refreshAllGroupForAddUser(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtnForAddUser").on("click", function () {
CHAT_UI.refreshAllGroupForAddUser(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupArea").addClass("none");
$("#parentGroupArea").addClass("none");
} else {
$("#rootGroupArea").removeClass("none");
$("#parentGroupArea").removeClass("none");
}
//該当グループのパースを表示。
var groupPathTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_PATH);
var groupPathCount = 0;
result.groupPathList.forEach(function (groupPath) {
if (!(groupPathCount < result.groupPathList.length - 3)) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathAreaForAddUser").append(obj);
}
groupPathCount++;
});
//該当グループの下位グループ表示。
var groupTemplate = getTemplate(TemplateURL.ADD_USER_GROUP_LIST);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListAreaForAddUser").append(obj);
});
//該当グループの所属ユーザを表示。
const userTemplate = getTemplate(TemplateURL.ADD_USER_USER_LIST);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupListForAddUser").append(obj);
};
......@@ -7,6 +7,8 @@ document.addEventListener("DOMContentLoaded", function () {
// iOSキーボード変換検知用
bindiOSKeyBoardEvent();
bindSearchCancel();
});
// メンバー検索
......@@ -95,6 +97,13 @@ var bindiOSKeyBoardEvent = function () {
});
};
var bindSearchCancel = function () {
$("#chatMakeRoom .search_form .cancel").click(function () {
let roomListTitle = getLocalizedString("createRoomTitle");
$("#makeRoomTitle").text(roomListTitle);
});
};
var renderRoomList = function (url, groupName, groupID) {
return Mustache.render(url, {
name: groupName,
......@@ -104,8 +113,10 @@ var renderRoomList = function (url, groupName, groupID) {
var searchUserData = function (userList) {
userList.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function (shopMemberId) {
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == user.shopMemberId;
});
if (findObj) {
......@@ -119,3 +130,89 @@ var renderUser = function (url, userList) {
userList: userList,
});
};
$("#makeRoomConfirmBtn").on("click", function (e) {
const selectedUserList =
ChatManagementCommon.selectedUserList.join(",");
NativeBridgeDelegate.saveSelectedUserList(selectedUserList);
$("#makeRoomForm").submit();
});
$("#tabAllGroupOnMakeRoom").on("click", function (e) {
ChatManagementCommon.refreshAllGroupForMakeRoom("0");
});
$("#tabMyGroupOnMakeRoom").on("click", function (e) {
CHAT_UI.refreshMyGroupForMakeRoom();
});
CHAT_UI.refreshMyGroupForMakeRoom = function () {
$(".modal-backdrop").remove();
$("#favoriteListForMakeRoom").html("");
$("#myGroupListForMakeRoom").html("");
//画面タイトル設定
let contactListTitle = getLocalizedString("userSearch");
$("#title").text(contactListTitle);
// グループの様式を読み込む
var groupTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_LIST);
// ユーザの様式を読み込む
var userTemplate = getTemplate(TemplateURL.MAKE_ROOM_USER_LIST);
var groupUserTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_USER_LIST);
NativeBridgeDelegate.updateContactInfo();
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteListForMakeRoom").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsers();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = Common.getProfileImgUrl(favoriteUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == favoriteUser.shopMemberId;
});
if (findObj) {
favoriteUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteListForMakeRoom").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsers();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupListForMakeRoom").append(obj);
});
};
var ChatManagementCommon = {};
//招待するメンバーを保存する変数
ChatManagementCommon.selectedUserList = new Array();
ChatManagementCommon.showMakeRoomConfirmView = function () {
$("#selectedUserList").html("");
var userTemplate = getTemplate(TemplateURL.MAKE_ROOM_CONFIRM_USER_LIST);
var selectedUserList = NativeBridgeDataSource.loadSelectedUsers();
selectedUserList.forEach(function (user) {
let html = Mustache.render(userTemplate, {
id: user.shopMemberId,
profileImage: Common.getProfileImgUrl(user.profileUrl),
name: user.shopMemberName,
});
let obj = jQuery.parseHTML(html);
$("#selectedUserList").append(obj);
});
$("#makeRoomBtn")
.off()
.on("click", function () {
// #36130に対応
const trimmedRoomName = $("#newRoomName").val().trim();
if (trimmedRoomName.length == 0) {
// loadingIndicatorを表示
Common.showLoadingIndicator();
let userIdList = new Array();
let userNameList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
userNameList.push(user.shopMemberName);
});
// 参加ユーザ名でルーム名を生成
let newRoomName =
currentUserInfo.loginId + "," + userNameList.join(",");
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
newRoomName,
MakeRoomFlag.MAKE_ROOM,
false
);
} else if (
trimmedRoomName.includes(";") ||
trimmedRoomName.includes("/") ||
trimmedRoomName.includes("?") ||
trimmedRoomName.includes(":") ||
trimmedRoomName.includes("@") ||
trimmedRoomName.includes("&") ||
trimmedRoomName.includes("=") ||
trimmedRoomName.includes("+") ||
trimmedRoomName.includes("$") ||
trimmedRoomName.includes(",") ||
trimmedRoomName.includes("-") ||
trimmedRoomName.includes("_") ||
trimmedRoomName.includes(".") ||
trimmedRoomName.includes("!") ||
trimmedRoomName.includes("~") ||
trimmedRoomName.includes("*") ||
trimmedRoomName.includes("'") ||
trimmedRoomName.includes("(") ||
trimmedRoomName.includes(")") ||
trimmedRoomName.includes("#") ||
trimmedRoomName.includes("\\") ||
trimmedRoomName.includes('"') ||
trimmedRoomName.includes("`")
) {
// #36147
// #36174
$("#customAlertTitle").text(getLocalizedString("invalidCharacter"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$("#customAlert")
.appendTo("body")
.modal({
backdrop: "static",
keyboard: false,
})
.on("click", "#customAlertOk", function (e) {});
} else if (trimmedRoomName.length > 20) {
// #36142
var inputText = $("#newRoomName").val().trim(); // #36142 文字列の前又は後の空白文字列を削除
// #36174
$("#customAlertTitle").text(getLocalizedString("nameTooLong"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$("#customAlert")
.appendTo("body")
.modal({
backdrop: "static",
keyboard: false,
})
.on("click", "#customAlertOk", function (e) {
$("#newRoomName").val(
inputText.substr(0, $("#newRoomName").prop("maxlength"))
);
});
} else {
//loadingIndicatorを表示
Common.showLoadingIndicator();
let userIdList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
});
// TODO: check why here using trimmedroomname instead of encodedRoomName
// ルーム名のtrimmingした後、URIencodingを行う
const encodedRoomName = encodeURIComponent(trimmedRoomName);
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
trimmedRoomName,
MakeRoomFlag.MAKE_ROOM,
false
);
}
});
$("#newRoomName").attr("placeholder", getLocalizedString("newRoomName"));
};
ChatManagementCommon.showAddUserConfirmView = function () {
$("#selectedUserList").html("");
var userTemplate = getTemplate(TemplateURL.ADD_USER_CONFIRM_USER_LIST);
var selectedUserList = NativeBridgeDataSource.loadSelectedUsers();
selectedUserList.forEach(function (user) {
let html = Mustache.render(userTemplate, {
id: user.shopMemberId,
profileImage: Common.getProfileImgUrl(user.profileUrl),
name: user.shopMemberName,
});
let obj = jQuery.parseHTML(html);
$("#selectedUserList").append(obj);
});
$("#addUserBtn")
.off()
.on("click", function () {
Common.showLoadingIndicator();
let userIdList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
});
NativeBridgeDelegate.inviteUsers(userIdList.join(","));
});
};
ChatManagementCommon.refreshAllGroupForMakeRoom = function (paramGroupId) {
var groupId = paramGroupId;
$(".cancel").addClass("none");
$(".search_form input").removeClass("focus");
$(".search_form input").val("");
$(".search_form form").removeClass();
$(".content").removeClass("none");
$(".overlay_src_msg").empty();
$("#tabAllGroupOnMakeRoom").prop("checked", true);
//オンライン状態であればサーバから情報更新。
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#parentGroupBtnForMakeRoom").off();
$("#rootGroupBtnForMakeRoom").off();
$("#childGroupListAreaForMakeRoom").html("");
$("#userInGroupListForMakeRoom").html("");
$("#groupPathAreaForMakeRoom").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfo(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtnForMakeRoom").on("click", function () {
ChatManagementCommon.refreshAllGroupForMakeRoom(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtnForMakeRoom").on("click", function () {
CHAChatManagementCommon_UI.refreshAllGroupForMakeRoom(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupArea").addClass("none");
$("#parentGroupArea").addClass("none");
} else {
$("#rootGroupArea").removeClass("none");
$("#parentGroupArea").removeClass("none");
}
//該当グループのパースを表示。
var groupPathTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_PATH);
var groupPathCount = 0;
result.groupPathList.forEach(function (groupPath) {
if (!(groupPathCount < result.groupPathList.length - 3)) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathAreaForMakeRoom").append(obj);
}
groupPathCount++;
});
//該当グループの下位グループ表示。
var groupTemplate = getTemplate(TemplateURL.MAKE_ROOM_GROUP_LIST);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListAreaForMakeRoom").append(obj);
});
//該当グループの所属ユーザを表示。
var userTemplate = getTemplate(TemplateURL.MAKE_ROOM_USER_LIST);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupListForMakeRoom").append(obj);
};
ChatManagementCommon.checkForMakeChat = function (checkMemberId) {
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == checkMemberId;
});
if (findObj) {
// remove
ChatManagementCommon.selectedUserList =
ChatManagementCommon.selectedUserList.filter(function (
shopMemberId
) {
return checkMemberId != shopMemberId;
});
$(".checkbox" + checkMemberId)
.prop("checked", false)
.trigger("change");
} else {
// add
ChatManagementCommon.selectedUserList.push(checkMemberId);
$(".checkbox" + checkMemberId)
.prop("checked", true)
.trigger("change");
}
let cnt = ChatManagementCommon.selectedUserList.length;
if (ChatManagementCommon.selectedUserList.length > 0) {
$(".select_member_num").text(cnt);
} else {
$(".select_member_num").text("0");
}
};
var ChatRoomChange = {};
document.addEventListener("DOMContentLoaded", function () {
// ルーム名変更イベント
$(".change_room_name_btn button").click(function () {
$("form").submit();
});
});
$("#roomNameChangeBtn").click(function () {
var changeRoomName = $("#roomNameInput").val();
var trimmedRoomName = $("#roomNameInput").val().trim();
if (trimmedRoomName.length == 0) {
alert(getLocalizedString("error_empty_room_name"));
return;
}
NativeBridgeDelegate.changeRoomName(changeRoomName);
});
document.addEventListener("DOMContentLoaded", function () {
no_scroll();
// メニューオーバーレイ表示
$(".menu_btn").click(function () {
var w = $(this).width();
$(this).toggleClass("hide");
$("#overlay_menu .item").toggleClass("hide");
});
// ユーザーリストオーバーレイ表示
$(".user_btn").click(function () {
var w = $(this).width();
$(this).toggleClass("hide");
$("#overlay_user_list.overlay")
.toggleClass("slidein")
.css({ transform: "translateX(" & -w & ")" });
if ($(this).hasClass("hide")) {
return_scroll();
} else {
scrollTo(0, 0);
no_scroll();
}
});
// モーダルonモーダル(前のモーダルを非表示に)
// ホスト変更ボタン押下イベント
$(".ch_host_btn").click(function () {
var target = $(this).val();
changeModal(target, "changeHostModal");
});
/* モーダルの切り替え */
function changeModal(beforeModal, afterModal) {
$(beforeModal).modal("hide");
$(afterModal).modal("show");
}
// 閉じるイベント
$(".close_btn").click(function () {
$("#overlay_add_user_list").addClass("none");
no_scroll();
});
// ユーザー追加イベント
$(".inv_btn").click(function () {
$("#overlay_add_user_list").addClass("none");
});
// ユーザー招待メンバー検索
$(".add_user_btn").click(function () {
return_scroll();
Common.showLoadingIndicator();
ChatManagementCommon.selectedUserList = [];
CHAT_UI.refreshMyGroupForAddUserInCollaboration();
$("#addUserConfirmBtnInCollaboration")
.off()
.on("click", function () {
$("#addUserInCollaboration").modal("hide");
const selectedUserList =
ChatManagementCommon.selectedUserList.join(",");
NativeBridgeDelegate.saveSelectedUserList(selectedUserList);
CHAT_UI.confirmInviteUserListInCollaboration();
});
});
});
function penOff() {
if (!$("#penBtn .pen").hasClass("disable")) {
$("#coviewPenCtrBtn").click();
$("#penBtn .pen").addClass("disable");
}
}
function no_scroll() {
document.addEventListener("mousewheel", scroll_control, { passive: false });
document.addEventListener("touchmove", scroll_control, { passive: false });
}
// スクロール禁止解除
function return_scroll() {
document.removeEventListener("mousewheel", scroll_control, {
passive: false,
});
document.removeEventListener("touchmove", scroll_control, { passive: false });
}
function scroll_control(event) {
if (event.cancelable) {
event.preventDefault();
}
}
CHAT_UI.confirmInviteUserListInCollaboration = function () {
var selectedUsers = NativeBridgeDataSource.loadSelectedUsers();
if (selectedUsers != "") {
$("#selectedUserListinCollaboration").html("");
var selectedUserList = NativeBridgeDataSource.loadSelectedUsers();
selectedUserList.forEach(function (user) {
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
});
var modalTemplate;
$.get(
{ url: "./modal_add_user_confirm.html", async: false },
function (text) {
modalTemplate = text;
}
);
let html = Mustache.render(modalTemplate, {
userList: selectedUserList,
});
let obj = jQuery.parseHTML(html);
$("#modal_add_user_confirm").html(obj);
$("#modalAddUserConfirm").modal("show");
} else {
}
$("#cancelAddUserBtn")
.off()
.on("click", function () {
console.log("cancelClick");
$("#modalAddUserConfirm").modal("hide");
$("#addUserInCollaboration").modal("show");
});
$("#addUserBtn")
.off()
.on("click", function () {
Common.showLoadingIndicator();
let userIdList = new Array();
selectedUserList.forEach(function (user) {
userIdList.push(user.shopMemberId);
});
const commaJoinedUserIDList = userIdList.join(",");
const collaborationType = CHAT_UTIL.getCollaborationType(
globalUserInfo.coWorkType
);
NativeBridgeDelegate.inviteCollaboration(
commaJoinedUserIDList,
collaborationType
);
Common.dismissLoadingIndicator();
$("#modalAddUserConfirm").modal("hide");
});
};
$("#tabMyGroupOnAddUserInCollaboration").on("click", function (e) {
CHAT_UI.refreshMyGroupForAddUserInCollaboration();
});
$("#tabAllGroupOnAddUserInCollaboration").on("click", function (e) {
CHAT_UI.refreshAllGroupForAddUserInCollaboration("0");
});
CHAT_UI.refreshMyGroupForAddUserInCollaboration = function () {
if (ChatManagementCommon.selectedUserList.length > 0) {
$(".select_member_num").text(
ChatManagementCommon.selectedUserList.length
);
} else {
$(".select_member_num").text("0");
}
$("#favoriteListForAddUserInCollaboration").html("");
$("#myGroupListForAddUserInCollaboration").html("");
$("#tabMyGroupOnAddUserInCollaboration").prop("checked", true);
// グループの様式を読み込む
var groupTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_LIST_IN_COLLABORATION
);
// ユーザの様式を読み込む
var userTemplate = getTemplate(
TemplateURL.ADD_USER_USER_LIST_IN_COLLABORATION
);
var groupUserTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_USER_LIST_IN_COLLABORATION
);
NativeBridgeDelegate.updateContactInfo();
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteListForAddUserInCollaboration").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsersNotInRoom();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = Common.getProfileImgUrl(favoriteUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == favoriteUser.shopMemberId;
});
if (findObj) {
favoriteUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteListForAddUserInCollaboration").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsersNotInRoom();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupListForAddUserInCollaboration").append(obj);
});
$("#addUserInCollaboration").modal("show");
Common.dismissLoadingIndicator();
};
CHAT_UI.refreshAllGroupForAddUserInCollaboration = function (paramGroupId) {
var groupId = paramGroupId;
$(".content").removeClass("none");
$("#tabAllGroupOnAddUserInCollaboration").prop("checked", true);
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#parentGroupBtnForAddUserInCollaboration").off();
$("#rootGroupBtnForAddUserInCollaboration").off();
$("#childGroupListAreaForAddUserInCollaboration").html("");
$("#userInGroupListForAddUserInCollaboration").html("");
$("#groupPathAreaForAddUserInCollaboration").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfoForAddUser(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtnForAddUserInCollaboration").on("click", function () {
CHAT_UI.refreshAllGroupForAddUserInCollaboration(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtnForAddUserInCollaboration").on("click", function () {
CHAT_UI.refreshAllGroupForAddUserInCollaboration(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupAreaInCollaboration").addClass("none");
$("#parentGroupAreaInCollaboration").addClass("none");
} else {
$("#rootGroupAreaInCollaboration").removeClass("none");
$("#parentGroupAreaInCollaboration").removeClass("none");
}
//該当グループのパースを表示。
var groupPathTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_PATH_IN_COLLABORATION
);
var groupPathCount = 0;
result.groupPathList.forEach(function (groupPath) {
if (!(groupPathCount < result.groupPathList.length - 3)) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathAreaForAddUserInCollaboration").append(obj);
}
groupPathCount++;
});
//該当グループの下位グループ表示。
var groupTemplate = getTemplate(
TemplateURL.ADD_USER_GROUP_LIST_IN_COLLABORATION
);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListAreaForAddUserInCollaboration").append(obj);
});
//該当グループの所属ユーザを表示。
var userTemplate = getTemplate(
TemplateURL.ADD_USER_USER_LIST_IN_COLLABORATION
);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
let findObj = ChatManagementCommon.selectedUserList.find(function (
shopMemberId
) {
return shopMemberId == groupUser.shopMemberId;
});
if (findObj) {
groupUser.checked = "checked";
}
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupListForAddUserInCollaboration").append(obj);
};
CHAT_UI.makeNameCardInCollaboration = function (shopMemberId) {
if (currentUserInfo.shopMemberId == shopMemberId) {
return;
}
var nameCardInfo = NativeBridgeDataSource.getNameCardData(shopMemberId);
var namecardTemplate;
var changeHostTemplate;
$.get({ url: "./modal_collabo_profile.html", async: false }, function (text) {
namecardTemplate = text;
});
let isCollaborationHost = coview_api.getRoomUsers();
nameCardInfo.profileUrl = Common.getProfileImgUrl(nameCardInfo.profileUrl);
let whosHost = $("#collaboration_user_" + nameCardInfo.loginId).hasClass(
"host"
);
let namecardHtml = Mustache.render(namecardTemplate, {
shopMemberId: nameCardInfo.shopMemberId,
profileUrl: nameCardInfo.profileUrl,
loginId: nameCardInfo.loginId,
name: nameCardInfo.shopMemberName,
groupPathList: nameCardInfo.groupPathList,
isFavorite: nameCardInfo.isFavorite,
isHost: isCollaborationHost,
whosHost: whosHost,
});
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on(
"click",
function () {}
);
$("#userProfileModalInCollaboration").html(namecardObj);
$("#userNameCardInCollaboration").modal("show");
};
CHAT_UI.removeFavoriteUserInCollaboration = function (shopMemberId) {
Common.showLoadingIndicator();
$("#userNameCardInCollaboration").modal("hide");
NativeBridgeDataSource.removeFavoriteUser(shopMemberId);
Common.dismissLoadingIndicator();
};
CHAT_UI.insertFavoriteUserInCollaboration = function (shopMemberId) {
$("#userNameCardInCollaboration").modal("hide");
NativeBridgeDataSource.addFavoriteUser(shopMemberId);
Common.dismissLoadingIndicator();
};
CHAT_UI.refreshJoinedCollaboration = function (loginIdList) {
for (var count = 0; count < loginIdList.length; count++) {
loginIdList[count] = loginIdList[count].replaceAll(
globalUserInfo.shopName + "_",
""
);
}
Common.showLoadingIndicator();
$("#collaboration_overlay_user_list").html("");
var joinedUserListTemplate;
$.get(
{ url: "./collaboration_overlay_user_list.html", async: false },
function (text) {
joinedUserListTemplate = text;
}
);
var joinedUserList = NativeBridgeDataSource.getUserListByLoginId(loginIdList);
var sortedUserList = new Array();
loginIdList.forEach(function (userId) {
joinedUserList.forEach(function (user) {
if (userId == user.loginId) {
sortedUserList.push(user);
}
});
});
sortedUserList.forEach(function (user) {
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(joinedUserListTemplate, {
joinedUserList: sortedUserList,
});
let obj = jQuery.parseHTML(html);
$("#collaboration_overlay_user_list").append(obj);
Common.dismissLoadingIndicator();
};
CHAT_UI.toggleCategory = function (category) {
$(category).toggleClass("open");
$(category).next().slideToggle();
};
CHAT_UI.refreshForOffline = function () {
serverInfo.isOnline = "false";
if (typeof coview_api == "undefined") {
return;
}
const alertString = getLocalizedString("err_weak_network_exit_collaboration");
alert(alertString);
NativeBridgeDelegate.finishCollaboration();
if (collaborationJoinFlg != "2") {
NativeBridgeDelegate.joinRoom(roomInfo.roomID, roomInfo.name);
} else {
NativeBridgeDelegate.openCommunicationHome();
}
};
......@@ -970,7 +970,7 @@ function recordStop(callback) {
callback();
return;
}
CHAT_UI.showLoadingIndicator();
Common.showLoadingIndicator();
// アーカイブ保存中は画面操作不可(協業終了,協業切り替え防止)
screenLock();
......@@ -1015,13 +1015,13 @@ function MainManRecordWithCollaboration(action, url, callback) {
processData: false,
success: function (res) {
recordFinished();
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
console.log(res);
callback();
},
error: function (err) {
recordFinished();
CHAT_UI.dismissLoadingIndicator();
Common.dismissLoadingIndicator();
console.log(err);
callback();
},
......
......@@ -23,7 +23,8 @@ CONTACT.searchUser = function (keyword) {
groupDataSearch(groupList);
//ユーザデータ検索
const userList = NativeBridgeDataSource.getAllGroupShopMemberByName(keyword);
const userList =
NativeBridgeDataSource.getAllGroupShopMemberByName(keyword);
userDataSearch(userList);
hasNoData = userList.length == 0 && groupList.length == 0;
......@@ -104,7 +105,7 @@ var renderGroupList = function (url, groupName, groupID, isFavorite) {
var userDataSearch = function (userList) {
userList.forEach(function (user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
user.profileUrl = Common.getProfileImgUrl(user.profileUrl);
});
var userTemplate = getTemplate(TemplateURL.USER_LIST);
let html = renderUserList(userTemplate, userList);
......@@ -116,4 +117,126 @@ var renderUserList = function (url, userList) {
return Mustache.render(url, {
userList: userList,
});
};
$("#tabMyGroup").on("click", function (e) {
$("#contactSearch").attr("placeholder", getLocalizedString("userSearch"));
CHAT_UI.refreshContactScreen();
});
$("#tabAllGroup").on("click", function (e) {
CHAT_UI.refreshAllGroupSearch("0");
});
CHAT_UI.refreshContactScreen = function () {
Common.showLoadingIndicator();
$("#userNameCard").modal("hide");
$("#favoriteList").html("");
$("#myGroupList").html("");
//画面タイトル設定
let contactListTitle = getLocalizedString("contactListTitle");
$("#title").text(contactListTitle);
// グループの様式を読み込む
const groupTemplate = getTemplate(TemplateURL.GROUP_LIST);
// ユーザの様式を読み込む
var userTemplate = getTemplate(TemplateURL.USER_LIST);
var myNamecardTemplate = getTemplate(TemplateURL.MY_NAME_CARD);
var groupUserTemplate = getTemplate(TemplateURL.GROUP_USER_LIST);
NativeBridgeDelegate.updateContactInfo();
var myInfo = NativeBridgeDataSource.getMyInfo();
myInfo.profileImagePath = Common.getProfileImgUrl(myInfo.profileUrl);
let myNamecardHtml = Mustache.render(myNamecardTemplate, {
loginId: myInfo.shopMemberId,
profileImage: myInfo.profileImagePath,
name: myInfo.shopMemberName,
groupPathList: myInfo.groupPathList,
});
let myNamecardObj = $(jQuery.parseHTML(myNamecardHtml)).on(
"click",
function () {}
);
$("#myProfileModal").html(myNamecardObj);
$("#myName").text(myInfo.shopMemberName);
$("#myImg").attr("src", myInfo.profileImagePath);
//お気に入りグループ取得。
var favoriteGroupList = NativeBridgeDataSource.getFavoriteGroups();
favoriteGroupList.forEach(function (favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
isFavorite: true,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#favoriteList").append(obj);
});
//お気に入りユーザ取得。
var favoriteUserList = NativeBridgeDataSource.getFavoriteUsers();
favoriteUserList.forEach(function (favoriteUser) {
favoriteUser.profileUrl = Common.getProfileImgUrl(favoriteUser.profileUrl);
favoriteUser.isFavorite = true;
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList,
});
let obj = jQuery.parseHTML(html);
$("#favoriteList").append(obj);
var myGroupList = NativeBridgeDataSource.getMyGroupUsers();
myGroupList.forEach(function (myGroup) {
myGroup.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
});
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#myGroupList").append(obj);
});
Common.dismissLoadingIndicator();
};
// template_group_list.html (GROUP_LIST)
// >> contact.js
CHAT_UI.favoriteGroupChange = function (groupId, star) {
if ($(star).hasClass("active")) {
CHAT_UI.removeFavoriteGroup(groupId);
} else if ($(star).hasClass("disable")) {
CHAT_UI.insertFavoriteGroup(groupId);
}
};
CHAT_UI.removeFavoriteGroup = function (groupId) {
Common.showLoadingIndicator();
var result = NativeBridgeDataSource.removeFavoriteGroup(groupId);
if (result) {
$(".group_" + groupId).removeClass("active");
$(".group_" + groupId).addClass("disable");
} else {
$(".group_" + groupId).addClass("active");
$(".group_" + groupId).removeClass("disable");
}
Common.dismissLoadingIndicator();
};
CHAT_UI.insertFavoriteGroup = function (groupId) {
Common.showLoadingIndicator();
const result = NativeBridgeDataSource.addFavoriteGroup(groupID);
if (result) {
$(".group_" + groupId).removeClass("disable");
$(".group_" + groupId).addClass("active");
} else {
$(".group_" + groupId).addClass("disable");
$(".group_" + groupId).removeClass("active");
}
Common.dismissLoadingIndicator();
};
\ No newline at end of file
var Namecard = {};
// archive_detail.html
// collaboration_overlay_user_list.html
// >> collaboration.js
// archive.js
// collaboration.js
// template_chatroom_user_list.html (CHATROOM_USER_LIST)
// >> chat-room.js
// template_group_user_list.html (GROUP_USER_LIST)
// >> contact.js
// template_user_list.html
// >> chat-room.js, contact.js
// template_user_message.html
// >> chat-websocket-message.js
// >> chat-room.js
CHAT_UI.makeNameCard = function (shopMemberId) {
if (currentUserInfo.shopMemberId == shopMemberId) {
return;
}
var nameCardInfo = NativeBridgeDataSource.getNameCardData(shopMemberId);
var namecardTemplate = getTemplate(TemplateURL.USER_NAME_CARD);
nameCardInfo.profileUrl = Common.getProfileImgUrl(nameCardInfo.profileUrl);
let namecardHtml = Mustache.render(namecardTemplate, {
shopMemberId: nameCardInfo.shopMemberId,
profileUrl: nameCardInfo.profileUrl,
name: nameCardInfo.shopMemberName,
groupPathList: nameCardInfo.groupPathList,
chat: getLocalizedString("chat"),
voice: getLocalizedString("voice"),
favorite: getLocalizedString("addFavorite"),
isFavorite: nameCardInfo.isFavorite,
});
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on(
"click",
function () {}
);
$("#userProfileModal").html(namecardObj);
$("#userNameCard").modal("show");
};
// template_user_name_card.html
CHAT_UI.startChat = function (userShopMemberId, userName) {
Common.showLoadingIndicator();
var userIdList = [];
userIdList.push(userShopMemberId);
// 参加ユーザ名でルーム名を生成
let newRoomName = currentUserInfo.loginId + "," + userName;
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
newRoomName,
MakeRoomFlag.NAME_CARD,
false
);
};
// template_user_name_card.html
CHAT_UI.startVoice = function (userShopMemberId, userName) {
Common.showLoadingIndicator();
var userIdList = [];
userIdList.push(userShopMemberId);
// 参加ユーザ名でルーム名を生成
let newRoomName = currentUserInfo.loginId + "," + userName;
NativeBridgeDelegate.createChatRoom(
ChatRoomType.DM,
userIdList.join(","),
newRoomName,
MakeRoomFlag.NAME_CARD,
true
);
};
// template_group_user_list.html (GROUP_USER_LIST)
// >> chat-room.js
// >> contact.js
// template_user_list.html
CHAT_UI.favoriteUserChange = function (shopMemberId, star) {
if ($(star).hasClass("active")) {
CHAT_UI.removeFavoriteUser(shopMemberId);
} else if ($(star).hasClass("disable")) {
CHAT_UI.insertFavoriteUser(shopMemberId);
}
};
// modal_collabo_profile.html
// collaboration.js
// template_user_name_card.html
CHAT_UI.removeFavoriteUser = function (shopMemberId) {
Common.showLoadingIndicator();
$("#userNameCard").modal("hide");
$("#myNameCard").modal("hide");
const result = NativeBridgeDataSource.removeFavoriteUser(shopMemberId);
if (result) {
$(".shopmember_" + shopMemberId).removeClass("active");
$(".shopmember_" + shopMemberId).addClass("disable");
} else {
$(".shopmember_" + shopMemberId).addClass("active");
$(".shopmember_" + shopMemberId).removeClass("disable");
}
Common.dismissLoadingIndicator();
};
// modal_collabo_profile.html
// collaboration.js
// template_user_name_card.html
CHAT_UI.insertFavoriteUser = function (shopMemberId) {
$("#userNameCard").modal("hide");
$("#myNameCard").modal("hide");
const result = NativeBridgeDataSource.addFavoriteUser(shopMemberId);
if (result) {
$(".shopmember_" + shopMemberId).removeClass("disable");
$(".shopmember_" + shopMemberId).addClass("active");
} else {
$(".shopmember_" + shopMemberId).addClass("disable");
$(".shopmember_" + shopMemberId).removeClass("active");
}
Common.dismissLoadingIndicator();
};
// contact.html
// contact.js
// template_group_list.html (GROUP_LIST)
// >> contact.js
// template_group_path.html (GROUP_PATH)
// >> self
// template_user_name_card.html
// >> CHAT_UI.makeNameCard
//全グループ検索画面表示。
CHAT_UI.refreshAllGroupSearch = function (paramGroupId) {
var groupId = paramGroupId;
if (window.location.pathname.includes("chat_room")) {
if (groupId == "") return;
NativeBridgeDelegate.setToMoveGroupId(groupId);
window.location.href = "contact.html";
}
Common.showLoadingIndicator();
$("#userNameCard").modal("hide");
$(".cancel").addClass("none");
$(".search_form input").removeClass("focus");
$(".search_form input").val("");
$(".search_form form").removeClass();
$(".content").removeClass("none");
$(".overlay_src_msg").empty();
$("#contactSearch").attr(
"placeholder",
getLocalizedString("searchUserAndGroup")
);
$("#tabAllGroup").prop("checked", true);
//オンライン状態であればサーバから情報更新。
NativeBridgeDelegate.updateGroupInfo(groupId);
//画面エリアを初期化。
$("#rootGroupBtn").off();
$("#parentGroupBtn").off();
$("#childGroupListArea").html("");
$("#userInGroupList").html("");
$("#groupPathArea").html("");
//DBからグループ情報を取得。
var result = NativeBridgeDataSource.getGroupInfo(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== "undefined") {
$("#parentGroupBtn").on("click", function () {
CHAT_UI.refreshAllGroupSearch(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== "undefined") {
if (paramGroupId == 0) {
groupId = result.rootGroupId;
}
$("#rootGroupBtn").on("click", function () {
CHAT_UI.refreshAllGroupSearch(result.rootGroupId);
});
}
if (groupId == result.rootGroupId || paramGroupId == "0") {
$("#rootGroupArea").addClass("none");
$("#parentGroupArea").addClass("none");
} else {
$("#rootGroupArea").removeClass("none");
$("#parentGroupArea").removeClass("none");
}
//該当グループのパースを表示。
const groupPathTemplate = getTemplate(TemplateURL.GROUP_PATH);
result.groupPathList.forEach(function (groupPath) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId,
});
let obj = jQuery.parseHTML(html);
$("#groupPathArea").append(obj);
});
//該当グループの下位グループ表示。
const groupTemplate = getTemplate(TemplateURL.GROUP_LIST);
result.childGroupList.forEach(function (childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId,
isFavorite: childGroup.isFavorite,
});
let obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#childGroupListArea").append(obj);
});
//該当グループの所属ユーザを表示。
const userTemplate = getTemplate(TemplateURL.USER_LIST);
result.groupUserList.forEach(function (groupUser) {
groupUser.profileUrl = Common.getProfileImgUrl(groupUser.profileUrl);
});
let html = Mustache.render(userTemplate, {
userList: result.groupUserList,
});
let obj = jQuery.parseHTML(html);
$("#userInGroupList").append(obj);
Common.dismissLoadingIndicator();
};
CHAT_UI.refreshForOnline = function () {
$("#favoriteButton").prop("disabled", false);
};
CHAT_UI.refreshForOffline = function () {
$("#favoriteButton").prop("disabled", true);
};
......@@ -7,7 +7,7 @@
<span aria-hidden="true">&times;</span>
</button>
<div class="profile_desc_ d-flex flex-row">
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/>
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" />
<div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
</div>
</div>
......@@ -18,7 +18,8 @@
</div>
<div class="modal-footer border-0 justify-content-center">
{{#isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.removeFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
<button type="button" class="border-0 bg_navy"
onclick="CHAT_UI.removeFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite.png" alt="お気に入り">
......@@ -28,7 +29,8 @@
</button>
{{/isFavorite}}
{{^isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.insertFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
<button type="button" class="border-0 bg_navy"
onclick="CHAT_UI.insertFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite_white.png" alt="お気に入り">
......@@ -38,7 +40,8 @@
</button>
{{/isFavorite}}
{{#isHost}}
<button type="button" class="ch_host_btn border-0 bg_green text_white" onclick="hostChangeRequest('{{loginId}}');" >
<button type="button" class="ch_host_btn border-0 bg_green text_white"
onclick="hostChangeRequest('{{loginId}}');">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_change_host.png" alt="ホスト変更">
......@@ -49,7 +52,8 @@
{{/isHost}}
{{^isHost}}
{{#whosHost}}
<button type="button" class="ch_host_btn border-0 bg_blue text_white" data-toggle="modal" data-target="#hostRequestModal" value="#profileModal2">
<button type="button" class="ch_host_btn border-0 bg_blue text_white" data-toggle="modal"
data-target="#hostRequestModal" value="#profileModal2">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_change_host.png" alt="ホスト変更">
......@@ -59,7 +63,8 @@
</button>
{{/whosHost}}
{{^whosHost}}
<button type="button" class="ch_host_btn border-0 bg_grey text_white" data-toggle="modal" data-target="#hostRequestModal" value="#profileModal2" disabled>
<button type="button" class="ch_host_btn border-0 bg_grey text_white" data-toggle="modal"
data-target="#hostRequestModal" value="#profileModal2"  disabled>
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_change_host.png" alt="ホスト変更">
......
<div class="category" onclick="CHAT_UI.toggleCategory(this);"><div class="category_name"><span>{{groupName}}</span></div></div>
<div class="category" onclick="CHAT_UI.toggleCategory(this);">
<div class="category_name"><span>{{groupName}}</span></div>
</div>
<ul class="p-0 chat_make_room_list">
{{#groupUserList}}
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" >
<div class="chat_item d-flex flex-row align-items-center w-100"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});">
<div class="chat_item_l_chk">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]" class="checkbox-input checkbox{{shopMemberId}}" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" {{checked}}>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]"
class="checkbox-input checkbox{{shopMemberId}}"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});" {{checked}}>
<span class="checkbox-parts"></span>
</label>
</div>
</div>
<div class="chat_item_l">
<div class="thumbnail">
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/></div>
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" /></div>
</div>
</div>
<div class="chat_item_m">
......
<div class="category" onclick="CHAT_UI.toggleCategory(this);"><div class="category_name"><span>{{groupName}}</span></div></div>
<div class="category" onclick="CHAT_UI.toggleCategory(this);">
<div class="category_name"><span>{{groupName}}</span></div>
</div>
<ul class="p-0 chat_make_room_list">
{{#groupUserList}}
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" >
<div class="chat_item d-flex flex-row align-items-center w-100"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});">
<div class="chat_item_l_chk">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]" class="checkbox-input checkbox{{shopMemberId}}" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" {{checked}}>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]"
class="checkbox-input checkbox{{shopMemberId}}"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});" {{checked}}>
<span class="checkbox-parts"></span>
</label>
</div>
</div>
<div class="chat_item_l">
<div class="thumbnail">
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/></div>
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" /></div>
</div>
</div>
<div class="chat_item_m">
......
<ul class="p-0 chat_make_room_list">
{{#userList}}
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" >
<div class="chat_item d-flex flex-row align-items-center w-100"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});">
<div class="chat_item_l_chk">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]" class="checkbox-input checkbox{{shopMemberId}}" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" {{checked}}>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]"
class="checkbox-input checkbox{{shopMemberId}}"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});" {{checked}}>
<span class="checkbox-parts"></span>
</label>
</div>
......
<ul class="p-0 chat_make_room_list">
{{#userList}}
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" >
<div class="chat_item d-flex flex-row align-items-center w-100"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});">
<div class="chat_item_l_chk">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]" class="checkbox-input checkbox{{shopMemberId}}" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" {{checked}}>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]"
class="checkbox-input checkbox{{shopMemberId}}"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});" {{checked}}>
<span class="checkbox-parts"></span>
</label>
</div>
......
<li class="d-flex align-items-center" style="border-bottom: 1px solid #e2e8f0;">
<a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupForMakeRoom({{id}});">
<a href="#" class="w-100" onclick="ChatManagementCommon.refreshAllGroupForMakeRoom({{id}});">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thumbnail-icon">
......
<a href="#" class="breadcrumb_item" onclick="CHAT_UI.refreshAllGroupForMakeRoom({{id}});"><span>{{name}}</span></a>
\ No newline at end of file
<a href="#" class="breadcrumb_item" onclick="ChatManagementCommon.refreshAllGroupForMakeRoom({{id}});"><span>{{name}}</span></a>
\ No newline at end of file
<div class="category" onclick="CHAT_UI.toggleCategory(this);"><div class="category_name"><span>{{groupName}}</span></div></div>
<div class="category" onclick="CHAT_UI.toggleCategory(this);">
<div class="category_name"><span>{{groupName}}</span></div>
</div>
<ul class="p-0 chat_make_room_list">
{{#groupUserList}}
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" >
<div class="chat_item d-flex flex-row align-items-center w-100"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});">
<div class="chat_item_l_chk">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]" class="checkbox-input checkbox{{shopMemberId}}" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" {{checked}}>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]"
class="checkbox-input checkbox{{shopMemberId}}"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});" {{checked}}>
<span class="checkbox-parts"></span>
</label>
</div>
</div>
<div class="chat_item_l">
<div class="thumbnail">
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/></div>
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" /></div>
</div>
</div>
<div class="chat_item_m">
......
<ul class="p-0 chat_make_room_list">
{{#userList}}
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});">
<div class="chat_item d-flex flex-row align-items-center w-100"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});">
<div class="chat_item_l_chk">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]" class="checkbox-input checkbox{{shopMemberId}}" onclick="CHAT_UI.checkForMakeChat({{shopMemberId}});" {{checked}}>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]"
class="checkbox-input checkbox{{shopMemberId}}"
onclick="ChatManagementCommon.checkForMakeChat({{shopMemberId}});" {{checked}}>
<span class="checkbox-parts"></span>
</label>
</div>
......
<div class="modal fade profile_modal" id="userNameCard" tabindex="-1" role="dialog" aria-labelledby="userNameCard" aria-hidden="true">
<div class="modal fade profile_modal" id="userNameCard" tabindex="-1" role="dialog" aria-labelledby="userNameCard"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header border-0">
......@@ -6,7 +7,7 @@
<span aria-hidden="true">&times;</span>
</button>
<div class="profile_desc_ d-flex flex-row">
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/>
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" />
<div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
</div>
</div>
......@@ -17,7 +18,8 @@
</div>
<div class="modal-footer border-0 justify-content-center">
{{#isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.removeFavoriteUser({{shopMemberId}})" id="favoriteButton">
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.removeFavoriteUser({{shopMemberId}})"
id="favoriteButton">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite.png" alt="お気に入り">
......@@ -27,7 +29,8 @@
</button>
{{/isFavorite}}
{{^isFavorite}}
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.insertFavoriteUser({{shopMemberId}})" id="favoriteButton">
<button type="button" class="border-0 bg_navy" onclick="CHAT_UI.insertFavoriteUser({{shopMemberId}})"
id="favoriteButton">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="icon/icon_profile_favorite_white.png" alt="お気に入り">
......@@ -55,4 +58,4 @@
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment