Skip to content

C
chat_webview
Commit 8548e74d by Kang Donghun
Options

Merge branch 'origin/develop_apply_design_chat' of… 

Merge branch 'origin/develop_apply_design_chat' of gitlab.agentec.jp:abookCommunication/chat_webview into origin/develop_apply_design_chat
parents 5a808744 7194ca24
Showing with 251 additions and 143 deletions
public_new/chat_add_user_confirm.html
......@@ -43,158 +43,58 @@
<div class="chat_list">
<h2>参加者</h2>
<ul class="p-0 chat_make_room_list">
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail">
<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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail">
<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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail"><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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail"><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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail"><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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail"><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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail"><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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail"><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>
</li>
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail"><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>
</li>
<div id="selectedUserList"></div>
</ul>
</div>
<!-- ユーザー招待ボタン -->
<div class="add_user_btn">
<button type="button" name="button">招待</button>
<button type="button" name="button" id="addUserBtn">招待</button>
</div>
</form>
</main>
<script src="./js/libs/jquery-3.3.1.min.js"></script>
<script src="./js/language.js"></script>
<script src="./js/language_ko.js" charset="UTF-8"></script>
<script src="./js/language_ja.js" charset="UTF-8"></script>
<script src="./js/language_en.js" charset="UTF-8"></script>
<script src="./js/libs/moment.js"></script>
<script src="./js/libs/locale/ko.js" charset="UTF-8"></script>
<script src="./js/libs/locale/ja.js" charset="UTF-8"></script>
<script src="./js/libs/mustache.min.js"></script>
<script src="./js/libs/bootstrap.min.js"></script>
<script src="./js/libs/jquery.mark.min.js"></script>
<script src="./js/common.js"></script>
<script src="./js/loading.js"></script>
<script src="./js/constant.js"></script>
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/chat-util.js"></script>
<script src="./js/chat-db.js"></script>
<script>
String.prototype.replaceAll = function(org, dest) {
return this.split(org).join(dest);
}
<script src="./js/libs/jquery-3.3.1.min.js"></script>
<script src="./js/libs/moment.js"></script>
<script src="./js/libs/bootstrap.min.js"></script>
<script src="./js/libs/jquery.mark.min.js"></script>
<script src="./js/chat.js"></script>
let CHAT_SERVER_URL = '';
let CMS_SERVER_URL = '';
let ASSET_PATH = './';
let PLATFORM = '';
let IS_MOBILE = true;
let IS_ONLINE = false;
android.getLoginParameter();
android.getGlobalParameter();
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.showMakeRoomConfirmView();
CHAT_UI.showAddUserConfirmView();
};
</script>
</body>
</html>
public_new/js/chat-db.js
......@@ -46,6 +46,15 @@ CHAT_DB.getMessages = function(roomId) {
}
};
CHAT_DB.getFavoriteUsersNotInRoom = function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getFavoriteUsersNotInRoom());
}
};
CHAT_DB.getFavoriteUsers = function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
......@@ -235,3 +244,12 @@ CHAT_DB.searchMessages = function(keyword, userList) {
return JSON.parse(android.searchMessages(keyword, userList));
}
};
CHAT_DB.getMyGroupUsersNotInRoom = function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getMyGroupUsersNotInRoom());
}
};
\ No newline at end of file
public_new/js/chat-ui.js
......@@ -1256,6 +1256,11 @@ $('#makeRoomConfirmBtn').on('click', function(e) {
$('#makeRoomForm').submit();
});
$('#addUserConfirmBtn').on('click', function(e) {
android.saveSelectedUserList(CHAT.globalSelectedUserList.join(","));
$('#addUserForm').submit();
});
CHAT_UI.favoriteUserChange = function(shopMemberId, star) {
if ($(star).hasClass('active')) {
CHAT_UI.removeFavoriteUser(shopMemberId);
......@@ -1939,4 +1944,139 @@ CHAT_UI.showMakeRoomConfirmView = function() {
}
});
}
CHAT_UI.showAddUserConfirmView = function() {
$('#selectedUserList').html('');
var userTemplate;
$.get({ url: "./template/template_add_user_confirm_user_list.html", async: false }
, function(text) {
userTemplate = text;
}
);
var selectedUserList = CHAT_DB.loadSelectedUsers();
console.log("check = " + selectedUserList);
selectedUserList.forEach(function(user){
let html = Mustache.render(userTemplate, {
id: user.shopMemberId,
profileImage: CHAT.getProfileImgUrl(user.profileUrl),
name: user.shopMemberName
});
let obj = jQuery.parseHTML(html);
$('#selectedUserList').append(obj);
})
$("#addUserBtn").off().on('click', function() {
CHAT_UI.showLoadingIndicator();
let userIdList = new Array();
selectedUserList.forEach(function(user){
userIdList.push(user.shopMemberId);
})
android.inviteUsers(userIdList.join(','));
});
}
CHAT_UI.refreshMyGroupForAddUser = function() {
$(".modal-backdrop").remove();
$('#favoriteListForMakeRoom').html('');
$('#myGroupListForMakeRoom').html('');
//画面タイトル設定
let contactListTitle = getLocalizedString("userSearch");
$('#title').text(contactListTitle);
// グループの様式を読み込む
var groupTemplate;
$.get({ url: "./template/template_make_room_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
// ユーザの様式を読み込む
var userTemplate;
$.get({ url: "./template/template_make_room_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
var groupUserTemplate;
$.get({ url: "./template/template_make_room_group_user_list.html", async: false }
, function(text) {
groupUserTemplate = text;
});
if (IS_ONLINE == 'true') {
android.updateGroupInfo('0');
android.updateMyInfo();
android.updateGroupUser();
android.updateFavorite();
}
//お気に入りグループ取得。
var favoriteGroupList = CHAT_DB.getFavoriteGroups();
favoriteGroupList.forEach(function(favoriteGroup) {
let html = Mustache.render(groupTemplate, {
name: favoriteGroup.groupName,
id: favoriteGroup.groupId,
});
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#favoriteListForMakeRoom').append(obj);
})
//お気に入りユーザ取得。
var favoriteUserList = CHAT_DB.getFavoriteUsersNotInRoom();
favoriteUserList.forEach(function(favoriteUser) {
favoriteUser.profileUrl = CHAT.getProfileImgUrl(favoriteUser.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function(shopMemberId) {
return shopMemberId == favoriteUser.shopMemberId;
})
if (findObj) {
favoriteUser.checked = 'checked';
}
});
let html = Mustache.render(userTemplate, {
userList: favoriteUserList
});
let obj = jQuery.parseHTML(html);
$('#favoriteListForMakeRoom').append(obj);
/*favoriteUserList.forEach(function(favoriteUser) {
favoriteUser.profileImagePath = CHAT.getProfileImgUrl(favoriteUser.profileUrl)
let html = Mustache.render(userTemplate, {
shopMemberId: favoriteUser.shopMemberId,
profileImage: favoriteUser.profileImagePath,
name: favoriteUser.shopMemberName,
isFavorite: true
});
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#favoriteList').append(obj);
})*/
var myGroupList = CHAT_DB.getMyGroupUsersNotInRoom();
myGroupList.forEach(function(myGroup) {
myGroup.groupUserList.forEach(function(groupUser) {
groupUser.profileUrl = CHAT.getProfileImgUrl(groupUser.profileUrl)
let findObj = CHAT.globalSelectedUserList.find(function(shopMemberId) {
return shopMemberId == groupUser.shopMemberId;
})
if (findObj) {
groupUser.checked = 'checked';
}
})
let html = Mustache.render(groupUserTemplate, {
groupName: myGroup.groupName,
groupUserList: myGroup.groupUserList
});
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
$('#myGroupListForMakeRoom').append(obj);
})
}
\ No newline at end of file
public_new/template/template_add_user_confirm_user_list.html 0 → 100644
<ul class="p-0 chat_make_room_list">
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l">
<div class="thumbnail">
<div class="img_wrap"><img src="{{profileImage}}" 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>
</div>
</div>
</div>
</div>
</li>
</ul>
\ No newline at end of file
public_new/template/template_add_user_user_list.html 0 → 100644
<ul class="p-0 chat_make_room_list">
{{#userList}}
<li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l_chk">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox{{shopMemberId}}" name="checkbox[]" class="checkbox-input checkbox{{shopMemberId}}" onchange="CHAT_UI.checkForMakeChat({{shopMemberId}});" {{checked}}>
<span class="checkbox-parts"></span>
</label>
</div>
</div>
<div class="chat_item_l">
<div class="thumbnail">
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'" /></div>
</div>
</div>
<div class="chat_item_m">
<div class="d-flex flex-column">
<div class="chat_item_t">
<span class="chat_item_ttl">{{shopMemberName}}</span>
</div>
</div>
</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