Skip to content

C
chat_webview
Commit 807f9237 by Lee Munkyeong
Options

Merge branch 'origin/develop_apply_design_chat' into 'origin/develop_apply_design' 

Origin/develop apply design chat

See merge request !13
parents 45f74721 750300a0
Showing with 810 additions and 415 deletions
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{
......@@ -710,7 +711,7 @@ a.article:hover {
}
.chat-list-type-btn {
width: 30%;
width: 40%;
}
#my_info > div > div {
padding-left: 5%;
......@@ -724,6 +725,10 @@ a.article:hover {
padding-left: 5%;
}
#my_group_list > div > div {
padding-left: 5%;
}
.contact-seperator {
width: 100%;
background-color: #095395!important;
......@@ -741,9 +746,6 @@ a.article:hover {
min-height: 250px;
top: 20%;
background: #F7FFF4;
}
#namecard {
z-index: 10051;
}
......@@ -760,6 +762,44 @@ a.article:hover {
text-align: center;
}
<<<<<<< HEAD
=======
.border-bottom-gray {
border-bottom: 1px solid #c4c4c4;
}
#childGroupList > div > div {
padding-left: 5%;
}
#userInGroupList > div > div {
padding-left: 5%;
}
.group-navigater {
margin-right: 10px;
}
.namecard-action-area {
display: -webkit-box;
}
.namecard-action-btn {
text-align: center;
}
.name-chat {
background-color: yellow;
}
.name-voice {
background-color: green;
}
.name-favorite {
background-color: blue;
}
>>>>>>> origin/develop_createRoom_UI
.inbox_archive {
width: 100%;
}
......@@ -888,3 +928,7 @@ a.article:hover {
text-align: center;
overflow: hidden;
}
<<<<<<< HEAD
=======
>>>>>>> origin/develop_apply_design_chat
>>>>>>> origin/develop_createRoom_UI
public/index.html
......@@ -221,7 +221,7 @@
</div>
<div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">
<div class="inbox_people">
<div class="inbox_people" >
<div class="heading_srch">
<div class="srch_bar">
<div class="stylish-input-group">
......@@ -232,15 +232,49 @@
</div>
</div>
</div>
<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="allGroupBtn"></button>
</div>
<div id="myGroupArea">
<div id="my_info" class="inbox_user row">
</div>
<label class="contact-seperator" id="favorite-seperator">Favorite</label>
<div id="favorite_list" class="inbox_user row">
</div>
<label class="contact-seperator" id="mygroup-seperator">MY GROUP</label>
<div id="my_group_list" class="inbox_user row">
</div>
</div>
<div id="allGroupArea">
<label class="contact-seperator" id="groupPathSeperator">GROUP PATH</label>
<div id="groupPathArea" style="float:left;">
</div>
<label class="contact-seperator" id="moveBtnSeperator">MOVE BUTTON</label>
<div id="groupBtnArea">
<div class="user_list col-12" id="rootGroupBtn">
<div class="user_people">
<div class="user_ib">
<h5>MOVE TO ROOT GROUP</h5>
</div>
</div>
</div>
<div class="user_list col-12" id="parentGroupBtn">
<div class="user_people">
<div class="user_ib">
<h5>MOVE TO PARENTS GROUP</h5>
</div>
</div>
</div>
</div>
<label class="contact-seperator" id="childGroupSeperator">CHILD GROUP</label>
<div id="childGroupList" class="inbox_user row group-search-list">
</div>
<label class="contact-seperator" id="groupUserSeperator">USERS IN GROUP</label>
<div id="userInGroupList" class="inbox_user row group-search-list">
</div>
</div>
</div>
......@@ -384,8 +418,9 @@
</ul>
</div>
<div class="popup" id="myNamecard"></div>
<div class="popup" id="userNamecard"></div>
<div class="popup" id="namecard"></div>
<nav class="navbar navbar-expand navbar-dark fixed-bottom flex-md-nowrap p-2 bg-footer talign-center border footer-nav" id="bottomNav">
<div class="col-4">
<img src="./icon/ic_communication_meeting_gray.png" style="width: 35%;" id="contactButton">
......@@ -398,7 +433,7 @@
</div>
</nav>
<script id="my-namecard-template" type="text/template">
<div style="float: right;"><i class="fa fa-times my-name-card-close" aria-hidden="true"></i></div>
<div style="float: right;"><i class="fa fa-times my-name-card-close" aria-hidden="true" onclick="CHAT_UI.hideNamecard('myNamecard');"></i></div>
<div class="namecard_img">
<img src="./images/user-profile.png" alt>
<div class="namedard-img-upload" >Upload</div>
......@@ -411,7 +446,7 @@
</div>
</script>
<script id="namecard-template" type="text/template">
<div style="float: right;"><i class="fa fa-times my-name-card-close" aria-hidden="true"></i></div>
<div style="float: right;"><i class="fa fa-times my-name-card-close" aria-hidden="true" onclick="CHAT_UI.hideNamecard('userNamecard');"></i></div>
<div class="namecard_img">
<img src="./images/user-profile.png" alt>
<div class="namecard-login-id">{{name}}</div>
......@@ -421,11 +456,22 @@
<li><b>{{.}}</b></li>
{{/groupPathList}}
</div>
<div class="text-center">
<button type="button" class="btn btn-primary" id="nameCardChatBtn" onclick="CHAT_UI.startChat('{{loginId}}','{{name}}');">{{chat}}</button>
<button type="button" class="btn btn-primary" id="nameCardVoiceBtn" onclick="CHAT_UI.startVoice();">{{voice}}</button>
{{#isFavorite}}
<button type="button" class="btn btn-primary" onclick="CHAT_UI.changeFavorite();">{{favorite}}</button>
{{/isFavorite}}
{{^isFavotire}}
<button type="button" class="btn btn-primary" onclick="CHAT_UI.changeFavorite();">{{favorite}}</button>
{{/isFavorite}}
</div>
</script>
<script id="message-template" type="text/template">
<div class="incoming_msg">
<div class="incoming_msg_img">
<img src={{{profileImage}}} alt="">
<img src={{{profileImage}}} alt="" onclick="CHAT_UI.makeNameCard({{shopMemberId}});" >
</div>
<div class="received_msg">
<div class="received_withd_msg">
......@@ -478,7 +524,7 @@
</div>
</script>
<script id="group-template" type="text/template">
<div class="group_list col-12" data-name="{{name}}">
<div class="group_list col-12" data-name="{{name}}" data-id="{{id}}">
<div class="group_people">
<div class="group_img">
<img src="./images/group-image.png" alt="">
......@@ -512,6 +558,9 @@
</div>
</div>
</script>
<script id="group-navigater-template" type="text/template">
<label class="group-navigater" data-name="{{name}}" data-id="{{id}}">{{name}}</label>
</script>
<script id="favorite-user-template" type="text/template">
<div class="user_list col-12" data-name="{{name}}">
<div class="user_people">
......
public/js/chat-db.js
......@@ -14,11 +14,13 @@ CHAT_DB.getRoomList = function(roomType) {
//ロカールDBからログインしたユーザのデータを取得する。
CHAT_DB.getMyInfo = function(input) {
var result = JSON.parse(android.getMyInfo());
CHAT.globalLoginParameter.shopMemberId = result.shopMemberId;
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getMyInfo());
return result;
}
};
......@@ -58,6 +60,26 @@ CHAT_DB.getMyGroupUsers = function() {
}
};
<<<<<<< HEAD
=======
CHAT_DB.getGroupInfo = function(groupId) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getGroupInfo(groupId));
}
};
CHAT_DB.getNameCardData = function(shopMemberId) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getNameCardData(shopMemberId));
}
};
>>>>>>> origin/develop_createRoom_UI
CHAT_DB.getArchiveList = function() {
if (CHAT_UTIL.isIOS()) {
// String形式をJsonに変更してReturn
......@@ -123,4 +145,7 @@ CHAT_DB.updateChatRoomInfo = function(roomId) {
//TODO Android処理追加必要
}
};
<<<<<<< HEAD
=======
>>>>>>> origin/develop_createRoom_UI
public/js/chat-websocket.js
......@@ -365,23 +365,20 @@ function setSocketAction () {
$('#pills-group-tab').tab('show');
$('#backButton').show();
if (isInvite) {
$('.titleRoomName').text(memberSelectTitle);
$('#newRoomName, .roomListIcon, .chatRoomIcon').hide();
$('#userSelectionConfirmBtn').show();
$("#userSelectionConfirmBtn").off().on('click', function(){
CHAT_UI.setConfirmButtonEvent(isInvite);
});
} else {
$('.titleRoomName').text(memberSelectTitle);
$('.roomListIcon, .chatRoomIcon, #newRoomName').hide();
$('#userSelectionConfirmBtn').show();
$("#userSelectionConfirmBtn").off().on('click', function(){
CHAT_UI.setConfirmButtonEvent(isInvite);
});
}
//
if (CHAT.globalSelectedUserList.length > 0) {
$('#userSelectionLength').text(CHAT.globalSelectedUserList.length);
} else {
......
public/js/constant.js
......@@ -25,3 +25,8 @@ const chatRoomType = {
DM : "1",
GROUP : "0"
}
const nameCardAreaId = {
MY : "myNamecard",
USER : "userNamecard"
}
\ No newline at end of file
public/js/language_en.js
......@@ -59,6 +59,20 @@ $.lang.en = {
"favorite":"Favorite List",
"mygroup":"My Group",
"groupChatRoom":"Group",
<<<<<<< HEAD
=======
"myGroup":"My Group",
"allGroup":"All Group",
"returnToRootGroup":"Return to Root Group",
"returnToParentGroup":"Return to Parent Group",
"quickBtn":"Quick Button",
"groupPath":"Group Path",
"childGroup":"Minor Group",
"groupUser":" Member List",
"chat":"Chat",
"voice":"Call",
"addFavorite":"Add Favorite"
>>>>>>> origin/develop_createRoom_UI
"archiveListTitle":"Archive",
"archiveTypeImage":"Image",
"archiveTypeMovie":"Movie",
......
public/js/language_ja.js
......@@ -59,6 +59,20 @@ $.lang.ja = {
"favorite":"お気に入りリスト",
"mygroup":"マイグループ",
"groupChatRoom":"グループ",
<<<<<<< HEAD
=======
"myGroup":"マイグループ",
"allGroup":"全グループ",
"returnToRootGroup":"トップグループに戻る",
"returnToParentGroup":"上位グループに戻る",
"quickBtn":"クイックボタン",
"groupPath":"グループパンクズ",
"childGroup":"下位グループ",
"groupUser":"所属ユーザ",
"chat":"チャット",
"voice":"通話",
"addFavorite":"お気に入り追加"
>>>>>>> origin/develop_createRoom_UI
"archiveListTitle":"アーカイブ",
"archiveTypeImage":"画像",
"archiveTypeMovie":"動画",
......
public/js/language_ko.js
......@@ -59,6 +59,20 @@ $.lang.ko = {
"favorite":"즐겨찾기리스트",
"mygroup":"마이그룹",
"groupChatRoom":"그룹",
<<<<<<< HEAD
=======
"myGroup":"내그룹",
"allGroup":"전그룹",
"returnToRootGroup":"최상위그룹으로 돌아가기",
"returnToParentGroup":"상위그룹으로 돌아가기",
"quickBtn":"퀵버튼",
"groupPath":"그룹 경로",
"childGroup":"하위 그룹",
"groupUser":"소속 사용자",
"chat":"채팅",
"voice":"통화",
"addFavorite":"즐겨찾기추가"
>>>>>>> origin/develop_createRoom_UI
"archiveListTitle":"아카이브",
"archiveTypeImage":"이미지",
"archiveTypeMovie":"동영상",
......
public_new/archive.html
......@@ -64,7 +64,6 @@
</ul>
</div>
</main>
<!-- フッター -->
<footer>
<div class="footer-wrap">
......
public_new/chat.html
......@@ -68,8 +68,6 @@
<!-- オーバーレイ -->
<div class="chat_list">
<ul class="overlay_src_msg">
</ul>
</div>
</main>
......@@ -123,7 +121,6 @@
String.prototype.replaceAll = function(org, dest) {
return this.split(org).join(dest);
}
let CHAT_SERVER_URL = '';
let CMS_SERVER_URL = '';
let ASSET_PATH = './';
......@@ -133,6 +130,7 @@
$("#loadingArea").load("./loading.html");
android.getLoginParameter();
android.getGlobalParameter();
android.saveSelectedUserList("");
function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
CHAT_SERVER_URL = chatServerUrl;
......@@ -142,6 +140,7 @@
IS_ONLINE = isOnline;
console.log("onChat");
CHAT_UI.refreshRoomList(chatRoomType.GROUP);
CHAT_UI.dismissLoadingIndicator();
};
</script>
</body>
......
public_new/chat_add_user_confirm.html
......@@ -43,165 +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);
}
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();
<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>
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/chat_make_room_confirm.html
......@@ -19,8 +19,8 @@
<div class="row h-100 align-items-center">
<div class="col-4 pr-0">
<div class="nav-item">
<div class="nav_prev">
<a href="chat_make_room.html"><span>ルーム開設</span></a>
<div class="nav_prev" id="prevBtn">
<a href="chat_make_room.html"><span style="font-size: 13px;">ルーム開設</span></a>
</div>
</div>
</div>
......@@ -41,163 +41,19 @@
<form action="chat_room.html" method="post">
<!-- ルーム名入力 -->
<div class="room_name">
<label for="room_name"><h2>ルーム名</h2></label>
<input type="text" class="input_name_room" name="room_name" placeholder="ルーム名を入力してください">
<label><h2>ルーム名</h2></label>
<input type="text" class="input_name_room" name="room_name" id="newRoomName" placeholder="ルーム名を入力してください">
</div>
<!-- 参加者一覧 -->
<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="make_room_btn">
<div class="make_room_btn" id="makeRoomBtn">
<button type="button" name="button">
チャット開始</button>
</div>
......@@ -205,10 +61,46 @@
</main>
<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>
<script src="./js/libs/jquery-3.3.1.min.js"></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/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/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);
}
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();
};
</script>
</body>
</html>
public_new/chat_room.html
......@@ -52,42 +52,9 @@
</div>
<!-- フィルター -->
<div id="filter" class="user_list filter d-flex flex-row none">
<div class="user_item">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="img/noImage.png" alt="プロフィール画像">
</div>
<span>名前名前名前名前名前名前名前名前</span>
</div>
</div>
<div class="user_item">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="img/noImage.png" alt="プロフィール画像">
</div>
<span>名前名前名前名前名前名前名前名前</span>
</div>
</div>
<div class="user_item">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="img/noImage.png" alt="プロフィール画像">
</div>
<span>名前名前名前名前名前名前名前名前</span>
</div>
</div>
<div class="user_item">
<div class="d-flex flex-column">
<div class="img_wrap">
<img src="img/noImage.png" alt="プロフィール画像">
</div>
<span>名前名前名前名前名前名前名前名前</span>
</div>
</div>
</div>
<!-- フィルター -->
<div id="filter" class="user_list filter d-flex flex-row none"></div>
<div class="chat_list">
<ul class="overlay_src_msg">
</ul>
......@@ -208,7 +175,6 @@
android.getLoginParameter();
android.getGlobalParameter();
function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
CHAT_SERVER_URL = chatServerUrl;
CMS_SERVER_URL = cmsServerUrl;
......@@ -216,6 +182,7 @@
IS_MOBILE = isMobile;
IS_ONLINE = isOnline;
CHAT_UI.loadMessages(CHAT.globalLoginParameter.roomId, CHAT.globalLoginParameter.roomName);
};
</script>
......
public_new/css/chat.css
......@@ -35,8 +35,8 @@ input[name="tab_item"] {
clear: both;
overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content{
#tabMyGroupOnMakeRoom:checked ~ #tab1_content,
#tabAllGroupOnMakeRoom:checked ~ #tab2_content{
display: block;
}
......
public_new/js/chat-add-user.js 0 → 100644
$(function() {
// メンバー検索
$('#chat_add_user .search_form input[type="search"]').keyup(function(){
var isAllGroup = $('#tabAllGroupOnMakeRoom').is(':checked');
$('.overlay_src_msg').empty();
//全グループ検索画面
if (isAllGroup) {
var keyword = $('#chat_add_user .search_form input[type="search"]').val();
if (keyword == '') {
return;
}
//グループデータ検索
var groupList = CHAT_DB.getGroupByName(keyword);
var groupTemplate;
$.get({ url: "./template/template_make_room_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
groupList.forEach(function(group) {
let html = Mustache.render(groupTemplate, {
name: group.groupName,
id: group.groupId,
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
})
//ユーザデータ検索
var userList = CHAT_DB.getAllGroupShopMemberNotInRoomByName(keyword);
var userTemplate;
$.get({ url: "./template/template_make_room_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function(shopMemberId) {
return shopMemberId == user.shopMemberId;
})
if (findObj) {
user.checked = 'checked';
}
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
　　//連絡先画面
} else {
var keyword = $('#chat_add_user .search_form input[type="search"]').val();
if (keyword == '') {
return;
}
var userList = CHAT_DB.getMyGroupShopMemberNotInRoomByName(keyword);
var userTemplate;
$.get({ url: "./template/template_make_room_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function(shopMemberId) {
return shopMemberId == user.shopMemberId;
})
if (findObj) {
user.checked = 'checked';
}
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').html(obj);
}
});
});
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処理追加必要
......@@ -82,6 +91,16 @@ CHAT_DB.getGroupInfo = function(groupId) {
}
};
CHAT_DB.loadSelectedUsers = function() {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
console.log(JSON.parse(android.getSelectedUserList()));
return JSON.parse(android.getSelectedUserList());
}
}
CHAT_DB.getNameCardData = function(shopMemberId) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
......@@ -99,6 +118,15 @@ CHAT_DB.getMyGroupShopMemberByName = function(shopMemberName) {
}
};
CHAT_DB.getMyGroupShopMemberNotInRoomByName = function(shopMemberName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getMyGroupShopMemberNotInRoomByName(shopMemberName));
}
};
CHAT_DB.getAllGroupShopMemberByName = function(shopMemberName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
......@@ -108,6 +136,15 @@ CHAT_DB.getAllGroupShopMemberByName = function(shopMemberName) {
}
};
CHAT_DB.getAllGroupShopMemberNotInRoomByName = function(shopMemberName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
} else if (CHAT_UTIL.isAndroid()) {
//String形式をJsonに変更してReturn
return JSON.parse(android.getAllGroupShopMemberNotInRoomByName(shopMemberName));
}
};
CHAT_DB.getGroupByName = function(groupName) {
if (CHAT_UTIL.isIOS()) {
//TODO IOS処理追加必要
......@@ -217,3 +254,20 @@ CHAT_DB.updateArchiveDetail = function(archiveId) {
// TODO
}
};
CHAT_DB.searchMessages = function(keyword, userList) {
if (CHAT_UTIL.isIOS()) {
// TODO
} else if (CHAT_UTIL.isAndroid()) {
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-websocket.js
......@@ -6,7 +6,6 @@ var CHAT_SOCKET = {};
CHAT_SOCKET.connectSocket = function () {
if (IS_ONLINE == 'true') {
socket = io(CHAT_SERVER_URL);
console.log(socket);
setSocketAction();
} else {
//オフラインの場合、DBからルーム一覧を表示。
......@@ -37,7 +36,6 @@ function setSocketAction () {
});
socket.on('disconnect', function() {
console.log('disconnect');
//socketが切断されたら黒画面で画面を更新する
$('.overlay').addClass('active undismissable');
//alert('Disconnected from the server');
......@@ -45,7 +43,6 @@ function setSocketAction () {
});
socket.on('connect_error', function() {
console.log('connect_error');
CHAT_UI.dismissLoadingIndicator();
});
......@@ -163,8 +160,6 @@ function setSocketAction () {
// New Message
// #36170
socket.on('newMessage', function(message, roomId, roomName) {
console.log(message);
let messageTime = CHAT_UTIL.formatDate(message.createdAt);
var userMessageTemplate;
$.get({ url: "./template/template_user_message.html", async: false }
, function(text) {
......@@ -186,22 +181,27 @@ function setSocketAction () {
// ユーザーが送信したメッセージの場合、自分のメッセージ様式を適用して表示する
template = myMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.createdAt);
message.profileImagePath = CHAT.getProfileImgUrl(message.profileImagePath)
try {
message.text = decodeURIComponent(message.text)
} catch(e) {
message.text = message.text
}
if ( message.text.includes(messageSeperator) ) {
message.text = message.text.split(messageSeperator)[0];
}
var replacePath = message.text;
replacePath = replacePath.replaceAll('?fileName=', '?sid=' + CHAT.globalLoginParameter.sid + '&fileName=');
message.text = replacePath;
//TODO newMessageの際にDB格納が必要。
let html = Mustache.render(template, {
text: message.text,
from: message.from,
profileImage: message.profileImagePath,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime
createdAtTime: messageTime.createdAtTime,
isToday: true
});
// イメージの場合、img tagを追加する
html = message.text.includes('attachedImages') || message.text.includes('attachedVideos') ? CHAT_UTIL.htmlDecode(html) : html;
......
public_new/js/chat.js
......@@ -126,8 +126,7 @@ CHAT.uploadImage = function(formData) {
}
socket.emit('createMessage', {
//text: '['+encodedText+'<&split>'+messageType.IMAGE+']'
text: encodedText
text: encodedText + messageSeperator + messageType.IMAGE
}, 1);
} else { // 動画の処理
......@@ -152,8 +151,7 @@ CHAT.uploadImage = function(formData) {
}
socket.emit('createMessage', {
//text: '['+encodedText+'<&split>'+messageType.VIDEO+']'
text: encodedText
text: encodedText + messageSeperator + messageType.VIDEO
}, 1);
}
......@@ -247,7 +245,6 @@ getLoginParameter = function(sid, loginId, shopName, roomId = undefined, roomNam
});
} else {
console.log('No error');
if (loginParam.roomName != undefined && loginParam.roomName != "null") {
$('.titleRoomName').text(loginParam.roomName).data('roomName', loginParam.roomName);
} else {
......@@ -272,21 +269,6 @@ CHAT.leaveRoom = function() {
}
$(function() {
// ルーム開設メンバー数カウント
$('input:checkbox').change(function() {
if($(this).prop('checked')){
$(this).attr('checked', true);
}else{
$(this).removeAttr('checked');
}
}).trigger('change');
// チェックした人数カウント
$('input:checkbox').change(function() {
var cnt = $('.checkbox input:checkbox:checked').length;
$('.select_member_num').text(cnt);
}).trigger('change');
// ルーム人数選択確認イベント
$('.make_room_btn button').click(function(){
$('form').submit();
......@@ -345,13 +327,21 @@ $(function() {
$('#chatTitle').text(roomListTitle);
});
$('#chat_add_user .search_form .cancel').click(function(){
CHAT.globalSelectedUserList.forEach(function(userId) {
if ($('.checkbox' + userId).prop('checked')) {
$('.checkbox' + checkMemberId).attr('checked', true);
} else {
$('.checkbox' + checkMemberId).removeAttr('checked');
}
});
});
// チャットメンバー検索
$('#chat .search_form input[type="search"]').keyup(function(){
$('.overlay_src_msg').empty();
var keyword = $('#chat .search_form input[type="search"]').val();
if (keyword == '' || keyword.length < 2) {
return;
}
if (keyword == '' || keyword.length < 2) { return; }
var rooms = CHAT_DB.getRoomList(chatRoomType.ALL, keyword);
let roomListTitle = getLocalizedString("room_search_placeholder");
$('#chatTitle').text(roomListTitle);
......@@ -360,6 +350,7 @@ $(function() {
, function(text) {
template = text;
});
rooms.forEach(function(room) {
room.profileImagePath = ASSET_PATH + 'images/user-profile.png'
if (room.message) {
......@@ -391,15 +382,14 @@ $(function() {
attendUsers: room.attendUsers
});
// Click event
let obj = $(jQuery.parseHTML(html)).on('click', function() {
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
});
if (CHAT_UI.isLandscapeMode()) {
$(".chat_list").removeClass("col-12").addClass("col-6");
}
});
// ルームメンバー検索
$('#chat_room .search_form input[type="search"]').keyup(function(){
$.ajax({
......@@ -410,27 +400,119 @@ $(function() {
$('.overlay_src_msg').html(data);
})
});
// ユーザー招待メンバー検索
$('#chat_add_user .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);
})
});
// チャットルーム
// メッセージ検索イベント
$('.chat_room_src_form input[type="search"]').keyup(function(){
$.ajax({
url: 'search_message.html',
type: 'POST',
datatype: 'html'
}).done(function (data) {
$('.overlay_src_msg').html(data);
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
$('.overlay_src_msg').empty();
var checkedUserList = [];
$('.img_wrap.filter').each(function(user) {
var selectedUser = $('.img_wrap.filter')[user];
checkedUserList.push($(selectedUser).data('user-id'));
})
if (keyword.length < 2) { return; }
var messages = CHAT_DB.searchMessages(keyword, checkedUserList.join(','));
var userMessageTemplate;
$.get({ url: "./template/template_user_message.html", async: false }
, function(text) {
userMessageTemplate = text;
});
var myMessageTemplate;
$.get({ url: "./template/template_my_message.html", async: false }
, function(text) {
myMessageTemplate = text;
});
let jQueryMessages = $('.overlay_src_msg');
messages.forEach(function(message) {
let template = userMessageTemplate;
if (message.shopMemberId == CHAT.globalLoginParameter.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == messageType.SYSTEM) {
template = systemMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
if (message.profileUrl) {
message.profileUrl = CHAT.getProfileImgUrl(message.profileUrl)
} else {
message.profileUrl = CHAT.getProfileImgUrl("")
}
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll('?fileName=', '?sid=' + CHAT.globalLoginParameter.sid + '&fileName=');
message.message = replacePath;
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime
});
html = message.message.includes('attachedImages') || message.message.includes('attachedVideos') ? CHAT_UTIL.htmlDecode(html) : html;
workVal = html + workVal;
})
jQueryMessages.prepend(workVal);
});
$('.filter_img').on('click', function() {
let workVal = "";
var keyword = $('.chat_room_src_form input[type="search"]').val();
$('.overlay_src_msg').empty();
var checkedUserList = [];
$('.img_wrap.filter').each(function(user) {
var selectedUser = $('.img_wrap.filter')[user];
checkedUserList.push($(selectedUser).data('user-id'));
})
if (keyword.length < 2) { return; }
var messages = CHAT_DB.searchMessages(keyword, checkedUserList.join(','));
var userMessageTemplate;
$.get({ url: "./template/template_user_message.html", async: false }
, function(text) {
userMessageTemplate = text;
});
var myMessageTemplate;
$.get({ url: "./template/template_my_message.html", async: false }
, function(text) {
myMessageTemplate = text;
});
let jQueryMessages = $('.overlay_src_msg');
messages.forEach(function(message) {
let template = userMessageTemplate;
if (message.shopMemberId == CHAT.globalLoginParameter.shopMemberId) {
template = myMessageTemplate;
}
if (message.messageType == messageType.SYSTEM) {
template = systemMessageTemplate;
}
let messageTime = CHAT_UTIL.formatDate(message.insertDate);
// ユーザの様式を読み込む
if (message.profileUrl) {
message.profileUrl = CHAT.getProfileImgUrl(message.profileUrl)
} else {
message.profileUrl = CHAT.getProfileImgUrl("")
}
message.message = message.message.toString();
var replacePath = message.message;
replacePath = replacePath.replaceAll('?fileName=', '?sid=' + CHAT.globalLoginParameter.sid + '&fileName=');
message.message = replacePath;
let html = Mustache.render(template, {
text: message.message,
from: message.loginId,
shopMemberId: message.shopMemberId,
profileImage: message.profileUrl,
createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime
});
html = message.message.includes('attachedImages') || message.message.includes('attachedVideos') ? CHAT_UTIL.htmlDecode(html) : html;
workVal = html + workVal;
})
jQueryMessages.prepend(workVal);
});
});
public_new/js/chatMakeRoom.js 0 → 100644
$(function() {
// メンバー検索
$('#chatMakeRoom .search_form input[type="search"]').keyup(function(){
var isAllGroup = $('#tabAllGroupOnMakeRoom').is(':checked');
$('.overlay_src_msg').empty();
//全グループ検索画面
if (isAllGroup) {
var keyword = $('#chatMakeRoom .search_form input[type="search"]').val();
if (keyword == '') {
return;
}
//グループデータ検索
var groupList = CHAT_DB.getGroupByName(keyword);
var groupTemplate;
$.get({ url: "./template/template_make_room_group_list.html", async: false }
, function(text) {
groupTemplate = text;
});
groupList.forEach(function(group) {
let html = Mustache.render(groupTemplate, {
name: group.groupName,
id: group.groupId,
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
})
//ユーザデータ検索
var userList = CHAT_DB.getAllGroupShopMemberByName(keyword);
var userTemplate;
$.get({ url: "./template/template_make_room_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function(shopMemberId) {
return shopMemberId == user.shopMemberId;
})
if (findObj) {
user.checked = 'checked';
}
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').append(obj);
　　//連絡先画面
} else {
var keyword = $('#chatMakeRoom .search_form input[type="search"]').val();
if (keyword == '') {
return;
}
var userList = CHAT_DB.getMyGroupShopMemberByName(keyword);
var userTemplate;
$.get({ url: "./template/template_make_room_user_list.html", async: false }
, function(text) {
userTemplate = text;
});
userList.forEach(function(user) {
user.profileUrl = CHAT.getProfileImgUrl(user.profileUrl);
let findObj = CHAT.globalSelectedUserList.find(function(shopMemberId) {
return shopMemberId == user.shopMemberId;
})
if (findObj) {
user.checked = 'checked';
}
});
let html = Mustache.render(userTemplate, {
userList: userList
});
let obj = jQuery.parseHTML(html);
$('.overlay_src_msg').html(obj);
}
});
});
public_new/js/common.js
......@@ -55,6 +55,7 @@ $(function() {
$('.message_input_form').click(function(){
$('.message_input_send').removeClass('none');
$('.attach_file').addClass('none');
$('.footer_content_b').addClass('none');
});
$('.message_input_form').on('focusout',function(e){
......@@ -63,6 +64,7 @@ $(function() {
}
$('.message_input_send').addClass('none');
$('.attach_file').removeClass('none');
$('.footer_content_b').removeClass('none');
});
});
public_new/js/constant.js
......@@ -27,7 +27,13 @@ const chatRoomType = {
ALL : "2"
}
const groupSearchFlg = {
ROOT : "0"
}
const nameCardAreaId = {
MY : "myNamecard",
USER : "userNamecard"
}
const messageSeperator = "<::split>";
public_new/js/loading.js
$(window).load(function () { //読み込み完了したら実行する
$(window).on('load',function () { //読み込み完了したら実行する
$('#loader-bg').delay(900).fadeOut(800);//ローディングを隠す
$('#loader').delay(600).fadeOut(300);
});
......
public_new/modal_chat_menu.html
......@@ -11,6 +11,7 @@
<ul>
<li><a href="chat_change_room_name.html"><img src="icon/icon_change_room_name.png" alt="ルーム名変更">ルーム名変更</a></li>
<li><a href="chat_add_user.html"><img src="icon/icon_add_user.png" alt="ユーザー招待">ユーザー招待</a></li>
<li ><a href="javascript:return false;" onclick="CHAT_UI.roomDisplayOff();"><img src="icon/icon_chat_gray.png" alt="ユーザー招待">部屋非表示</a></li>
</ul>
</div>
</div>
......
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
public_new/template/template_chatroom_user_filter_list.html 0 → 100644
{{#userList}}
<div class="user_item">
<div class="d-flex flex-column">
<div class="img_wrap filter_img" data-user-id="{{shopMemberId}}">
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'">
</div>
<span>{{shopMemberName}}</span>
</div>
</div>
{{/userList}}
\ No newline at end of file
public_new/template/template_make_room_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_make_room_group_list.html 0 → 100644
<li class="d-flex align-items-center">
<a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupForMakeRoom({{id}});">
<div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l">
<div class="thumbnail">
<img src="icon/icon_folder.png" alt="フォルダ" />
</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>
</a>
</li>
\ No newline at end of file
public_new/template/template_make_room_group_path.html 0 → 100644
<a href="#" class="breadcrumb_item" onclick="CHAT_UI.refreshAllGroupForMakeRoom({{id}});"><span>{{name}}</span></a>
\ No newline at end of file
public_new/template/template_make_room_group_user_list.html 0 → 100644
<div class="category"><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">
<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>
{{/groupUserList}}
</ul>
\ No newline at end of file
public_new/template/template_make_room_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
public_new/template/template_my_message.html
<div class="room_right">
<div class="text">{{text}}</div>
{{#isToday}}
<div class="date d-flex flex-column"><span></span><span>{{createdAtTime}}</span></div>
{{/isToday}}
{{^isToday}}
<div class="date d-flex flex-column"><span>{{createdAtDay}}</span><span>{{createdAtTime}}</span></div>
{{/isToday}}
<div class="read d-flex align-items-end"><span></span></div>
</div>
\ No newline at end of file
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'"></a>
</figure>
<div class="room_left-text">
<div class="name">{{from}}</div>
<div class="text">{{text}}</div>
</div>
{{#isToday}}
<div class="date d-flex flex-column"><span></span><span>{{createdAtTime}}</span></div>
{{/isToday}}
{{^isToday}}
<div class="date d-flex flex-column"><span>{{createdAtDay}}</span><span>{{createdAtTime}}</span></div>
{{/isToday}}
<div class="read d-flex align-items-end"><span></span></div>
</div>
\ 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