Merge branch 'feature/host_change' into 'develop'

Feature/host change See merge request !212

Merge branch 'feature/host_change' into 'develop'
Feature/host change See merge request !212
4cd1a0a8 · Kim Peace · 09ce81e9 · 31cdfeef · 4cd1a0a8 · 4cd1a0a8
Commit 4cd1a0a8 authored Aug 02, 2021 by Kim Peace
17 changed files
--- a/public_new/chat_add_user.html
+++ b/public_new/chat_add_user.html
@@ -8,7 +8,7 @@
    content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1, user-scalable=0">
  <title>LiveTaskyell</title>
  <link rel="stylesheet" href="./css/notosansjp.css">
-  <link rel="stylesheet" href="./fontawesome/css/all.css" >
+  <link rel="stylesheet" href="./fontawesome/css/all.css">
  <link rel="stylesheet" href="./css/bootstrap.min.css">
  <link rel="stylesheet" href="./css/common.css">
  <link rel="stylesheet" href="./css/chat.css">
@@ -21,7 +21,7 @@
  <!-- ナビメニュー -->
  <nav>
    <div class="row h-100 align-items-center">
-      <div class="col-4 pr-0">
+      <div class="col-10 pr-0">
        <div class="nav-item">
          <div class="nav_prev">
            <a href="chat_room.html"><span>ルーム</span></a>
@@ -66,7 +66,7 @@
            <div id="myGroupListForMakeRoom"></div>
          </div>
        </div>
-      </div>
        <div class="tab_content" id="tab2_content">
          <div class="breadcrumb" id="groupPathAreaForAddUser"></div>
          <div class="chat_list">
@@ -79,6 +79,7 @@
                      <div class="thumbnail-icon">
                        <img src="icon/icon_prev_top.svg" alt="トップグループに戻る" />
                      </div>
+                    </div>
                    <div class="chat_item_m px-0">
                      <div class="d-flex flex-column">
                        <div class="chat_item_t">
@@ -87,7 +88,6 @@
                      </div>
                    </div>
                  </div>
-                </div>
                </a>
              </li>
              <li class="d-flex align-items-center" id="parentGroupArea">
@@ -97,6 +97,7 @@
                      <div class="thumbnail-icon">
                        <img src="icon/icon_prev.svg" alt="上位グループに戻る" />
                      </div>
+                    </div>
                    <div class="chat_item_m px-0">
                      <div class="d-flex flex-column">
                        <div class="chat_item_t">

--- a/public_new/js/Models/coview-userinfo.js
+++ b/public_new/js/Models/coview-userinfo.js
@@ -90,7 +90,7 @@ var CoviewUserInfo = class {
 // variable name for legacy connection to agent_app.js in coview library
 var globalUserInfo = new CoviewUserInfo(
  currentUserInfo.sid,
-  currentUserInfo.loginID,
+  currentUserInfo.shopName + "_" + currentUserInfo.loginID,
  roomInfo.roomID,
  currentUserInfo.shopName
 );
--- a/public_new/js/common/common.js
+++ b/public_new/js/common/common.js
--- a/public_new/js/common/native-bridge-delegate.js
+++ b/public_new/js/common/native-bridge-delegate.js
@@ -117,7 +117,7 @@ NativeBridgeDelegate.joinCollaboration = function (
 NativeBridgeDelegate.inviteUsers = function (userIDList) {
  if (typeof android != "undefined") {
-    android.inviteUsers(userIDList, false);
+    android.inviteUsers(userIDList);
  } else {
    webkit.messageHandlers.inviteUsers.postMessage({
      userIdList: userIDList,
@@ -146,7 +146,7 @@ NativeBridgeDelegate.finishPIPMode = function (needsAndroid = false) {
  if (deviceInfo.isiOS()) {
    webkit.messageHandlers.finishPipMode.postMessage({});
  } else if (needsAndroid && typeof android != "undefined") {
-    android.finishPip();
+    android.finishPIP();
  }
 };

--- a/public_new/js/languages/language_en.js
+++ b/public_new/js/languages/language_en.js
@@ -53,6 +53,7 @@ $.lang.en = {
    "groupChatRoom":"Group",
    "myGroup":"My Group",
    "allGroup":"All Group",
+    "message_join": "Join",
    "message_ended" : "End",
    "returnToRootGroup":"Return to Root Group",
    "returnToParentGroup":"Return to Parent Group",

--- a/public_new/js/languages/language_ja.js
+++ b/public_new/js/languages/language_ja.js
@@ -53,6 +53,7 @@ $.lang.ja = {
    "groupChatRoom":"グループ",
    "myGroup":"マイグループ",
    "allGroup":"全グループ",
+    "message_join": "参加する",
    "message_ended" : "終了しました",
    "returnToRootGroup":"トップグループに戻る",
    "returnToParentGroup":"上位グループに戻る",

--- a/public_new/js/languages/language_ko.js
+++ b/public_new/js/languages/language_ko.js
@@ -53,6 +53,7 @@ $.lang.ko = {
    "groupChatRoom":"그룹",
    "myGroup":"내그룹",
    "allGroup":"전그룹",
+    "message_join": "참가하기",
    "message_ended" : "종료되었습니다.",
    "returnToRootGroup":"최상위그룹으로 돌아가기",
    "returnToParentGroup":"상위그룹으로 돌아가기",

--- a/public_new/js/views/chats/chat-room-message.js
+++ b/public_new/js/views/chats/chat-room-message.js
@@ -98,7 +98,6 @@ ChatRoom.loadMessages = function (joinRoomID, joinRoomName) {
  let messages = NativeBridgeDataSource.getMessagesByRoomID(roomID);
  ChatRoom.prependMessage(messages);
  window.addEventListener(
    "load",
    function (event) {
@@ -167,9 +166,9 @@ ChatRoom.prependMessage = function (messages) {
    // 日付ラーベル表示
    if (
-      messageCreatedTime != checkBeforeDate 
+      messageCreatedTime != checkBeforeDate &&
-      && checkBeforeDate != "" 
+      checkBeforeDate != "" &&
-      && !isToday
+      !isToday
    ) {
      const html = ChatRoom.renderDateLabelMessage(beforeDate);
      messageElement.append(html);
@@ -255,13 +254,17 @@ ChatRoom.renderCollaborationMessage = function (message, isToday, isOtherYear) {
    collaborationInfo.collaborationType
  );
+  const collaborationJoinMessage =
+    message.messageType == MessageType.COMMUNICATIONEND
+      ? getLocalizedString("message_ended")
+      : getLocalizedString("message_join");
  const html = Mustache.render(collaborationMessageTemplate, {
    messageId: message.messageId,
    roomName: roomName,
    userCount: userInCollaboration.length,
    userList: displayUserList,
    insertDate: message.insertDate,
-    // TODO: peacekim:: should check collaborationInfo.collaborationType is string or number
    collaborationType: strCollaborationType,
    meetingId: meetingID,
    isToday: isToday,
@@ -270,6 +273,7 @@ ChatRoom.renderCollaborationMessage = function (message, isToday, isOtherYear) {
    createdAtYear: createdAtYear,
    isOtherYear: isOtherYear,
    isEnded: message.messageType == MessageType.COMMUNICATIONEND ? true : false,
+    collaborationJoinMessage: collaborationJoinMessage,
  });
  return message.message.includes("attachedImages") ||
    message.message.includes("attachedVideos")

--- a/public_new/js/views/collaboration/collaboration.js
+++ b/public_new/js/views/collaboration/collaboration.js
@@ -50,6 +50,16 @@ CollaborationUI.bindDisplayUsersButton = function () {
  });
 };
+CollaborationUI.userListSlideOut = function () {
+  const w = $(".user_btn").width();
+  $(".user_btn").removeClass("hide");
+  $("#overlay_user_list.overlay")
+    .removeClass("slidein")
+    .css({ transform: "translateX(" & -w & ")" });
+  scrollTo(0, 0);
+  CollaborationUI.bindDisableScroll();
+};
 CollaborationUI.bindChangeHostButton = function () {
  $(".ch_host_btn").click(function () {
    const target = $(this).val();
@@ -130,6 +140,7 @@ CollaborationUI.makeNameCard = function (shopMemberID) {
    isFavorite: nameCardInfo.isFavorite,
    isHost: isCollaborationHost,
    whosHost: whosHost,
+    collaborationId: globalUserInfo.shopName + "_" + nameCardInfo.loginId,
  });
  let namecardObj = $(jQuery.parseHTML(namecardHTML)).on(

--- a/public_new/js/views/collaboration/fermi-web-socket-bridge.js
+++ b/public_new/js/views/collaboration/fermi-web-socket-bridge.js
@@ -3,13 +3,12 @@ var FermiWebSocketBridge = {};
 // call from modal_collabo_profile.html
 FermiWebSocketBridge.requestHostChange = function (loginID) {
  fw.sendToMsg("others", "HOST_CHANGE_REQUEST", {
-    loginId: getFermiLoginId(loginID),
+    loginId: loginID,
  });
 };
 FermiWebSocketBridge.shareFileHost = function (collaborationType) {
  fw.sendToMsg("others", "SHARE_FILE_HOST", {
-    // TODO: Peacekim check collaboration type as coviewType
    collaborationType: collaborationType,
  });
 };
@@ -19,14 +18,14 @@ FermiWebSocketBridge.hostChangeResponse = function () {
  fw.sendToMsg("others", "HOST_CHANGE_RESPONSE", {
    isAndroid: deviceInfo.isAndroid(),
    isAble: deviceInfo.androidVersion >= ANDROID_SDK_VERSION.O,
-    loginId: currentUserInfo.loginID,
+    loginId: globalUserInfo.loginId,
  });
 };
 // PIP_END_REQUEST
 FermiWebSocketBridge.pipEndRequest = function (loginID) {
  fw.sendToMsg("others", "PIP_END_REQUEST", {
-    loginId: getFermiLoginId(loginID),
+    loginId: loginID,
  });
 };
@@ -46,6 +45,10 @@ FermiWebSocketBridge.hostRequestDone = function (hostID) {
 // GET_COLLABORATION_TYPE_RESPONSE
 FermiWebSocketBridge.getCollaborationTypeResponse = function (loginID) {
+  if (typeof meetingID == undefined) {
+    var meetingID = 0;
+  }
  fw.sendToMsg("others", "GET_COLLABORATION_TYPE_RESPONSE", {
    loginId: loginID,
    collaborationType: globalUserInfo.collaborationType,
@@ -65,7 +68,7 @@ FermiWebSocketBridge.captureRequest = function () {
  // todo: peacekim:: check if it's okay for loginID
  // instead of globalUserInfo.loginId
  fw.sendToMsg("others", "CAPTURE_REQUEST", {
-    name: currentUserInfo.loginID,
+    name: globalUserInfo.loginId,
  });
 };
@@ -83,6 +86,10 @@ FermiWebSocketBridge.changeCollaboration = function (
 // CHANGE_HOST_APPLY
 FermiWebSocketBridge.changeHostApply = function () {
  fw.sendToMsg("others", "CHANGE_HOST_APPLY", {
-    hostId: currentUserInfo.loginID,
+    hostId: globalUserInfo.loginId,
  });
 };
+FermiWebSocketBridge.hostUpdated = function () {
+  fw.sendToMsg("others", "HOST_UPDATED", {});
+};
--- a/public_new/js/views/collaboration/fermi-web-socket-message-handler.js
+++ b/public_new/js/views/collaboration/fermi-web-socket-message-handler.js
@@ -3,14 +3,14 @@ var FermiWebSocketMessageHandler = {};
 FermiWebSocketMessageHandler.bindWebSocketMessage = function () {
  fw.socket.on("message", async function (data) {
    if (g_isMainMan) {
+      // 自分がホストの場合
      FermiWebSocketMessageHandler.handleMessagesToHost(data);
    } else if (data.payload.loginId == globalUserInfo.loginId) {
      // 自分自身の場合
      FermiWebSocketMessageHandler.handleMessagesToSelf(data);
-    } else {
+    }
    // global messages
    FermiWebSocketMessageHandler.handleMessagesToAll(data);
-    }
  });
 };
@@ -43,7 +43,7 @@ FermiWebSocketMessageHandler.handleMessagesToSelf = function (data) {
  // 自分自身の場合
  switch (data.type) {
    case "HOST_CHANGE_REQUEST":
-      FermiWebSocketMessageHandler.hostChangeRequest();
+      FermiWebSocketMessageHandler.hostChangeRequest(data);
      break;
    case "PIP_END_REQUEST":
      if (globalUserInfo.collaborationType == COLLABORATION_TYPE.DOCUMENT) {
@@ -70,6 +70,8 @@ FermiWebSocketMessageHandler.handleMessagesToAll = function (data) {
      break;
    case "API_SEND_OWNER_CHANGE_COMPLETE":
      FermiWebSocketMessageHandler.apiSendOwnerChangeComplete(data);
+      CollaborationFeature.updateHost();
+      FermiWebSocketBridge.hostUpdated();
      break;
    case "API_SEND_OWNER_CHANGE_CONFIRM":
      if (globalUserInfo.collaborationType == COLLABORATION_TYPE.CAMERA) {
@@ -81,6 +83,7 @@ FermiWebSocketMessageHandler.handleMessagesToAll = function (data) {
      break;
    case "HOST_REQUEST_DONE":
      FermiWebSocketMessageHandler.hostRequestDone();
+      CollaborationFeature.updateHost();
      break;
    case "HOST_REQUEST_REJECT":
      FermiWebSocketMessageHandler.hostRequestReject(data);
@@ -89,6 +92,15 @@ FermiWebSocketMessageHandler.handleMessagesToAll = function (data) {
      if (globalUserInfo.joinType != COLLABORATION_JOIN_TYPE.INVITED) {
        FermiWebSocketMessageHandler.apiWelcome();
      }
+      CollaborationFeature.updateHost();
+      break;
+    case "SWITCH_VIDEO":
+      CollaborationFeature.updateHost();
+      CollaborationUI.userListSlideOut();
+      $(".profile_favorite_btn").click();
+      break;
+    case "HOST_UPDATED":
+      CollaborationFeature.updateHost();
      break;
    default:
      break;
@@ -166,8 +178,8 @@ FermiWebSocketMessageHandler.captureRequest = function (data) {
 };
 // HOST_CHANGE_REQUEST
-FermiWebSocketMessageHandler.hostChangeRequest = function () {
+FermiWebSocketMessageHandler.hostChangeRequest = function (data) {
-  FermiWebSocketBridge.hostChangeRequest();
+  FermiWebSocketBridge.hostChangeResponse(data);
 };
 // HOST_CHANGE_RESPONSE
@@ -185,7 +197,7 @@ FermiWebSocketMessageHandler.hostChangeResponse = function (data) {
  } else {
    FermiWebSocketBridge.pipEndRequest(data.payload.loginId);
    waitMillisecond(500);
-    CoviewBridge.changeHost(getFermiLoginId(data.payload.loginId));
+    CoviewBridge.changeHost(data.payload.loginId);
  }
 };
@@ -236,7 +248,7 @@ FermiWebSocketMessageHandler.changeHostApplyForHost = function (data) {
  waitMillisecond(500);
  if (confirm(getLocalizedString("norify_request_host_change", hostID))) {
-    CoviewBridge.changeHost(getFermiLoginId(hostID));
+    CoviewBridge.changeHost(hostID);
    NativeBridgeDelegate.setHostRequestFlg(HostRequestFlag.DONE);
  } else {
    FermiWebSocketBridge.hostRequestReject(hostID);
@@ -251,7 +263,7 @@ FermiWebSocketMessageHandler.hostRequestDone = function () {
 // HOST_REQUEST_REJECT
 FermiWebSocketMessageHandler.hostRequestReject = function (data) {
-  if (data.payload.hostId == currentUserInfo.loginID) {
+  if (data.payload.hostId == globalUserInfo.loginId) {
    alert("REJECT for owner user");
  }
  NativeBridgeDelegate.setHostRequestFlg(HostRequestFlag.DONE);
@@ -265,7 +277,8 @@ FermiWebSocketMessageHandler.getCollaborationType = function (data) {
 // GET_COLLABORATION_TYPE_RESPONSE
 FermiWebSocketMessageHandler.getCollaborationTypeResponse = function (data) {
  const collaborationType = data.payload.collaborationType;
-  const meetingID = data.payload.newMeetingId;
+  const meetingID = data.payload.newMeetingId ?? 0;
  FermiWebSocketMessageHandler.updateJoinChangeCollaboration(collaborationType);
  globalUserInfo.meetingID = meetingID;
  CollaborationUI.updateScreen(globalUserInfo.collaborationType);

--- a/public_new/js/views/collaboration/share-event-listener.js
+++ b/public_new/js/views/collaboration/share-event-listener.js
@@ -14,9 +14,15 @@ CoviewBridge.bindReadyEvent = function () {
 };
 CoviewBridge.bindFermiWebSocketOpenned = function () {
+  try {
    wc_api.addEventListener("open", async function (event) {
      FermiWebSocketMessageHandler.bindWebSocketMessage();
    });
+  } catch (err) {
+    setTimeout(() => {
+      CoviewBridge.bindFermiWebSocketOpenned();
+    }, 1000);
+  }
 };
 CoviewBridge.bindStartEvent = function () {
@@ -102,7 +108,6 @@ CoviewBridge.bindMessageEvent = function () {
    if (globalUserInfo.isLeaved) {
      return;
    }
-    let loginIDList = new Array();
    switch (json.api) {
      case "LoginResponse":
        CollaborationFeature.didReceiveLoginResponseMessage();
@@ -126,10 +131,11 @@ CoviewBridge.bindMessageEvent = function () {
      case "RoomMemberJoinedEvent":
      // fall through
      case "RoomMemberLeavedEvent":
+        attendingUsers = new Array();
        for (let key in g_participants) {
-          loginIDList.push(key);
+          attendingUsers.push(key);
        }
-        CollaborationUI.refreshJoinedCollaboration(loginIDList);
+        CollaborationUI.refreshJoinedCollaboration(attendingUsers);
        break;
      case "HostRequest":
        // to be called by
@@ -185,9 +191,7 @@ CollaborationFeature.didReceiveLoginResponseMessage = async function () {
    case COLLABORATION_JOIN_TYPE.INVITED:
    // fall through
    case COLLABORATION_JOIN_TYPE.ATTENDEE:
-      // TODO:: here to update host
      coview_api.JoinRoom(globalUserInfo.roomId, globalUserInfo.coWorkType);
      break;
    case COLLABORATION_JOIN_TYPE.HOST:
      let deleteRoomResult = JSON.parse(
@@ -228,9 +232,15 @@ CollaborationFeature.didReceivedJoinRoomInfoResponseMessage = function () {
  NativeBridgeDelegate.joinRoom(roomInfo.roomID, roomInfo.roomName);
 };
+CoviewBridge.changeHostFromModal = function () {
+  const userID = $("#changeHostModal").data("bs.modal")._config.collaborationid;
+  // call in agent_app.js
+  coview_api.HostChange(userID);
+};
 CoviewBridge.changeHost = function (userID) {
  // call in agent_app.js
-  changeOwnerSend(userID);
+  coview_api.HostChange(userID);
 };
 CoviewBridge.addLoginID = function (loginID) {
@@ -260,10 +270,11 @@ CollaborationFeature.updateHost = function () {
  }
  CollaborationUI.showHostMark(g_isMainManUsername);
+  $("#remoteVideoNameSpan").addClass("hide");
 };
 CollaborationUI.showHostButtons = function () {
  $(".host_contents").removeClass("none");
  if (globalUserInfo.collaborationType == COLLABORATION_TYPE.CAMERA) {
    $(".photo_select_button").removeClass("none");
@@ -275,7 +286,6 @@ CollaborationUI.showHostButtons = function () {
 };
 CollaborationUI.hideHostButtons = function () {
  $(".host_contents").addClass("none");
  if (globalUserInfo.collaborationType == COLLABORATION_TYPE.CAMERA) {
    $(".photo_select_button").addClass("none");
@@ -287,24 +297,29 @@ CollaborationUI.hideHostButtons = function () {
 };
 CollaborationUI.showHostMark = function (hostName) {
-  const currentUserLoginIDDiv = $(
+  // remove all host mark
-    "#collaboration_user_" + currentUserInfo.loginID
+  attendingUsers.forEach(function (userName) {
-  );
+    // hide other user's video area
-  const replaceHostIDDiv = $(
+    $(userName).hide();
-    "#collaboration_user_" + getReplacedLoginId(hostName)
+    // remove host mark
-  );
+    const user = "#collaboration_user_" + getReplacedLoginId(userName);
-  const replacedMainManUserID = $(
+    $(user).removeClass("host");
-    "#collaboration_user_" + getReplacedLoginId(g_isMainManUsername)
+  });
-  );
+  // show host video area
+  $(hostName).show();
+  // set host name as current user if host name is not set
  if (hostName == "") {
-    if (!currentUserLoginIDDiv.hasClass("host") && coview_api.getRoomUsers()) {
+    hostName = getReplacedLoginId(globalUserInfo.loginId);
-      currentUserLoginIDDiv.addClass("host");
-    }
-  } else {
-    if (!replaceHostIDDiv.hasClass("host")) {
-      replaceHostIDDiv.addClass("host");
  }
+  // find host named div
+  const hostUserDiv = $("#collaboration_user_" + getReplacedLoginId(hostName));
+  // add host mark
+  if (!hostUserDiv.hasClass("host")) {
+    hostUserDiv.addClass("host");
  }
 };
@@ -457,9 +472,9 @@ CollaborationUI.refreshJoinedCollaboration = function (loginIDList) {
    NativeBridgeDataSource.getUserListByLoginId(loginIDList);
  const sortedUserList = new Array();
-  loginIDList.forEach(function (userId) {
+  loginIDList.forEach(function (userID) {
    joinedUserList.forEach(function (user) {
-      if (userId == user.loginId) {
+      if (userID == user.loginId) {
        sortedUserList.push(user);
      }
    });

--- a/public_new/js/views/collaboration/share.js
+++ b/public_new/js/views/collaboration/share.js
@@ -2,6 +2,7 @@
 /* Functions                                           */
 /* --------------------------------------------------- */
 let coview_api = new CoviewApi();
+var attendingUsers = new Array();
 var isBoard = false;
 var backgroundFileName;

--- a/public_new/modal_collabo_change_host.html
+++ b/public_new/modal_collabo_change_host.html
@@ -15,7 +15,8 @@
            <span>キャンセル</span>
          </div>
        </button>
-        <button type="button" onclick="CoviewBridge.changeHost({{shopMemberId}});" class="profile_chat_btn border-0 bg_blue text_white">
+        <button type="button" onclick="CoviewBridge.changeHostFromModal();"
+          class="profile_chat_btn border-0 bg_blue text_white">
          <div class="d-flex flex-column">
            <span>引き渡し</span>
          </div>

--- a/public_new/modal_collabo_profile.html
+++ b/public_new/modal_collabo_profile.html
@@ -22,7 +22,8 @@
          <button type="button" class="border-0 bg_navy"
            onclick="CollaborationUI.removeFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
            <div class="d-flex flex-column">
-              <span class="star active shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange('{{shopMemberId}}',this)"></span>
+              <span class="star active shopmember_{{shopMemberId}}"
+                onclick="CHAT_UI.favoriteUserChange('{{shopMemberId}}',this)"></span>
              <span>お気に入り解除</span>
            </div>
          </button>
@@ -31,14 +32,16 @@
          <button type="button" class="border-0 bg_navy"
            onclick="CollaborationUI.insertFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
            <div class="d-flex flex-column">
-              <span class="star disable shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange('{{shopMemberId}}',this)"></span>
+              <span class="star disable shopmember_{{shopMemberId}}"
+                onclick="Namecard.favoriteUserChange('{{shopMemberId}}',this)"></span>
              <span>お気に入り登録</span>
            </div>
          </button>
          {{/isFavorite}}
          {{#isHost}}
-          <button type="button" class="ch_host_btn border-0 bg_green text_white"
+          <button type="button" class="ch_host_btn border-0 bg_green text_white" data-toggle="modal"
-            onclick="FermiWebSocketBridge.requestHostChange('{{loginId}}');">
+            data-target="#changeHostModal" value="#profileModal2" data-collaborationId='{{collaborationId}}'>
+            <!-- onclick="FermiWebSocketBridge.requestHostChange('{{collaborationId}}');"> -->
            <div class="d-flex flex-column">
              <div class="img_wrap">
                <img src="icon/icon_change_host.svg" alt="ホスト変更">

--- a/public_new/template/template_close_collaboration_message.html
+++ b/public_new/template/template_close_collaboration_message.html
+<!-- TODO: peacekim not using this file-->
 <!-- 通話 -->
 <div class="collabo_area_container chat_message" data-messageid="{{messageId}}">
  <!-- 時刻 -->

--- a/public_new/template/template_open_collaboration_message.html
+++ b/public_new/template/template_open_collaboration_message.html
@@ -34,15 +34,10 @@
        <div class="collabo_btn">
          <button class="collaboation_join_button" type="button" name="button"
            class="d-flex flex-row justify-content-center align-items-center"
-            onclick="NativeBridgeDelegate.joinCollaboration('{{collaborationType}}', {{meetingId}})" {{#isEnded}} disabled
+            onclick="NativeBridgeDelegate.joinCollaboration('{{collaborationType}}', {{meetingId}})" {{#isEnded}}
-            {{/isEnded}}>
+            disabled {{/isEnded}}>
            <img src="icon/icon_profile_phone_white.svg" alt="通話">
-            {{#isEnded}}
+            <span class="collaboration_join_message">{{collaborationJoinMessage}}</span>
-            <span class="collaboration_join_message">終了しました</span>
-            {{/isEnded}}
-            {{^isEnded}}
-            <span class="collaboration_join_message">参加する</span>
-            {{/isEnded}}
          </button>
        </div>
      </div>