チャット開設画面修正

public/css/chat.css

@@ -98,6 +98,7 @@ img {
   float: left;
   padding: 0 0 0 15px;
   width: 85%;
+  padding-top: 6px;
 }
 
 #room_list, #group_list, #user_list, #select_user_list {
@@ -506,7 +507,7 @@ a.article:hover {
   padding-left: 12%;
 }
 .userCheckBox{
-  margin-left: -12%;
+  margin-left: 80%;
 }
 
 .nav-item .dropdown-toggle::after{

public/js/chat-ui.js

@@ -667,7 +667,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
     $('#backButton').off().on('click', function() {
         //loadingIndicatorを表示
         CHAT_UI.showLoadingIndicator();
-        socket.emit('getGroupList', isInvite)
+        CHAT_UI.refreshGroupSearch("0", isInvite);
     });
 
     $("#userSelectionConfirmBtn").off().on('click', function(){
@@ -709,12 +709,9 @@ CHAT_UI.showConfirmView = function(isInvite) {
 
                     // ルーム名のURIencodingを行う
                     //const encodedRoomName = encodeURIComponent(newRoomName);
-                    console.log("kdh check IdList = " + userIdList.toString);
-                    console.log("kdh check newRoomName = " + newRoomName);
-
 
                     //todo android create room api
-                    android.createChatRoom("1",userIdList.join(','),newRoomName);
+                    android.createChatRoom("1", userIdList.join(','), newRoomName);
 
 
                     /*socket.emit('createNewRoom', userIdList, encodedRoomName, function(newRoomId) {
@@ -916,7 +913,9 @@ CHAT_UI.waitForLoadingImage = function(div, callback) {
 }
 
 $('#contactButton').on('click', function(event){
-    CHAT_UI.refreshContactScreen();
+    let isCreate = false;
+    let isInvite = false;
+    CHAT_UI.refreshContactScreen(isCreate, isInvite);
 });
 
 $('#chatButton').on('click', function(event){
@@ -928,8 +927,8 @@ CHAT_UI.refreshGroupSearch = function(groupId, isInvite) {
     $('#pills-contact-tab').tab('show');
 
     //画面タイトル設定
-    let contactListTitle = getLocalizedString("contactListTitle");
-    $('.titleRoomName').text(contactListTitle);
+    let memberSelectTitle = getLocalizedString("userSearch")
+    $('.titleRoomName').text(memberSelectTitle);
 
     if (IS_ONLINE == 'true') {
         android.updateGroupInfo(groupId);
@@ -939,19 +938,13 @@ CHAT_UI.refreshGroupSearch = function(groupId, isInvite) {
 
     $('#backButton').show();
     $('#homeButton').hide();
-    if (isInvite) {
-        $('#newRoomName, .roomListIcon, .chatRoomIcon').hide();
-        $('#userSelectionConfirmBtn').show();
-        $("#userSelectionConfirmBtn").off().on('click', function(){
-            CHAT_UI.setConfirmButtonEvent(isInvite);
-        });
-    } else {
-        $('.roomListIcon, .chatRoomIcon, #newRoomName').hide();
-        $('#userSelectionConfirmBtn').show();
-        $("#userSelectionConfirmBtn").off().on('click', function(){
-            CHAT_UI.setConfirmButtonEvent(isInvite);
-        });
-    }
+
+    $('#newRoomName, .roomListIcon, .chatRoomIcon').hide();
+    $('#userSelectionConfirmBtn').show();
+    $("#userSelectionConfirmBtn").off().on('click', function(){
+        CHAT_UI.setConfirmButtonEvent(isInvite);
+    });
+
     var result = CHAT_DB.getGroupInfo(groupId);
 
     $('#childGroupList').html('');
@@ -1015,28 +1008,30 @@ CHAT_UI.refreshGroupSearch = function(groupId, isInvite) {
             if (IS_ONLINE == 'true') {
                 if ($(this).find('.userCheckBox.active').length > 0) {
                     // remove
-                    console.log("kdh check1");
                     CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
                         return groupUser.shopMemberId != element.shopMemberId;
                     });
                 } else {
                     // add
-                    console.log("kdh check2");
                     CHAT.globalSelectedUserList.push({shopMemberName:groupUser.shopMemberName, shopMemberId : groupUser.shopMemberId, profileImagePath: groupUser.profileImagePath});
                 }
-                    console.log("kdh check active");
                 $(this).find('.userCheckBox').toggleClass('active');
 
                 if (CHAT.globalSelectedUserList.length > 0) {
-                    console.log("kdh check3");
                     $('#userSelectionLength').text(CHAT.globalSelectedUserList.length);
                 } else {
-                    console.log("kdh check4");
                     $('#userSelectionLength').text('');
                 }
             }
 
         });
+        let findObj = CHAT.globalSelectedUserList.find(function(selectedUser) {
+            return selectedUser.shopMemberId == groupUser.shopMemberId;
+        })
+
+        if (findObj) {
+            $(obj).find('.userCheckBox').toggleClass('active');
+        }
 
         $('#userInGroupList').append(obj);
     })
@@ -1049,29 +1044,42 @@ CHAT_UI.refreshGroupSearch = function(groupId, isInvite) {
         } else {
             if (IS_ONLINE == 'true') {
                 android.updateRoomList();
-                CHAT_UI.refreshGroupSearch("0", isInvite);
+                CHAT_UI.refreshRoomList(chatRoomType.DM);
                 CHAT_UI.dismissLoadingIndicator();
             }
         }
     });
+
+    $('#myGroupBtn').off().on('click', function() {
+        let isCreate = true;
+        CHAT_UI.refreshContactScreen(isCreate, isInvite);
+    });
+
     CHAT_UI.dismissLoadingIndicator();
     $('.userCheckBox').show();
-    $('#myGroupArea').hide();
-    $('#groupButtonArea').hide();
+    $('#groupButtonArea').show();
     $('#allGroupArea').show();
+    $('#myGroupArea').hide();
 }
 
-CHAT_UI.refreshContactScreen = function() {
+CHAT_UI.refreshContactScreen = function(isCreate, isInvite) {
     //loadingIndicatorを表示
     $('#my_info').html('');
     $('#favorite_list').html('');
     $('#my_group_list').html('');
     CHAT_UI.showLoadingIndicator();
-    $('#pills-contact-tab').tab('show');
+    if (isCreate != true) {
+        $('#pills-contact-tab').tab('show');
+        //画面タイトル設定
+        let contactListTitle = getLocalizedString("contactListTitle");
+        $('.titleRoomName').text(contactListTitle);
+        $('#backButton').hide();
+        $('#homeButton').show();
+        $('#userSelectionConfirmBtn').hide();
+    }
+    $('#myGroupArea').show();
+    $('#allGroupArea').hide();
 
-    //画面タイトル設定
-    let contactListTitle = getLocalizedString("contactListTitle");
-    $('.titleRoomName').text(contactListTitle);
 
     // グループの様式を読み込む
     const groupTemplate = $('#group-template').html();
@@ -1086,34 +1094,36 @@ CHAT_UI.refreshContactScreen = function() {
         android.updateGroupUser();
     }
 
-    var myInfo = CHAT_DB.getMyInfo();
+    if (isCreate != true) {
+        var myInfo = CHAT_DB.getMyInfo();
 
-    myInfo.profileImagePath = CHAT.getProfileImgUrl(myInfo.profileUrl)
+        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(){
+        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(){
 
-    });
-    $('#myNamecard').append(myNamecardObj);
+        });
+        $('#myNamecard').append(myNamecardObj);
 
-    let html = Mustache.render(userTemplate, {
-        id: myInfo.shopMemberId,
-        profileImage: myInfo.profileImagePath,
-        name: myInfo.shopMemberName
-    });
+        let html = Mustache.render(userTemplate, {
+            id: myInfo.shopMemberId,
+            profileImage: myInfo.profileImagePath,
+            name: myInfo.shopMemberName
+        });
 
-    let obj = $(jQuery.parseHTML(html)).on('click', function(){
-        CHAT_UI.showNamecard('myNamecard');
-    });
+        let obj = $(jQuery.parseHTML(html)).on('click', function(){
+            CHAT_UI.showNamecard('myNamecard');
+        });
 
-    $('#my_info').append(obj);
+        $('#my_info').append(obj);
+    }
 
     var groupUserList = CHAT_DB.getMyGroupUsers();
     groupUserList.forEach(function(groupUser) {
@@ -1129,23 +1139,50 @@ CHAT_UI.refreshContactScreen = function() {
 //                android.updateUserInfo(groupUser.shopMemberId);
 //            }
             console.log('click');
-            let namecardHtml = Mustache.render(userNamecardTemplate, {
-                    loginId: groupUser.shopMemberId,
-                    profileImage: groupUser.profileImagePath,
-                    name: groupUser.shopMemberName,
-                    groupPathList: groupUser.groupPathList,
-                    chat: getLocalizedString("chat"),
-                    voice: getLocalizedString("voice"),
-                    favorite: getLocalizedString("addFavorite")
-            });
-            console.log(namecardHtml);
-            let namecardObj = $(jQuery.parseHTML(namecardHtml)).on('click', function(){
-            });
-            $('#userNamecard').html(namecardObj);
-            CHAT_UI.showNamecard('userNamecard');
+            if (isCreate != true) {
+                let namecardHtml = Mustache.render(userNamecardTemplate, {
+                        loginId: groupUser.shopMemberId,
+                        profileImage: groupUser.profileImagePath,
+                        name: groupUser.shopMemberName,
+                        groupPathList: groupUser.groupPathList,
+                        chat: getLocalizedString("chat"),
+                        voice: getLocalizedString("voice"),
+                        favorite: getLocalizedString("addFavorite")
+                });
+                console.log(namecardHtml);
+                let namecardObj = $(jQuery.parseHTML(namecardHtml)).on('click', function(){
+                });
+                $('#userNamecard').html(namecardObj);
+                CHAT_UI.showNamecard('userNamecard');
+            } else {
+                if ($(this).find('.userCheckBox.active').length > 0) {
+                    // remove
+                    CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
+                        return groupUser.shopMemberId != element.shopMemberId;
+                    });
+                } else {
+                    // add
+                    CHAT.globalSelectedUserList.push({shopMemberName:groupUser.shopMemberName, shopMemberId : groupUser.shopMemberId, profileImagePath: groupUser.profileImagePath});
+                }
+                $(this).find('.userCheckBox').toggleClass('active');
+
+                if (CHAT.globalSelectedUserList.length > 0) {
+                    $('#userSelectionLength').text(CHAT.globalSelectedUserList.length);
+                } else {
+                    $('#userSelectionLength').text('');
+                }
+            }
 
         });
 
+        let findObj = CHAT.globalSelectedUserList.find(function(selectedUser) {
+            return selectedUser.shopMemberId == groupUser.shopMemberId;
+        })
+
+        if (findObj) {
+            $(obj).find('.userCheckBox').toggleClass('active');
+        }
+
         $('#my_group_list').append(obj);
     })
     var favoriteCount = 0;
@@ -1157,6 +1194,10 @@ CHAT_UI.refreshContactScreen = function() {
 
         let obj = $(jQuery.parseHTML(html)).on('click', function(){
             //TODO need onClick Action
+            if (isCreate != true) {
+            } else {
+                CHAT_UI.refreshGroupSearch(favoriteGroup.groupId, isInvite);
+            }
         });
         favoriteCount++
         $('#favorite_list').append(obj);
@@ -1173,7 +1214,34 @@ CHAT_UI.refreshContactScreen = function() {
 
         let obj = $(jQuery.parseHTML(html)).on('click', function(){
             //TODO need onClick Action
+            if (isCreate != true) {
+            } else {
+                if ($(this).find('.userCheckBox.active').length > 0) {
+                    // remove
+                    CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
+                        return favoriteUser.shopMemberId != element.shopMemberId;
+                    });
+                } else {
+                    // add
+                    CHAT.globalSelectedUserList.push({shopMemberName:favoriteUser.shopMemberName, shopMemberId : favoriteUser.shopMemberId, profileImagePath: favoriteUser.profileImagePath});
+                }
+                $(this).find('.userCheckBox').toggleClass('active');
+
+                if (CHAT.globalSelectedUserList.length > 0) {
+                    $('#userSelectionL ength').text(CHAT.globalSelectedUserList.length);
+                } else {
+                    $('#userSelectionLength').text('');
+                }
+            }
         });
+
+        let findObj = CHAT.globalSelectedUserList.find(function(selectedUser) {
+            return selectedUser.shopMemberId == favoriteUser.shopMemberId;
+        })
+
+        if (findObj) {
+            $(obj).find('.userCheckBox').toggleClass('active');
+        }
         favoriteCount++
         $('#favorite_list').append(obj);
     })
@@ -1185,6 +1253,19 @@ CHAT_UI.refreshContactScreen = function() {
         $('#favorite_list').show();
         $('#favorite-seperator').show();
     }
+
+    if (isCreate == true) {
+        $('.userCheckBox').show();
+        $('#allGroupBtn').off().on('click', function() {
+            CHAT_UI.refreshGroupSearch("0", isInvite);
+        });
+    } else {
+        $('.userCheckBox').hide();
+        $('#allGroupBtn').off().on('click', function() {
+            CHAT_UI.refesshAllGroupSearch("0");
+        });
+    };
+
     CHAT_UI.dismissLoadingIndicator();
 }
 
@@ -1284,10 +1365,8 @@ CHAT_UI.joinRoom = function(roomId,roomName) {
 };
 
 CHAT_UI.loadMessages = function(messages, roomId, roomName) {
-
     $('#messages').html('');
     $('.titleRoomName').text(roomName).data('roomName', roomName);
-    $('#pills-chat-tab').tab('show');
     $("#message-search").attr("placeholder", getLocalizedString("chat_search_placeholder"));
     let jQueryMessages = $('#messages');
         // スクロールの変化を防ぐため以前画面の高さを保存する
@@ -1378,18 +1457,11 @@ CHAT_UI.showUserNamecard = function(shopMemberId) {
 //    })
 }
 
-$('#myGroupBtn').on('click', function (e){
-
-    $('#myGroupArea').show();
-    $('#allGroupArea').hide();
-});
-
 $('#allGroupBtn').on('click', function (e){
     CHAT_UI.refesshAllGroupSearch('0')
 });
 
 CHAT_UI.refesshAllGroupSearch = function(groupId) {
-
     if (IS_ONLINE == 'true') {
         android.updateGroupInfo(groupId);
     }
@@ -1465,6 +1537,12 @@ CHAT_UI.refesshAllGroupSearch = function(groupId) {
 
             $('#userInGroupList').append(obj);
         })
+
+    $('#myGroupBtn').off().on('click', function (e){
+        $('#myGroupArea').show();
+        $('#allGroupArea').hide();
+    });
+
     $('.userCheckBox').hide();
     $('#myGroupArea').hide();
     $('#allGroupArea').show();