Merge branch 'release_sp3' into 'bugFix/#42192操作改善1'

# Conflicts:
#   public_new/chat_room.html

public_new/archive.html

@@ -18,7 +18,7 @@
 
   <script>
     window.addEventListener('DOMContentLoaded', function() {
-      CHAT_DB.callGetArchiveList();
+      CHAT_DB.getArchiveList();
     });
   </script>
 </head>
@@ -135,12 +135,31 @@
   </li>
 </script>
 <script>
+  String.prototype.replaceAll = function(org, dest) {
+    return this.split(org).join(dest);
+  }
+
   let CHAT_SERVER_URL = '';
   let CMS_SERVER_URL = '';
   let ASSET_PATH = './';
   let PLATFORM = '';
   let IS_MOBILE = true;
   let IS_ONLINE = false;
+  $("#chatMenuModal").load("./modal_chat_menu.html");
+  $("#loadingArea").load("./loading.html");
+  android.getLoginParameter();
+  android.getGlobalParameter();
+  webkit.messageHandlers.loginInfoRequestMessageHandlerId.postMessage({});
+  webkit.messageHandlers.getGlobalParameter.postMessage({});
+
+  function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
+    CHAT_SERVER_URL = chatServerUrl;
+    CMS_SERVER_URL = cmsServerUrl;
+    PLATFORM = platform;
+    IS_MOBILE = isMobile;
+    IS_ONLINE = isOnline;
+    CHAT_UI.loadMessages(CHAT.globalLoginParameter.roomId, CHAT.globalLoginParameter.roomName);
+  };
 </script>
 </body>
 

public_new/archive_detail.html

@@ -22,7 +22,7 @@
       var urlSearch = location.search.substring(1).split('&');
       var kv = urlSearch[0].split('=');
       urlPrm[kv[0]]=kv[1];
-      CHAT_DB.callGetArchiveDetail(urlPrm.archiveId);
+      CHAT_DB.getArchiveDetail(urlPrm.archiveId);
     });
   </script>
 </head>

public_new/chat.html

@@ -129,6 +129,8 @@
     android.getLoginParameter();
     android.getGlobalParameter();
     android.saveSelectedUserList("");
+    webkit.messageHandlers.loginInfoRequestMessageHandlerId.postMessage({});
+    webkit.messageHandlers.getGlobalParameter.postMessage({});
 
     function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
       CHAT_SERVER_URL = chatServerUrl;

public_new/chat_room.html

@@ -138,12 +138,6 @@
   <div id="userProfileModal"></div>
   <div id="chatMenuModal"></div>
   <div id="pictureModal"></div>
-  <!-- メニューモーダル -->
-  <!--#include virtual="modal_chat_menu.html" -->
-  <!-- プロフィールモーダル -->
-  <!--#include virtual="modal_chat_profile.html" -->
-  <!-- 写真メッセージーモーダル -->
-  <!--#include virtual="modal_chat_picture.html" -->
 
   <script src="./js/libs/jquery-3.3.1.min.js"></script>
   <script src="./js/libs/socket.io.js"></script>
@@ -186,6 +180,8 @@
     $("#loadingArea").load("./loading.html");
     android.getLoginParameter();
     android.getGlobalParameter();
+    webkit.messageHandlers.loginInfoRequestMessageHandlerId.postMessage({});
+    webkit.messageHandlers.getGlobalParameter.postMessage();
 
     function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
       CHAT_SERVER_URL = chatServerUrl;

public_new/contact.html

@@ -229,6 +229,9 @@
     $("#loadingArea").load("./loading.html");
     android.getLoginParameter();
     android.getGlobalParameter();
+    webkit.messageHandlers.loginInfoRequestMessageHandlerId.postMessage({});
+    webkit.messageHandlers.getGlobalParameter.postMessage({});
+
     function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
       CHAT_SERVER_URL = chatServerUrl;
       CMS_SERVER_URL = cmsServerUrl;

public_new/css/chat.css

@@ -558,6 +558,7 @@ input[name="tab_item"] {
   border-radius: 8px;
   background-color: #ffffff;
   font-size: 18px;
+  word-break: break-word;
 }
 .room_left-text.latest .text,
 .room_left-text.latest .img_wrap {
@@ -623,6 +624,7 @@ input[name="tab_item"] {
   margin: 0;
   margin-left: 80px;
   font-size: 18px;
+  word-break: break-word;
 }
 /* 吹き出し */
 .room_right .text::after {
@@ -742,9 +744,6 @@ input[name="tab_item"] {
 
 /**************************** modal *************************/
 /* メニューモーダル */
-.modal-body {
-    padding-left: 0.6rem;
-}
 .modal-body #modal_image {
     width: 100%;
     height: 100%;
@@ -844,3 +843,12 @@ input[name="tab_item"] {
     max-width: 75%;
   }
 }
+/*************************** ネームカード *************************/
+.prifile_name {
+  padding-top: 20px;
+  padding-bottom: 20px;
+  line-height: 1.2;
+  font-size: 16px;
+  margin-left: auto;
+  margin-right: auto;
+}
\ No newline at end of file

public_new/css/common.css

@@ -152,16 +152,17 @@ main {
 }
 
 .profile_modal #userNameCard-scroll {
-    height: 200px;
-    overflow: auto;
+    height: 150px;
+    overflow: scroll;
     padding-top: 0rem;
-    padding-right: 0rem;
+    padding-right: 1rem;
     margin-top: 1rem;
 }
+.profile_modal .modal-header { display: table; }
 .profile_modal .modal-header,.profile_modal .modal-body { padding-bottom: 0; }
-.profile_modal .modal-footer button { width: 33%; padding: 5px;}
-.profile_modal.w_50 .modal-footer button { width: 50%; padding: 5px;}
-.profile_modal .modal-header .profile_desc{ width: 100%;}
+.profile_modal .modal-footer button { width: 33%; padding: 5px; }
+.profile_modal.w_50 .modal-footer button { width: 50%; padding: 5px; }
+.profile_modal .modal-header .profile_desc { width: 100%; }
 .profile_modal .modal-header .profile_name {
   width: 100%;
   text-align: center;

public_new/js/chat-db.js

 // 名前空間
 var CHAT_DB = {};
 
+// ios用
+function callNativeApp(iosKey, jsonData) {
+    console.log("callNativeApp called");
+    var result;
+    try {
+        var key = iosKey;
+        var data = jsonData;
+        var payload = {key: key, data: data};
+        // payloadの形 {"type":"SJbridge","data":{"name":"abc","role":"dev"}}
+        // resにObjective-cからのレスポンスが返る
+        result = prompt(JSON.stringify (payload));
+        console.log(result);
+    } catch(err) {
+        console.log('The native context does not exist yet');
+    }
+    return result;
+}
 
 //ロカールDBからルーム一覧情報を取得
 CHAT_DB.getRoomList = function(roomType, keyWord) {
     if (CHAT_UTIL.isIOS()) {
-        return JSON.parse(iosRoomList);        
+        return JSON.parse(callNativeApp("getRoomList", {"roomType": roomType, "keyWord": keyWord}));
     } else if (CHAT_UTIL.isAndroid()) {
     	return JSON.parse(android.getRoomList(roomType, keyWord));
     }
 };
 
-var iosRoomList;
-CHAT_DB.getIosRoomList = function(roomList) {
-	iosRoomList = roomList;
-    CHAT_DB.getRoomList(0);
-};
-
 CHAT_DB.callGetRoomList = function(roomType) {
     if (CHAT_UTIL.isIOS()) {
-        webkit.messageHandlers.getRoomList.postMessage({roomType});
+        return JSON.parse(callNativeApp("getRoomList", {"roomType": roomType}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getRoomList(roomType));
@@ -27,10 +38,9 @@ CHAT_DB.callGetRoomList = function(roomType) {
 }
 
 //ロカールDBからログインしたユーザのデータを取得する。
-CHAT_DB.getMyInfo = function(input) {
+CHAT_DB.getMyInfo = function() {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
-        
+        return JSON.parse(callNativeApp("getMyInfo", {}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getMyInfo());
@@ -39,7 +49,7 @@ CHAT_DB.getMyInfo = function(input) {
 
 CHAT_DB.getMessages = function(roomId) {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getMessages", {"roomId": roomId}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getMessageList(roomId));
@@ -57,7 +67,7 @@ CHAT_DB.getFavoriteUsersNotInRoom = function() {
 
 CHAT_DB.getFavoriteUsers = function() {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getFavoriteUsers", {}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getFavoriteUsers());
@@ -66,7 +76,7 @@ CHAT_DB.getFavoriteUsers = function() {
 
 CHAT_DB.getFavoriteGroups = function() {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getFavoriteGroups", {}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getFavoriteGroups());
@@ -75,7 +85,7 @@ CHAT_DB.getFavoriteGroups = function() {
 
 CHAT_DB.getMyGroupUsers = function() {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getMyGroupUsers", {}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getMyGroupUsers());
@@ -84,7 +94,7 @@ CHAT_DB.getMyGroupUsers = function() {
 
 CHAT_DB.getGroupInfo = function(groupId) {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getGroupInfo", {"groupId": groupId}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getGroupInfo(groupId));
@@ -103,7 +113,7 @@ CHAT_DB.loadSelectedUsers = function() {
 
 CHAT_DB.getNameCardData = function(shopMemberId) {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getNameCardData", {"shopMemberId": shopMemberId}));
     } else if (CHAT_UTIL.isAndroid()) {
     	return JSON.parse(android.getNameCardData(shopMemberId));
     }
@@ -111,7 +121,7 @@ CHAT_DB.getNameCardData = function(shopMemberId) {
 
 CHAT_DB.getMyGroupShopMemberByName = function(shopMemberName) {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getMyGroupShopMemberByName", {"shopMemberName": shopMemberName}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getMyGroupShopMemberByName(shopMemberName));
@@ -129,7 +139,7 @@ CHAT_DB.getMyGroupShopMemberNotInRoomByName = function(shopMemberName) {
 
 CHAT_DB.getAllGroupShopMemberByName = function(shopMemberName) {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getAllGroupShopMemberByName", {"shopMemberName": shopMemberName}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getAllGroupShopMemberByName(shopMemberName));
@@ -147,7 +157,7 @@ CHAT_DB.getAllGroupShopMemberNotInRoomByName = function(shopMemberName) {
 
 CHAT_DB.getGroupByName = function(groupName) {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getGroupByName", {"groupName": groupName}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getGroupByName(groupName));
@@ -156,7 +166,7 @@ CHAT_DB.getGroupByName = function(groupName) {
 
 CHAT_DB.getUsersInRoom = function(roomId) {
     if (CHAT_UTIL.isIOS()) {
-        //TODO IOS処理追加必要
+        return JSON.parse(callNativeApp("getUsersInRoom", {"roomId": roomId}));
     } else if (CHAT_UTIL.isAndroid()) {
         //String形式をJsonに変更してReturn
     	return JSON.parse(android.getUsersInRoom(roomId));
@@ -164,25 +174,9 @@ CHAT_DB.getUsersInRoom = function(roomId) {
 }
 
 // アーカイブ一覧
-var iosArchiveList;
-
-CHAT_DB.callGetArchiveList = function() {
-    if (CHAT_UTIL.isIOS()) {
-        iosArchiveList = "";
-        webkit.messageHandlers.getArchiveList.postMessage();
-    } else if (CHAT_UTIL.isAndroid()) {
-        CHAT_UI.refreshArchiveScreen();
-    }
-};
-
-CHAT_DB.getIosArchiveList = function(archiveList) {
-    iosArchiveList = archiveList;
-    CHAT_UI.refreshArchiveScreen();
-};
-
 CHAT_DB.getArchiveList = function() {
     if (CHAT_UTIL.isIOS()) {
-        return JSON.parse(iosArchiveList);
+        return JSON.parse(callNativeApp("getArchiveList", {}));
     } else if (CHAT_UTIL.isAndroid()) {
         // TODO
     }
@@ -190,58 +184,25 @@ CHAT_DB.getArchiveList = function() {
 
 CHAT_DB.updateArchiveList = function() {
     if (CHAT_UTIL.isIOS()) {
-        webkit.messageHandlers.updateArchiveList.postMessage();
+        webkit.messageHandlers.updateArchiveList.postMessage({});
     } else if (CHAT_UTIL.isAndroid()) {
         // TODO
     }
 };
 
 // アーカイブ一覧検索
-var iosSearchArchiveList;
-var searchWord;
-
-CHAT_DB.callGetArchiveByName = function(keyword) {
-    if (CHAT_UTIL.isIOS()) {
-        iosSearchArchiveList = "";
-        searchWord = keyword;
-        webkit.messageHandlers.getArchiveByName.postMessage({keyword});
-    } else if (CHAT_UTIL.isAndroid()) {
-        ARCHIVE_UI.refreshSearchScreen(keyword);
-    }
-};
-
-CHAT_DB.getIosSearchArchiveList = function(archiveList) {
-    iosSearchArchiveList = archiveList;
-    ARCHIVE_UI.refreshSearchScreen(searchWord);
-};
-
 CHAT_DB.getArchiveByName = function(archiveName) {
     if (CHAT_UTIL.isIOS()) {
-        return JSON.parse(iosSearchArchiveList);
+        return JSON.parse(callNativeApp("getArchiveByName", {"archiveName": archiveName}));
     } else if (CHAT_UTIL.isAndroid()) {
         // TODO
     }
 };
 
 // アーカイブ詳細
-var iosArchiveDetail;
-CHAT_DB.getIosArchiveDetail = function(archiveDetail) {
-    iosArchiveDetail = archiveDetail;
-    CHAT_DB.callGetArchiveDetail(archiveDetail.archiveId);
-};
-
-CHAT_DB.callGetArchiveDetail = function(archiveId) {
-    if (CHAT_UTIL.isIOS()) {
-        iosArchiveDetail = "";
-        webkit.messageHandlers.getArchiveDetail.postMessage({archiveId});
-    } else if (CHAT_UTIL.isAndroid()) {
-        CHAT_UI.refreshArchiveDetailScreen(archiveId);
-    }
-};
-
-CHAT_DB.getArchiveDetail = function() {
+CHAT_DB.getArchiveDetail = function(archiveId) {
     if (CHAT_UTIL.isIOS()) {
-        return JSON.parse(iosArchiveDetail);
+        return JSON.parse(callNativeApp("getArchiveDetail", {"archiveId": archiveId}));
     } else if (CHAT_UTIL.isAndroid()) {
         // TODO
     }

public_new/js/chat-ui.js

@@ -126,6 +126,7 @@ $('#room-search').on('input', function(event) {
     } else {
         if (IS_ONLINE == 'true') {
             android.updateRoomList();
+            webkit.messageHandlers.updateRoomList.postMessage({});
             CHAT_UI.refreshRoomList(chatRoomType.DM);
             CHAT_UI.dismissLoadingIndicator();
         }
@@ -417,6 +418,7 @@ $('a[data-toggle="pill"]').on('show.bs.tab', function(e) {
                 if (IS_ONLINE == 'true') {
                     socket.emit('leaveRoom', function() {
                         android.updateRoomList();
+                        webkit.messageHandlers.updateRoomList.postMessage({});
                     });
                 }
                 CHAT_UI.refreshRoomList(chatRoomType.DM);
@@ -684,6 +686,17 @@ CHAT_UI.showConfirmView = function(isInvite) {
                     //todo android create room api
                     android.createChatRoom("1",userIdList.join(','),newRoomName);
 
+                    if (CHAT_UTIL.isIOS()) {
+                        // TODO
+                        var roomDic = {
+                            roomType: "1",
+                            userIdList: userIdList.join(','),
+                            roomName: newRoomName
+                        };
+                        webkit.messageHandlers.createChatRoom.postMessage({roomDic});
+                    }
+                    
+
 
                     /*socket.emit('createNewRoom', userIdList, encodedRoomName, function(newRoomId) {
                         socket.emit('joinRoom', newRoomId, newRoomName, function() {
@@ -932,6 +945,11 @@ CHAT_UI.refreshContactScreen = function() {
         android.updateMyInfo();
         android.updateGroupUser();
         android.updateFavorite();
+
+        webkit.messageHandlers.updateGroupInfo.postMessage({'0'});
+        webkit.messageHandlers.updateMyInfo.postMessage({});
+        webkit.messageHandlers.updateGroupUser.postMessage({});
+        webkit.messageHandlers.updateFavorite.postMessage({});
     }
 
     var myInfo = CHAT_DB.getMyInfo();
@@ -1007,6 +1025,7 @@ CHAT_UI.refreshRoomList = function(roomType) {
 
     if (IS_ONLINE == 'true') {
         android.updateRoomList();
+        webkit.messageHandlers.updateRoomList.postMessage({});
     }
     var rooms = CHAT_DB.getRoomList(roomType, null);
     CHAT.globalIsInvite = false;
@@ -1044,7 +1063,7 @@ CHAT_UI.refreshRoomList = function(roomType) {
         var displayMsg;
         //TODO 協業の場合処理追加必要
         if (room.messageType == messageType.TEXT || room.messageType == messageType.TEXT) displayMsg = room.message;
-        if (room.messageType == messageType.IMAGE || room.messageType == messageType.SYSTEM) displayMsg = getLocalizedString("image");
+        if (room.messageType == messageType.IMAGE || room.messageType == messageType.VIDEO) displayMsg = getLocalizedString("image");
         var attendUserName = [];
         room.attendUsers.forEach(function(user) {
             user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
@@ -1094,12 +1113,14 @@ CHAT_UI.refreshRoomList = function(roomType) {
 CHAT_UI.joinRoom = function(roomId,roomName) {
     //native側に入場対象のroomId,roomNameを保存。(ルーム詳細画面初期化の時に使用。)
     android.joinRoom(roomId,roomName);
+    webkit.messageHandlers.roomInfosaveMessageHandlerId.postMessage({"roomId": roomId, "roomName": roomName});
 };
 
 CHAT_UI.loadMessages = function(roomId, roomName) {
     if (IS_ONLINE == 'true') {
         CHAT_SOCKET.connectSocket();
         android.updateMessages(roomId);
+        webkit.messageHandlers.updateMessages.postMessage({roomId});
         socket.emit('exitRoom',roomId);
         socket.emit('joinRoom', roomId, roomName, function() {
         });
@@ -1290,6 +1311,7 @@ CHAT_UI.removeFavoriteUser = function(shopMemberId) {
     $('#userNameCard').modal('hide');
     $('#myNameCard').modal('hide');
     android.removeFavoriteUser(shopMemberId);
+    webkit.messageHandlers.removeFavoriteUser.postMessage({shopMemberId});
     $('.shopmember_'+shopMemberId).removeClass('active');
     $('.shopmember_'+shopMemberId).addClass('disable');
     CHAT_UI.dismissLoadingIndicator();
@@ -1313,6 +1335,7 @@ CHAT_UI.insertFavoriteUser = function(shopMemberId) {
 
 CHAT_UI.removeFavoriteGroup = function(groupId) {
     android.removeFavoriteGroup(groupId);
+    webkit.messageHandlers.removeFavoriteGroup.postMessage({groupId});
     $('.group_'+groupId).removeClass('active');
     $('.group_'+groupId).addClass('disable');
     CHAT_UI.dismissLoadingIndicator();
@@ -1350,6 +1373,7 @@ CHAT_UI.refreshAllGroupSearch = function(paramGroupId) {
     //オンライン状態であればサーバから情報更新。
     if (IS_ONLINE == 'true') {
         android.updateGroupInfo(groupId);
+        webkit.messageHandlers.updateGroupInfo.postMessage({groupId});
     }
 
     //画面エリアを初期化。
@@ -1443,6 +1467,7 @@ CHAT_UI.startChat = function(userShopMemberId,userName) {
     // 参加ユーザ名でルーム名を生成
     let newRoomName = CHAT.globalLoginParameter.loginId + ',' +userName;
     android.createChatRoom(chatRoomType.DM, userIdList.join(','),newRoomName);
+    webkit.messageHandlers.createChatRoom.postMessage({"roomType": chatRoomType.DM, "userIdList": userIdList.join(','), "roomName": newRoomName});
     CHAT_UI.hideNamecard(nameCardAreaId.USER);
 };
 

public_new/js/chat-websocket.js

@@ -199,6 +199,7 @@ function setSocketAction () {
             text: message.text,
             from: message.from,
             profileImage: message.profileImagePath,
+            shopMemberId: message.userId,
             createdAtDay: messageTime.createdAtDay,
             createdAtTime: messageTime.createdAtTime,
             isToday: true

public_new/js/chat.js

@@ -135,14 +135,18 @@ CHAT.uploadImage = function(formData) {
             }
 
             let downloadPath = CMS_SERVER_URL + '/chatapi/file/download?fileName=' + imageName + '&roomId=' + CHAT.globalLoginParameter.roomId;
-            const aTag = $('<a/>', {id:"attachedImages"})
-            const image = $('<img/>',{src:imgPath, width:'auto',style:'max-width:100%'});
+
+            var videoSrc = CMS_SERVER_URL + '/chatapi/file/getImage?fileName=' + res.fileName + '&roomId=' + CHAT.globalLoginParameter.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});
 
-            aTag.append(image);
-            aTag.append(downloadIcon);
+            videoTag.append(source);
+            totalDiv.append(videoTag);
+            totalDiv.append(downloadIcon);
 
-            let text = aTag.prop('outerHTML');
+            let text = totalDiv.prop('outerHTML');
             let encodedText
             try {
                 encodedText = encodeURIComponent(text)

public_new/template/template_user_message.html

 <div class="room_left">
   <figure>
-    <a href="#" data-toggle="modal" data-target="#profileModal1"><img src="{{profileImage}}" onError="this.src='./img/noImage.png'"></a>
+    <a href="#" data-toggle="modal" data-target="#profileModal1">
+      <img src="{{profileImage}}" onError="this.src='./img/noImage.png'" onclick="CHAT_UI.makeNameCard({{shopMemberId}})">
+    </a>
   </figure>
   <div class="room_left-text">
     <div class="name">{{from}}</div>

public_new/template/template_user_name_card.html

@@ -2,13 +2,13 @@
   <div class="modal-dialog modal-dialog-centered" role="document">
     <div class="modal-content">
       <div class="modal-header border-0">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
         <div class="prifile_desc d-flex flex-row">
           <img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/>
           <div class="prifile_name"><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" id="userNameCard-scroll">
         {{#groupPathList}}