Commit d5b5b4a3 by Takuya Ogawa

Merge branch 'features/1.3.0_chat' into 'features/1.3.0'

Features/1.3.0 chat

See merge request !51
parents 1ee02f0d 6d6c04c9
...@@ -570,4 +570,16 @@ a.article:hover { ...@@ -570,4 +570,16 @@ a.article:hover {
display: inline-block; display: inline-block;
text-align: left; text-align: left;
width: 100%; width: 100%;
} }
\ No newline at end of file
.modal-dialog {
z-index: 10001;
}
.modal {
z-index: 10101;
}
.modal-backdrop {
z-index:10050;
}
...@@ -159,7 +159,16 @@ socket.on('disconnect', function (){ ...@@ -159,7 +159,16 @@ socket.on('disconnect', function (){
socket.on('connect_error', function (){ socket.on('connect_error', function (){
jQuery('.overlay').addClass('active undismissable'); jQuery('.overlay').addClass('active undismissable');
// console.log('connect_error'); // console.log('connect_error');
alert('connect_error'); // #36174
$("#customAlertTitle").text(getLocalizedString("errorConnect"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
dismissLoadingIndicator(); dismissLoadingIndicator();
}); });
...@@ -324,22 +333,33 @@ jQuery('#roomDeleteButton').on('click', function(e){ ...@@ -324,22 +333,33 @@ jQuery('#roomDeleteButton').on('click', function(e){
// チャットルームの削除アイコンにクリックイベントを与える // チャットルームの削除アイコンにクリックイベントを与える
jQuery('.deleteBox').off('click'); jQuery('.deleteBox').off('click');
jQuery('.deleteBox').on('click', function(e){ jQuery('.deleteBox').on('click', function(e){
// #36174
let roomId = jQuery(this).data('roomId');
let activeRoom = jQuery(this).data('activeRoom');
$("#roomDeleteTitle").text(getLocalizedString("roomDeleteTitle"));
$("#roomDelete").text(getLocalizedString("roomDelete"));
$("#cancelTitle").text(getLocalizedString("cancelTitle"));
// #36128 // #36128
if (window.confirm('Do you want to delete this room?')) { $('#roomDeleteConfirm').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#roomDelete', function(e) {
//loadingIndicatorを表示 //loadingIndicatorを表示
showLoadingIndicator(); showLoadingIndicator();
// 現在接続されているチャットルームを離れるとメッセージテップを初期化する // 現在接続されているチャットルームを離れるとメッセージテップを初期化する
if (jQuery(this).data('activeRoom')) { if (activeRoom) {
jQuery('#messages').html(''); jQuery('#messages').html('');
saveRoomInfo('', ''); saveRoomInfo('', '');
} }
// チャットルームから退場する // チャットルームから退場する
socket.emit('exitRoom', jQuery(this).data('roomId')); socket.emit('exitRoom', roomId);
// #36129に対応 // #36129に対応
let roomListTitle = getLocalizedString("roomListTitle") let roomListTitle = getLocalizedString("roomListTitle")
$('.titleRoomName').text(roomListTitle) $('.titleRoomName').text(roomListTitle)
} });
}); });
} }
}); });
...@@ -736,14 +756,23 @@ jQuery('#chatKeyword').on('keypress', function(event){ ...@@ -736,14 +756,23 @@ jQuery('#chatKeyword').on('keypress', function(event){
// Exit Room // Exit Room
jQuery('#exitRoom').on('click', function(event){ jQuery('#exitRoom').on('click', function(event){
if (window.confirm('Do you want to leave this room?')) { // 36174
$("#exitRoomTitle").text(getLocalizedString("exitRoomTitle"));
$("#exitRoomOk").text(getLocalizedString("yesTitle"));
$("#noExit").text(getLocalizedString("cancelTitle"));
$('#exitRoomConfirm').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#exitRoomOk', function(e) {
//loadingIndicatorを表示 //loadingIndicatorを表示
showLoadingIndicator(); showLoadingIndicator();
// チャットルームから退場する // チャットルームから退場する
socket.emit('exitRoom'); socket.emit('exitRoom');
jQuery('#dismiss').click(); jQuery('#dismiss').click();
saveRoomInfo('', ''); saveRoomInfo('', '');
} });
}); });
// Side Bar // Side Bar
...@@ -1127,7 +1156,21 @@ jQuery('#pills-confirm-tab').on('shown.bs.tab', function (e){ ...@@ -1127,7 +1156,21 @@ jQuery('#pills-confirm-tab').on('shown.bs.tab', function (e){
socket.on('showServerError', function (message){ socket.on('showServerError', function (message){
console.log(message); console.log(message);
alert(message); // #36174
if (message == 'server error Ocurred') {
message = getLocalizedString("serverErrorOccured");
} else if (message == 'Room not found') {
message = getLocalizedString("errorRoomNotFound");
}
$("#customAlertTitle").text(message);
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
dismissLoadingIndicator(); dismissLoadingIndicator();
if(message == "Room not found"){ if(message == "Room not found"){
...@@ -1149,7 +1192,16 @@ socket.on("retryJoinProcess", () => { ...@@ -1149,7 +1192,16 @@ socket.on("retryJoinProcess", () => {
//webでのsocket connect //webでのsocket connect
socket.emit('join', params, function (err) { socket.emit('join', params, function (err) {
if (err) { if (err) {
alert(err); // #36174
$("#customAlertTitle").text(err);
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
} else { } else {
console.log('No error'); console.log('No error');
if(params.roomName != undefined) { if(params.roomName != undefined) {
...@@ -1246,21 +1298,50 @@ function showConfirmView(isInvite){ ...@@ -1246,21 +1298,50 @@ function showConfirmView(isInvite){
// #36130に対応 // #36130に対応
const trimmedRoomName = jQuery('#newRoomName').val().trim() const trimmedRoomName = jQuery('#newRoomName').val().trim()
if (trimmedRoomName.length == 0) { if (trimmedRoomName.length == 0) {
//ルーム名を入力しなかったら、ルーム名textFieldにfocusを置く // 36174
jQuery('#newRoomName').focus(); $("#userSelectionTitle").text(getLocalizedString("inputRoomName"));
alert("Input RoomName"); $("#yesTitle").text(getLocalizedString("yesTitle"));
$('#confirm').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#yesTitle', function(e) {
//ルーム名を入力しなかったら、ルーム名textFieldにfocusを置く
jQuery('#newRoomName').focus();
});
} else if(trimmedRoomName.includes(';') || trimmedRoomName.includes('/') || trimmedRoomName.includes('?') || trimmedRoomName.includes(':') || trimmedRoomName.includes("@") } else if(trimmedRoomName.includes(';') || trimmedRoomName.includes('/') || trimmedRoomName.includes('?') || trimmedRoomName.includes(':') || trimmedRoomName.includes("@")
|| trimmedRoomName.includes('&') || trimmedRoomName.includes('=') || trimmedRoomName.includes("+") || trimmedRoomName.includes('$') || trimmedRoomName.includes(",") || trimmedRoomName.includes('-') || trimmedRoomName.includes('&') || trimmedRoomName.includes('=') || trimmedRoomName.includes("+") || trimmedRoomName.includes('$') || trimmedRoomName.includes(",") || trimmedRoomName.includes('-')
|| trimmedRoomName.includes('_') || trimmedRoomName.includes('.') || trimmedRoomName.includes('!') || trimmedRoomName.includes('~') || trimmedRoomName.includes('*') || trimmedRoomName.includes("\'") || trimmedRoomName.includes('_') || trimmedRoomName.includes('.') || trimmedRoomName.includes('!') || trimmedRoomName.includes('~') || trimmedRoomName.includes('*') || trimmedRoomName.includes("\'")
|| trimmedRoomName.includes('(') || trimmedRoomName.includes(')') || trimmedRoomName.includes('#') || trimmedRoomName.includes("\\") || trimmedRoomName.includes("\"") || trimmedRoomName.includes("`")) { || trimmedRoomName.includes('(') || trimmedRoomName.includes(')') || trimmedRoomName.includes('#') || trimmedRoomName.includes("\\") || trimmedRoomName.includes("\"") || trimmedRoomName.includes("`")) {
// #36147 // #36147
alert("InvalidSpecialCharacterRoomName") // #36174
$("#customAlertTitle").text(getLocalizedString("invalidCharacter"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
} else if (trimmedRoomName.length > 20) { } else if (trimmedRoomName.length > 20) {
// #36142 // #36142
var inputText = $('#newRoomName').val().trim(); // #36142 文字列の前又は後の空白文字列を削除 var inputText = $('#newRoomName').val().trim(); // #36142 文字列の前又は後の空白文字列を削除
alert("Please enter room name less than 20 characters", () => {
// #36174
$("#customAlertTitle").text(getLocalizedString("nameTooLong"));
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
$('#newRoomName').val(inputText.substr(0, $('#newRoomName').prop("maxlength"))); $('#newRoomName').val(inputText.substr(0, $('#newRoomName').prop("maxlength")));
}); });
} else { } else {
//loadingIndicatorを表示 //loadingIndicatorを表示
showLoadingIndicator(); showLoadingIndicator();
...@@ -1287,9 +1368,19 @@ function showConfirmView(isInvite){ ...@@ -1287,9 +1368,19 @@ function showConfirmView(isInvite){
jQuery("#userSelectionDeleteBtn").hide(); jQuery("#userSelectionDeleteBtn").hide();
jQuery("#userSelectionDeleteBtn").off().on('click', function() { jQuery("#userSelectionDeleteBtn").off().on('click', function() {
if(window.confirm('Do you want to remove selected members from the list?')) { // #36174
$("#customConfirmTitle").text(getLocalizedString("memberDeleteTitle"));
$("#customConfirmOk").text(getLocalizedString("roomDelete"));
$("#customAlertCancel").text(getLocalizedString("cancelTitle"));
$('#customConfirm').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customConfirmOk', function(e) {
deleteButtonAction(isInvite); deleteButtonAction(isInvite);
} });
}); });
} }
...@@ -1352,7 +1443,17 @@ function getLoginParameter(sid, loginId, shopName, roomId = undefined, roomName ...@@ -1352,7 +1443,17 @@ function getLoginParameter(sid, loginId, shopName, roomId = undefined, roomName
socket.emit('join', globalLoginParameter, function (err) { socket.emit('join', globalLoginParameter, function (err) {
if (err) { if (err) {
alert(err); // #36174
$("#customAlertTitle").text(err);
$("#customAlertOk").text(getLocalizedString("yesTitle"));
$('#customAlert').appendTo("body").modal({
backdrop: 'static',
keyboard: false
})
.on('click', '#customAlertOk', function(e) {
});
} else { } else {
console.log('No error'); console.log('No error');
if (globalLoginParameter.roomName != undefined && globalLoginParameter.roomName != "null") { if (globalLoginParameter.roomName != undefined && globalLoginParameter.roomName != "null") {
......
$.lang.en = { $.lang.en = {
"chat_placeholder":"Type message", "chat_placeholder":"Type message",
"participants":"Paricipants", "participants":"Member List",
"exitRoom":"Exit ", "exitRoom":"Exit ",
"roomListTitle":"Room List", "roomListTitle":"Room List",
"deleteRoomTitle":"Delete Room", "deleteRoomTitle":"Delete Room",
...@@ -8,7 +8,7 @@ $.lang.en = { ...@@ -8,7 +8,7 @@ $.lang.en = {
"inviteUsersTitle":"Invite Member", "inviteUsersTitle":"Invite Member",
"createRoomSubtitle":"Create Room", "createRoomSubtitle":"Create Room",
"inviteUsersSubtitle":"Invite User", "inviteUsersSubtitle":"Invite User",
"roomListEmptyString":"No chat available.", "roomListEmptyString":"There is no room available.",
"left":"%@ has left", "left":"%@ has left",
"join":"%@ has joined", "join":"%@ has joined",
"added":"%@ has been added", "added":"%@ has been added",
...@@ -31,5 +31,18 @@ $.lang.en = { ...@@ -31,5 +31,18 @@ $.lang.en = {
"everyoneIsHere":"Everyone is in the chat.", "everyoneIsHere":"Everyone is in the chat.",
"people":"people", "people":"people",
"searchResult":"Results", "searchResult":"Results",
"searchRoomListEmptyString":"No search results." "searchRoomListEmptyString":"No search results.",
"inputRoomName":"Please enter a room name.",
"exitRoomTitle":"Do you want to leave this room?",
"roomDeleteTitle":"Do you want to delete this room?",
"roomDelete":"Delete",
"cancelTitle":"No",
"yesTitle":"Yes",
"invalidCharacter":"The character ;/?:@&=+$,-_.!~*\'()#\\\"` cannot be included in the roomname.",
"nameTooLong":"Please enter room name less than 20 characters.",
"errorDisconnected":"Disconnected from the server.",
"errorConnect":"There was a problem with the network.\n Please check the connection status of the network.",
"errorRoomNotFound":"This chat room has already been deleted.",
"serverErrorOccured":"App will not be able to communicate with the server. \n After a few moments, please try again.",
"memberDeleteTitle":"Do you want to remove selected members from the list?"
} }
...@@ -31,5 +31,18 @@ $.lang.ja = { ...@@ -31,5 +31,18 @@ $.lang.ja = {
"everyoneIsHere":"招待可能なメンバーがいません。", "everyoneIsHere":"招待可能なメンバーがいません。",
"people":"人", "people":"人",
"searchResult":"件のトーク", "searchResult":"件のトーク",
"searchRoomListEmptyString":"検索結果がありません。" "searchRoomListEmptyString":"検索結果がありません。",
"inputRoomName":"ルーム名を入力してください。",
"exitRoomTitle":"このチャットルームを出ますか?",
"roomDeleteTitle":"このチャットルームを削除しますか?",
"roomDelete":"削除",
"cancelTitle":"いいえ",
"yesTitle":"はい",
"invalidCharacter":"特殊文字 ;/?:@&=+$,-_.!~*\'()#\\\"` はルーム名に含めることができません。",
"nameTooLong":"ルーム名は文字列20字以内に入力してください。",
"errorDisconnected":"接続が切れました。",
"errorConnect":"ネットワークに問題がありました。\nネットワークの接続状態を確認してください。",
"errorRoomNotFound":"既に削除されたチャットルームです。",
"serverErrorOccured":"サーバと通信できません。\nしばらく時間をおいて再度操作してください。",
"memberDeleteTitle":"選択したメンバーをリストから削除しますか?"
} }
$.lang.ko = { $.lang.ko = {
"chat_placeholder":"메시지를 입력하세요.", "chat_placeholder":"메시지를 입력하세요.",
"participants":"대화상대", "participants":"멤버 리스트",
"exitRoom":"나가기 ", "exitRoom":"나가기 ",
"roomListTitle":"채팅 리스트", "roomListTitle":"채팅 리스트",
"deleteRoomTitle":"채팅방 삭제", "deleteRoomTitle":"채팅방 삭제",
...@@ -17,9 +17,9 @@ $.lang.ko = { ...@@ -17,9 +17,9 @@ $.lang.ko = {
"orderByTime":"최신순", "orderByTime":"최신순",
"orderByUnread":"안 읽은 순", "orderByUnread":"안 읽은 순",
"roomKeywordPlaceHolder":"검색", "roomKeywordPlaceHolder":"검색",
"okayLabel":"알겠습니다!", "okayLabel":"알겠습니다.",
"completeLabel":"작업이 끝났습니다.", "completeLabel":"작업이 끝났습니다.",
"thankLabel":"감사합니다.:-)", "thankLabel":"감사합니다.",
"startToWorkLabel":"작업을 시작합니다.", "startToWorkLabel":"작업을 시작합니다.",
"groupListKeyword":"검색", "groupListKeyword":"검색",
"groupPageSubtitle":"그룹", "groupPageSubtitle":"그룹",
...@@ -31,5 +31,18 @@ $.lang.ko = { ...@@ -31,5 +31,18 @@ $.lang.ko = {
"everyoneIsHere":"초대가능한 유저가 없습니다.", "everyoneIsHere":"초대가능한 유저가 없습니다.",
"people":"명", "people":"명",
"searchResult":"건의 결과", "searchResult":"건의 결과",
"searchRoomListEmptyString":"검색 결과가 없습니다." "searchRoomListEmptyString":"검색 결과가 없습니다.",
"inputRoomName":"방 제목을 입력해 주십시오.",
"exitRoomTitle":"이 채팅방을 나가시겠습니까?",
"roomDeleteTitle":"이 방을 삭제 하시겠습니까?",
"roomDelete":"삭제",
"cancelTitle":"아니오",
"yesTitle":"예",
"invalidCharacter":"특수문자 ;/?:@&=+$,-_.!~*\'()#\\\"` 는 방 제목에 포함될 수 없습니다.",
"nameTooLong":"방 제목은 20자 이내로 입력해 주세요.",
"errorDisconnected":"서버와 접속이 끊어졌습니다.",
"errorConnect":"네트워크에 문제가 발생했습니다.\n네트워크 연결상태를 확인하여 주십시요.",
"errorRoomNotFound":"이미 삭제된 채팅룸입니다.",
"serverErrorOccured":"서버와 통신할 수 없습니다.\n잠시 후 다시 시도해보시기 바랍니다.",
"memberDeleteTitle":"목록에서 선택된 멤버를 삭제하시겠습니까?"
} }
...@@ -25,6 +25,21 @@ ...@@ -25,6 +25,21 @@
<button class="btn btn-primary roomListIcon" type="button" id="roomDeleteButton"> <button class="btn btn-primary roomListIcon" type="button" id="roomDeleteButton">
<i class="fa fa-trash"></i> <i class="fa fa-trash"></i>
</button> </button>
<!-- Confirm Dialog -->
<div id="roomDeleteConfirm" class="modal fade">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body" id="roomDeleteTitle">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-primary" id="roomDelete">Delete</button>
<button type="button" data-dismiss="modal" class="btn" id="cancelTitle">Cancel</button>
</div>
</div>
</div>
</div>
</li> </li>
<li class="nav-item dropdown roomListIcon"> <li class="nav-item dropdown roomListIcon">
<a class="nav-link dropdown-toggle" href="#" id="arrangeRooms" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <a class="nav-link dropdown-toggle" href="#" id="arrangeRooms" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
...@@ -76,6 +91,20 @@ ...@@ -76,6 +91,20 @@
<span id="userSelectionLength" class="badge badge-light"></span> <span id="userSelectionLength" class="badge badge-light"></span>
<i class="fas fa-check"></i> <i class="fas fa-check"></i>
</button> </button>
<!-- Alert Dialog -->
<div id="confirm" class="modal fade">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body" id="userSelectionTitle">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn" id="yesTitle">OK</button>
</div>
</div>
</div>
</div>
</li> </li>
</ul> </ul>
</nav> </nav>
...@@ -93,6 +122,21 @@ ...@@ -93,6 +122,21 @@
<a class="btn text-light" role="button" id="exitRoom"> <a class="btn text-light" role="button" id="exitRoom">
Exit <i class="fas fa-door-open"></i> Exit <i class="fas fa-door-open"></i>
</a> </a>
<!-- Confirm Dialog -->
<div id="exitRoomConfirm" class="modal fade">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body" id="exitRoomTitle">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-primary" id="exitRoomOk">Ok</button>
<button type="button" data-dismiss="modal" class="btn" id="noExit">Cancel</button>
</div>
</div>
</div>
</div>
</footer> </footer>
</nav> </nav>
<!-- Dark Overlay element --> <!-- Dark Overlay element -->
...@@ -103,6 +147,36 @@ ...@@ -103,6 +147,36 @@
<span class="sr-only">Loading...</span> <span class="sr-only">Loading...</span>
</div> </div>
</div> </div>
<!-- Error Alert Dialog -->
<div id="customAlert" class="modal fade">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body" id="customAlertTitle">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-primary" id="customAlertOk">Ok</button>
</div>
</div>
</div>
</div>
<!-- Confirm Dialog -->
<div id="customConfirm" class="modal fade">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body" id="customConfirmTitle">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-primary" id="customConfirmOk">Ok</button>
<button type="button" data-dismiss="modal" class="btn" id="customAlertCancel">Cancel</button>
</div>
</div>
</div>
</div>
<div class="tab-content" id="pills-tabContent"> <div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-chatlist" role="tabpanel" aria-labelledby="pills-chatlist-tab"> <div class="tab-pane fade show active" id="pills-chatlist" role="tabpanel" aria-labelledby="pills-chatlist-tab">
<div class="inbox_people"> <div class="inbox_people">
......
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