Skip to content

C
chat_webview
Commit 6ee54ba1 by Lee Munkyeong
Options

連絡先画面UI

parent c9a4a037
Showing with 296 additions and 382 deletions
public_new/contact.html
......@@ -48,7 +48,7 @@
<a href="#" class="cancel none">キャンセル</a>
</form>
</div>
<div class="chat_list">
<div class="content chat_list">
<ul class="p-0 chat_make_room_list">
<li class="d-flex align-items-center">
<a href="#" data-toggle="modal" data-target="#myNameCard" style="width: 100%;">
......@@ -88,11 +88,7 @@
</div>
</div>
<div class="tab_content" id="tab2_content">
<div class="breadcrumb">
<a href="#" class="breadcrumb_item"><span>Root</span></a>
<a href="#" class="breadcrumb_item"><span>GroupA</span></a>
<a href="#" class="breadcrumb_item"><span>GroupASubB</span></a>
</div>
<div class="breadcrumb" id="groupPathArea"></div>
<div class="chat_list">
<!-- 全グループ -->
<ul class="p-0 chat_make_room_list">
......@@ -113,11 +109,6 @@
</div>
</div>
</a>
<!--<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>-->
</li>
<li class="d-flex align-items-center">
<a href="#" class="w-100" id="parentGroupBtn">
......@@ -130,17 +121,12 @@
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">トップグループに戻る</span>
<span class="chat_item_ttl">上位グループに戻る</span>
</div>
</div>
</div>
</div>
</a>
<!--<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>-->
</li>
<div id="childGroupListArea">
<li class="d-flex align-items-center">
......@@ -167,75 +153,7 @@
</div>
</li>
</div>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎名前太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="img/thumbnail.png" alt="サムネイル画像" /></div>
</div>
</div>
<div class="chat_item_m px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">名前　太郎</span>
</div>
</div>
</div>
</div>
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
</div>
</div>
</li>
<div id="userInGroupList"></div>
</ul>
</div>
</div>
......
public_new/js/chat-db.js
......@@ -56,7 +56,6 @@ CHAT_DB.getMyGroupUsers = function() {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
console.log(JSON.parse(android.getMyGroupUsers()));
return JSON.parse(android.getMyGroupUsers());
}
};
......@@ -78,3 +77,30 @@ CHAT_DB.getNameCardData = function(shopMemberId) {
return JSON.parse(android.getNameCardData(shopMemberId));
}
};
CHAT_DB.getMyGroupShopMemberByName = function(shopMemberName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getMyGroupShopMemberByName(shopMemberName));
}
};
CHAT_DB.getAllGroupShopMemberByName = function(shopMemberName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getAllGroupShopMemberByName(shopMemberName));
}
};
CHAT_DB.getGroupByName = function(groupName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getGroupByName(groupName));
}
};
public_new/js/chat-ui.js
......@@ -73,7 +73,7 @@ $('#roomDeleteButton').on('click', function(e) {
let roomListTitle = getLocalizedString("roomListTitle")
$('.titleRoomName').text(roomListTitle)
$('.chat_list.active_chat').on('click', function(e){
$('.chat_list.active_chat').on('click', function(e) {
$('#pills-chat-tab').tab('show');
});
} else {
......@@ -87,7 +87,7 @@ $('#roomDeleteButton').on('click', function(e) {
// チャットルームの削除アイコンにクリックイベントを与える
$('.deleteBox').off('click');
$('.deleteBox').on('click', function(e){
$('.deleteBox').on('click', function(e) {
// #36174
let roomId = $(this).data('roomId');
let activeRoom = $(this).data('activeRoom');
......@@ -133,7 +133,7 @@ $('#room-search').on('input', function(event) {
});
//上にスクロールすると新しいメッセージを呼ぶ処理。
$('#messages').scroll(function(){
$('#messages').scroll(function() {
if ($(this).scrollTop() === 0) {
if (!$('#chatLoader').is(':visible')) {
// 現在、メッセージの個数以前をメッセージを読み込む
......@@ -150,7 +150,7 @@ $('#messages').scroll(function(){
});
// UIの位置調整(キーボード出現時)
$('#message-form').on('focus', function(){
$('#message-form').on('focus', function() {
if (CHAT_UTIL.isIOS()) {
// メッセージ入力欄の位置指定
document.querySelector('.fixed-bottom').style.bottom = 10000 + 'px';
......@@ -181,7 +181,7 @@ CHAT_UI.resetNavigationPosition = function() {
// 端末の向きを記録(キーボード出現時にLandscapeModeと判定する対策)
var isLandscape;
CHAT_UI.setOrientation = function(isLandscapeMode){
CHAT_UI.setOrientation = function(isLandscapeMode) {
if (isLandscapeMode == 'false') {
$(".mesgs").removeClass("landscape_mesgs");
isLandscape = false;
......@@ -192,7 +192,7 @@ CHAT_UI.setOrientation = function(isLandscapeMode){
}
//メッセージ送信
$('#message-form').on('keypress', function(event){
$('#message-form').on('keypress', function(event) {
if (event.which == 13) {
// Enterキーの処理
$('#message-send-btn').click();
......@@ -200,7 +200,7 @@ $('#message-form').on('keypress', function(event){
});
// 送信ボタンの処理
$('#message-send-btn').on('click', function (e){
$('#message-send-btn').on('click', function(e) {
e.preventDefault();
const messageTextBox = $('#message-form');
const message = messageTextBox.val().length > 0 ? encodeURIComponent(messageTextBox.val() + " ") : "";
......@@ -216,24 +216,24 @@ $('#message-send-btn').on('click', function (e){
});
// 写真アップロード
$('#fileUploadButton').on('click', function(){
$('#fileUploadButton').on('click', function() {
$('#imageInputTag').click();
});
// 動画アップロード
$('#fileUploadButton2').on('click', function(){
$('#fileUploadButton2').on('click', function() {
$('#imageInputTag2').click();
});
$('#imageInputTag').on('change', function(){
$('#imageInputTag').on('change', function() {
$('#image-form').submit();
});
$('#imageInputTag2').on('change', function(){
$('#imageInputTag2').on('change', function() {
$('#image-form2').submit();
});
$('#image-form').on('submit', function(e){
$('#image-form').on('submit', function(e) {
e.preventDefault();
const imageInputTag = $('#imageInputTag');
const file = imageInputTag.prop('files')[0];
......@@ -244,7 +244,7 @@ $('#image-form').on('submit', function(e){
var fd = new FormData($(this)[0]);
//画像の大きさが500pixelより大きかったら、thumbnailを生成
CHAT.createThumbnailAndUpload(file, function(resizeFile, thumbnailCreated){
CHAT.createThumbnailAndUpload(file, function(resizeFile, thumbnailCreated) {
if (resizeFile && thumbnailCreated) {
//ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
fd.append('thumb', resizeFile)
......@@ -257,7 +257,7 @@ $('#image-form').on('submit', function(e){
}
});
$('#image-form2').on('submit', function(e){
$('#image-form2').on('submit', function(e) {
e.preventDefault();
const imageInputTag2 = $('#imageInputTag2');
const file = imageInputTag2.prop('files')[0];
......@@ -268,7 +268,7 @@ $('#image-form2').on('submit', function(e){
var fd = new FormData($(this)[0]);
if(!file.type.includes("image")) { // video 保存
CHAT.createVideoThumbnailAndUpload(file, function(resizeFile, thumbnailCreated){
CHAT.createVideoThumbnailAndUpload(file, function(resizeFile, thumbnailCreated) {
if(resizeFile && thumbnailCreated) {
//ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
fd.append('thumb', resizeFile)
......@@ -310,7 +310,7 @@ $('#pre-search').on('click', function(event) {
});
// Exit Room
$('#exitRoom').on('click', function(event){
$('#exitRoom').on('click', function(event) {
// 36174
$("#exitRoomTitle").text(getLocalizedString("exitRoomTitle"));
$("#exitRoomOk").text(getLocalizedString("yesTitle"));
......@@ -331,7 +331,7 @@ $('#exitRoom').on('click', function(event){
});
// Side Bar
$('#sidebarCollapse').on('click', function (){
$('#sidebarCollapse').on('click', function() {
// open sidebar
$('#sidebar').addClass('active');
// fade in the overlay
......@@ -340,7 +340,7 @@ $('#sidebarCollapse').on('click', function (){
$('a[aria-expanded=true]').attr('aria-expanded', 'false');
});
$('#dismiss, .overlay').on('click', function (){
$('#dismiss, .overlay').on('click', function() {
// hide sidebar
$('#sidebar').removeClass('active');
// hide overlay if dismissable
......@@ -349,7 +349,7 @@ $('#dismiss, .overlay').on('click', function (){
//Invite User
//招待ボタンを押すとグループリストを持ってくる。(ボタンを動的に追加して微動作中)
$('#addUser').on('click', function(event){
$('#addUser').on('click', function(event) {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let isInvite = true;
......@@ -394,7 +394,7 @@ $('#selectListKeyword').on('input', function(event) {
/* ---------------------------------------------------------------------- */
// Tab Open/Shown Event
$('a[data-toggle="pill"]').on('show.bs.tab', function (e) {
$('a[data-toggle="pill"]').on('show.bs.tab', function(e) {
var target = $(e.target).attr("href"); // e.target : activated tab
switch(target) {
case '#pills-chat':
......@@ -530,15 +530,15 @@ $('a[data-toggle="pill"]').on('hide.bs.tab', function(e) {
}
});
$('#pills-chat-tab').on('shown.bs.tab', function (e){
$('#pills-chat-tab').on('shown.bs.tab', function(e) {
CHAT_UI.scrollToBottom();
});
$('#pills-user-tab').on('shown.bs.tab', function (e){
$('#pills-user-tab').on('shown.bs.tab', function(e) {
$('#userSelectionConfirmBtn').show();
});
$('#pills-confirm-tab').on('shown.bs.tab', function (e){
$('#pills-confirm-tab').on('shown.bs.tab', function(e) {
$('#userSelectionConfirmBtn').show();
$('#userSelectionLength').text('');
$('#userSelectionDeleteBtn').hide();
......@@ -606,7 +606,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
const template = $('#user-template').html();
$('#select_user_list').html('');
CHAT.globalSelectedUserList.forEach(function(user){
CHAT.globalSelectedUserList.forEach(function(user) {
let html = Mustache.render(template, {
id: user.shopMemberId,
profileImage: user.profileImagePath,
......@@ -615,7 +615,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
// TODO 次のコミットに参考事項
// チャットルーム開設画面で参加ユーザー削除用チェックロジックが残っているので
// 影響テスト後、削除予定。 kang-dh
let obj = $(jQuery.parseHTML(html)).on('click',function(){
let obj = $(jQuery.parseHTML(html)).on('click',function() {
$(this).find('.userCheckBox').toggleClass('active');
});
......@@ -637,13 +637,13 @@ CHAT_UI.showConfirmView = function(isInvite) {
socket.emit('getGroupList', isInvite)
});
$("#userSelectionConfirmBtn").off().on('click', function(){
$("#userSelectionConfirmBtn").off().on('click', function() {
if (isInvite) {
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function (e) {
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.id;
});
// ユーザーの名前(login id)リスト。
let loginIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function (e) {
let loginIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.name;
});
......@@ -663,10 +663,10 @@ CHAT_UI.showConfirmView = function(isInvite) {
// loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function (e) {
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.id;
});
let userNameList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function (e) {
let userNameList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.name;
});
......@@ -684,7 +684,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
/*socket.emit('createNewRoom', userIdList, encodedRoomName, function(newRoomId) {
socket.emit('joinRoom', newRoomId, newRoomName, function () {
socket.emit('joinRoom', newRoomId, newRoomName, function() {
CHAT.saveRoomInfo(newRoomId, newRoomName);
$('#messages').html('');
$('.titleRoomName').text(newRoomName).data('roomName', newRoomName);
......@@ -695,7 +695,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
/*socket.on('createNewRoom', (shopMemberIdList, newRoomName, callback) => {
const user = onlineUsers.getUser(socket.id)
if(user){
if(user) {
var loginIdListObj = new Object();
var newRoomNameObj = new Object();
......@@ -764,7 +764,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
} else {
//loadingIndicatorを表示
CHAT_UI.showLoadingIndicator();
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function (e) {
let userIdList = jQuery.makeArray($('#select_user_list .user_list').find('.userCheckBox')).map(function(e) {
return e.dataset.id;
});
......@@ -798,7 +798,7 @@ CHAT_UI.showConfirmView = function(isInvite) {
CHAT_UI.deleteButtonAction = function(isInvite) {
//配列の整理
jQuery.makeArray($('#select_user_list .user_list').find(".userCheckBox.active")).map(function (e) {
jQuery.makeArray($('#select_user_list .user_list').find(".userCheckBox.active")).map(function(e) {
CHAT.globalSelectedUserList = CHAT.globalSelectedUserList.filter(function(element) {
return e.dataset.name != element.loginId;
});
......@@ -860,13 +860,13 @@ CHAT_UI.waitForLoadingImage = function(div, callback) {
if (count==0)
callback();
var loaded = 0;
imgs.one( "load" , function ( e ) {
imgs.one( "load" , function( e ) {
// イメージが読み込まれた
loaded++;
if ( loaded === count ) {
callback();
}
}).each( function () {
}).each( function() {
if ( this.complete || this.readyState === readyState.COMPLETED ) {
$(this).trigger("load");
}
......@@ -874,11 +874,11 @@ CHAT_UI.waitForLoadingImage = function(div, callback) {
});
}
$('#contactButton').on('click', function(event){
$('#contactButton').on('click', function(event) {
CHAT_UI.refreshContactScreen();
});
$('#chatButton').on('click', function(event){
$('#chatButton').on('click', function(event) {
CHAT_UI.refreshRoomList(chatRoomType.DM);
});
......@@ -893,7 +893,11 @@ CHAT_UI.refreshContactScreen = function() {
$('#title').text(contactListTitle);
// グループの様式を読み込む
const groupTemplate = $('#group-template').html();
var groupTemplate;
$.get({ url: "./template/template_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
// ユーザの様式を読み込む
var userTemplate;
......@@ -914,7 +918,6 @@ CHAT_UI.refreshContactScreen = function() {
groupUserTemplate = text;
});
//const userNamecardTemplate = $('#namecard-template').html();
if (IS_ONLINE == 'true') {
android.updateGroupInfo('0');
android.updateMyInfo();
......@@ -934,43 +937,41 @@ CHAT_UI.refreshContactScreen = function() {
name: myInfo.shopMemberName,
groupPathList: myInfo.groupPathList
});
let myNamecardObj = $(jQuery.parseHTML(myNamecardHtml)).on('click', function(){
let myNamecardObj = $(jQuery.parseHTML(myNamecardHtml)).on('click', function() {
});
$('#myProfileModal').html(myNamecardObj);
$('#myName').text(myInfo.shopMemberName);
$('#myImg').attr('src',myInfo.profileImagePath);
/*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');
});
$('#my_info').append(obj);*/
var favoriteCount = 0;
/*var favoriteGroupList = CHAT_DB.getFavoriteGroups();
//お気に入りグループ取得。
var favoriteGroupList = CHAT_DB.getFavoriteGroups();
console.log(favoriteGroupList);
favoriteGroupList.forEach(function(favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
isFavorite: true
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
//TODO need onClick Action
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
favoriteCount++
$('#favorite_list').append(obj);
})*/
$('#favoriteList').append(obj);
})
//お気に入りユーザ取得。
var favoriteUserList = CHAT_DB.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);
/*favoriteUserList.forEach(function(favoriteUser) {
favoriteUser.profileImagePath = CHAT.getProfileImgUrl(favoriteUser.profileUrl)
let html = Mustache.render(userTemplate, {
shopMemberId: favoriteUser.shopMemberId,
......@@ -979,37 +980,28 @@ CHAT_UI.refreshContactScreen = function() {
isFavorite: true
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
//TODO need onClick Action
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
favoriteCount++
$('#favoriteList').append(obj);
})
})*/
var myGroupList = CHAT_DB.getMyGroupUsers();
myGroupList.forEach(function(myGroup) {
myGroup.groupUserList.forEach(function (groupUser){
groupUser.profileImagePath = CHAT.getProfileImgUrl(groupUser.profileUrl)
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(){
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#myGroupList').append(obj);
})
/*if (favoriteCount == 0) {
$('#favorite_list').hide();
$('#favorite-seperator').hide();
} else {
$('#favorite_list').show();
$('#favorite-seperator').show();
}*/
}
CHAT_UI.refreshRoomList = function(roomType) {
......@@ -1152,7 +1144,7 @@ CHAT_UI.loadMessages = function(messages, roomId, roomName) {
jQueryMessages.prepend(workVal);
if (beforeHeight !== 0) {
// 追加のメッセージ読み込み時は読み込み前のスクロール位置を維持
setTimeout(function () {
setTimeout(function() {
jQueryMessages.scrollTop(jQueryMessages.prop('scrollHeight') - beforeHeight);
}, 400);
} else {
......@@ -1174,89 +1166,127 @@ CHAT_UI.loadMessages = function(messages, roomId, roomName) {
};
$('#dmBtn').on('click', function (e){
$('#dmBtn').on('click', function(e) {
CHAT_UI.refreshRoomList(chatRoomType.DM);
});
$('#groupBtn').on('click', function (e){
$('#groupBtn').on('click', function(e) {
CHAT_UI.refreshRoomList(chatRoomType.GROUP);
});
CHAT_UI.showNamecard = function(id) {
$('#'+id).appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
}
$('#myGroupBtn').on('click', function(e) {
$('#myGroupArea').show();
$('#allGroupArea').hide();
});
CHAT_UI.hideNamecard = function(id) {
$('#'+id).modal('hide');
}
$('#tabAllGroup').on('click', function(e) {
CHAT_UI.refesshAllGroupSearch('0')
});
CHAT_UI.showUserNamecard = function(shopMemberId) {
CHAT_UI.favoriteUserChange = function(shopMemberId, star) {
if ($(star).hasClass('active')) {
CHAT_UI.removeFavoriteUser(shopMemberId);
} else if ($(star).hasClass('disable')) {
CHAT_UI.insertFavoriteUser(shopMemberId);
}
}
// $('#myNamecard').appendTo("body").modal({
// backdrop: 'static',
// keyboard: false
// })
CHAT_UI.favoriteGroupChange = function(groupId, star) {
if ($(star).hasClass('active')) {
CHAT_UI.removeFavoriteGroup(groupId);
} else if ($(star).hasClass('disable')) {
CHAT_UI.insertFavoriteGroup(groupId);
}
}
$('#myGroupBtn').on('click', function (e){
CHAT_UI.removeFavoriteUser = function(shopMemberId) {
$('#userNameCard').modal('hide');
$('#myNameCard').modal('hide');
android.removeFavoriteUser(shopMemberId);
$('.shopmember_'+shopMemberId).removeClass('active');
$('.shopmember_'+shopMemberId).addClass('disable');
};
$('#myGroupArea').show();
$('#allGroupArea').hide();
});
CHAT_UI.insertFavoriteUser = function(shopMemberId) {
$('#userNameCard').modal('hide');
$('#myNameCard').modal('hide');
android.addFavoriteUser(shopMemberId);
$('.shopmember_'+shopMemberId).removeClass('disable');
$('.shopmember_'+shopMemberId).addClass('active');
};
$('#tabAllGroup').on('click', function (e){
console.log('tabAllGroup')
CHAT_UI.refesshAllGroupSearch('0')
});
CHAT_UI.removeFavoriteGroup = function(groupId) {
android.removeFavoriteGroup(groupId);
$('.group_'+groupId).removeClass('active');
$('.group_'+groupId).addClass('disable');
};
CHAT_UI.insertFavoriteGroup = function(groupId) {
android.addFavoriteGroup(groupId);
$('.group_'+groupId).removeClass('disable');
$('.group_'+groupId).addClass('active');
};
//全グループ検索画面表示。
CHAT_UI.refesshAllGroupSearch = function(groupId) {
console.log('AllGroupSearchScreen');
//CHAT_UI.makeNameCard(id)
$('.cancel').addClass('none');
$('.search_form input').removeClass('focus');
$('.search_form input').val('');
$('.search_form form').removeClass();
$('.content').removeClass('none');
$('.overlay_src_msg').empty();
$('#tabAllGroup').prop('checked', true);
//オンライン状態であればサーバから情報更新。
if (IS_ONLINE == 'true') {
android.updateGroupInfo(groupId);
}
//画面エリアを初期化。
$('#rootGroupBtn').off();
$('#parentGroupBtn').off();
var result = CHAT_DB.getGroupInfo(groupId);
$('#childGroupListArea').html('');
$('#userInGroupList').html('');
$('#groupPathArea').html('');
//DBからグループ情報を取得。
var result = CHAT_DB.getGroupInfo(groupId);
//上位グループ、トップグループ遷移ボタンのイベント追加。
if (typeof result.parentGroupId !== 'undefined') {
console.log(result.parentGroupId);
$('#parentGroupBtn').on('click', function() {
CHAT_UI.refesshAllGroupSearch(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== 'undefined') {
console.log(result.rootGroupId);
$('#rootGroupBtn').on('click', function() {
CHAT_UI.refesshAllGroupSearch(result.rootGroupId);
});
}
//該当グループのパースを表示。
var groupPathTemplate;
$.get({ url: "./template/template_group_path.html", async: false }
, function(text) {
groupPathTemplate = text;
});
/*const groupNaviTemplate = $('#group-navigater-template').html();
var groupCount = 0;
var groupPathCount = 0;
result.groupPathList.forEach(function(groupPath) {
if (groupCount != 0) {
$('#groupPathArea').append("<label class='group-navigater'> > </label>");
}
let html = Mustache.render(groupNaviTemplate, {
if (!(groupPathCount < (result.groupPathList.length - 3))) {
let html = Mustache.render(groupPathTemplate, {
name: groupPath.groupName,
id: groupPath.groupId
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
CHAT_UI.refesshAllGroupSearch(groupPath.groupId);
});
groupCount++;
let obj = jQuery.parseHTML(html);
$('#groupPathArea').append(obj);
})*/
}
groupPathCount++;
})
//該当グループの下位グループ表示。
var groupTemplate;
$.get({ url: "./template/template_group_list.html", async: false }
, function(text) {
......@@ -1268,35 +1298,31 @@ CHAT_UI.refesshAllGroupSearch = function(groupId) {
id: childGroup.groupId
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
CHAT_UI.refesshAllGroupSearch(childGroup.groupId);
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#childGroupListArea').append(obj);
})
/*const userTemplate = $('#user-template').html();
//該当グループの所属ユーザを表示。
var userTemplate;
$.get({ url: "./template/template_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
result.groupUserList.forEach(function(groupUser) {
groupUser.profileImagePath = CHAT.getProfileImgUrl(groupUser.profileUrl)
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl)
})
let html = Mustache.render(userTemplate, {
id: groupUser.shopMemberId,
profileImage: groupUser.profileImagePath,
name: groupUser.shopMemberName
userList: result.groupUserList
});
let obj = $(jQuery.parseHTML(html)).on('click', function(){
CHAT_UI.makeNameCard(groupUser.shopMemberId);
});
let obj = jQuery.parseHTML(html);
$('#userInGroupList').append(obj);
})
$('#myGroupArea').hide();
$('#allGroupArea').show();*/
}
CHAT_UI.startChat = function (userShopMemberId,userName) {
CHAT_UI.startChat = function(userShopMemberId,userName) {
CHAT_UI.showLoadingIndicator();
var userIdList = [];
userIdList.push(userShopMemberId);
......@@ -1307,43 +1333,14 @@ CHAT_UI.startChat = function (userShopMemberId,userName) {
CHAT_UI.hideNamecard(nameCardAreaId.USER);
};
CHAT_UI.startVoice = function () {
//add Android Chat click
CHAT_UI.startVoice = function() {
console.log("VoiceClick");
};
CHAT_UI.changeFavorite = function () {
//add Android Chat click
console.log("FavoriteClick");
};
CHAT_UI.removeFavoriteUser = function (shopMemberId) {
//add Android Chat click
$('#userNameCard').modal('hide');
$('#myNameCard').modal('hide');
console.log('hide');
android.removeFavoriteUser(shopMemberId);
console.log("removeFU");
};
CHAT_UI.insertFavoriteUser = function (shopMemberId) {
//add Android Chat click
$('#userNameCard').modal('hide');
$('#myNameCard').modal('hide');
console.log('insert');
android.addFavoriteUser(shopMemberId);
console.log("insertFU");
};
CHAT_UI.changeFavorite = function () {
//add Android Chat click
console.log("FavoriteClick");
};
CHAT_UI.makeNameCard = function (shopMemberId) {
console.log('makeNameCard Click');
CHAT_UI.makeNameCard = function(shopMemberId) {
var nameCardInfo = CHAT_DB.getNameCardData(shopMemberId);
console.log(nameCardInfo);
var namecardTemplate;
$.get({ url: "./template/template_user_name_card.html", async: false }
......@@ -1362,112 +1359,14 @@ CHAT_UI.makeNameCard = function (shopMemberId) {
isFavorite: nameCardInfo.isFavorite
});
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on('click', function(){
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on('click', function() {
});
$('#userProfileModal').html(namecardObj);
$('#userNameCard').modal('show');
};
CHAT_UI.makeNameCardInChatRoom = function (chatRoomId) {
console.log('makeNameCard Click');
var nameCardInfo = CHAT_DB.getNameCardData(chatRoomId);
console.log(nameCardInfo);
const userNamecardTemplate = $('#namecard-template').html();
let namecardHtml = Mustache.render(userNamecardTemplate, {
loginId: nameCardInfo.shopMemberId,
profileImage: nameCardInfo.profileImagePath,
name: nameCardInfo.shopMemberName,
groupPathList: nameCardInfo.groupPathList,
chat: getLocalizedString("chat"),
voice: getLocalizedString("voice"),
favorite: getLocalizedString("addFavorite")
});
console.log('done html render');
let namecardObj = $(jQuery.parseHTML(namecardHtml)).on('click', function(){
});
console.log(namecardHtml);
console.log(namecardObj);
$('#userProfileModal').html(namecardHtml);
CHAT_UI.showNamecard('userProfileModal');
CHAT_UI.toggleCategory = function(category) {
$(category).toggleClass("open");
$(category).next().slideToggle();
};
CHAT_UI.refesshAllGroupSearchFaborite = function(groupId) {
const userNamecardTemplate = $('#namecard-template').html();
if (IS_ONLINE == 'true') {
android.updateGroupInfo(groupId);
}
$('#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.refesshAllGroupSearch(result.parentGroupId);
});
}
if (typeof result.rootGroupId !== 'undefined') {
console.log(result.rootGroupId);
$('#rootGroupBtn').on('click', function() {
CHAT_UI.refesshAllGroupSearch(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.refesshAllGroupSearch(groupPath.groupId);
});
groupCount++;
$('#groupPathArea').append(obj);
})
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.refesshAllGroupSearch(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(){
CHAT_UI.makeNameCard(groupUser.shopMemberId);
});
$('#userInGroupList').append(obj);
})
$('#myGroupArea').hide();
$('#allGroupArea').show();
}
\ No newline at end of file
public_new/js/common.js
$(function() {
var h = $(window).height(); //画面の高さを取得
// アコーディオン
$('.category').click(function() {
// アコーディオン
$('.category').on('click',function () {
$(this).toggleClass("open");
$(this).next().slideToggle();
});
});
$(function() {
var h = $(window).height(); //画面の高さを取得
// ローディング表示
$('footer a').click(function(event){
......
public_new/js/contact.js
$(function() {
// メンバー検索
$('#contact .search_form input[type="search"]').keyup(function(){
$.ajax({
url: 'search_message_user_list.html',
type: 'POST',
datatype: 'html'
}).done(function (data) {
$('.overlay_src_msg').html(data);
var isAllGroup = $('#tabAllGroup').is(':checked');
console.log(isAllGroup);
$('.overlay_src_msg').empty();
//全グループ検索画面
if (isAllGroup) {
var keyword = $('#contact .search_form input[type="search"]').val();
if (keyword == '') {
return;
}
//グループデータ検索
var groupList = CHAT_DB.getGroupByName(keyword);
var groupTemplate;
$.get({ url: "./template/template_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
groupList.forEach(function(group) {
let html = Mustache.render(groupTemplate, {
name: group.groupName,
id: group.groupId,
isFavorite: group.isFavorite
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
})
//ユーザデータ検索
var userList = CHAT_DB.getAllGroupShopMemberByName(keyword);
var userTemplate;
$.get({ url: "./template/template_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
　　//連絡先画面
} else {
var keyword = $('#contact .search_form input[type="search"]').val();
if (keyword == '') {
return;
}
var userList = CHAT_DB.getMyGroupShopMemberByName(keyword);
var userTemplate;
$.get({ url: "./template/template_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').html(obj);
}
});
});
public_new/template/template_group_list.html
<li class="d-flex align-items-center">
<a href="chat_room.html" class="w-100">
<a href="#" class="w-100" onclick="CHAT_UI.refesshAllGroupSearch({{id}});">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
......@@ -17,7 +17,12 @@
</a>
<div class="chat_item_r">
<div class="d-flex flex-column">
<span class="star disable"></span>
{{#isFavorite}}
<span class="star active group_{{id}}" onclick="CHAT_UI.favoriteGroupChange({{id}},this)"></span>
{{/isFavorite}}
{{^isFavorite}}
<span class="star disable group_{{id}}" onclick="CHAT_UI.favoriteGroupChange({{id}},this)"></span>
{{/isFavorite}}
</div>
</div>
</li>
\ No newline at end of file
public_new/template/template_group_path.html 0 → 100644
<a href="#" class="breadcrumb_item" onclick="CHAT_UI.refesshAllGroupSearch({{id}});"><span>{{name}}</span></a>
\ No newline at end of file
public_new/template/template_group_user_list.html
<div class="category"><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">
<a href="#" onclick="CHAT_UI.makeNameCard({{shopMemberId}})" style="width: 100%;">
<a href="javascript:return false;" onclick="CHAT_UI.makeNameCard({{shopMemberId}})" style="width: 100%;">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
......@@ -21,10 +21,10 @@
<div class="chat_item_r">
<div class="d-flex flex-column">
{{#isFavorite}}
<span class="star active"></span>
<span class="star active shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
{{^isFavorite}}
<span class="star disable"></span>
<span class="star disable shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
</div>
</div>
......
public_new/template/template_user_list.html
<ul class="p-0 chat_make_room_list">
{{#userList}}
<li class="d-flex align-items-center">
<a href="#" onclick="CHAT_UI.makeNameCard({{shopMemberId}})" style="width: 100%;">
<a href="javascript:return false;" onclick="CHAT_UI.makeNameCard({{shopMemberId}})" style="width: 100%;">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thubnail">
<div class="img_wrap"><img src="{{profileImage}}" 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 px-0">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">{{name}}</span>
<span class="chat_item_ttl">{{shopMemberName}}</span>
</div>
</div>
</div>
......@@ -19,12 +20,13 @@
<div class="chat_item_r">
<div class="d-flex flex-column">
{{#isFavorite}}
<span class="star active"></span>
<span class="star active shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
{{^isFavorite}}
<span class="star disable"></span>
<span class="star disable shopmember_{{shopMemberId}}" onclick="CHAT_UI.favoriteUserChange({{shopMemberId}},this)"></span>
{{/isFavorite}}
</div>
</div>
</li>
{{/userList}}
</ul>
\ 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