Skip to content

C
chat_webview
Commit 86d7f716 by Kim Eunchul
Options

Merge remote-tracking branch 'origin/develop' into squash/socket_kim-ec 

# Conflicts:
#	public_new/js/sockets/chat-websocket-message.js
parents 2f805a11 f598d8fc
Showing with 444 additions and 318 deletions
public_new/css/chat.css
...@@ -73,6 +73,9 @@ input[name="tab_item"] { ...@@ -73,6 +73,9 @@ input[name="tab_item"] {
width: 90px; width: 90px;
max-height: 60px; max-height: 60px;
} }
#addUserFormInCollaboration .chat_list li {
border-bottom: 1px solid #e2e8f0;
}
.chat_list ul li { .chat_list ul li {
list-style: none; list-style: none;
border-bottom: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0;
......
public_new/css/collaboration.css
...@@ -26,14 +26,42 @@ ...@@ -26,14 +26,42 @@
margin: 0 5px; margin: 0 5px;
} }
.menu-icon {width: 40px;height: 50px;margin: 10px 15px;transform:scale(0.8);padding: 0;cursor: pointer;z-index:20} .menu-icon {
.menu-bar {width: 40px;height: 5px;background: white;position: absolute;transition: all 0.3s;} width: 40px;
.menu-bar1 {margin-top: 9px} height: 50px;
.menu-bar2 {margin-top: 23px} margin: 10px 15px;
.menu-bar3 {margin-top: 37px} transform: scale(0.8);
.menu-icon.hover .menu-bar1 {-webkit-transform: rotate(45deg) scaleX(0.7);margin-top: 22px;} padding: 0;
.menu-icon.hover .menu-bar2 {opacity: 0} cursor: pointer;
.menu-icon.hover .menu-bar3 {-webkit-transform: rotate(-45deg) scaleX(0.7);margin-top: 22px;} z-index: 20;
}
.menu-bar {
width: 40px;
height: 5px;
background: white;
position: absolute;
transition: all 0.3s;
}
.menu-bar1 {
margin-top: 9px;
}
.menu-bar2 {
margin-top: 23px;
}
.menu-bar3 {
margin-top: 37px;
}
.menu-icon.hover .menu-bar1 {
-webkit-transform: rotate(45deg) scaleX(0.7);
margin-top: 22px;
}
.menu-icon.hover .menu-bar2 {
opacity: 0;
}
.menu-icon.hover .menu-bar3 {
-webkit-transform: rotate(-45deg) scaleX(0.7);
margin-top: 22px;
}
.collabo-label { .collabo-label {
padding: 2px 5px; padding: 2px 5px;
...@@ -50,8 +78,8 @@ ...@@ -50,8 +78,8 @@
margin-top: 50px; margin-top: 50px;
} }
#overlay_user_list .user_list { #overlay_user_list .user_list {
background: #383838!important; background: #383838 !important;
border: none!important; border: none !important;
height: calc(100% - 140px); height: calc(100% - 140px);
overflow-x: unset; overflow-x: unset;
overflow-y: scroll; overflow-y: scroll;
...@@ -139,38 +167,40 @@ ...@@ -139,38 +167,40 @@
width: 60px; width: 60px;
height: 60px; height: 60px;
} }
#collabo_main .talking_area,#collabo_main .start_pip_area { #collabo_main .talking_area,
#collabo_main .start_pip_area {
position: relative; position: relative;
z-index: 2; z-index: 2;
} }
.talking_img_wrap { .talking_img_wrap {
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 90px; width: 90px;
height: 90px; height: 90px;
border-radius: 50%; border-radius: 50%;
border: 1px solid #fff; border: 1px solid #fff;
box-shadow: 0 0 20px #ffffff; box-shadow: 0 0 20px #ffffff;
cursor: pointer; cursor: pointer;
} }
.talking_img_wrap::before, .talking_img_wrap::after { .talking_img_wrap::before,
content: ""; .talking_img_wrap::after {
display: block; content: "";
position: absolute; display: block;
top: 0; position: absolute;
bottom: 0; top: 0;
left: 0; bottom: 0;
right: 0; left: 0;
margin: auto; right: 0;
width: 100%; margin: auto;
height: 100%; width: 100%;
border: 1px solid #fff; height: 100%;
border-radius: 50%; border: 1px solid #fff;
box-sizing: border-box; border-radius: 50%;
pointer-events: none; box-sizing: border-box;
animation: pulsate 2s linear infinite; pointer-events: none;
animation: pulsate 2s linear infinite;
} }
/**************************** overlay *************************/ /**************************** overlay *************************/
...@@ -217,9 +247,9 @@ animation: pulsate 2s linear infinite; ...@@ -217,9 +247,9 @@ animation: pulsate 2s linear infinite;
background: #383838; background: #383838;
height: 100vh; height: 100vh;
} }
#add_user_list{ #add_user_list {
width: 90%; width: 90%;
height: 90%; height: 90%;
} }
.fixed { .fixed {
position: fixed; position: fixed;
...@@ -236,53 +266,53 @@ animation: pulsate 2s linear infinite; ...@@ -236,53 +266,53 @@ animation: pulsate 2s linear infinite;
overflow: scroll; overflow: scroll;
} }
#overlay_menu { #overlay_menu {
transition: .7s; transition: 0.7s;
position: absolute; position: absolute;
top: 60px; top: 60px;
right: 0; right: 0;
} }
#overlay_menu .item01{ #overlay_menu .item01 {
opacity: 0; opacity: 0;
animation: fadein .5s ease forwards; animation: fadein 0.5s ease forwards;
} }
#overlay_menu .item02{ #overlay_menu .item02 {
opacity: 0; opacity: 0;
animation: fadein 1s ease forwards; animation: fadein 1s ease forwards;
} }
#overlay_menu .item03{ #overlay_menu .item03 {
opacity: 0; opacity: 0;
animation: fadein 1.5s ease forwards; animation: fadein 1.5s ease forwards;
} }
#overlay_menu .item04{ #overlay_menu .item04 {
opacity: 0; opacity: 0;
animation: fadein 2s ease forwards; animation: fadein 2s ease forwards;
} }
#overlay_menu .item05{ #overlay_menu .item05 {
opacity: 0; opacity: 0;
animation: fadein 2.5s ease forwards; animation: fadein 2.5s ease forwards;
} }
@keyframes fadein{ @keyframes fadein {
0%{ 0% {
opacity: 0; opacity: 0;
} }
100%{ 100% {
opacity: 1; opacity: 1;
} }
} }
@keyframes fadeout{ @keyframes fadeout {
0%{ 0% {
opacity: 1; opacity: 1;
} }
100%{ 100% {
opacity: 0; opacity: 0;
} }
} }
#overlay_menu .item01.hide, #overlay_menu .item01.hide,
#overlay_menu .item02.hide, #overlay_menu .item02.hide,
#overlay_menu .item03.hide, #overlay_menu .item03.hide,
#overlay_menu .item04.hide, #overlay_menu .item04.hide,
#overlay_menu .item05.hide{ #overlay_menu .item05.hide {
opacity: 1; opacity: 1;
animation: fadeout 0.3s ease forwards; animation: fadeout 0.3s ease forwards;
} }
...@@ -303,7 +333,7 @@ animation: pulsate 2s linear infinite; ...@@ -303,7 +333,7 @@ animation: pulsate 2s linear infinite;
position: relative; position: relative;
z-index: 999; z-index: 999;
} }
#overlay_menu .menu_wrap .menu .item.hide{ #overlay_menu .menu_wrap .menu .item.hide {
z-index: 0; z-index: 0;
} }
#overlay_menu .menu_wrap .menu .item:hover { #overlay_menu .menu_wrap .menu .item:hover {
...@@ -317,8 +347,8 @@ animation: pulsate 2s linear infinite; ...@@ -317,8 +347,8 @@ animation: pulsate 2s linear infinite;
color: #fff; color: #fff;
padding-top: 6px; padding-top: 6px;
} }
#overlay_menu .menu_wrap .menu .item span{ #overlay_menu .menu_wrap .menu .item span {
font-size:12px; font-size: 12px;
} }
#overlay_menu .img_wrap { #overlay_menu .img_wrap {
width: 35px; width: 35px;
...@@ -330,21 +360,14 @@ animation: pulsate 2s linear infinite; ...@@ -330,21 +360,14 @@ animation: pulsate 2s linear infinite;
width: 35px; width: 35px;
height: 35px; height: 35px;
} }
.fas.fa-wrench{ .fas.fa-wrench {
color: #fff; color: #fff;
font-size: 24px; font-size: 24px;
vertical-align: middle; vertical-align: middle;
} }
/* ユーザー追加 */ /* ユーザー追加 */
#overlay_add_user_list {
position: fixed;
z-index: 100;
top: 0;
background: white;
height: 70%;
width: 80%;
}
#add_user_list .user_list li { #add_user_list .user_list li {
list-style: none; list-style: none;
border-bottom: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0;
...@@ -424,13 +447,20 @@ animation: pulsate 2s linear infinite; ...@@ -424,13 +447,20 @@ animation: pulsate 2s linear infinite;
height: 50px; height: 50px;
border-radius: 50%; border-radius: 50%;
} }
#overlay_add_user_list a {
color: #323743;
}
/**************************** add user *************************/ /**************************** add user *************************/
#addUserFormInCollaboration nav{ #addUserFormInCollaboration nav {
border:none; border: none;
}
#addUserFormInCollaboration {
height: 100%;
display: flex;
flex-flow: column;
overflow-y: auto;
}
#addUserFormInCollaboration .content {
width: 100%;
} }
/**************************** zoomin zoomout *************************/ /**************************** zoomin zoomout *************************/
...@@ -456,6 +486,10 @@ animation: pulsate 2s linear infinite; ...@@ -456,6 +486,10 @@ animation: pulsate 2s linear infinite;
margin: auto 0; margin: auto 0;
} }
.coview_on_media_image_crown {
visibility: hidden;
}
/**************************** modal *************************/ /**************************** modal *************************/
#captyaModal .modal-header span, #captyaModal .modal-header span,
#changeHostModal .modal-header span, #changeHostModal .modal-header span,
...@@ -483,12 +517,12 @@ animation: pulsate 2s linear infinite; ...@@ -483,12 +517,12 @@ animation: pulsate 2s linear infinite;
height: 50px; height: 50px;
border-radius: 5px; border-radius: 5px;
} }
#modalAddUserConfirm .chat_list h2{ #modalAddUserConfirm .chat_list h2 {
font-size: 20px; font-size: 20px;
} }
/**************************** document *************************/ /**************************** document *************************/
.start_pip_img_wrap{ .start_pip_img_wrap {
width: 40px; width: 40px;
} }
...@@ -519,12 +553,12 @@ animation: pulsate 2s linear infinite; ...@@ -519,12 +553,12 @@ animation: pulsate 2s linear infinite;
.end:hover { .end:hover {
background: #ff4747c7; background: #ff4747c7;
} }
.close_img{ .close_img {
width: 20px; width: 20px;
height: 20px; height: 20px;
} }
.t-icon{ .t-icon {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: contain; background-size: contain;
...@@ -532,40 +566,40 @@ animation: pulsate 2s linear infinite; ...@@ -532,40 +566,40 @@ animation: pulsate 2s linear infinite;
height: 30px; height: 30px;
margin: 0 10px 6px 10px; margin: 0 10px 6px 10px;
} }
.voice{ .voice {
background-image: url("../icon/icon_voice_white.svg"); background-image: url("../icon/icon_voice_white.svg");
} }
.voice.disable{ .voice.disable {
background-image: url("../icon/icon_voice_white_disable.svg"); background-image: url("../icon/icon_voice_white_disable.svg");
} }
.pen{ .pen {
background-image: url("../icon/icon_collabo_pen_white.svg"); background-image: url("../icon/icon_collabo_pen_white.svg");
} }
.pen.disable{ .pen.disable {
background-image: url("../icon/icon_collabo_pen_white_disable.svg"); background-image: url("../icon/icon_collabo_pen_white_disable.svg");
} }
.picture{ .picture {
background-image: url("../icon/icon_collabo_picture.svg"); background-image: url("../icon/icon_collabo_picture.svg");
} }
.place{ .place {
background-image: url("../icon/icon_collabo_place_white.svg"); background-image: url("../icon/icon_collabo_place_white.svg");
} }
.delete{ .delete {
background-image: url("../icon/icon_collabo_delete_white.svg"); background-image: url("../icon/icon_collabo_delete_white.svg");
} }
.rewind{ .rewind {
background-image: url("../icon/icon_collabo_rewind_white.svg"); background-image: url("../icon/icon_collabo_rewind_white.svg");
} }
.forward{ .forward {
background-image: url("../icon/icon_collabo_forward_white.svg"); background-image: url("../icon/icon_collabo_forward_white.svg");
} }
.capture{ .capture {
background-image: url("../icon/icon_collabo_capture.svg"); background-image: url("../icon/icon_collabo_capture.svg");
} }
.record{ .record {
background-image: url("../icon/icon_record.svg"); background-image: url("../icon/icon_record.svg");
} }
.record.disable{ .record.disable {
background-image: url("../icon/icon_record_disable.svg"); background-image: url("../icon/icon_record_disable.svg");
} }
...@@ -575,11 +609,12 @@ animation: pulsate 2s linear infinite; ...@@ -575,11 +609,12 @@ animation: pulsate 2s linear infinite;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 50%; border-radius: 50%;
background-color: #DD4545; background-color: #dd4545;
box-shadow: 0 0 20px #dd4545; box-shadow: 0 0 20px #dd4545;
cursor: pointer; cursor: pointer;
} }
.record.disable::before, .record.disable::after { .record.disable::before,
.record.disable::after {
content: ""; content: "";
display: block; display: block;
position: absolute; position: absolute;
...@@ -590,7 +625,7 @@ animation: pulsate 2s linear infinite; ...@@ -590,7 +625,7 @@ animation: pulsate 2s linear infinite;
margin: auto; margin: auto;
width: 100%; width: 100%;
height: 100%; height: 100%;
border: 1px solid #DD4545; border: 1px solid #dd4545;
border-radius: 50%; border-radius: 50%;
box-sizing: border-box; box-sizing: border-box;
pointer-events: none; pointer-events: none;
...@@ -607,7 +642,7 @@ animation: pulsate 2s linear infinite; ...@@ -607,7 +642,7 @@ animation: pulsate 2s linear infinite;
} }
} }
.flash-txt{ .flash-txt {
position: absolute; position: absolute;
top: -35px; top: -35px;
left: -45px; left: -45px;
...@@ -627,14 +662,32 @@ animation: pulsate 2s linear infinite; ...@@ -627,14 +662,32 @@ animation: pulsate 2s linear infinite;
border-radius: 5px; border-radius: 5px;
} }
@-webkit-keyframes fade-in-out { @-webkit-keyframes fade-in-out {
0% {visibility: hidden; opacity: 0;} 0% {
50% {visibility: visible; opacity: 1;} visibility: hidden;
100% {visibility: hidden; opacity: 0;} opacity: 0;
}
50% {
visibility: visible;
opacity: 1;
}
100% {
visibility: hidden;
opacity: 0;
}
} }
@keyframes fade-in-out { @keyframes fade-in-out {
0% {visibility: hidden; opacity: 0;} 0% {
50% {visibility: visible; opacity: 1;} visibility: hidden;
100% {visibility: hidden; opacity: 0;} opacity: 0;
}
50% {
visibility: visible;
opacity: 1;
}
100% {
visibility: hidden;
opacity: 0;
}
} }
/**************************** footer-menu *************************/ /**************************** footer-menu *************************/
...@@ -677,15 +730,17 @@ animation: pulsate 2s linear infinite; ...@@ -677,15 +730,17 @@ animation: pulsate 2s linear infinite;
margin: 0 5px; margin: 0 5px;
color: #fff; color: #fff;
} }
#collabo_footer_menu{ #collabo_footer_menu {
opacity: 1; opacity: 1;
animation: fadein 0.5s ease forwards; animation: fadein 0.5s ease forwards;
} }
#collabo_footer_menu.hide{ #collabo_footer_menu.hide {
opacity: 1; opacity: 1;
animation: fadeout 0.5s ease forwards; animation: fadeout 0.5s ease forwards;
} }
#collabo_footer .txt{ font-size: 12px; } #collabo_footer .txt {
font-size: 12px;
}
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
#add_user_list .user_item_ttl { #add_user_list .user_item_ttl {
...@@ -723,13 +778,12 @@ animation: pulsate 2s linear infinite; ...@@ -723,13 +778,12 @@ animation: pulsate 2s linear infinite;
.add_user_modal { .add_user_modal {
width: 80%; width: 80%;
height: 80%; height: 100%;
left: 12.5%; left: 12.5%;
overflow: auto; overflow: auto;
} }
.add_user_confirm_modal { .add_user_confirm_modal {
max-height: 80%;
left: 5%; left: 5%;
width: 90%; width: 90%;
} }
...@@ -743,7 +797,7 @@ animation: pulsate 2s linear infinite; ...@@ -743,7 +797,7 @@ animation: pulsate 2s linear infinite;
} }
#selectedUserListinCollaboration { #selectedUserListinCollaboration {
height: 400px; height: 50vh;
overflow: scroll; overflow: scroll;
} }
...@@ -768,8 +822,8 @@ animation: pulsate 2s linear infinite; ...@@ -768,8 +822,8 @@ animation: pulsate 2s linear infinite;
transition: all 0.2s ease; transition: all 0.2s ease;
} }
.modal-content .msg_notification { .modal-content .msg_notification {
display: none; display: none;
} }
input[name="tab_item"] { input[name="tab_item"] {
display: none; display: none;
...@@ -781,28 +835,35 @@ input[name="tab_item"] { ...@@ -781,28 +835,35 @@ input[name="tab_item"] {
overflow: hidden; overflow: hidden;
} }
#addUserFormInCollaboration #tab1_content,
#addUserFormInCollaboration #tab2_content {
height: 70vh;
overflow-y: scroll;
overflow-x: hidden;
}
#tabMyGroupOnMakeRoom:checked ~ #tab1_content, #tabMyGroupOnMakeRoom:checked ~ #tab1_content,
#tabAllGroupOnMakeRoom:checked ~ #tab2_content{ #tabAllGroupOnMakeRoom:checked ~ #tab2_content {
display: block; display: block;
} }
#tabMyGroupOnAddUserInCollaboration:checked ~ #tab1_content, #tabMyGroupOnAddUserInCollaboration:checked ~ #tab1_content,
#tabAllGroupOnAddUserInCollaboration:checked ~ #tab2_content{ #tabAllGroupOnAddUserInCollaboration:checked ~ #tab2_content {
display: block; display: block;
} }
#tabMyGroupOnAddUser:checked ~ #tab1_content, #tabMyGroupOnAddUser:checked ~ #tab1_content,
#tabAllGroupOnAddUser:checked ~ #tab2_content{ #tabAllGroupOnAddUser:checked ~ #tab2_content {
display: block; display: block;
} }
#tabMyGroup:checked ~ #tab1_content, #tabMyGroup:checked ~ #tab1_content,
#tabAllGroup:checked ~ #tab2_content{ #tabAllGroup:checked ~ #tab2_content {
display: block; display: block;
} }
#tabGroup:checked ~ #tab1_content, #tabGroup:checked ~ #tab1_content,
#tabDM:checked ~ #tab2_content{ #tabDM:checked ~ #tab2_content {
display: block; display: block;
} }
...@@ -851,7 +912,7 @@ input[name="tab_item"] { ...@@ -851,7 +912,7 @@ input[name="tab_item"] {
z-index: 999; z-index: 999;
} }
#userNameCardInCollaboration li{ #userNameCardInCollaboration li {
list-style: none; list-style: none;
} }
...@@ -926,4 +987,3 @@ input[name="tab_item"] { ...@@ -926,4 +987,3 @@ input[name="tab_item"] {
max-width: 75%; max-width: 75%;
} }
} }
public_new/js/common/common.js
...@@ -159,6 +159,7 @@ Common.startCollaboration = function (collaborationType) { ...@@ -159,6 +159,7 @@ Common.startCollaboration = function (collaborationType) {
deviceInfo.androidVersion < ANDROID_SDK_VERSION.O deviceInfo.androidVersion < ANDROID_SDK_VERSION.O
) { ) {
alert(getLocalizedString("not_support_version")); alert(getLocalizedString("not_support_version"));
Common.dismissLoadingIndicator();
return; return;
} }
} }
...@@ -168,9 +169,10 @@ Common.startCollaboration = function (collaborationType) { ...@@ -168,9 +169,10 @@ Common.startCollaboration = function (collaborationType) {
Common.dismissLoadingIndicator(); Common.dismissLoadingIndicator();
return; return;
} }
const sendData = DATA_MESSAGE_SCHEME + FINISH_ALL_COLLABORATION_SIGNAL;
CHAT_SOCKET.emitCreateMessage(SOCKET_KEY.CREATE_MESSAGE, sendData);
NativeBridgeDelegate.finishAllCollaboration();
} }
CHAT_SOCKET.emitCollaborationFinishMessage();
NativeBridgeDelegate.finishAllCollaboration();
NativeBridgeDelegate.startCollaboration(collaborationType); NativeBridgeDelegate.startCollaboration(collaborationType);
Common.dismissLoadingIndicator();
}; };
public_new/js/common/native-bridge-delegate.js
...@@ -135,7 +135,7 @@ NativeBridgeDelegate.saveSelectedUserList = function (selectedUserList) { ...@@ -135,7 +135,7 @@ NativeBridgeDelegate.saveSelectedUserList = function (selectedUserList) {
NativeBridgeDelegate.startPIPMode = function () { NativeBridgeDelegate.startPIPMode = function () {
if (typeof android != "undefined") { if (typeof android != "undefined") {
android.startPipMode(); android.startPIPMode();
} else if (deviceInfo.isiOS()) { } else if (deviceInfo.isiOS()) {
webkit.messageHandlers.startPipMode.postMessage({}); webkit.messageHandlers.startPipMode.postMessage({});
} }
...@@ -366,7 +366,11 @@ NativeBridgeDelegate.changeCollaboration = function ( ...@@ -366,7 +366,11 @@ NativeBridgeDelegate.changeCollaboration = function (
NativeBridgeDelegate.showLoadingIndicator = function () { NativeBridgeDelegate.showLoadingIndicator = function () {
if (deviceInfo.isiOS()) { if (deviceInfo.isiOS()) {
webkit.messageHandlers.showLoadingIndicator.postMessage({}); try {
webkit.messageHandlers.showLoadingIndicator.postMessage({});
} catch (e) {
console.error("failed to display loading indicator with error: " + e);
}
} else if (deviceInfo.isAndroid()) { } else if (deviceInfo.isAndroid()) {
android.showLoadingIndicator(); android.showLoadingIndicator();
} }
......
public_new/js/sockets/chat-websocket-message.js
...@@ -19,6 +19,10 @@ CHAT_SOCKET.handleMessage = function (message, roomName, socketKey, roomID = nul ...@@ -19,6 +19,10 @@ CHAT_SOCKET.handleMessage = function (message, roomName, socketKey, roomID = nul
DATA_MESSAGE_SCHEME + FINISH_ALL_COLLABORATION_SIGNAL DATA_MESSAGE_SCHEME + FINISH_ALL_COLLABORATION_SIGNAL
) { ) {
CHAT_SOCKET.cleanUpCollaborationMessage(); CHAT_SOCKET.cleanUpCollaborationMessage();
if (typeof CoviewBridge !== "undefined") {
CoviewBridge.finishCollaboration();
}
return; return;
} }
...@@ -26,9 +30,7 @@ CHAT_SOCKET.handleMessage = function (message, roomName, socketKey, roomID = nul ...@@ -26,9 +30,7 @@ CHAT_SOCKET.handleMessage = function (message, roomName, socketKey, roomID = nul
const messageType = socketKey; const messageType = socketKey;
const messageText = unwrappedMessageInfo; const messageText = unwrappedMessageInfo;
if ( if (messageType == SOCKET_KEY.NEW_COMMUNICATION) {
messageType == SOCKET_KEY.NEW_COMMUNICATION
) {
CHAT_SOCKET.addCollaborationMessage( CHAT_SOCKET.addCollaborationMessage(
messageInfo, messageInfo,
message.userId, message.userId,
...@@ -50,7 +52,7 @@ CHAT_SOCKET.handleMessage = function (message, roomName, socketKey, roomID = nul ...@@ -50,7 +52,7 @@ CHAT_SOCKET.handleMessage = function (message, roomName, socketKey, roomID = nul
} else { } else {
Common.dismissLoadingIndicator(); Common.dismissLoadingIndicator();
} }
} };
CHAT_SOCKET.decodeMessage = function (text) { CHAT_SOCKET.decodeMessage = function (text) {
try { try {
...@@ -126,6 +128,7 @@ CHAT_SOCKET.renderCollaborationMessage = function ( ...@@ -126,6 +128,7 @@ CHAT_SOCKET.renderCollaborationMessage = function (
createdAtDay: messageTime.createdAtDay, createdAtDay: messageTime.createdAtDay,
createdAtTime: messageTime.createdAtTime, createdAtTime: messageTime.createdAtTime,
isOtherYear: false, isOtherYear: false,
collaborationJoinMessage: getLocalizedString("message_join"),
}); });
}; };
...@@ -187,8 +190,11 @@ CHAT_SOCKET.getUserInfoList = function (userID) { ...@@ -187,8 +190,11 @@ CHAT_SOCKET.getUserInfoList = function (userID) {
return JSON.parse(NativeBridgeDataSource.getUserInfoList(userID)); return JSON.parse(NativeBridgeDataSource.getUserInfoList(userID));
}; };
CHAT_SOCKET.cleanUpCollaborationMessage = function () { CHAT_SOCKET.cleanUpCollaborationMessage = function (exceptFirst = false) {
$(".collabo_area.start").each(function (index, collaborationMessage) { $(".collabo_area.start").each(function (index, collaborationMessage) {
if (exceptFirst && index === 0) {
return;
}
$(collaborationMessage).removeClass("start"); $(collaborationMessage).removeClass("start");
$(collaborationMessage).addClass("end"); $(collaborationMessage).addClass("end");
$(collaborationMessage).addClass("disable"); $(collaborationMessage).addClass("disable");
...@@ -197,7 +203,7 @@ CHAT_SOCKET.cleanUpCollaborationMessage = function () { ...@@ -197,7 +203,7 @@ CHAT_SOCKET.cleanUpCollaborationMessage = function () {
.attr("disabled", "disabled"); .attr("disabled", "disabled");
$(collaborationMessage) $(collaborationMessage)
.find(".collaboration_join_message") .find(".collaboration_join_message")
.text(getLocalizedString("flex-directionmessage_ended")); .text(getLocalizedString("message_ended"));
}); });
}; };
......
public_new/js/sockets/chat-websocket.js
...@@ -189,9 +189,9 @@ var bindOnRefreshUserListInGroup = function () { ...@@ -189,9 +189,9 @@ var bindOnRefreshUserListInGroup = function () {
}; };
var nextFibonacci = function (num) { var nextFibonacci = function (num) {
let nextNum = num * (1 + Math.sqrt(5)) / 2.0; let nextNum = (num * (1 + Math.sqrt(5))) / 2.0;
return Math.round(nextNum); return Math.round(nextNum);
} };
CHAT_SOCKET.emitCreateMessage = function (socketKey, sendData) { CHAT_SOCKET.emitCreateMessage = function (socketKey, sendData) {
if (socket.connected == false) { if (socket.connected == false) {
...@@ -213,30 +213,56 @@ CHAT_SOCKET.emitCreateVideo = function (sendData) { ...@@ -213,30 +213,56 @@ CHAT_SOCKET.emitCreateVideo = function (sendData) {
CHAT_SOCKET.emitCreateMessage(SOCKET_KEY.CREATE_VIDEO, sendData); CHAT_SOCKET.emitCreateMessage(SOCKET_KEY.CREATE_VIDEO, sendData);
}; };
CHAT_SOCKET.emitCreateCommunicationStart = function (sendData, collaborationType, meetingID) { CHAT_SOCKET.emitCreateCommunicationStart = function (
sendData,
collaborationType,
meetingID
) {
if (socket.connected == false) { if (socket.connected == false) {
CHAT_SOCKET.reconnectCreateMessage(SOCKET_KEY.COMMUNICATION, sendData, collaborationType, meetingID); CHAT_SOCKET.reconnectCreateMessage(
SOCKET_KEY.COMMUNICATION,
sendData,
collaborationType,
meetingID
);
} else { } else {
socket.emit(SOCKET_KEY.COMMUNICATION, { text: sendData }, collaborationType, meetingID); socket.emit(
SOCKET_KEY.COMMUNICATION,
{ text: sendData },
collaborationType,
meetingID
);
} }
}; };
CHAT_SOCKET.reconnectCreateMessage = function (socketKey, sendData, timeout = 100, collaborationType = null, meetingID = null) { CHAT_SOCKET.reconnectCreateMessage = function (
socketKey,
sendData,
timeout = 100,
collaborationType = null,
meetingID = null
) {
if (socket.connected == false) { if (socket.connected == false) {
console.log("socket disconnected, reconnect... " + timeout) console.info("socket disconnected, reconnect... " + timeout);
CHAT_SOCKET.initialJoin(); CHAT_SOCKET.initialJoin();
setTimeout(function() { setTimeout(function () {
CHAT_SOCKET.reconnectCreateMessage(socketKey, sendData, nextFibonacci(timeout)); CHAT_SOCKET.reconnectCreateMessage(
}, timeout); socketKey,
sendData,
nextFibonacci(timeout)
);
}, timeout);
return;
}
console.info("socket reconnected");
if (collaborationType == null) {
socket.emit(socketKey, { text: sendData });
} else { } else {
console.log("reconnected") socket.emit(socketKey, { text: sendData }, collaborationType, meetingID);
if (collaborationType == null) {
socket.emit(socketKey, { text: sendData });
} else {
socket.emit(socketKey, { text: sendData }, collaborationType, meetingID);
}
} }
} };
CHAT_SOCKET.emitCollaborationFinishMessage = function () { CHAT_SOCKET.emitCollaborationFinishMessage = function () {
if (socket != null && socket.connected) { if (socket != null && socket.connected) {
......
public_new/js/views/archive/archive.js
...@@ -23,7 +23,7 @@ ArchiveUI.refreshSearchScreen = function (keyword) { ...@@ -23,7 +23,7 @@ ArchiveUI.refreshSearchScreen = function (keyword) {
); );
let obj = jQuery.parseHTML(html); let obj = jQuery.parseHTML(html);
$(".overlay_src_msg").append(obj); $(".overlay_src_msg").prepend(obj);
}); });
}); });
}; };
...@@ -340,7 +340,7 @@ ArchiveUI.refreshArchiveScreen = function () { ...@@ -340,7 +340,7 @@ ArchiveUI.refreshArchiveScreen = function () {
typeImage: typeImage, typeImage: typeImage,
}); });
const obj = $(jQuery.parseHTML(html)).on("click", function () {}); const obj = $(jQuery.parseHTML(html)).on("click", function () {});
$("#archiveList").append(obj); $("#archiveList").prepend(obj);
}); });
// loadingIndicatorを非表示 // loadingIndicatorを非表示
......
public_new/js/views/chats/chat-room-message.js
...@@ -98,6 +98,8 @@ ChatRoom.loadMessages = function (joinRoomID, joinRoomName) { ...@@ -98,6 +98,8 @@ ChatRoom.loadMessages = function (joinRoomID, joinRoomName) {
let messages = NativeBridgeDataSource.getMessagesByRoomID(roomID); let messages = NativeBridgeDataSource.getMessagesByRoomID(roomID);
ChatRoom.prependMessage(messages, roomID); ChatRoom.prependMessage(messages, roomID);
CHAT_SOCKET.cleanUpCollaborationMessage(true);
window.addEventListener( window.addEventListener(
"load", "load",
function (event) { function (event) {
...@@ -282,7 +284,7 @@ ChatRoom.renderCollaborationMessage = function (message, isToday, isOtherYear) { ...@@ -282,7 +284,7 @@ ChatRoom.renderCollaborationMessage = function (message, isToday, isOtherYear) {
}; };
ChatRoom.getMeetingID = function (meetingID) { ChatRoom.getMeetingID = function (meetingID) {
return typeof meetingID != "undefined" ? 0 : meetingID; return typeof meetingID == "undefined" ? 0 : meetingID;
}; };
ChatRoom.getDisplayUserList = function (userList) { ChatRoom.getDisplayUserList = function (userList) {
......
public_new/js/views/chats/chat-room.js
...@@ -10,32 +10,45 @@ window.onscroll = function () { ...@@ -10,32 +10,45 @@ window.onscroll = function () {
return; return;
} }
beforeScroll = window.scrollY; beforeScroll = window.scrollY;
ChatRoom.prependMessageWhenScrollIfNeeded();
};
ChatRoom.prependMessageWhenScrollIfNeeded = function () {
const beforeHeight = $(".room_container").height(); const beforeHeight = $(".room_container").height();
messageCount = $(".chat_message").length; messageCount = $(".chat_message").length;
// TODO: peacekim :: check this condition
if ($(this).scrollTop() === 0 && messageCount >= PagingSize.MESSAGE) { if ($(this).scrollTop() === 0 && messageCount >= PagingSize.MESSAGE) {
setTimeout(function () { setTimeout(() => {
if (!$("#chatLoader").is(":visible")) { if (!$("#chatLoader").is(":visible")) {
// display loading indicator in chat message // display loading indicator in chat message
let loader = $( let loader = $(
'<div id="chatLoader" class="text-center"><div class="spinner-grow spinner-grow-sm" role="status" /></div>' '<div id="chatLoader" class="text-center"><div class="spinner-grow spinner-grow-sm" role="status" /></div>'
); );
$("#messages").append(loader); $("#messages").append(loader);
// get lastest message id and update message from server via native }
const messageID = $($(".chat_message").last()).data("messageid"); ChatRoom.loadNewMessage().then((messages) => {
NativeBridgeDelegate.updatePreMessage(messageID);
let messages = NativeBridgeDataSource.getMessagesByMessageID(messageID);
// prepend message // prepend message
ChatRoom.prependMessage(messages); ChatRoom.prependMessage(messages);
// hide loading indicator // hide loading indicator
loader.remove(); if (typeof loader !== "undefined") {
var afterHeight = $(".room_container").height(); loader.remove();
}
const afterHeight = $(".room_container").height();
window.scroll(0, afterHeight - beforeHeight); window.scroll(0, afterHeight - beforeHeight);
} });
}, 0); }, 0);
} }
}; };
ChatRoom.loadNewMessage = async function () {
return new Promise(function (done) {
// get lastest message id and update message from server via native
const messageID = $($(".chat_message").last()).data("messageid");
NativeBridgeDelegate.updatePreMessage(messageID);
let messages = NativeBridgeDataSource.getMessagesByMessageID(messageID);
done(messages);
});
};
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
// 検索イベントバインディング // 検索イベントバインディング
ChatRoom.bindSearchUI(); ChatRoom.bindSearchUI();
......
public_new/js/views/collaboration/collaboration-add-user.js
CollaborationUI.initialBindAddUserButton = function () { CollaborationUI.initialBindAddUserButton = function () {
// ユーザー招待メンバー検索 // ユーザー招待メンバー検索
$(".add_user_btn").click(function () { $(".add_user_btn").click(function () {
CollaborationUI.bindEnableScroll(); CollaborationUI.enableScroll();
Common.showLoadingIndicator(); Common.showLoadingIndicator();
ChatManagementCommon.selectedUserList = []; ChatManagementCommon.selectedUserList = [];
CollaborationUI.refreshMyGroupForAddUserInCollaboration(); CollaborationUI.refreshMyGroupForAddUserInCollaboration();
...@@ -9,6 +9,11 @@ CollaborationUI.initialBindAddUserButton = function () { ...@@ -9,6 +9,11 @@ CollaborationUI.initialBindAddUserButton = function () {
.off() .off()
.on("click", function () { .on("click", function () {
$("#addUserInCollaboration").modal("hide"); $("#addUserInCollaboration").modal("hide");
if (ChatManagementCommon.selectedUserList.length == 0) {
return;
}
const selectedUserList = const selectedUserList =
ChatManagementCommon.selectedUserList.join(","); ChatManagementCommon.selectedUserList.join(",");
NativeBridgeDelegate.saveSelectedUserList(selectedUserList); NativeBridgeDelegate.saveSelectedUserList(selectedUserList);
...@@ -149,7 +154,7 @@ CollaborationUI.refreshAllGroupForAddUserInCollaboration = function (groupID) { ...@@ -149,7 +154,7 @@ CollaborationUI.refreshAllGroupForAddUserInCollaboration = function (groupID) {
CollaborationUI.appendChildGroups(result.childGroupList); CollaborationUI.appendChildGroups(result.childGroupList);
//該当グループの所属ユーザを表示。 //該当グループの所属ユーザを表示。
CollaborationUI.appendUsers(); CollaborationUI.appendUsers(result.groupUserList);
}; };
CollaborationUI.bindOnClickParentGroup = function (parentGroupID) { CollaborationUI.bindOnClickParentGroup = function (parentGroupID) {
...@@ -168,7 +173,7 @@ CollaborationUI.displayRootGroupAndParentGroupIfNeeded = function ( ...@@ -168,7 +173,7 @@ CollaborationUI.displayRootGroupAndParentGroupIfNeeded = function (
rootGroupID, rootGroupID,
groupID groupID
) { ) {
if (typeof rootGroupID !== "undefined" && paramGroupID == 0) { if (typeof rootGroupID !== "undefined" && rootGroupID == 0) {
groupID = rootGroupID; groupID = rootGroupID;
} }
...@@ -296,7 +301,7 @@ CollaborationUI.bindAddUserButton = function (selectedUsers) { ...@@ -296,7 +301,7 @@ CollaborationUI.bindAddUserButton = function (selectedUsers) {
let userIDList = selectedUsers.map((user) => user.shopMemberId); let userIDList = selectedUsers.map((user) => user.shopMemberId);
const commaJoinedUserIDList = userIDList.join(","); const commaJoinedUserIDList = userIDList.join(",");
const collaborationType = globalUserInfo.collaborationType; const collaborationType = globalUserInfo.collaborationType;
scrollTo(0,0);
NativeBridgeDelegate.inviteCollaboration( NativeBridgeDelegate.inviteCollaboration(
commaJoinedUserIDList, commaJoinedUserIDList,
collaborationType collaborationType
......
public_new/js/views/collaboration/collaboration.js
var CollaborationUI = {}; var CollaborationUI = {};
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
CollaborationUI.bindDisableScroll(); CollaborationUI.disableScroll();
// メニューオーバーレイ表示 // メニューオーバーレイ表示
CollaborationUI.bindMenuButton(); CollaborationUI.bindMenuButton();
...@@ -12,14 +12,16 @@ document.addEventListener("DOMContentLoaded", function () { ...@@ -12,14 +12,16 @@ document.addEventListener("DOMContentLoaded", function () {
// モーダルonモーダル（前のモーダルを非表示に） // モーダルonモーダル（前のモーダルを非表示に）
// ホスト変更ボタン押下イベント // ホスト変更ボタン押下イベント
CollaborationUI.bindChangeHostButton(); CollaborationUI.bindChangeHostButton();
});
// 閉じるイベント document.addEventListener("readystatechange", () => {
CollaborationUI.bindCloseButton(); if (document.readyState === "complete") {
CollaborationUI.initialBindAddUserButton();
// ユーザー追加イベント // 閉じるイベント
CollaborationUI.bindInviteButton(); CollaborationUI.bindCloseButton();
// ユーザー追加イベント
CollaborationUI.initialBindAddUserButton(); CollaborationUI.bindInviteButton();
}
}); });
/********************************* /*********************************
...@@ -34,30 +36,31 @@ CollaborationUI.bindMenuButton = function () { ...@@ -34,30 +36,31 @@ CollaborationUI.bindMenuButton = function () {
CollaborationUI.bindDisplayUsersButton = function () { CollaborationUI.bindDisplayUsersButton = function () {
$(".user_btn").click(function () { $(".user_btn").click(function () {
var w = $(this).width(); const width = $(this).width();
$("#overlay_user_list.overlay").stop();
$(this).toggleClass("hide"); $(this).toggleClass("hide");
$("#overlay_user_list.overlay") $("#overlay_user_list.overlay")
.toggleClass("slidein") .toggleClass("slidein")
.css({ transform: "translateX(" & -w & ")" }); .animate({ left: "+=width" }, 500, function () {
scrollTo(0, 0);
});
if ($(this).hasClass("hide")) { if ($(this).hasClass("hide")) {
CollaborationUI.bindEnableScroll(); CollaborationUI.enableScroll();
} else { } else {
scrollTo(0, 0); CollaborationUI.disableScroll();
CollaborationUI.bindDisableScroll();
} }
}); });
}; };
CollaborationUI.userListSlideOut = function () { CollaborationUI.userListSlideOut = function () {
const w = $(".user_btn").width(); const userButtonWidth = $(".user_btn").width();
$(".user_btn").removeClass("hide"); $(".user_btn").removeClass("hide");
$("#overlay_user_list.overlay") $("#overlay_user_list.overlay")
.removeClass("slidein") .removeClass("slidein")
.css({ transform: "translateX(" & -w & ")" }); .css({ transform: "translateX(" & -userButtonWidth & ")" });
scrollTo(0, 0); scrollTo(0, 0);
CollaborationUI.bindDisableScroll(); CollaborationUI.disableScroll();
}; };
CollaborationUI.bindChangeHostButton = function () { CollaborationUI.bindChangeHostButton = function () {
...@@ -73,21 +76,21 @@ CollaborationUI.bindChangeHostButton = function () { ...@@ -73,21 +76,21 @@ CollaborationUI.bindChangeHostButton = function () {
CollaborationUI.bindCloseButton = function () { CollaborationUI.bindCloseButton = function () {
$(".close_btn").click(function () { $(".close_btn").click(function () {
$("#overlay_add_user_list").addClass("none"); scrollTo(0, 0);
CollaborationUI.bindDisableScroll(); CollaborationUI.disableScroll();
}); });
}; };
CollaborationUI.bindInviteButton = function () { CollaborationUI.bindInviteButton = function () {
$(".inv_btn").click(function () { $(".inv_btn").click(function () {
$("#overlay_add_user_list").addClass("none"); scrollTo(0, 0);
}); });
}; };
/********************************* /*********************************
* Scroll Controls * Scroll Controls
********************************/ ********************************/
CollaborationUI.bindDisableScroll = function () { CollaborationUI.disableScroll = function () {
document.addEventListener("mousewheel", CollaborationUI.scrollControl, { document.addEventListener("mousewheel", CollaborationUI.scrollControl, {
passive: false, passive: false,
}); });
...@@ -97,7 +100,7 @@ CollaborationUI.bindDisableScroll = function () { ...@@ -97,7 +100,7 @@ CollaborationUI.bindDisableScroll = function () {
}; };
// スクロール禁止解除 // スクロール禁止解除
CollaborationUI.bindEnableScroll = function () { CollaborationUI.enableScroll = function () {
document.removeEventListener("mousewheel", CollaborationUI.scrollControl, { document.removeEventListener("mousewheel", CollaborationUI.scrollControl, {
passive: false, passive: false,
}); });
...@@ -182,14 +185,6 @@ CollaborationUI.refreshForOffline = function () { ...@@ -182,14 +185,6 @@ CollaborationUI.refreshForOffline = function () {
} }
}; };
CollaborationUI.showLoadingIndicator = function () {
$("#loadingIndicator").addClass("full_active");
};
CollaborationUI.hideLoadingIndicator = function () {
$("#loadingIndicator").removeClass("full_active");
};
CollaborationUI.displayAddUserButtonIfNeeded = function () { CollaborationUI.displayAddUserButtonIfNeeded = function () {
if (roomInfo.roomType == ChatRoomType.DM) { if (roomInfo.roomType == ChatRoomType.DM) {
$(".add_user_btn").removeClass("none"); $(".add_user_btn").removeClass("none");
......
public_new/js/views/collaboration/fermi-web-socket-bridge.js
...@@ -45,9 +45,7 @@ FermiWebSocketBridge.hostRequestDone = function (hostID) { ...@@ -45,9 +45,7 @@ FermiWebSocketBridge.hostRequestDone = function (hostID) {
// GET_COLLABORATION_TYPE_RESPONSE // GET_COLLABORATION_TYPE_RESPONSE
FermiWebSocketBridge.getCollaborationTypeResponse = function (loginID) { FermiWebSocketBridge.getCollaborationTypeResponse = function (loginID) {
if (typeof meetingID == undefined) { let meetingID = globalUserInfo.meetingID ?? 0;
var meetingID = 0;
}
fw.sendToMsg("others", "GET_COLLABORATION_TYPE_RESPONSE", { fw.sendToMsg("others", "GET_COLLABORATION_TYPE_RESPONSE", {
loginId: loginID, loginId: loginID,
......
public_new/js/views/collaboration/share-event-listener.js
...@@ -28,7 +28,6 @@ CoviewBridge.bindFermiWebSocketOpenned = function () { ...@@ -28,7 +28,6 @@ CoviewBridge.bindFermiWebSocketOpenned = function () {
CoviewBridge.bindStartEvent = function () { CoviewBridge.bindStartEvent = function () {
coview_api.addEventListener("start", function () { coview_api.addEventListener("start", function () {
CollaborationFeature.enableScrollLock(); CollaborationFeature.enableScrollLock();
CollaborationUI.hideLoadingIndicator();
}); });
}; };
...@@ -84,14 +83,11 @@ CoviewBridge.bindAllByeEvent = function () { ...@@ -84,14 +83,11 @@ CoviewBridge.bindAllByeEvent = function () {
NativeBridgeDelegate.showExitHostAlert(); NativeBridgeDelegate.showExitHostAlert();
return; return;
} }
CollaborationUI.hideLoadingIndicator();
}); });
}; };
CoviewBridge.bindGuestByeEvent = function () { CoviewBridge.bindGuestByeEvent = function () {
coview_api.addEventListener("guestbye", function () { coview_api.addEventListener("guestbye", function () {});
CollaborationUI.hideLoadingIndicator();
});
}; };
CoviewBridge.bindDestroyEvent = function () { CoviewBridge.bindDestroyEvent = function () {
...@@ -99,7 +95,6 @@ CoviewBridge.bindDestroyEvent = function () { ...@@ -99,7 +95,6 @@ CoviewBridge.bindDestroyEvent = function () {
CHAT_SOCKET.emitCollaborationFinishMessage(); CHAT_SOCKET.emitCollaborationFinishMessage();
alert(getLocalizedString("inform_exit_host_collaboration")); alert(getLocalizedString("inform_exit_host_collaboration"));
CoviewBridge.exitCollaboration(); CoviewBridge.exitCollaboration();
CollaborationUI.hideLoadingIndicator();
}); });
}; };
...@@ -110,7 +105,7 @@ CoviewBridge.bindMessageEvent = function () { ...@@ -110,7 +105,7 @@ CoviewBridge.bindMessageEvent = function () {
} }
switch (json.api) { switch (json.api) {
case "LoginResponse": case "LoginResponse":
CollaborationFeature.didReceiveLoginResponseMessage(); await CollaborationFeature.didReceiveLoginResponseMessage();
break; break;
case "CreateRoomResponse": case "CreateRoomResponse":
if (json.resultCode == 200) { if (json.resultCode == 200) {
...@@ -211,21 +206,26 @@ CollaborationFeature.didReceiveLoginResponseMessage = async function () { ...@@ -211,21 +206,26 @@ CollaborationFeature.didReceiveLoginResponseMessage = async function () {
CollaborationFeature.didReceiveCreateRoomResponseMessage = function () { CollaborationFeature.didReceiveCreateRoomResponseMessage = function () {
let coviewInviteMessage = ""; let coviewInviteMessage = "";
let collaborationType = CHAT_UTIL.getCollaborationTypeNumber(globalUserInfo.collaborationType); let collaborationType = CHAT_UTIL.getCollaborationTypeNumber(
let meetingID = null globalUserInfo.collaborationType
);
let meetingID = null;
if (globalUserInfo.collaborationType == COLLABORATION_TYPE.DOCUMENT) { if (globalUserInfo.collaborationType == COLLABORATION_TYPE.DOCUMENT) {
meetingID = globalUserInfo.meetingID; meetingID = globalUserInfo.meetingID;
} }
CHAT_SOCKET.emitCreateCommunicationStart(coviewInviteMessage, collaborationType, meetingID); CHAT_SOCKET.emitCreateCommunicationStart(
coviewInviteMessage,
collaborationType,
meetingID
);
}; };
CollaborationFeature.didReceivedJoinRoomInfoResponseMessage = function () { CollaborationFeature.didReceivedJoinRoomInfoResponseMessage = function () {
alert(getLocalizedString("not_exist_sharing_call")); alert(getLocalizedString("not_exist_sharing_call"));
coview_api.LeaveRoom(); coview_api.LeaveRoom();
$(".coview_share_area").hide(); $(".coview_share_area").hide();
CollaborationUI.hideLoadingIndicator();
NativeBridgeDelegate.joinRoom(roomInfo.roomID, roomInfo.roomName); NativeBridgeDelegate.joinRoom(roomInfo.roomID, roomInfo.roomName);
}; };
...@@ -492,7 +492,6 @@ CollaborationUI.refreshJoinedCollaboration = function (loginIDList) { ...@@ -492,7 +492,6 @@ CollaborationUI.refreshJoinedCollaboration = function (loginIDList) {
}; };
CollaborationUI.moveToVideoShareArea = function () { CollaborationUI.moveToVideoShareArea = function () {
CollaborationUI.showLoadingIndicator();
$(".coview_share_area").show(); $(".coview_share_area").show();
$("#collabo_main").removeClass("none"); $("#collabo_main").removeClass("none");
}; };
public_new/js/views/collaboration/share.js
...@@ -52,9 +52,10 @@ function changeCollaboration(collaborationType) { ...@@ -52,9 +52,10 @@ function changeCollaboration(collaborationType) {
case COLLABORATION_TYPE.DOCUMENT: case COLLABORATION_TYPE.DOCUMENT:
coview_api.ChangeCollaboration("audio"); coview_api.ChangeCollaboration("audio");
newMeetingID = NativeBridgeDataSource.createContentView(); newMeetingID = NativeBridgeDataSource.createContentView();
if (newMeetingID == "-1") { //会議室作成失敗 if (newMeetingID == "-1") {
CoviewBridge.finishCollaboration(); //会議室作成失敗
return; CoviewBridge.finishCollaboration();
return;
} }
break; break;
case COLLABORATION_TYPE.BOARD: case COLLABORATION_TYPE.BOARD:
......
public_new/js/views/contact/contact.js
...@@ -143,9 +143,7 @@ Contact.refreshContactScreen = function () { ...@@ -143,9 +143,7 @@ Contact.refreshContactScreen = function () {
Contact.appendMyNamecard(); Contact.appendMyNamecard();
Contact.appendFavoritGroupList(); Contact.reloadFavoriteList();
Contact.appendFavoritUsers();
Contact.appendMyGroupList(); Contact.appendMyGroupList();
...@@ -173,6 +171,12 @@ Contact.appendMyNamecard = function () { ...@@ -173,6 +171,12 @@ Contact.appendMyNamecard = function () {
$("#myImg").attr("src", myInfo.profileImagePath); $("#myImg").attr("src", myInfo.profileImagePath);
}; };
Contact.reloadFavoriteList = function () {
$("#favoriteList").html("");
Contact.appendFavoritGroupList();
Contact.appendFavoritUsers();
};
Contact.appendFavoritGroupList = function () { Contact.appendFavoritGroupList = function () {
// グループの様式を読み込む // グループの様式を読み込む
const groupTemplate = getTemplate(TemplateURL.GROUP_LIST); const groupTemplate = getTemplate(TemplateURL.GROUP_LIST);
...@@ -221,37 +225,35 @@ Contact.appendMyGroupList = function () { ...@@ -221,37 +225,35 @@ Contact.appendMyGroupList = function () {
}; };
Contact.favoriteGroupChange = function (groupID, star) { Contact.favoriteGroupChange = function (groupID, star) {
if ($(star).hasClass("active")) { const div = $(star);
Contact.removeFavoriteGroup(groupID); if (div.hasClass("sp-circle")) {
} else if ($(star).hasClass("disable")) { return;
Contact.insertFavoriteGroup(groupID);
} }
div.removeClass("star");
div.addClass("sp-circle");
setTimeout(() => {
if (div.hasClass("active")) {
Contact.removeFavoriteGroup(groupID, div);
} else if (div.hasClass("disable")) {
Contact.insertFavoriteGroup(groupID, div);
}
div.removeClass("sp-circle");
div.addClass("star");
Contact.reloadFavoriteList();
}, 0);
}; };
Contact.removeFavoriteGroup = function (groupID) { Contact.removeFavoriteGroup = function (groupID, div) {
Common.showLoadingIndicator(); const result = NativeBridgeDataSource.removeFavoriteGroup(groupID);
var result = NativeBridgeDataSource.removeFavoriteGroup(groupID); div.removeClass(result ? "active" : "disable");
if (result) { div.addClass(result ? "disable" : "active");
$(".group_" + groupID).removeClass("active");
$(".group_" + groupID).addClass("disable");
} else {
$(".group_" + groupID).addClass("active");
$(".group_" + groupID).removeClass("disable");
}
Common.dismissLoadingIndicator();
}; };
Contact.insertFavoriteGroup = function (groupID) { Contact.insertFavoriteGroup = function (groupID, div) {
Common.showLoadingIndicator();
const result = NativeBridgeDataSource.addFavoriteGroup(groupID); const result = NativeBridgeDataSource.addFavoriteGroup(groupID);
if (result) { div.removeClass(result ? "disable" : "active");
$(".group_" + groupID).removeClass("disable"); div.addClass(result ? "active" : "disable");
$(".group_" + groupID).addClass("active");
} else {
$(".group_" + groupID).addClass("disable");
$(".group_" + groupID).removeClass("active");
}
Common.dismissLoadingIndicator();
}; };
//全グループ検索画面表示。 //全グループ検索画面表示。
......
public_new/js/views/contact/namecard.js
...@@ -63,40 +63,44 @@ Namecard.startVoice = function (userShopMemberID, userName) { ...@@ -63,40 +63,44 @@ Namecard.startVoice = function (userShopMemberID, userName) {
}; };
Namecard.favoriteUserChange = function (shopMemberID, star) { Namecard.favoriteUserChange = function (shopMemberID, star) {
if ($(star).hasClass("active")) { const div = $(star);
Namecard.removeFavoriteUser(shopMemberID); if (div.hasClass("sp-circle")) {
} else if ($(star).hasClass("disable")) { return;
Namecard.insertFavoriteUser(shopMemberID);
} }
div.removeClass("star");
div.addClass("sp-circle");
setTimeout(() => {
if (div.hasClass("active")) {
Namecard.removeFavoriteUser(shopMemberID, div);
} else if (div.hasClass("disable")) {
Namecard.insertFavoriteUser(shopMemberID, div);
}
div.removeClass("sp-circle");
div.addClass("star");
if (typeof Contact != "undefined") {
Contact.reloadFavoriteList();
}
if (div.hasClass("active")) {
window.scroll(0, window.scrollY + $(".my_info_sell").height());
} else if (div.hasClass("disable")) {
window.scroll(0, window.scrollY - $(".my_info_sell").height());
}
}, 0);
}; };
Namecard.removeFavoriteUser = function (shopMemberID) { Namecard.removeFavoriteUser = function (shopMemberID, div) {
Common.showLoadingIndicator();
$("#userNameCard").modal("hide");
$("#myNameCard").modal("hide");
const result = NativeBridgeDataSource.removeFavoriteUser(shopMemberID); const result = NativeBridgeDataSource.removeFavoriteUser(shopMemberID);
if (result) { div.removeClass(result ? "active" : "disable");
$(".shopmember_" + shopMemberID).removeClass("active"); div.addClass(result ? "disable" : "active");
$(".shopmember_" + shopMemberID).addClass("disable");
} else {
$(".shopmember_" + shopMemberID).addClass("active");
$(".shopmember_" + shopMemberID).removeClass("disable");
}
Common.dismissLoadingIndicator();
}; };
Namecard.insertFavoriteUser = function (shopMemberID) { Namecard.insertFavoriteUser = function (shopMemberID, div) {
$("#userNameCard").modal("hide");
$("#myNameCard").modal("hide");
const result = NativeBridgeDataSource.addFavoriteUser(shopMemberID); const result = NativeBridgeDataSource.addFavoriteUser(shopMemberID);
if (result) { div.removeClass(result ? "disable" : "active");
$(".shopmember_" + shopMemberID).removeClass("disable"); div.addClass(result ? "active" : "disable");
$(".shopmember_" + shopMemberID).addClass("active");
} else {
$(".shopmember_" + shopMemberID).addClass("disable");
$(".shopmember_" + shopMemberID).removeClass("active");
}
Common.dismissLoadingIndicator();
}; };
Namecard.refreshForOnline = function () { Namecard.refreshForOnline = function () {
...@@ -109,11 +113,12 @@ Namecard.refreshForOffline = function () { ...@@ -109,11 +113,12 @@ Namecard.refreshForOffline = function () {
Namecard.moveContactPage = function (paramGroupID) { Namecard.moveContactPage = function (paramGroupID) {
const groupID = paramGroupID; const groupID = paramGroupID;
if (window.location.pathname.includes("chat_room") || if (
window.location.pathname.includes("archive_detail")) window.location.pathname.includes("chat_room") ||
{ window.location.pathname.includes("archive_detail")
) {
if (groupID == "") return; if (groupID == "") return;
NativeBridgeDelegate.setToMoveGroupId(groupID); NativeBridgeDelegate.setToMoveGroupId(groupID);
window.location.href = "contact.html"; window.location.href = "contact.html";
} }
} };
public_new/modal_add_user_confirm.html
<div class="modal fade add_user_confirm_modal" id="modalAddUserConfirm" tabindex="-1" role="dialog" <div class="modal fade add_user_confirm_modal" id="modalAddUserConfirm" tabindex="-1" role="dialog"
aria-labelledby="modalAddUserConfirm" aria-hidden="true" style="position: fixed;"> aria-labelledby="modalAddUserConfirm" aria-hidden="true" style="position: fixed; overflow-y: hidden;">
<div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document"> <div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document" style="max-width: 100%;">
<div class="modal-content" style="position: fixed;top: 0;height: 100%;width: 100%;left:0;right: 0;margin: 0 auto;"> <div class="modal-content" style="height:70vh; width:90vw;">
<div class="modal-header border-0 pb-0"> <div class="modal-header border-0 pb-0">
<span class="m-auto">ユーザー招待</span> <span class="m-auto">ユーザー招待</span>
</div> </div>
...@@ -16,7 +16,8 @@ ...@@ -16,7 +16,8 @@
<div class="chat_item d-flex flex-row align-items-center w-100"> <div class="chat_item d-flex flex-row align-items-center w-100">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thumbnail"> <div class="thumbnail">
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/></div> <div class="img_wrap"><img src="{{profileUrl}}"
onError="this.src='./img/noImage.png'" /></div>
</div> </div>
</div> </div>
<div class="chat_item_m px-0"> <div class="chat_item_m px-0">
...@@ -34,8 +35,10 @@ ...@@ -34,8 +35,10 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="modal-footer border-0 justify-content-center" style="position: relative;width: 100%;background-color: white;"> <div class="modal-footer border-0 justify-content-center"
<button type="button" id="cancelAddUserBtn" class="profile_favorite_btn bg_white border_gray text_blue cancel_add_user_btn"> style="position: relative;width: 100%;background-color: white;">
<button type="button" id="cancelAddUserBtn"
class="profile_favorite_btn bg_white border_gray text_blue cancel_add_user_btn">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<span>キャンセル</span> <span>キャンセル</span>
</div> </div>
......
public_new/modal_add_user_list.html
<!-- コンテンツ --> <!-- コンテンツ -->
<div class="modal fade add_user_modal" id="addUserInCollaboration" tabindex="-1" role="dialog" aria-labelledby="addUserInCollaboration" aria-hidden="true"> <div class="modal fade add_user_modal" id="addUserInCollaboration" tabindex="-1" role="dialog"
<div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document"> aria-labelledby="addUserInCollaboration" aria-hidden="true">
<div class="modal-content" style="position: fixed;width: 100%;height:100%;top: 0px;left:0;"> <div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document" style="max-width: 100%;">
<div class="modal-content">
<form id="addUserFormInCollaboration" action="chat_add_user_confirm.html" method="post"> <form id="addUserFormInCollaboration" action="chat_add_user_confirm.html" method="post">
<!-- ユーザー検索 --> <!-- ユーザー検索 -->
<!-- タブ --> <!-- タブ -->
...@@ -9,7 +10,8 @@ ...@@ -9,7 +10,8 @@
<div class="row h-100 align-items-center"> <div class="row h-100 align-items-center">
<div class="col-4 pr-0"> <div class="col-4 pr-0">
<div class="nav-item"> <div class="nav-item">
<a href="#" class="close_btn" class="close" data-dismiss="modal" aria-label="Close">閉じる</a> <a href="#" class="close_btn" class="close" data-dismiss="modal"
aria-label="Close">閉じる</a>
</div> </div>
</div> </div>
<div class="col-4 p-0"> <div class="col-4 p-0">
...@@ -20,19 +22,23 @@ ...@@ -20,19 +22,23 @@
</div><!-- .row --> </div><!-- .row -->
</nav><!-- nav --> </nav><!-- nav -->
<div class="content tabs"> <div class="content tabs">
<input id="tabMyGroupOnAddUserInCollaboration" type="radio" name="tab_item" checked onclick="CollaborationUI.refreshMyGroupForAddUserInCollaboration();"> <input id="tabMyGroupOnAddUserInCollaboration" type="radio" name="tab_item" checked
onclick="CollaborationUI.refreshMyGroupForAddUserInCollaboration();">
<label class="tab_item m-0" for="tabMyGroupOnAddUserInCollaboration">マイグループ</label> <label class="tab_item m-0" for="tabMyGroupOnAddUserInCollaboration">マイグループ</label>
<input id="tabAllGroupOnAddUserInCollaboration" type="radio" name="tab_item" onclick="CollaborationUI.refreshAllGroupForAddUserInCollaboration('0');"> <input id="tabAllGroupOnAddUserInCollaboration" type="radio" name="tab_item"
onclick="CollaborationUI.refreshAllGroupForAddUserInCollaboration('0');">
<label class="tab_item m-0" for="tabAllGroupOnAddUserInCollaboration">全グループ</label> <label class="tab_item m-0" for="tabAllGroupOnAddUserInCollaboration">全グループ</label>
<div class="tab_content" id="tab1_content" style="height: 100vh; overflow:scroll;"> <div class="tab_content" id="tab1_content">
<div class="chat_list"> <div class="chat_list">
<!-- お気に入りグループ --> <!-- お気に入りグループ -->
<div class="category" onclick="CollaborationUI.toggleCategory(this);"><div class="category_name"><span>お気に入り</span></div></div> <div class="category" onclick="CollaborationUI.toggleCategory(this);">
<div class="category_name"><span>お気に入り</span></div>
</div>
<div id="favoriteListForAddUserInCollaboration"></div> <div id="favoriteListForAddUserInCollaboration"></div>
<div id="myGroupListForAddUserInCollaboration"></div> <div id="myGroupListForAddUserInCollaboration"></div>
</div> </div>
</div> </div>
<div class="tab_content" id="tab2_content" style="height: 100vh; overflow:scroll;"> <div class="tab_content" id="tab2_content">
<div class="breadcrumb" id="groupPathAreaForAddUserInCollaboration"></div> <div class="breadcrumb" id="groupPathAreaForAddUserInCollaboration"></div>
<div class="chat_list"> <div class="chat_list">
<!-- 全グループ --> <!-- 全グループ -->
...@@ -80,7 +86,7 @@ ...@@ -80,7 +86,7 @@
</div> </div>
</div> </div>
<!-- ルーム解説ボタン --> <!-- ルーム解説ボタン -->
<div class="add_user_confirm_btn content" id="addUserConfirmBtnInCollaboration" style="position: fixed;"> <div class="add_user_confirm_btn content" id="addUserConfirmBtnInCollaboration">
<button type="button" name="button" id="buttonAddUser" style="bottom: 0; width: 100%;"> <button type="button" name="button" id="buttonAddUser" style="bottom: 0; width: 100%;">
確認<br> 確認<br>
<span class="select_member_num"></span><span class="select_member">名 選択中</span></button> <span class="select_member_num"></span><span class="select_member">名 選択中</span></button>
...@@ -88,4 +94,4 @@ ...@@ -88,4 +94,4 @@
</form> </form>
</div> </div>
</div> </div>
</div> </div>
\ No newline at end of file
public_new/modal_chat_profile.html
<!-- TODO: peacekim:: this file is not using-->
<div class="modal fade profile_modal" id="profileModal1" tabindex="-1" role="dialog" aria-labelledby="profileModal1" <div class="modal fade profile_modal" id="profileModal1" tabindex="-1" role="dialog" aria-labelledby="profileModal1"
aria-hidden="true"> aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document"> <div class="modal-dialog modal-dialog-centered" role="document">
......
public_new/modal_collabo_profile.html
...@@ -19,21 +19,19 @@ ...@@ -19,21 +19,19 @@
</div> </div>
<div class="modal-footer border-0 justify-content-center"> <div class="modal-footer border-0 justify-content-center">
{{#isFavorite}} {{#isFavorite}}
<button type="button" class="border-0 bg_navy" <button type="button" class="border-0 bg_navy" id="favoriteButton">
onclick="CollaborationUI.removeFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<span class="star active shopmember_{{shopMemberId}}" <span class="star active shopmember_{{shopMemberId}}"
onclick="CHAT_UI.favoriteUserChange('{{shopMemberId}}',this)"></span> onclick="CollaborationUI.removeFavoriteUserInCollaboration({{shopMemberId}})"></span>
<span>お気に入り解除</span> <span>お気に入り解除</span>
</div> </div>
</button> </button>
{{/isFavorite}} {{/isFavorite}}
{{^isFavorite}} {{^isFavorite}}
<button type="button" class="border-0 bg_navy" <button type="button" class="border-0 bg_navy" id="favoriteButton">
onclick="CollaborationUI.insertFavoriteUserInCollaboration({{shopMemberId}})" id="favoriteButton">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<span class="star disable shopmember_{{shopMemberId}}" <span class="star disable shopmember_{{shopMemberId}}"
onclick="Namecard.favoriteUserChange('{{shopMemberId}}',this)"></span> onclick="CollaborationUI.insertFavoriteUserInCollaboration({{shopMemberId}})"></span>
<span>お気に入り登録</span> <span>お気に入り登録</span>
</div> </div>
</button> </button>
......
public_new/template/template_chatroom_user_list.html
{{#userList}} {{#userList}}
<div class="user_item"> <div class="user_item">
<a href="javascript:return false;" onclick="Namecard.makeNameCard({{shopMemberId}})"> <a href="#" onclick="Namecard.makeNameCard({{shopMemberId}})">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<div class="img_wrap"> <div class="img_wrap">
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"> <img src="{{profileUrl}}" onError="this.src='./img/noImage.png'">
......
public_new/template/template_group_user_list.html
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<ul class="p-0 chat_make_room_list"> <ul class="p-0 chat_make_room_list">
{{#groupUserList}} {{#groupUserList}}
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<a href="javascript:return false;" onclick="Namecard.makeNameCard({{shopMemberId}})" style="width: 100%;"> <a href="#" onclick="Namecard.makeNameCard({{shopMemberId}})" style="width: 100%;">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thumbnail"> <div class="thumbnail">
...@@ -21,10 +21,10 @@ ...@@ -21,10 +21,10 @@
<div class="chat_item_r"> <div class="chat_item_r">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
{{#isFavorite}} {{#isFavorite}}
<span class="star active shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}},this)"></span> <span class="star active shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}}, this)"></span>
{{/isFavorite}} {{/isFavorite}}
{{^isFavorite}} {{^isFavorite}}
<span class="star disable shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}},this)"></span> <span class="star disable shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}}, this)"></span>
{{/isFavorite}} {{/isFavorite}}
</div> </div>
</div> </div>
......
public_new/template/template_user_list.html
<ul class="p-0 chat_make_room_list" style="margin-top: 0px !important;border-top: none !important;"> <ul class="p-0" style="margin-top: 0px !important;border-top: none !important;">
{{#userList}} {{#userList}}
<li class="d-flex align-items-center"> <li class="d-flex align-items-center userCell">
<a href="javascript:return false;" onclick="Namecard.makeNameCard({{shopMemberId}})" style="width: 100%;"> <a href="#" onclick="Namecard.makeNameCard({{shopMemberId}})" style="width: 100%;">
<div class="chat_item d-flex flex-row align-items-center"> <div class="chat_item d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thumbnail"> <div class="thumbnail">
...@@ -20,10 +20,10 @@ ...@@ -20,10 +20,10 @@
<div class="chat_item_r"> <div class="chat_item_r">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
{{#isFavorite}} {{#isFavorite}}
<span class="star active shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}},this)"></span> <span class="star active shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}}, this)"></span>
{{/isFavorite}} {{/isFavorite}}
{{^isFavorite}} {{^isFavorite}}
<span class="star disable shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}},this)"></span> <span class="star disable shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange({{shopMemberId}}, this)"></span>
{{/isFavorite}} {{/isFavorite}}
</div> </div>
</div> </div>
......
public_new/template/template_user_name_card.html
...@@ -18,24 +18,20 @@ ...@@ -18,24 +18,20 @@
{{/groupPathList}} {{/groupPathList}}
</div> </div>
<div class="modal-footer border-0 justify-content-center"> <div class="modal-footer border-0 justify-content-center">
{{#isFavorite}} <button type="button" class="border-0" id="favoriteButton">
<button type="button" class="border-0" onclick="Namecard.removeFavoriteUser({{shopMemberId}})"
id="favoriteButton">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<span class="star active shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange('{{shopMemberId}}', this)"></span> {{#isFavorite}}
<span class="star active shopmember_{{shopMemberId}}"
onclick="Namecard.favoriteUserChange({{shopMemberId}}, this)"></span>
<span>お気に入り解除</span> <span>お気に入り解除</span>
</div> {{/isFavorite}}
</button> {{^isFavorite}}
{{/isFavorite}} <span class="star disable shopmember_{{shopMemberId}}"
{{^isFavorite}} onclick="Namecard.favoriteUserChange({{shopMemberId}}, this)"></span>
<button type="button" class="border-0" onclick="Namecard.insertFavoriteUser({{shopMemberId}})"
id="favoriteButton">
<div class="d-flex flex-column">
<span class="star disable shopmember_{{shopMemberId}}" onclick="Namecard.favoriteUserChange('{{shopMemberId}}', this)"></span>
<span>お気に入り登録</span> <span>お気に入り登録</span>
{{/isFavorite}}
</div> </div>
</button> </button>
{{/isFavorite}}
<button type="button" class="border-0" onclick="Namecard.startVoice('{{shopMemberId}}','{{name}}');"> <button type="button" class="border-0" onclick="Namecard.startVoice('{{shopMemberId}}','{{name}}');">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<div class="img_wrap"> <div class="img_wrap">
......
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