Skip to content

C
chat_webview
Commit ead1dbfb by Kang Donghun
Options

チャット一覧画面の詳細検索項目（グループ）修正

parent 386a6f81
Showing with 106 additions and 204 deletions
public/index.html
...@@ -232,7 +232,7 @@ ...@@ -232,7 +232,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="text-center border-bottom-gray"> <div id="groupButtonArea" class="text-center border-bottom-gray">
<button type="button" class="btn btn-primary chat-list-type-btn" id="myGroupBtn"></button> <button type="button" class="btn btn-primary chat-list-type-btn" id="myGroupBtn"></button>
<button type="button" class="btn btn-primary chat-list-type-btn" id="allGroupBtn"></button> <button type="button" class="btn btn-primary chat-list-type-btn" id="allGroupBtn"></button>
</div> </div>
...@@ -258,15 +258,6 @@ ...@@ -258,15 +258,6 @@
<div class="user_ib"> <div class="user_ib">
<h5>MOVE TO ROOT GROUP</h5> <h5>MOVE TO ROOT GROUP</h5>
</div> </div>
<div class="squareBox userCheckBox" data-name="{{name}}" data-id="{{id}}">
<div class="squareBoxContent">
<div>
<span>
<i class="fas fa-check"></i>
</span>
</div>
</div>
</div>
</div> </div>
</div> </div>
<div class="user_list col-12" id="parentGroupBtn"> <div class="user_list col-12" id="parentGroupBtn">
...@@ -274,15 +265,6 @@ ...@@ -274,15 +265,6 @@
<div class="user_ib"> <div class="user_ib">
<h5>MOVE TO PARENTS GROUP</h5> <h5>MOVE TO PARENTS GROUP</h5>
</div> </div>
<div class="squareBox userCheckBox" data-name="{{name}}" data-id="{{id}}">
<div class="squareBoxContent">
<div>
<span>
<i class="fas fa-check"></i>
</span>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
......
public/js/chat-ui.js
...@@ -55,11 +55,12 @@ $(window).on('resize', function() { ...@@ -55,11 +55,12 @@ $(window).on('resize', function() {
// チャットルーム生成ボタン処理 // チャットルーム生成ボタン処理
$('#createChatRoom').on('click', function() { $('#createChatRoom').on('click', function() {
//loadingIndicatorを表示 //loadingIndicatorを表示
CHAT_UI.showLoadingIndicator(); // CHAT_UI.showLoadingIndicator();
let isInvite = false; let isInvite = false;
CHAT.globalIsInvite = isInvite; CHAT.globalIsInvite = isInvite;
socket.emit('getGroupList', isInvite); // socket.emit('getGroupList', isInvite);
CHAT_UI.refreshGroupSearch('0', isInvite);
}); });
// Room Delete // Room Delete
...@@ -480,6 +481,9 @@ $('a[data-toggle="pill"]').on('show.bs.tab', function (e) { ...@@ -480,6 +481,9 @@ $('a[data-toggle="pill"]').on('show.bs.tab', function (e) {
$("#backButton").hide(); $("#backButton").hide();
$('.titleRoomName').show(); $('.titleRoomName').show();
$('#myGroupArea').show(); $('#myGroupArea').show();
$('#newRoomName').val('');
$('#userSelectionLength').text('');
CHAT.globalSelectedUserList = [];
$('#allGroupArea').hide(); $('#allGroupArea').hide();
$('#my_info').show(); $('#my_info').show();
$('#bottomNav').show(); $('#bottomNav').show();
...@@ -639,7 +643,7 @@ CHAT_UI.showConfirmView = function(isInvite) { ...@@ -639,7 +643,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
let html = Mustache.render(template, { let html = Mustache.render(template, {
id: user.shopMemberId, id: user.shopMemberId,
profileImage: user.profileImagePath, profileImage: user.profileImagePath,
name: user.loginId name: user.shopMemberName
}); });
// TODO 次のコミットに参考事項 // TODO 次のコミットに参考事項
// チャットルーム開設画面で参加ユーザー削除用チェックロジックが残っているので // チャットルーム開設画面で参加ユーザー削除用チェックロジックが残っているので
...@@ -705,7 +709,8 @@ CHAT_UI.showConfirmView = function(isInvite) { ...@@ -705,7 +709,8 @@ CHAT_UI.showConfirmView = function(isInvite) {
// ルーム名のURIencodingを行う // ルーム名のURIencodingを行う
//const encodedRoomName = encodeURIComponent(newRoomName); //const encodedRoomName = encodeURIComponent(newRoomName);
console.log("kdh check IdList = " + userIdList.toString);
console.log("kdh check newRoomName = " + newRoomName);
//todo android create room api //todo android create room api
...@@ -915,13 +920,35 @@ $('#chatButton').on('click', function(event){ ...@@ -915,13 +920,35 @@ $('#chatButton').on('click', function(event){
CHAT_UI.refreshRoomList(chatRoomType.DM); CHAT_UI.refreshRoomList(chatRoomType.DM);
}); });
CHAT_UI.refreshGroupSearch = function(isInvite) { CHAT_UI.refreshGroupSearch = function(groupId, isInvite) {
CHAT_UI.showLoadingIndicator();
$('#pills-contact-tab').tab('show');
//画面タイトル設定
let contactListTitle = getLocalizedString("contactListTitle");
$('.titleRoomName').text(contactListTitle);
if (IS_ONLINE == 'true') { if (IS_ONLINE == 'true') {
android.updateGroupInfo(groupId); android.updateGroupInfo(groupId);
} }
$('#rootGroupBtn').off(); $('#rootGroupBtn').off();
$('#parentGroupBtn').off(); $('#parentGroupBtn').off();
$('#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);
});
}
var result = CHAT_DB.getGroupInfo(groupId); var result = CHAT_DB.getGroupInfo(groupId);
$('#childGroupList').html(''); $('#childGroupList').html('');
...@@ -931,17 +958,16 @@ CHAT_UI.refreshGroupSearch = function(isInvite) { ...@@ -931,17 +958,16 @@ CHAT_UI.refreshGroupSearch = function(isInvite) {
if (typeof result.parentGroupId !== 'undefined') { if (typeof result.parentGroupId !== 'undefined') {
console.log(result.parentGroupId); console.log(result.parentGroupId);
$('#parentGroupBtn').on('click', function() { $('#parentGroupBtn').on('click', function() {
CHAT_UI.refesshAllGroupSearch(result.parentGroupId); CHAT_UI.refreshGroupSearch(result.parentGroupId, isInvite);
}); });
} }
if (typeof result.rootGroupId !== 'undefined') { if (typeof result.rootGroupId !== 'undefined') {
console.log(result.rootGroupId); console.log(result.rootGroupId);
$('#rootGroupBtn').on('click', function() { $('#rootGroupBtn').on('click', function() {
CHAT_UI.refesshAllGroupSearch(result.rootGroupId); CHAT_UI.refreshGroupSearch(result.rootGroupId, isInvite);
}); });
} }
const groupNaviTemplate = $('#group-navigater-template').html(); const groupNaviTemplate = $('#group-navigater-template').html();
var groupCount = 0; var groupCount = 0;
result.groupPathList.forEach(function(groupPath) { result.groupPathList.forEach(function(groupPath) {
...@@ -953,7 +979,7 @@ CHAT_UI.refreshGroupSearch = function(isInvite) { ...@@ -953,7 +979,7 @@ CHAT_UI.refreshGroupSearch = function(isInvite) {
id: groupPath.groupId id: groupPath.groupId
}); });
let obj = $(jQuery.parseHTML(html)).on('click', function(){ let obj = $(jQuery.parseHTML(html)).on('click', function(){
CHAT_UI.refesshAllGroupSearch(groupPath.groupId); CHAT_UI.refreshGroupSearch(groupPath.groupId, isInvite);
}); });
groupCount++; groupCount++;
$('#groupPathArea').append(obj); $('#groupPathArea').append(obj);
...@@ -961,16 +987,16 @@ CHAT_UI.refreshGroupSearch = function(isInvite) { ...@@ -961,16 +987,16 @@ CHAT_UI.refreshGroupSearch = function(isInvite) {
const groupTemplate = $('#group-template').html(); const groupTemplate = $('#group-template').html();
result.childGroupList.forEach(function(childGroup) { result.childGroupList.forEach(function(childGroup) {
let html = Mustache.render(groupTemplate, { let html = Mustache.render(groupTemplate, {
name: childGroup.groupName, name: childGroup.groupName,
id: childGroup.groupId id: childGroup.groupId
}); });
let obj = $(jQuery.parseHTML(html)).on('click', function(){ let obj = $(jQuery.parseHTML(html)).on('click', function(){
CHAT_UI.refesshAllGroupSearch(childGroup.groupId); CHAT_UI.refreshGroupSearch(childGroup.groupId, isInvite);
}); });
$('#childGroupList').append(obj); $('#childGroupList').append(obj);
}) })
const userTemplate = $('#user-template').html(); const userTemplate = $('#user-template').html();
result.groupUserList.forEach(function(groupUser) { result.groupUserList.forEach(function(groupUser) {
...@@ -986,38 +1012,49 @@ CHAT_UI.refreshGroupSearch = function(isInvite) { ...@@ -986,38 +1012,49 @@ CHAT_UI.refreshGroupSearch = function(isInvite) {
if (IS_ONLINE == 'true') { if (IS_ONLINE == 'true') {
if ($(this).find('.userCheckBox.active').length > 0) { if ($(this).find('.userCheckBox.active').length > 0) {
// remove // remove
console.log("kdh check1");
CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) { CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
return user.loginId != element.loginId; return groupUser.shopMemberId != element.shopMemberId;
}); });
} else { } else {
// add // add
CHAT.globalSelectedUserList.push({loginId:user.loginId, shopMemberId : user.shopMemberId, profileImagePath: user.profileImagePath}); 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'); $(this).find('.userCheckBox').toggleClass('active');
if (CHAT.globalSelectedUserList.length > 0) { if (CHAT.globalSelectedUserList.length > 0) {
console.log("kdh check3");
$('#userSelectionLength').text(CHAT.globalSelectedUserList.length); $('#userSelectionLength').text(CHAT.globalSelectedUserList.length);
} else { } else {
console.log("kdh check4");
$('#userSelectionLength').text(''); $('#userSelectionLength').text('');
} }
} }
}); });
let findObj = CHAT.globalSelectedUserList.find(function(selectedUser) {
return selectedUser.loginId == user.loginId;
})
if (findObj) {
$(obj).find('.userCheckBox').toggleClass('active');
}
$('#user_list').append(obj);
$('.userCheckBox').show();
$('#userInGroupList').append(obj); $('#userInGroupList').append(obj);
}) })
$('#backButton').off().on('click', function() {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
if (isInvite) {
$('#pills-chat-tab').tab('show');
} else {
if (IS_ONLINE == 'true') {
android.updateRoomList();
CHAT_UI.refreshGroupSearch("0", isInvite);
CHAT_UI.dismissLoadingIndicator();
}
}
});
CHAT_UI.dismissLoadingIndicator();
$('.userCheckBox').show();
$('#myGroupArea').hide(); $('#myGroupArea').hide();
$('#groupButtonArea').hide();
$('#allGroupArea').show(); $('#allGroupArea').show();
} }
...@@ -1314,6 +1351,8 @@ $('#groupBtn').on('click', function (e){ ...@@ -1314,6 +1351,8 @@ $('#groupBtn').on('click', function (e){
CHAT_UI.refreshRoomList(chatRoomType.GROUP); CHAT_UI.refreshRoomList(chatRoomType.GROUP);
}); });
CHAT_UI.showNamecard = function(id) { CHAT_UI.showNamecard = function(id) {
$('#'+id).appendTo("body").modal({ $('#'+id).appendTo("body").modal({
backdrop: 'static', backdrop: 'static',
......
public/js/chat-websocket.js
...@@ -333,39 +333,38 @@ function setSocketAction () { ...@@ -333,39 +333,38 @@ function setSocketAction () {
// Update Group List(Invite) // Update Group List(Invite)
socket.on('refreshGroupList', function(groups, isInvite){ socket.on('refreshGroupList', function(groups, isInvite){
// $('#group_list').html(''); $('#group_list').html('');
// const template = $('#group-template').html(); const template = $('#group-template').html();
// if (groups.length === 0) { if (groups.length === 0) {
// $('#group_list').append('<center class="text-secondary">'+ getLocalizedString(everyoneIsHere) +'</center>'); $('#group_list').append('<center class="text-secondary">'+ getLocalizedString(everyoneIsHere) +'</center>');
// } }
// // グループ名と人数を表記する。 // グループ名と人数を表記する。
// groups.forEach(function(group) { groups.forEach(function(group) {
// let html = Mustache.render(template, { let html = Mustache.render(template, {
// name: group.groupName, name: group.groupName,
// info: group.memberCnt + getLocalizedString("people") info: group.memberCnt + getLocalizedString("people")
// }); });
// // グループをクリックすると、該当グループのユーザーリストを読み込むようにイベントを与える // グループをクリックすると、該当グループのユーザーリストを読み込むようにイベントを与える
// let obj = $(jQuery.parseHTML(html)).on('click', function() { let obj = $(jQuery.parseHTML(html)).on('click', function() {
// // loadingIndicatorを表示 // loadingIndicatorを表示
// CHAT_UI.showLoadingIndicator(); CHAT_UI.showLoadingIndicator();
// socket.emit('getUserListInGroup', group.groupId, isInvite); socket.emit('getUserListInGroup', group.groupId, isInvite);
// $('#groupName').text(group.groupName); $('#groupName').text(group.groupName);
// }); });
// $('#group_list').append(obj); $('#group_list').append(obj);
// }); });
//
// // Rotate // Rotate
// if (CHAT_UI.isLandscapeMode()) { if (CHAT_UI.isLandscapeMode()) {
// $(".group_list").addClass("col-6").removeClass("col-12"); $(".group_list").addClass("col-6").removeClass("col-12");
// } }
//
// // Set Title // Set Title
// let memberSelectTitle = getLocalizedString("groupSearch") let memberSelectTitle = getLocalizedString("groupSearch")
//
// $('#pills-group-tab').tab('show'); $('#pills-group-tab').tab('show');
//
// $('#backButton').show(); $('#backButton').show();
//
if (isInvite) { if (isInvite) {
$('#newRoomName, .roomListIcon, .chatRoomIcon').hide(); $('#newRoomName, .roomListIcon, .chatRoomIcon').hide();
$('#userSelectionConfirmBtn').show(); $('#userSelectionConfirmBtn').show();
...@@ -380,127 +379,12 @@ function setSocketAction () { ...@@ -380,127 +379,12 @@ function setSocketAction () {
}); });
} }
// //
// if (CHAT.globalSelectedUserList.length > 0) { if (CHAT.globalSelectedUserList.length > 0) {
// $('#userSelectionLength').text(CHAT.globalSelectedUserList.length); $('#userSelectionLength').text(CHAT.globalSelectedUserList.length);
// } else { } else {
// $('#userSelectionLength').text(''); $('#userSelectionLength').text('');
// }
//
// $('#backButton').off().on('click', function() {
// // loadingIndicatorを表示
// CHAT_UI.showLoadingIndicator();
// if (isInvite) {
// $('#pills-chat-tab').tab('show');
// } else {
// if (IS_ONLINE == 'true') {
// android.updateRoomList();
// CHAT_UI.refreshRoomList(chatRoomType.DM);
// CHAT_UI.dismissLoadingIndicator();
// }
// }
// });
$('#rootGroupBtn').off();
$('#parentGroupBtn').off();
var result = CHAT_DB.getGroupInfo(groupId);
$('#childGroupList').html('');
$('#userInGroupList').html('');
$('#groupPathArea').html('');
if (typeof result.parentGroupId !== 'undefined') {
console.log(result.parentGroupId);
$('#parentGroupBtn').on('click', function() {
CHAT_UI.refreshGroupList(isInvite, result.parentGroupId);
});
}
if (typeof result.rootGroupId !== 'undefined') {
console.log(result.rootGroupId);
$('#rootGroupBtn').on('click', function() {
CHAT_UI.refreshGroupList(isInvite, result.rootGroupId);
});
} }
const groupNaviTemplate = $('#group-navigater-template').html();
var groupCount = 0;
result.groupPathList.forEach(function(groupPath) {
if (groupCount != 0) {
$('#groupPathArea').append("<label class='group-navigater'> > </label>");
}
let html = Mustache.render(groupNaviTemplate, {
name: groupPath.groupName,
id: groupPath.groupId
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
CHAT_UI.refreshGroupList(isInvite, groupPath.groupId);
});
groupCount++;
$('#groupPathArea').append(obj);
if (IS_ONLINE == 'true') {
android.updateGroupInfo(groupPath.groupId);
android.updateMyInfo();
}
})
const groupTemplate = $('#group-template').html();
result.childGroupList.forEach(function(childGroup) {
let html = Mustache.render(groupTemplate, {
name: childGroup.groupName,
id: childGroup.groupId
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
CHAT_UI.refreshGroupList(isInvite, childGroup.groupId);
});
$('#childGroupList').append(obj);
})
const userTemplate = $('#user-template').html();
result.groupUserList.forEach(function(groupUser) {
groupUser.profileImagePath = CHAT.getProfileImgUrl(groupUser.profileUrl)
let html = Mustache.render(userTemplate, {
id: groupUser.shopMemberId,
profileImage: groupUser.profileImagePath,
name: groupUser.shopMemberName
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
//TODO need onClick Action
if (IS_ONLINE == 'true') {
if ($(this).find('.userCheckBox.active').length > 0) {
// remove
CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
return user.loginId != element.loginId;
});
} else {
// add
CHAT.globalSelectedUserList.push({loginId:user.loginId, shopMemberId : user.shopMemberId, profileImagePath: user.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.loginId == user.loginId;
})
if (findObj) {
$(obj).find('.userCheckBox').toggleClass('active');
}
$('#user_list').append(obj);
$('.userCheckBox').show();
$('#userInGroupList').append(obj);
})
$('#backButton').off().on('click', function() { $('#backButton').off().on('click', function() {
// loadingIndicatorを表示 // loadingIndicatorを表示
CHAT_UI.showLoadingIndicator(); CHAT_UI.showLoadingIndicator();
...@@ -514,9 +398,6 @@ function setSocketAction () { ...@@ -514,9 +398,6 @@ function setSocketAction () {
} }
} }
}); });
$('#myGroupArea').hide();
$('#allGroupArea').show();
}); });
// Update User List(Invite) // Update User List(Invite)
......
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