Commit d10b9423 by Kim Peace

Merge branch 'design/playground' into 'develop'

Design/playground

See merge request !191
parents fb49ca8c 2ea8c239
...@@ -66,7 +66,7 @@ ...@@ -66,7 +66,7 @@
</div> </div>
</main> </main>
<!-- フッター --> <!-- フッター -->
<footer> <footer id="footer-main">
<div class="footer-wrap"> <div class="footer-wrap">
<div class="d-flex justify-content-around h-100"> <div class="d-flex justify-content-around h-100">
<div class="footer_item"> <div class="footer_item">
......
...@@ -135,7 +135,7 @@ ...@@ -135,7 +135,7 @@
<div class="modal-header border-0"> <div class="modal-header border-0">
<div class="profile_desc d-flex flex-row"> <div class="profile_desc d-flex flex-row">
<img src="{{profileImage}}" onError="this.src='./img/noImage.png'"/> <img src="{{profileImage}}" onError="this.src='./img/noImage.png'"/>
<div class="profile_name"><span>{{name}}</span></div> <div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
</div> </div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
......
...@@ -54,9 +54,9 @@ ...@@ -54,9 +54,9 @@
<!-- タブ --> <!-- タブ -->
<div class="content tabs"> <div class="content tabs">
<input id="tabGroup" type="radio" name="tab_item"> <input id="tabGroup" type="radio" name="tab_item">
<label class="tab_item" for="tabGroup">グループ</label> <label class="tab_item m-0" for="tabGroup">グループ</label>
<input id="tabDM" type="radio" name="tab_item"> <input id="tabDM" type="radio" name="tab_item">
<label class="tab_item" for="tabDM">DM</label> <label class="tab_item m-0" for="tabDM">DM</label>
<div class="tab_content" id="tab1_content"> <div class="tab_content" id="tab1_content">
<div class="chat_list" id="groupChatList"> <div class="chat_list" id="groupChatList">
</div> </div>
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
</div> </div>
</main> </main>
<!-- フッター --> <!-- フッター -->
<footer> <footer id="footer-main">
<div class="footer-wrap"> <div class="footer-wrap">
<div class="d-flex justify-content-around h-100"> <div class="d-flex justify-content-around h-100">
<div class="footer_item"> <div class="footer_item">
......
...@@ -54,9 +54,9 @@ ...@@ -54,9 +54,9 @@
<!-- タブ --> <!-- タブ -->
<div class="content tabs"> <div class="content tabs">
<input id="tabMyGroupOnAddUser" type="radio" name="tab_item" checked> <input id="tabMyGroupOnAddUser" type="radio" name="tab_item" checked>
<label class="tab_item" for="tabMyGroupOnAddUser">マイグループ</label> <label class="tab_item m-0" for="tabMyGroupOnAddUser">マイグループ</label>
<input id="tabAllGroupOnAddUser" type="radio" name="tab_item"> <input id="tabAllGroupOnAddUser" type="radio" name="tab_item">
<label class="tab_item" for="tabAllGroupOnAddUser">全グループ</label> <label class="tab_item m-0" for="tabAllGroupOnAddUser">全グループ</label>
<div class="tab_content" id="tab1_content"> <div class="tab_content" id="tab1_content">
<div class="chat_list"> <div class="chat_list">
<!-- お気に入りグループ --> <!-- お気に入りグループ -->
...@@ -74,7 +74,7 @@ ...@@ -74,7 +74,7 @@
<a href="#" class="w-100" id="rootGroupBtnForAddUser"> <a href="#" class="w-100" id="rootGroupBtnForAddUser">
<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-icon">
<img src="icon/icon_prev_top.png" alt="トップグループに戻る" /> <img src="icon/icon_prev_top.png" alt="トップグループに戻る" />
</div> </div>
</div> </div>
...@@ -92,7 +92,7 @@ ...@@ -92,7 +92,7 @@
<a href="#" class="w-100" id="parentGroupBtnForAddUser"> <a href="#" class="w-100" id="parentGroupBtnForAddUser">
<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-icon">
<img src="icon/icon_prev.png" alt="上位グループに戻る" /> <img src="icon/icon_prev.png" alt="上位グループに戻る" />
</div> </div>
</div> </div>
......
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
<main id="chatMakeRoom"> <main id="chatMakeRoom">
<form id="makeRoomForm" action="chat_make_room_confirm.html" method="post"> <form id="makeRoomForm" action="chat_make_room_confirm.html" method="post">
<!-- ユーザー検索 --> <!-- ユーザー検索 -->
<div class="search_form my-2"> <div class="search_form">
<input type="search" name="search" placeholder="ユーザー検索" maxlength="30"> <input type="search" name="search" placeholder="ユーザー検索" maxlength="30">
<span class="src_icon"></span> <span class="src_icon"></span>
<a href="#" class="cancel none">キャンセル</a> <a href="#" class="cancel none">キャンセル</a>
...@@ -54,9 +54,9 @@ ...@@ -54,9 +54,9 @@
<!-- タブ --> <!-- タブ -->
<div class="content tabs"> <div class="content tabs">
<input id="tabMyGroupOnMakeRoom" type="radio" name="tab_item" checked> <input id="tabMyGroupOnMakeRoom" type="radio" name="tab_item" checked>
<label class="tab_item" for="tabMyGroupOnMakeRoom">マイグループ</label> <label class="tab_item m-0" for="tabMyGroupOnMakeRoom">マイグループ</label>
<input id="tabAllGroupOnMakeRoom" type="radio" name="tab_item"> <input id="tabAllGroupOnMakeRoom" type="radio" name="tab_item">
<label class="tab_item" for="tabAllGroupOnMakeRoom">全グループ</label> <label class="tab_item m-0" for="tabAllGroupOnMakeRoom">全グループ</label>
<div class="tab_content" id="tab1_content"> <div class="tab_content" id="tab1_content">
<div class="chat_list"> <div class="chat_list">
<!-- お気に入りグループ --> <!-- お気に入りグループ -->
......
...@@ -43,8 +43,8 @@ ...@@ -43,8 +43,8 @@
</div> </div>
<div class="col-4 pl-0"> <div class="col-4 pl-0">
<div class="nav-item text-right"> <div class="nav-item text-right">
<a href="#" class="search_menu"><img src="icon/icon_search.png" alt="検索"></a> <a href="#" class="search_menu mx-2"><img src="icon/icon_search.png" alt="検索"></a>
<a href="#" data-toggle="modal" data-target="#menuModalCenter" id="roomMenu" class="none"><img <a href="#" data-toggle="modal" data-target="#menuModalCenter" id="roomMenu" class="none mx-1"><img
src="icon/icon_room_menu.png" alt="メニュー"></a> src="icon/icon_room_menu.png" alt="メニュー"></a>
</div> </div>
</div><!-- .col --> </div><!-- .col -->
......
...@@ -11,6 +11,8 @@ ...@@ -11,6 +11,8 @@
<link href="./fontawesome/css/all.css" rel="stylesheet"> <link href="./fontawesome/css/all.css" rel="stylesheet">
<link rel="stylesheet" href="./css/bootstrap.min.css"> <link rel="stylesheet" href="./css/bootstrap.min.css">
<link rel="stylesheet" href="./css/common.css"> <link rel="stylesheet" href="./css/common.css">
<link rel="stylesheet" href="./css/contact.css">
<link rel="stylesheet" href="./css/chat.css">
<link rel="stylesheet" href="./css/collaboration.css"> <link rel="stylesheet" href="./css/collaboration.css">
<link rel="stylesheet" href="./css/footer.css"> <link rel="stylesheet" href="./css/footer.css">
<link rel="stylesheet" href="./css/font-awesome.css"> <link rel="stylesheet" href="./css/font-awesome.css">
...@@ -24,16 +26,26 @@ ...@@ -24,16 +26,26 @@
<header id="collabo_header"> <header id="collabo_header">
<div class="d-flex align-items-center h-100"> <div class="d-flex align-items-center h-100">
<div class="collabo_nav_l text-left w-100"> <div class="collabo_nav_l text-left w-100">
通話中 <div class="d-flex flex-row">
<span class="collabo-label collaboration_contents voice_contents">音声</span>
<span class="collabo-label collaboration_contents video_contents">動画</span>
<span class="collabo-label collaboration_contents picture_contents">写真</span>
<span class="collabo-label collaboration_contents document_contents">文書</span>
<span class="collabo-label collaboration_contents board_contents">ボード</span>
<span class="mx-3 host_contents">司会者</span>
<span class="mx-3 none">参加者</span>
</div>
</div> </div>
<div class="collabo_nav_r"> <div class="collabo_nav_r">
<div class="text-right d-flex align-items-center"> <div class="text-right d-flex align-items-center">
<button type="button" name="button" <button type="button" name="button"
class="btn user_btn collaboration_contents picture_contents video_contents board_contents"></button> class="btn user_btn"></button>
<button type="button" name="button" class="btn add_user_btn none"></button> <button type="button" name="button" class="btn add_user_btn none"></button>
<button type="button" name="button" class="btn menu_btn host_contents"></button> <div class="menu-icon menu_btn host_contents" onclick="this.classList.toggle('hover');">
<button type="button" name="button" class="btn start_pip_btn collaboration_contents document_contents" <div class="menu-bar menu-bar1"></div>
onclick="startPipMode();"></button> <div class="menu-bar menu-bar2"></div>
<div class="menu-bar menu-bar3"></div>
</div>
<!-- <button type="button" name="button" class="btn exit_btn" onclick="Coview_exitCollaboration();"></button> --> <!-- <button type="button" name="button" class="btn exit_btn" onclick="Coview_exitCollaboration();"></button> -->
</div> </div>
</div> </div>
...@@ -45,6 +57,24 @@ ...@@ -45,6 +57,24 @@
<!-- コンテンツ --> <!-- コンテンツ -->
<main id="collabo_main" class="none"> <main id="collabo_main" class="none">
<div class="document_wrap"> <div class="document_wrap">
<!-- 音声共有 -->
<div class="talking_area icon_talking_wrap d-flex flex-column justify-content-center align-items-center h-100 collaboration_contents voice_contents none">
<div class="talking_img_wrap">
<img src="icon/icon_talking_white.png" alt="通話中">
</div>
<span class="text-white mt-4">通話中</span>
</div>
<!-- 文書共有 -->
<div class="start_pip_area d-flex flex-column justify-content-center align-items-center h-100 collaboration_contents document_contents none">
<div class="start_pip_img_wrap">
<a href="javascript:startPipMode();">
<img src="icon/icon_start_pip.png" alt="文書共有">
</a>
</div>
<span class="text-white mt-2">共有する</span>
</div>
<div class="coview_share_body coview_share_area" id="coviewShare" style="z-index: 1;"> <div class="coview_share_body coview_share_area" id="coviewShare" style="z-index: 1;">
</div> </div>
</div> </div>
...@@ -80,71 +110,17 @@ ...@@ -80,71 +110,17 @@
<div id="modal_collabo_host_request"></div> <div id="modal_collabo_host_request"></div>
<!-- フッター --> <!-- フッター -->
<footer id="collabo_footer_menu" class="active">
<button type="button" name="button" class="footer_menu_btn"></button>
<div class="footer_menu-wrap d-flex justify-content-around h-100">
<div class="d-flex align-items-center h-100">
<div class="footer_menu_item photo_select_button collaboration_contents picture_contents">
<div class="img_wrap bg_blue" id="photo_open_place_holder">
<img src="icon/icon_collabo_picture.png" alt="写真">
</div>
</div>
<div class="footer_menu_item">
<div class="img_wrap bg_red" id="penBtn">
<img src="icon/icon_collabo_pen_white.png" alt="ペン">
</div>
</div>
<div class="footer_menu_item none">
<div class="img_wrap bg_blue">
<img src="icon/icon_collabo_place_white.png" alt="場所">
</div>
</div>
<div class="footer_menu_item">
<div class="img_wrap bg_blue" id="eraserBtn">
<img src="icon/icon_collabo_delete_white.png" alt="削除">
</div>
</div>
</div>
<div class="d-flex align-items-center h-100 none">
<div class="footer_menu_item">
<div class="img_wrap bg_gray">
<img src="icon/icon_collabo_rewind_white.png" alt="戻る">
</div>
</div>
<div class="footer_menu_item">
<div class="img_wrap bg_gray">
<img src="icon/icon_collabo_forward_white.png" alt="進む">
</div>
</div>
</div>
<div class="d-flex align-items-center h-100 collaboration_contents video_contents_host">
<div class="footer_menu_item">
<div class="img_wrap wide bg_blue" id="captureBtn">
<img src="icon/icon_collabo_capture.png" alt="キャプチャ">
<span>キャプチャ</span>
</div>
</div>
</div>
<div class="d-flex align-items-center h-100 collaboration_contents video_contents_user">
<div class="footer_menu_item">
<div class="img_wrap wide bg_blue" id="captureRequestBtn">
<img src="icon/icon_collabo_capture.png" alt="キャプチャ">
<span>キャプチャリクエスト</span>
</div>
</div>
</div>
</div>
</footer>
<!-- フッター -->
<div id="footer_collabo"></div> <div id="footer_collabo"></div>
<div id="loadingArea"></div> <div id="loadingArea"></div>
<div class="pip_indicator none" onclick="finishPipMode();"> <div class="pip_indicator none" onclick="finishPipMode();">
<div style="vertical-align: middle;display: table-cell;">協業中 <div style="vertical-align: middle;display: table-cell;">
<img src="icon/icon_end_pip.png" alt="文書共有" style="width: 30px;height: 30px;">
<span style="font-size: 20px;vertical-align: middle;">戻る</span>
</div> </div>
</div> </div>
<div class="before_loading_indicator"> <div class="before_loading_indicator">
<div id="page_loader" class="before_loading_indicator"> <div id="page_loader" class="before_loading_indicator">
<i class="fa fa-circle-o-notch fa-spin fa-1x fa-fw"></i> <div class="sp sp-circle"></div>
</div> </div>
</div> </div>
<script src="./js/libs/jquery-3.3.1.min.js"></script> <script src="./js/libs/jquery-3.3.1.min.js"></script>
......
<div id="overlay_menu" class="overlay fixed" style="z-index: 6 !important;"> <div id="overlay_menu" class="fixed hide">
<div class="overlay_menu_wrap"> <div class="overlay_menu_wrap">
<div class="overlay_menu h-100 d-flex justify-content-center align-items-center"> <div class="overlay_menu d-flex justify-content-center align-items-center">
<div class="menu_wrap"> <div class="menu_wrap">
<div class="menu d-flex flex-row flex-wrap"> <div class="menu">
<div class="item collaboration_contents picture_contents document_contents board_contents video_contents"> <div class="item hide rounded-circle shadow m-2 item01">
<span class="item-overlay rounded-circle collaboration_contents voice_contents"></span>
<a href="javascript:changeCollaboration(COLLABORATION_TYPE.AUDIO);" <a href="javascript:changeCollaboration(COLLABORATION_TYPE.AUDIO);"
class="d-flex flex-column align-items-center"> class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_headset.png" alt="音声共有"> <img src="icon/icon_collabo_headset.png" alt="音声共有">
</div> </div>
<span>音声共有</span> <span>音声</span>
</a> </a>
</div> </div>
<div class="item collaboration_contents picture_contents voice_contents document_contents board_contents"> <div class="item hide rounded-circle shadow m-2 item02">
<span class="item-overlay rounded-circle collaboration_contents video_contents"></span>
<a href="javascript:changeCollaboration(COLLABORATION_TYPE.VIDEO);" <a href="javascript:changeCollaboration(COLLABORATION_TYPE.VIDEO);"
class="d-flex flex-column align-items-center"> class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_videocam.png" alt="動画共有"> <img src="icon/icon_collabo_videocam.png" alt="動画共有">
</div> </div>
<span>動画共有</span> <span>動画</span>
</a> </a>
</div> </div>
<div class="item collaboration_contents video_contents voice_contents document_contents board_contents"> <div class="item hide rounded-circle shadow m-2 item03">
<span class="item-overlay rounded-circle collaboration_contents picture_contents"></span>
<a href="javascript:changeCollaboration(COLLABORATION_TYPE.CAMERA);" <a href="javascript:changeCollaboration(COLLABORATION_TYPE.CAMERA);"
class="d-flex flex-column align-items-center"> class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_picture.png" alt="写真共有"> <img src="icon/icon_collabo_picture.png" alt="写真共有">
</div> </div>
<span>写真共有</span> <span>写真</span>
</a> </a>
</div> </div>
<div class="item collaboration_contents video_contents voice_contents picture_contents board_contents"> <div class="item hide rounded-circle shadow m-2 item04">
<span class="item-overlay rounded-circle collaboration_contents document_contents"></span>
<a href="javascript:changeCollaboration(COLLABORATION_TYPE.DOCUMENT);" <a href="javascript:changeCollaboration(COLLABORATION_TYPE.DOCUMENT);"
class="d-flex flex-column align-items-center"> class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_document.png" alt="文書共有"> <img src="icon/icon_collabo_document.png" alt="文書共有">
</div> </div>
<span>文書共有</span> <span>文書</span>
</a> </a>
</div> </div>
<div class="item collaboration_contents video_contents voice_contents picture_contents document_contents"> <div class="item hide rounded-circle shadow m-2 item05">
<span class="item-overlay rounded-circle collaboration_contents board_contents"></span>
<a href="javascript:changeCollaboration(COLLABORATION_TYPE.BOARD);" <a href="javascript:changeCollaboration(COLLABORATION_TYPE.BOARD);"
class="d-flex flex-column align-items-center"> class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_whiteboard.png" alt="落書き"> <img src="icon/icon_collabo_whiteboard.png" alt="落書き">
</div> </div>
<span>落書き</span> <span>ボード</span>
</a> </a>
</div> </div>
</div> </div>
......
...@@ -27,7 +27,11 @@ ...@@ -27,7 +27,11 @@
<div class="text-right d-flex align-items-center"> <div class="text-right d-flex align-items-center">
<button type="button" name="button" class="btn user_btn"></button> <button type="button" name="button" class="btn user_btn"></button>
<button type="button" name="button" class="btn add_user_btn none"></button> <button type="button" name="button" class="btn add_user_btn none"></button>
<button type="button" name="button" class="btn menu_btn"></button> <div class="menu-icon menu_btn" onclick="this.classList.toggle('hover');">
<div class="menu-bar menu-bar1"></div>
<div class="menu-bar menu-bar2"></div>
<div class="menu-bar menu-bar3"></div>
</div>
<!-- <button type="button" name="button" class="btn exit_btn" onclick="Coview_exitCollaboration();"></button> --> <!-- <button type="button" name="button" class="btn exit_btn" onclick="Coview_exitCollaboration();"></button> -->
</div> </div>
</div> </div>
...@@ -75,7 +79,6 @@ ...@@ -75,7 +79,6 @@
<!-- フッター --> <!-- フッター -->
<footer id="collabo_footer_menu" class="active"> <footer id="collabo_footer_menu" class="active">
<button type="button" name="button" class="footer_menu_btn"></button>
<div class="footer_menu-wrap d-flex justify-content-around h-100"> <div class="footer_menu-wrap d-flex justify-content-around h-100">
<div class="d-flex align-items-center h-100"> <div class="d-flex align-items-center h-100">
<div class="footer_menu_item"> <div class="footer_menu_item">
......
<div id="overlay_menu" class="overlay fixed"> <div id="overlay_menu" class="fixed hide">
<div class="overlay_menu_wrap"> <div class="overlay_menu_wrap">
<div class="overlay_menu h-100 d-flex justify-content-center align-items-center"> <div class="overlay_menu d-flex justify-content-center align-items-center">
<div class="menu_wrap"> <div class="menu_wrap">
<div class="menu d-flex flex-row flex-wrap"> <div class="menu">
<div class="item"> <div class="item rounded-circle shadow m-2 item01">
<a href="javascript:coview_api.ChangeCollaboration('audio');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('audio');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_headset.png" alt="音声共有"> <img src="icon/icon_collabo_headset.png" alt="音声共有">
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<span>音声共有</span> <span>音声共有</span>
</a> </a>
</div> </div>
<div class="item"> <div class="item rounded-circle shadow m-2 item02">
<a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_picture.png" alt="写真共有"> <img src="icon/icon_collabo_picture.png" alt="写真共有">
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<span>写真共有</span> <span>写真共有</span>
</a> </a>
</div> </div>
<div class="item"> <div class="item rounded-circle shadow m-2 item03">
<a href="javascript:coview_api.ChangeCollaboration('docs');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('docs');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_document.png" alt="文書共有"> <img src="icon/icon_collabo_document.png" alt="文書共有">
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<span>文書共有</span> <span>文書共有</span>
</a> </a>
</div> </div>
<div class="item"> <div class="item rounded-circle shadow m-2 item04">
<a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_whiteboard.png" alt="落書き"> <img src="icon/icon_collabo_whiteboard.png" alt="落書き">
......
<div id="overlay_menu" class="overlay fixed"> <div id="overlay_menu" class="fixed hide">
<div class="overlay_menu_wrap"> <div class="overlay_menu_wrap">
<div class="overlay_menu h-100 d-flex justify-content-center align-items-center"> <div class="overlay_menu d-flex justify-content-center align-items-center">
<div class="menu_wrap"> <div class="menu_wrap">
<div class="menu d-flex flex-row flex-wrap"> <div class="menu">
<div class="item"> <div class="item rounded-circle shadow m-2 item01">
<a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_picture.png" alt="写真共有"> <img src="icon/icon_collabo_picture.png" alt="写真共有">
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<span>写真共有</span> <span>写真共有</span>
</a> </a>
</div> </div>
<div class="item"> <div class="item rounded-circle shadow m-2 item02">
<a href="javascript:coview_api.ChangeCollaboration('video');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('video');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_videocam.png" alt="動画共有"> <img src="icon/icon_collabo_videocam.png" alt="動画共有">
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<span>動画共有</span> <span>動画共有</span>
</a> </a>
</div> </div>
<div class="item"> <div class="item rounded-circle shadow m-2 item03">
<a href="javascript:coview_api.ChangeCollaboration('docs');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('docs');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_document.png" alt="文書共有"> <img src="icon/icon_collabo_document.png" alt="文書共有">
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<span>文書共有</span> <span>文書共有</span>
</a> </a>
</div> </div>
<div class="item"> <div class="item rounded-circle shadow m-2 item04">
<a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center"> <a href="javascript:coview_api.ChangeCollaboration('image');" class="d-flex flex-column align-items-center">
<div class="img_wrap"> <div class="img_wrap">
<img src="icon/icon_collabo_whiteboard.png" alt="落書き"> <img src="icon/icon_collabo_whiteboard.png" alt="落書き">
......
...@@ -52,14 +52,14 @@ ...@@ -52,14 +52,14 @@
<div class="content tabs"> <div class="content tabs">
<input id="tabMyGroup" type="radio" name="tab_item" checked> <input id="tabMyGroup" type="radio" name="tab_item" checked>
<label class="tab_item" for="tabMyGroup">マイグループ</label> <label class="tab_item m-0" for="tabMyGroup">マイグループ</label>
<input id="tabAllGroup" type="radio" name="tab_item"> <input id="tabAllGroup" type="radio" name="tab_item">
<label class="tab_item" for="tabAllGroup">全グループ</label> <label class="tab_item m-0" for="tabAllGroup">全グループ</label>
<!-- タブ --> <!-- タブ -->
<div class="tab_content" id="tab1_content"> <div class="tab_content" id="tab1_content">
<div class="content chat_list my_info_sell"> <div class="content chat_list my_info_sell">
<ul class="p-0 chat_make_room_list"> <ul class="p-0 chat_make_room_list m-0">
<li class="d-flex align-items-center"> <li class="d-flex align-items-center">
<a href="#" style="width: 100%;"> <a href="#" style="width: 100%;">
<div class="chat_item d-flex flex-row align-items-center" style="background: none !important;"> <div class="chat_item d-flex flex-row align-items-center" style="background: none !important;">
...@@ -89,15 +89,15 @@ ...@@ -89,15 +89,15 @@
</div> </div>
</div> </div>
<div class="tab_content" id="tab2_content"> <div class="tab_content" id="tab2_content">
<div class="breadcrumb" id="groupPathArea"></div> <div class="breadcrumb m-0" id="groupPathArea"></div>
<div class="chat_list"> <div class="chat_list">
<!-- 全グループ --> <!-- 全グループ -->
<ul class="p-0 chat_make_room_list"> <ul class="p-0 chat_make_room_list m-0">
<li class="d-flex align-items-center" id="rootGroupArea"> <li class="d-flex align-items-center" id="rootGroupArea">
<a href="#" class="w-100" id="rootGroupBtn"> <a href="#" class="w-100" id="rootGroupBtn">
<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-icon">
<img src="icon/icon_prev_top.png" alt="トップグループに戻る" /> <img src="icon/icon_prev_top.png" alt="トップグループに戻る" />
</div> </div>
</div> </div>
...@@ -115,7 +115,7 @@ ...@@ -115,7 +115,7 @@
<a href="#" class="w-100" id="parentGroupBtn"> <a href="#" class="w-100" id="parentGroupBtn">
<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-icon">
<img src="icon/icon_prev.png" alt="上位グループに戻る" /> <img src="icon/icon_prev.png" alt="上位グループに戻る" />
</div> </div>
</div> </div>
...@@ -143,7 +143,7 @@ ...@@ -143,7 +143,7 @@
</main> </main>
<!-- フッター --> <!-- フッター -->
<footer> <footer id="footer-main">
<div class="footer-wrap"> <div class="footer-wrap">
<div class="d-flex justify-content-around h-100"> <div class="d-flex justify-content-around h-100">
<div class="footer_item"> <div class="footer_item">
......
...@@ -79,6 +79,8 @@ ...@@ -79,6 +79,8 @@
.archive_detail .ttl{ .archive_detail .ttl{
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
background: #0070ca2b;
padding: 10px;
} }
.archive_detail .item { .archive_detail .item {
margin-bottom: 20px; margin-bottom: 20px;
...@@ -97,7 +99,7 @@ ...@@ -97,7 +99,7 @@
margin: 0 5px; margin: 0 5px;
} }
.archive_detail_desc { .archive_detail_desc {
margin: 0 10px; margin: 20px;
} }
.archive_detail .archive_detail_desc .archive_detail_user_list span, .archive_detail .archive_detail_desc .archive_detail_user_list span,
.archive_detail .archive_detail_desc .archive_detail_sv_user span { .archive_detail .archive_detail_desc .archive_detail_sv_user span {
......
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
transition: all 0.2s ease; transition: all 0.2s ease;
border-radius: 5px 5px 0 0;
} }
.msg_notification { .msg_notification {
display: none; display: none;
...@@ -80,9 +81,6 @@ input[name="tab_item"] { ...@@ -80,9 +81,6 @@ input[name="tab_item"] {
border-bottom: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0;
position: relative; position: relative;
} }
.chat_list ul li:first-child {
border-top: 1px solid #e2e8f0;
}
.chat_list .chat_item_t, .chat_list .chat_item_t,
.chat_list .chat_item_desc { .chat_list .chat_item_desc {
white-space: nowrap; white-space: nowrap;
...@@ -101,7 +99,7 @@ input[name="tab_item"] { ...@@ -101,7 +99,7 @@ input[name="tab_item"] {
padding-left: 0; padding-left: 0;
text-align: center; text-align: center;
position: absolute; position: absolute;
right: 0px; right: 15px;
} }
#searchList { #searchList {
...@@ -120,7 +118,18 @@ input[name="tab_item"] { ...@@ -120,7 +118,18 @@ input[name="tab_item"] {
overflow: hidden; overflow: hidden;
margin: 0 auto; margin: 0 auto;
} }
.chat_item_l .thumbnail-icon {
width: 50px;
height: 50px;
text-align: center;
display: flex;
justify-content: space-around;
align-items: center;
}
.chat_item_l .thumbnail-icon img{
width: 35px;
height: 35px;
}
.chat_item_l .thumbnail img{ .chat_item_l .thumbnail img{
width: 50px; width: 50px;
height: 50px; height: 50px;
...@@ -227,13 +236,15 @@ input[name="tab_item"] { ...@@ -227,13 +236,15 @@ input[name="tab_item"] {
.chat_list .category { .chat_list .category {
text-align: left; text-align: left;
font-size: 1.4rem; font-size: 1.4rem;
height: 30px; height: 40px;
font-size: 16px; font-size: 16px;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
line-height: 30px; line-height: 40px;
background: #c4c4c4; background: #0070ca2b;
padding-left: 10px; padding-left: 10px;
border-top: 1px solid #0070ca21;
border-bottom: 1px solid #0070ca21;
} }
.category_name { .category_name {
white-space: nowrap; white-space: nowrap;
...@@ -245,7 +256,7 @@ input[name="tab_item"] { ...@@ -245,7 +256,7 @@ input[name="tab_item"] {
} }
.chat_list .category::after { .chat_list .category::after {
position: absolute; position: absolute;
top: 0; top: 8px;
right: 10px; right: 10px;
content: "\f107"; content: "\f107";
font: 25px FontAwesome; font: 25px FontAwesome;
...@@ -424,6 +435,11 @@ input[name="tab_item"] { ...@@ -424,6 +435,11 @@ input[name="tab_item"] {
width: 100%; width: 100%;
overflow-x: scroll; overflow-x: scroll;
z-index: 2; z-index: 2;
border-bottom: 1px solid #dee2e6;
transition: 0.5s;
}
.user_list.hide{
transform: translateY(-100%);
} }
.user_list .user_item { .user_list .user_item {
margin: 10px; margin: 10px;
...@@ -789,10 +805,10 @@ input[name="tab_item"] { ...@@ -789,10 +805,10 @@ input[name="tab_item"] {
} }
.menu_modal .modal-body ul li { .menu_modal .modal-body ul li {
border-bottom: 1px solid #c6c6c6; border-bottom: 1px solid #c6c6c6;
height: 40px; height: 50px;
} }
.menu_modal .modal-body ul li a { .menu_modal .modal-body ul li a {
line-height: 40px; line-height: 50px;
display: block; display: block;
color: #323743; color: #323743;
} }
...@@ -816,6 +832,7 @@ input[name="tab_item"] { ...@@ -816,6 +832,7 @@ input[name="tab_item"] {
.chat_make_room_list { .chat_make_room_list {
margin-top: 0px !important; margin-top: 0px !important;
margin-bottom: 0px !important;
} }
#favoriteListForMakeRoom > ul > li:nth-child(1) { #favoriteListForMakeRoom > ul > li:nth-child(1) {
......
...@@ -25,13 +25,14 @@ nav { ...@@ -25,13 +25,14 @@ nav {
width: 100%; width: 100%;
border-bottom: 1px solid #cdcdcd; border-bottom: 1px solid #cdcdcd;
background: #fff; background: #fff;
z-index: 2; z-index: 3;
} }
main { main {
margin-top: 60px; margin-top: 60px;
} }
.nav-item { .nav-item {
padding: 0 10px; padding: 0 10px;
white-space: nowrap;
} }
.nav-ttl { .nav-ttl {
text-align: center; text-align: center;
...@@ -135,8 +136,8 @@ main { ...@@ -135,8 +136,8 @@ main {
.profile_modal .modal-footer button { .profile_modal .modal-footer button {
color: #fff; color: #fff;
border-radius: 10px; border-radius: 10px;
min-width: 100px; min-width: 90px;
font-size: 14px; font-size: 11px;
} }
.profile_modal .modal-footer button img { .profile_modal .modal-footer button img {
width: 30px; width: 30px;
...@@ -180,9 +181,9 @@ main { ...@@ -180,9 +181,9 @@ main {
width: 100%; width: 100%;
} }
.profile_modal .modal-header .profile_name span { .profile_modal .modal-header .profile_name span {
line-height: 60px; font-weight: bold;
font-weight: bold; font-size: 20px;
font-size: 20px; padding: 5px;
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
white-space: nowrap; white-space: nowrap;
overflow-x: scroll; overflow-x: scroll;
display: block; display: block;
margin-bottom: 10px; background: #0070ca2b;
} }
.breadcrumb_item:not(:last-child):after { .breadcrumb_item:not(:last-child):after {
content: ">"; content: ">";
......
...@@ -2,7 +2,6 @@ ...@@ -2,7 +2,6 @@
/**************************** footer *************************/ /**************************** footer *************************/
footer { footer {
background: #f9f9f9;
height: 70px; height: 70px;
margin-top: 20px; margin-top: 20px;
border-top: 1px solid #cccccc; border-top: 1px solid #cccccc;
...@@ -10,6 +9,9 @@ footer { ...@@ -10,6 +9,9 @@ footer {
bottom: 0; bottom: 0;
width: 100%; width: 100%;
} }
#footer-main{
background: #F9F9F9;
}
footer .footer-wrap { footer .footer-wrap {
margin: 0 auto; margin: 0 auto;
height: 100%; height: 100%;
......
@charset "UTF-8"; @charset "UTF-8";
/**************************** loading *************************/ /**************************** loading *************************/
#loader-bg { .sp {
display: none; width: 25px;
position: fixed; height: 25px;
width: 100%; clear: both;
height: 100%;
top: 0px;
left: 0px;
background: rgb(255, 255, 255, 0.5);
z-index: 99;
} }
#loader { .sp-circle {
display: none; width: 40px;
position: fixed; height: 40px;
top: 50%; margin: auto;
left: 50%; border: 5px rgba(0, 0, 0, 0.25) solid;
width: 200px; border-top: 5px black solid;
height: 200px; border-radius: 50%;
margin-top: -100px; -webkit-animation: spCircRot .6s infinite linear;
margin-left: -100px; animation: spCircRot .6s infinite linear;
text-align: center;
color: #fff;
z-index: 999;
} }
.fa.fa-circle-o-notch { @-webkit-keyframes spCircRot {
color: #707070; from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(359deg);
}
}
@keyframes spCircRot {
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
} }
<footer id="collabo_footer"> <footer id="collabo_footer">
<div class="footer-wrap"> <div class="footer-wrap">
<div class="d-flex justify-content-around h-100"> <div class="d-flex justify-content-around h-100">
<div class="footer_item"> <div class="footer_item mx-md-3 photo_select_button collaboration_contents picture_contents">
<a href="javascript:photo_open_place_holderToggle();">
<div class="d-flex flex-column justify-content-center" id="photo_open_place_holder">
<div class="t-icon picture my-0"></div>
<span class="text-white txt">ピクチャ</span>
</div>
</a>
</div>
<div class="footer_item mx-md-3 collaboration_contents picture_contents video_contents document_contents board_contents">
<a href="javascript:penToggle();">
<div class="d-flex flex-column justify-content-center" id="penBtn">
<div class="t-icon pen disable my-0"></div>
<span class="text-white txt">ペン</span>
</div>
</a>
</div>
<div class="footer_item mx-md-3 collaboration_contents picture_contents video_contents document_contents board_contents">
<a href="javascript:eraserToggle();">
<div class="d-flex flex-column justify-content-center" id="eraserBtn">
<div class="t-icon delete my-0"></div>
<span class="text-white txt">削除</span>
</div>
</a>
</div>
<div class="footer_item mx-md-3 collaboration_contents video_contents_host">
<a href="javascript:captureToggle();">
<div class="d-flex flex-column justify-content-center" id="captureBtn">
<div class="t-icon capture my-0"></div>
<span class="text-white txt">キャプチャ</span>
</div>
</a>
</div>
<div class="footer_item mx-md-3 collaboration_contents video_contents_user">
<a href="javascript:captureRequestToggle();">
<div class="d-flex flex-column justify-content-center" id="captureRequestBtn">
<div class="t-icon capture my-0"></div>
<span class="text-white txt">キャプチャリクエスト</span>
</div>
</a>
</div>
<div class="footer_item mx-md-3">
<a href="javascript:micTogle();"> <a href="javascript:micTogle();">
<div class="img_wrap bg_red" id="micBtn"> <div class="d-flex flex-column justify-content-center" id="micBtn">
<img src="icon/icon_voice_gray.png" alt="音声"> <div class="t-icon voice my-0"></div>
<span class="text-white txt">マイク</span>
</div> </div>
</a> </a>
</div> </div>
<div class="footer_item none host_contents"> <div class="footer_item mx-md-3 none host_contents">
<a href="javascript:recordTogle();"> <a href="javascript:recordTogle();">
<div class="img_wrap bg_gray" id="recordBtn"> <div class="d-flex flex-column justify-content-center" id="recordBtn">
<img src="icon/icon_record.png" alt="録音"> <div class="t-icon record my-0"></div>
<span class="text-white txt">録音</span>
<div class="flash-txt"><p>録音を開始しました</p></div>
</div> </div>
</a> </a>
</div> </div>
<div class="footer_item"> <div class="footer_item mx-md-3">
<a href="javascript:Coview_exitCollaboration(isDocument);"> <a href="javascript:Coview_exitCollaboration(isDocument);">
<div class="img_wrap bg_red"> <div class="img_wrap bg_red mx-1">
<img src="icon/icon_tell.png" alt="通話"> <img src="icon/icon_close_white.png" alt="閉じる">
</div> </div>
</a> </a>
</div> </div>
......

706 Bytes | W: | H:

559 Bytes | W: | H:

public_new/icon/icon_add_member_white.png
public_new/icon/icon_add_member_white.png
public_new/icon/icon_add_member_white.png
public_new/icon/icon_add_member_white.png
  • 2-up
  • Swipe
  • Onion skin

515 Bytes | W: | H:

559 Bytes | W: | H:

public_new/icon/icon_add_user.png
public_new/icon/icon_add_user.png
public_new/icon/icon_add_user.png
public_new/icon/icon_add_user.png
  • 2-up
  • Swipe
  • Onion skin

381 Bytes | W: | H:

400 Bytes | W: | H:

public_new/icon/icon_change_room_name.png
public_new/icon/icon_change_room_name.png
public_new/icon/icon_change_room_name.png
public_new/icon/icon_change_room_name.png
  • 2-up
  • Swipe
  • Onion skin

285 Bytes | W: | H:

468 Bytes | W: | H:

public_new/icon/icon_chat.png
public_new/icon/icon_chat.png
public_new/icon/icon_chat.png
public_new/icon/icon_chat.png
  • 2-up
  • Swipe
  • Onion skin

286 Bytes | W: | H:

466 Bytes | W: | H:

public_new/icon/icon_chat_gray.png
public_new/icon/icon_chat_gray.png
public_new/icon/icon_chat_gray.png
public_new/icon/icon_chat_gray.png
  • 2-up
  • Swipe
  • Onion skin

460 Bytes | W: | H:

507 Bytes | W: | H:

public_new/icon/icon_collabo_capture.png
public_new/icon/icon_collabo_capture.png
public_new/icon/icon_collabo_capture.png
public_new/icon/icon_collabo_capture.png
  • 2-up
  • Swipe
  • Onion skin

347 Bytes | W: | H:

414 Bytes | W: | H:

public_new/icon/icon_collabo_delete_white.png
public_new/icon/icon_collabo_delete_white.png
public_new/icon/icon_collabo_delete_white.png
public_new/icon/icon_collabo_delete_white.png
  • 2-up
  • Swipe
  • Onion skin

498 Bytes | W: | H:

454 Bytes | W: | H:

public_new/icon/icon_collabo_document.png
public_new/icon/icon_collabo_document.png
public_new/icon/icon_collabo_document.png
public_new/icon/icon_collabo_document.png
  • 2-up
  • Swipe
  • Onion skin

682 Bytes | W: | H:

759 Bytes | W: | H:

public_new/icon/icon_collabo_headset.png
public_new/icon/icon_collabo_headset.png
public_new/icon/icon_collabo_headset.png
public_new/icon/icon_collabo_headset.png
  • 2-up
  • Swipe
  • Onion skin

318 Bytes | W: | H:

234 Bytes | W: | H:

public_new/icon/icon_collabo_menu.png
public_new/icon/icon_collabo_menu.png
public_new/icon/icon_collabo_menu.png
public_new/icon/icon_collabo_menu.png
  • 2-up
  • Swipe
  • Onion skin

405 Bytes | W: | H:

334 Bytes | W: | H:

public_new/icon/icon_collabo_pen_white.png
public_new/icon/icon_collabo_pen_white.png
public_new/icon/icon_collabo_pen_white.png
public_new/icon/icon_collabo_pen_white.png
  • 2-up
  • Swipe
  • Onion skin

547 Bytes | W: | H:

538 Bytes | W: | H:

public_new/icon/icon_collabo_picture.png
public_new/icon/icon_collabo_picture.png
public_new/icon/icon_collabo_picture.png
public_new/icon/icon_collabo_picture.png
  • 2-up
  • Swipe
  • Onion skin

607 Bytes | W: | H:

466 Bytes | W: | H:

public_new/icon/icon_collabo_place_white.png
public_new/icon/icon_collabo_place_white.png
public_new/icon/icon_collabo_place_white.png
public_new/icon/icon_collabo_place_white.png
  • 2-up
  • Swipe
  • Onion skin

367 Bytes | W: | H:

492 Bytes | W: | H:

public_new/icon/icon_collabo_videocam.png
public_new/icon/icon_collabo_videocam.png
public_new/icon/icon_collabo_videocam.png
public_new/icon/icon_collabo_videocam.png
  • 2-up
  • Swipe
  • Onion skin

847 Bytes | W: | H:

421 Bytes | W: | H:

public_new/icon/icon_host_tag.png
public_new/icon/icon_host_tag.png
public_new/icon/icon_host_tag.png
public_new/icon/icon_host_tag.png
  • 2-up
  • Swipe
  • Onion skin

382 Bytes | W: | H:

650 Bytes | W: | H:

public_new/icon/icon_make_room.png
public_new/icon/icon_make_room.png
public_new/icon/icon_make_room.png
public_new/icon/icon_make_room.png
  • 2-up
  • Swipe
  • Onion skin

1.61 KB | W: | H:

870 Bytes | W: | H:

public_new/icon/icon_member_blue.png
public_new/icon/icon_member_blue.png
public_new/icon/icon_member_blue.png
public_new/icon/icon_member_blue.png
  • 2-up
  • Swipe
  • Onion skin

896 Bytes | W: | H:

732 Bytes | W: | H:

public_new/icon/icon_member_white.png
public_new/icon/icon_member_white.png
public_new/icon/icon_member_white.png
public_new/icon/icon_member_white.png
  • 2-up
  • Swipe
  • Onion skin

380 Bytes | W: | H:

362 Bytes | W: | H:

public_new/icon/icon_movie.png
public_new/icon/icon_movie.png
public_new/icon/icon_movie.png
public_new/icon/icon_movie.png
  • 2-up
  • Swipe
  • Onion skin

417 Bytes | W: | H:

351 Bytes | W: | H:

public_new/icon/icon_paste.png
public_new/icon/icon_paste.png
public_new/icon/icon_paste.png
public_new/icon/icon_paste.png
  • 2-up
  • Swipe
  • Onion skin

517 Bytes | W: | H:

568 Bytes | W: | H:

public_new/icon/icon_phone.png
public_new/icon/icon_phone.png
public_new/icon/icon_phone.png
public_new/icon/icon_phone.png
  • 2-up
  • Swipe
  • Onion skin

391 Bytes | W: | H:

437 Bytes | W: | H:

public_new/icon/icon_photo.png
public_new/icon/icon_photo.png
public_new/icon/icon_photo.png
public_new/icon/icon_photo.png
  • 2-up
  • Swipe
  • Onion skin

343 Bytes | W: | H:

452 Bytes | W: | H:

public_new/icon/icon_record.png
public_new/icon/icon_record.png
public_new/icon/icon_record.png
public_new/icon/icon_record.png
  • 2-up
  • Swipe
  • Onion skin

303 Bytes | W: | H:

439 Bytes | W: | H:

public_new/icon/icon_room_menu.png
public_new/icon/icon_room_menu.png
public_new/icon/icon_room_menu.png
public_new/icon/icon_room_menu.png
  • 2-up
  • Swipe
  • Onion skin

656 Bytes | W: | H:

547 Bytes | W: | H:

public_new/icon/icon_search.png
public_new/icon/icon_search.png
public_new/icon/icon_search.png
public_new/icon/icon_search.png
  • 2-up
  • Swipe
  • Onion skin

1.88 KB | W: | H:

718 Bytes | W: | H:

public_new/icon/icon_start_pip.png
public_new/icon/icon_start_pip.png
public_new/icon/icon_start_pip.png
public_new/icon/icon_start_pip.png
  • 2-up
  • Swipe
  • Onion skin

500 Bytes | W: | H:

380 Bytes | W: | H:

public_new/icon/icon_tell.png
public_new/icon/icon_tell.png
public_new/icon/icon_tell.png
public_new/icon/icon_tell.png
  • 2-up
  • Swipe
  • Onion skin

943 Bytes | W: | H:

486 Bytes | W: | H:

public_new/icon/icon_voice_gray.png
public_new/icon/icon_voice_gray.png
public_new/icon/icon_voice_gray.png
public_new/icon/icon_voice_gray.png
  • 2-up
  • Swipe
  • Onion skin

997 Bytes | W: | H:

569 Bytes | W: | H:

public_new/icon/icon_voice_gray_disable.png
public_new/icon/icon_voice_gray_disable.png
public_new/icon/icon_voice_gray_disable.png
public_new/icon/icon_voice_gray_disable.png
  • 2-up
  • Swipe
  • Onion skin

799 Bytes | W: | H:

669 Bytes | W: | H:

public_new/img/noImage.png
public_new/img/noImage.png
public_new/img/noImage.png
public_new/img/noImage.png
  • 2-up
  • Swipe
  • Onion skin
...@@ -774,3 +774,17 @@ CHAT.searchMessage = function (keyword, workVal) { ...@@ -774,3 +774,17 @@ CHAT.searchMessage = function (keyword, workVal) {
jQueryMessages.append(noResultMsg); jQueryMessages.append(noResultMsg);
} }
}; };
// 下スクロールでユーザーリストを非表示
var startPos = 0,winScrollTop = 0;
$(window).on('scroll',function(){
winScrollTop = $(this).scrollTop();
if (winScrollTop >= startPos) {
if(winScrollTop >= 200){
$('#chat_room .user_list').addClass('hide');
}
} else {
$('#chat_room .user_list').removeClass('hide');
}
startPos = winScrollTop;
});
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
no_scroll();
// メニューオーバーレイ表示 // メニューオーバーレイ表示
$(".menu_btn").click(function () { $(".menu_btn").click(function () {
var w = $(this).width(); var w = $(this).width();
$(this).toggleClass("hide"); $(this).toggleClass("hide");
$("#overlay_menu.overlay") $('#overlay_menu .item').toggleClass('hide');
.toggleClass("slidein")
.css({ transform: "translateX(" & -w & ")" });
$("#collabo_main").toggleClass("noscroll");
}); });
// ユーザーリストオーバーレイ表示 // ユーザーリストオーバーレイ表示
$(".user_btn").click(function () { $(".user_btn").click(function () {
var w = $(this).width(); var w = $(this).width();
$(this).toggleClass("hide");
$("#overlay_user_list.overlay")
.toggleClass("slidein")
.css({ transform: "translateX(" & -w & ")" });
$("#collabo_main").toggleClass("noscroll");
if ($("#overlay_user_list.overlay").hasClass("noscroll")) {
$("#overlay_user_list.overlay").removeClass("noscroll");
} else {
$("#overlay_user_list.overlay").addClass("noscroll");
}
});
// フッターメニュー アコーディオン $(this).toggleClass("hide");
$(".footer_menu_btn").click(function () { $("#overlay_user_list.overlay")
var h_active = $("#collabo_footer").height(); .toggleClass("slidein")
var h_hide = h_active - $("#collabo_footer_menu").height(); .css({ transform: "translateX(" & -w & ")" });
// 非アクティブ時 if($(this).hasClass('hide')){
if ($(this).hasClass("hide")) { return_scroll();
$(this).removeClass("hide"); }else{
$("#collabo_footer_menu").css({ bottom: h_active }); scrollTo(0, 0);
// アクティブ時 no_scroll();
} else { }
$(this).addClass("hide"); });
$("#collabo_footer_menu").css({ bottom: h_hide });
}
});
// モーダルonモーダル(前のモーダルを非表示に) // モーダルonモーダル(前のモーダルを非表示に)
// ホスト変更ボタン押下イベント // ホスト変更ボタン押下イベント
...@@ -59,6 +43,7 @@ document.addEventListener("DOMContentLoaded", function () { ...@@ -59,6 +43,7 @@ document.addEventListener("DOMContentLoaded", function () {
// 閉じるイベント // 閉じるイベント
$(".close_btn").click(function () { $(".close_btn").click(function () {
$("#overlay_add_user_list").addClass("none"); $("#overlay_add_user_list").addClass("none");
no_scroll();
}); });
// ユーザー追加イベント // ユーザー追加イベント
...@@ -68,6 +53,7 @@ document.addEventListener("DOMContentLoaded", function () { ...@@ -68,6 +53,7 @@ document.addEventListener("DOMContentLoaded", function () {
// ユーザー招待メンバー検索 // ユーザー招待メンバー検索
$(".add_user_btn").click(function () { $(".add_user_btn").click(function () {
return_scroll();
CHAT_UI.showLoadingIndicator(); CHAT_UI.showLoadingIndicator();
CHAT.globalSelectedUserList = []; CHAT.globalSelectedUserList = [];
CHAT_UI.refreshMyGroupForAddUserInCollaboration(); CHAT_UI.refreshMyGroupForAddUserInCollaboration();
...@@ -85,49 +71,26 @@ document.addEventListener("DOMContentLoaded", function () { ...@@ -85,49 +71,26 @@ document.addEventListener("DOMContentLoaded", function () {
CHAT_UI.confirmInviteUserListInCollaboration(); CHAT_UI.confirmInviteUserListInCollaboration();
}); });
}); });
$("#penBtn").click(function () {
$("#coviewPenCtrBtn").click();
if ($("#penBtn").hasClass("bg_red")) {
$("#penBtn").removeClass("bg_red");
$("#penBtn").addClass("bg_blue");
} else {
$("#penBtn").addClass("bg_red");
$("#penBtn").removeClass("bg_blue");
}
});
$("#photo_open_place_holder").click(function () {
$("#open_file_upload").trigger("click");
});
$("#eraserBtn").click(function () {
$("#coviewEraserCtrBtn").click();
});
$("#captureBtn").click(function () {
if ($("#recordBtn").hasClass("bg_red")) {
screenLock();
recordStop(function () {
$("#screenLock").remove();
coview_api.Capture(CMS_SERVER_URL + "/chatapi/file/uploadArchive");
});
} else {
coview_api.Capture(CMS_SERVER_URL + "/chatapi/file/uploadArchive");
}
});
$("#captureRequestBtn").click(function () {
fw.sendToMsg("others", "CAPTURE_REQUEST", {
name: CHAT.globalLoginParameter.loginId,
});
});
}); });
function penOff() { function penOff() {
if ($("#penBtn").hasClass("bg_blue")) { if (!$("#penBtn .pen").hasClass("disable")) {
$("#coviewPenCtrBtn").click(); $("#coviewPenCtrBtn").click();
$("#penBtn").addClass("bg_red"); $("#penBtn .pen").addClass("disable");
$("#penBtn").removeClass("bg_blue");
} }
} }
function no_scroll() {
document.addEventListener("mousewheel", scroll_control, { passive: false });
document.addEventListener("touchmove", scroll_control, { passive: false });
}
// スクロール禁止解除
function return_scroll() {
document.removeEventListener("mousewheel", scroll_control, { passive: false });
document.removeEventListener('touchmove', scroll_control, { passive: false });
}
function scroll_control(event) {
if(event.cancelable){
event.preventDefault();
}
}
\ No newline at end of file
...@@ -193,7 +193,7 @@ document.addEventListener("DOMContentLoaded", function () { ...@@ -193,7 +193,7 @@ document.addEventListener("DOMContentLoaded", function () {
if ( if (
confirm(data.payload.name + getLocalizedString("request_capture")) confirm(data.payload.name + getLocalizedString("request_capture"))
) { ) {
if ($("#recordBtn").hasClass("bg_red")) { if ($("#recordBtn .record").hasClass("disable")) {
screenLock(); screenLock();
recordStop(function () { recordStop(function () {
$("#screenLock").remove(); $("#screenLock").remove();
...@@ -246,12 +246,12 @@ document.addEventListener("DOMContentLoaded", function () { ...@@ -246,12 +246,12 @@ document.addEventListener("DOMContentLoaded", function () {
} }
} else if (data.type === "API_SEND_OWNER_CHANGE_COMPLETE") { } else if (data.type === "API_SEND_OWNER_CHANGE_COMPLETE") {
penOff(); penOff();
if ($("#recordBtn").hasClass("bg_red")) { if ($("#recordBtn .record").hasClass("disable")) {
recordStop(function () { recordStop(function () {
console.log("ホスト変更によりレコードを終了しました"); console.log("ホスト変更によりレコードを終了しました");
}); });
} }
if ($("#micBtn").hasClass("bg_red")) { if ($("#micBtn .voice").hasClass("disable")) {
micOff(); micOff();
} else { } else {
micOn(); micOn();
...@@ -599,6 +599,12 @@ function Coview_moveToVideoShareArea() { ...@@ -599,6 +599,12 @@ function Coview_moveToVideoShareArea() {
$("#collabo_main").removeClass("none"); $("#collabo_main").removeClass("none");
} }
function Coview_moveToAudioShareArea() {
$(".coview_share_area").addClass("none");
$("#collabo_main").removeClass("none");
$(".talking_area").removeClass("none");
}
function changeCollaboration(changeCollaborationType) { function changeCollaboration(changeCollaborationType) {
recordStop(function () { recordStop(function () {
var newMeetingId = 0; var newMeetingId = 0;
...@@ -649,7 +655,7 @@ function changeCollaboration(changeCollaborationType) { ...@@ -649,7 +655,7 @@ function changeCollaboration(changeCollaborationType) {
coview_api.ChangeCollaboration("audio"); coview_api.ChangeCollaboration("audio");
break; break;
} }
if ($("#micBtn").hasClass("bg_red")) { if ($("#micBtn .voice").hasClass("disable")) {
micOff(); micOff();
} else { } else {
micOn(); micOn();
...@@ -717,17 +723,6 @@ async function initCollaborationUI(changeCollaborationType) { ...@@ -717,17 +723,6 @@ async function initCollaborationUI(changeCollaborationType) {
case COLLABORATION_TYPE.AUDIO: case COLLABORATION_TYPE.AUDIO:
$(".collaboration_contents").addClass("none"); $(".collaboration_contents").addClass("none");
$(".voice_contents").removeClass("none"); $(".voice_contents").removeClass("none");
var w = $(".user_btn").width();
$(".user_btn").toggleClass("hide");
$("#overlay_user_list.overlay")
.toggleClass("slidein")
.css({ transform: "translateX(" & -w & ")" });
$("#collabo_main").toggleClass("noscroll");
if ($("#overlay_user_list.overlay").hasClass("noscroll")) {
$("#overlay_user_list.overlay").removeClass("noscroll");
} else {
$("#overlay_user_list.overlay").addClass("noscroll");
}
break; break;
case COLLABORATION_TYPE.CAMERA: case COLLABORATION_TYPE.CAMERA:
...@@ -743,17 +738,6 @@ async function initCollaborationUI(changeCollaborationType) { ...@@ -743,17 +738,6 @@ async function initCollaborationUI(changeCollaborationType) {
case COLLABORATION_TYPE.DOCUMENT: case COLLABORATION_TYPE.DOCUMENT:
$(".collaboration_contents").addClass("none"); $(".collaboration_contents").addClass("none");
$(".document_contents").removeClass("none"); $(".document_contents").removeClass("none");
var w = $(".user_btn").width();
$(".user_btn").toggleClass("hide");
$("#overlay_user_list.overlay")
.toggleClass("slidein")
.css({ transform: "translateX(" & -w & ")" });
$("#collabo_main").toggleClass("noscroll");
if ($("#overlay_user_list.overlay").hasClass("noscroll")) {
$("#overlay_user_list.overlay").removeClass("noscroll");
} else {
$("#overlay_user_list.overlay").addClass("noscroll");
}
break; break;
case COLLABORATION_TYPE.BOARD: case COLLABORATION_TYPE.BOARD:
...@@ -780,7 +764,7 @@ function Coview_exitCollaboration(isDocument = false) { ...@@ -780,7 +764,7 @@ function Coview_exitCollaboration(isDocument = false) {
android.exitMeetingRoom(); android.exitMeetingRoom();
} }
} }
if ($("#recordBtn").hasClass("bg_red")) { if ($("#recordBtn .record").hasClass("disable")) {
recordStop(Coview_finishCollaboration); recordStop(Coview_finishCollaboration);
} else { } else {
Coview_finishCollaboration(); Coview_finishCollaboration();
...@@ -872,7 +856,7 @@ function Coview_connect_audio_collaboration() { ...@@ -872,7 +856,7 @@ function Coview_connect_audio_collaboration() {
coview_api.deleteRoom(globalUserInfo.roomId); coview_api.deleteRoom(globalUserInfo.roomId);
coview_api.CreateRoom(globalUserInfo.roomId, globalUserInfo.coWorkType); coview_api.CreateRoom(globalUserInfo.roomId, globalUserInfo.coWorkType);
Coview_moveToVideoShareArea(); Coview_moveToVideoShareArea();
Coview_moveToAudioShareArea();
$(".coview_share_title_name").text("音声通話"); $(".coview_share_title_name").text("音声通話");
} }
...@@ -1057,20 +1041,26 @@ function captureAndShareImage(urls, changeHostName) { ...@@ -1057,20 +1041,26 @@ function captureAndShareImage(urls, changeHostName) {
}); });
} }
function toolToggle(){
if($("#collabo_footer_menu").hasClass('hide')){
$("#collabo_footer_menu").removeClass('hide');
}else{
$("#collabo_footer_menu").addClass('hide');
}
}
function micOn() { function micOn() {
coview_api.MicMuteControl("off"); coview_api.MicMuteControl("off");
$("#micBtn").addClass("bg_blue"); $("#micBtn .voice").removeClass("disable");
$("#micBtn").removeClass("bg_red");
} }
function micOff() { function micOff() {
coview_api.MicMuteControl("on"); coview_api.MicMuteControl("on");
$("#micBtn").removeClass("bg_blue"); $("#micBtn .voice").addClass("disable");
$("#micBtn").addClass("bg_red");
} }
function micTogle() { function micTogle() {
if ($("#micBtn").hasClass("bg_red")) { if ($("#micBtn .voice").hasClass("disable")) {
micOn(); micOn();
} else { } else {
micOff(); micOff();
...@@ -1080,19 +1070,19 @@ function micTogle() { ...@@ -1080,19 +1070,19 @@ function micTogle() {
function recordStart() { function recordStart() {
console.log("レコードを開始しました"); console.log("レコードを開始しました");
MainManRecord("on"); MainManRecord("on");
$("#recordBtn").removeClass("bg_gray"); $("#recordBtn .record").addClass("disable");
$("#recordBtn").addClass("bg_red"); $('.flash-txt').addClass('on');
} }
function recordFinished() { function recordFinished() {
$("#recordBtn").addClass("bg_gray"); $("#recordBtn .record").removeClass("disable");
$("#recordBtn").removeClass("bg_red"); $('.flash-txt').removeClass('on');
// ロック画面の削除 // ロック画面の削除
delete_dom_obj("screenLock"); delete_dom_obj("screenLock");
} }
function recordTogle() { function recordTogle() {
if ($("#recordBtn").hasClass("bg_gray")) { if (!$("#recordBtn .record").hasClass("disable")) {
recordStart(); recordStart();
} else { } else {
recordStop(function () { recordStop(function () {
...@@ -1102,7 +1092,7 @@ function recordTogle() { ...@@ -1102,7 +1092,7 @@ function recordTogle() {
} }
function recordStop(callback) { function recordStop(callback) {
if ($("#recordBtn").hasClass("bg_gray")) { if (!$("#recordBtn .record").hasClass("disable")) {
callback(); callback();
return; return;
} }
...@@ -1205,3 +1195,34 @@ function requestCollaborationFinish() { ...@@ -1205,3 +1195,34 @@ function requestCollaborationFinish() {
async function waitMillisecond(millesecond) { async function waitMillisecond(millesecond) {
await new Promise(done => setTimeout(() => done(), millesecond)); await new Promise(done => setTimeout(() => done(), millesecond));
} }
function penToggle() {
$("#coviewPenCtrBtn").click();
if ($("#penBtn .pen").hasClass("disable")) {
$("#penBtn .pen").removeClass("disable");
} else {
$("#penBtn .pen").addClass("disable");
}
}
function photo_open_place_holderToggle() {
$("#open_file_upload").trigger("click");
}
function eraserToggle() {
$("#coviewEraserCtrBtn").click();
}
function captureToggle() {
if ($("#recordBtn").hasClass("bg_red")) {
screenLock();
recordStop(function () {
$("#screenLock").remove();
coview_api.Capture(CMS_SERVER_URL + "/chatapi/file/uploadArchive");
});
} else {
coview_api.Capture(CMS_SERVER_URL + "/chatapi/file/uploadArchive");
}
}
function captureRequestToggle() {
fw.sendToMsg("others", "CAPTURE_REQUEST", {
name: CHAT.globalLoginParameter.loginId,
});
}
\ No newline at end of file
<div id="loader-bg" class="loading-indicator"> <div id="loader-bg" class="loading-indicator">
<div id="loader" class="loading-indicator"> <div id="loader" class="loading-indicator">
<i class="fa fa-circle-o-notch fa-spin fa-3x fa-fw"></i> <div class="sp sp-circle"></div>
</div> </div>
</div> </div>
\ No newline at end of file
<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;">
<div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document"> <div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document">
<div class="modal-content" style="position: fixed;height: 600px;width: 86%;"> <div class="modal-content" style="position: fixed;top: 0;height: 100%;width: 100%;left:0;right: 0;margin: 0 auto;">
<div class="modal-header border-0 pb-0"> <div class="modal-header border-0 pb-0">
<span>ユーザー招待</span> <span>ユーザー招待</span>
</div> </div>
......
<!-- コンテンツ --> <!-- コンテンツ -->
<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" aria-labelledby="addUserInCollaboration" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document"> <div class="modal-dialog modal-dialog-centered modal_collaboration_user" role="document">
<div class="modal-content" style="position: fixed;width: 75.5%;top: 0px;"> <div class="modal-content" style="position: fixed;width: 100%;height:100%;top: 0px;left:0;">
<form id="addUserFormInCollaboration" action="chat_add_user_confirm.html" method="post"> <form id="addUserFormInCollaboration" action="chat_add_user_confirm.html" method="post">
<!-- ユーザー検索 --> <!-- ユーザー検索 -->
<!-- タブ --> <!-- タブ -->
...@@ -21,10 +21,10 @@ ...@@ -21,10 +21,10 @@
</nav><!-- nav --> </nav><!-- nav -->
<div class="content tabs"> <div class="content tabs">
<input id="tabMyGroupOnAddUserInCollaboration" type="radio" name="tab_item" checked onclick="CHAT_UI.refreshMyGroupForAddUserInCollaboration();"> <input id="tabMyGroupOnAddUserInCollaboration" type="radio" name="tab_item" checked onclick="CHAT_UI.refreshMyGroupForAddUserInCollaboration();">
<label class="tab_item" for="tabMyGroupOnAddUserInCollaboration">マイグループ</label> <label class="tab_item m-0" for="tabMyGroupOnAddUserInCollaboration">マイグループ</label>
<input id="tabAllGroupOnAddUserInCollaboration" type="radio" name="tab_item" onclick="CHAT_UI.refreshAllGroupForAddUserInCollaboration('0');"> <input id="tabAllGroupOnAddUserInCollaboration" type="radio" name="tab_item" onclick="CHAT_UI.refreshAllGroupForAddUserInCollaboration('0');">
<label class="tab_item" for="tabAllGroupOnAddUserInCollaboration">全グループ</label> <label class="tab_item m-0" for="tabAllGroupOnAddUserInCollaboration">全グループ</label>
<div class="tab_content" id="tab1_content" style="height: 340px; overflow:scroll;"> <div class="tab_content" id="tab1_content" style="height: 100vh; overflow:scroll;">
<div class="chat_list"> <div class="chat_list">
<!-- お気に入りグループ --> <!-- お気に入りグループ -->
<div class="category" onclick="CHAT_UI.toggleCategory(this);"><div class="category_name"><span>お気に入り</span></div></div> <div class="category" onclick="CHAT_UI.toggleCategory(this);"><div class="category_name"><span>お気に入り</span></div></div>
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
<div id="myGroupListForAddUserInCollaboration"></div> <div id="myGroupListForAddUserInCollaboration"></div>
</div> </div>
</div> </div>
<div class="tab_content" id="tab2_content" style="height: 340px; overflow:scroll;"> <div class="tab_content" id="tab2_content" style="height: 100vh; overflow:scroll;">
<div class="breadcrumb" id="groupPathAreaForAddUserInCollaboration"></div> <div class="breadcrumb" id="groupPathAreaForAddUserInCollaboration"></div>
<div class="chat_list"> <div class="chat_list">
<!-- 全グループ --> <!-- 全グループ -->
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
<a href="#" class="w-100" id="rootGroupBtnForAddUserInCollaboration"> <a href="#" class="w-100" id="rootGroupBtnForAddUserInCollaboration">
<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-icon">
<img src="icon/icon_prev_top.png" alt="トップグループに戻る" /> <img src="icon/icon_prev_top.png" alt="トップグループに戻る" />
</div> </div>
</div> </div>
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
<a href="#" class="w-100" id="parentGroupBtnForAddUserInCollaboration"> <a href="#" class="w-100" id="parentGroupBtnForAddUserInCollaboration">
<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-icon">
<img src="icon/icon_prev.png" alt="上位グループに戻る" /> <img src="icon/icon_prev.png" alt="上位グループに戻る" />
</div> </div>
</div> </div>
...@@ -81,7 +81,7 @@ ...@@ -81,7 +81,7 @@
</div> </div>
<!-- ルーム解説ボタン --> <!-- ルーム解説ボタン -->
<div class="add_user_confirm_btn content" id="addUserConfirmBtnInCollaboration" style="position: fixed;"> <div class="add_user_confirm_btn content" id="addUserConfirmBtnInCollaboration" style="position: fixed;">
<button type="button" name="button" id="buttonAddUser" style="top: 455px; width: 75.3%;"> <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>
</div> </div>
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body pt-0">
<ul> <ul>
<li><a id="room_name_change_button" href="chat_change_room_name.html"><img src="icon/icon_change_room_name.png" alt="ルーム名変更">ルーム名変更</a> <li><a id="room_name_change_button" href="chat_change_room_name.html"><img src="icon/icon_change_room_name.png" alt="ルーム名変更">ルーム名変更</a>
</li> </li>
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="modal-header border-0"> <div class="modal-header border-0">
<div class="profile_desc d-flex flex-row"> <div class="profile_desc d-flex flex-row">
<img src="img/noImage.png" alt="プロフィール画像"> <img src="img/noImage.png" alt="プロフィール画像">
<div class="profile_name"><span>名前 名前</span></div> <div class="prifile_name"><span>名前 名前</span></div>
</div> </div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
</button> </button>
<div class="profile_desc_ d-flex flex-row"> <div class="profile_desc_ d-flex flex-row">
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/> <img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/>
<div class="profile_name"><span>{{name}}</span></div> <div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
</div> </div>
</div> </div>
<div class="modal-body"> <div class="modal-body">
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupForAddUser({{id}});"> <a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupForAddUser({{id}});">
<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-icon">
<img src="icon/icon_folder.png" alt="フォルダ" /> <img src="icon/icon_folder.png" alt="フォルダ" />
</div> </div>
</div> </div>
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupForAddUserInCollaboration({{id}});"> <a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupForAddUserInCollaboration({{id}});">
<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-icon">
<img src="icon/icon_folder.png" alt="フォルダ" /> <img src="icon/icon_folder.png" alt="フォルダ" />
</div> </div>
</div> </div>
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupSearch({{id}});"> <a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupSearch({{id}});">
<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-icon">
<img src="icon/icon_folder.png" alt="フォルダ" /> <img src="icon/icon_folder.png" alt="フォルダ" />
</div> </div>
</div> </div>
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<a href="#" class="w-100" onclick="CHAT_UI.refreshAllGroupForMakeRoom({{id}});"> <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 d-flex flex-row align-items-center">
<div class="chat_item_l"> <div class="chat_item_l">
<div class="thumbnail"> <div class="thumbnail-icon">
<img src="icon/icon_folder.png" alt="フォルダ" /> <img src="icon/icon_folder.png" alt="フォルダ" />
</div> </div>
</div> </div>
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<div class="modal-header border-0"> <div class="modal-header border-0">
<div class="profile_desc d-flex flex-row"> <div class="profile_desc d-flex flex-row">
<img src="{{profileImage}}" onError="this.src='./img/noImage.png'"> <img src="{{profileImage}}" onError="this.src='./img/noImage.png'">
<div class="profile_name"><span>{{name}}</span></div> <div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
</div> </div>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
......
<li class="d-flex align-items-center"> <ul class="m-0">
<a href="#" class="w-100" onclick="CHAT_UI.joinRoom({{roomId}},'{{roomName}}');"> <li class="d-flex align-items-center">
<div class="chat_item d-flex flex-row align-items-center"> <a href="#" class="w-100" onclick="CHAT_UI.joinRoom({{roomId}},'{{roomName}}');">
<div class="chat_item_l"> <div class="chat_item d-flex flex-row align-items-center">
<div class="thumbnail{{thumbnailCount}} thumbnail"> <div class="chat_item_l">
{{#attendUsers}} <div class="thumbnail{{thumbnailCount}} thumbnail">
<div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/></div> {{#attendUsers}}
{{/attendUsers}} <div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/></div>
{{^attendUsers}} {{/attendUsers}}
<div class="img_wrap"><img src='./img/noImage.png'/></div> {{^attendUsers}}
{{/attendUsers}} <div class="img_wrap"><img src='./img/noImage.png'/></div>
{{/attendUsers}}
</div>
</div> </div>
</div> <div class="chat_item_m px-0">
<div class="chat_item_m px-0"> <div class="d-flex flex-column">
<div class="d-flex flex-column"> <div class="d-flex flex-row">
<div class="d-flex flex-row"> <div class="chat_item_t ">
<div class="chat_item_t "> <span class="chat_item_ttl">{{roomName}}</span>
<span class="chat_item_ttl">{{roomName}}</span> </div>
<span class="chat_item_num">({{userCnt}})</span>
</div>
<div class="chat_item_desc">
{{lastMessage}}
</div> </div>
<span class="chat_item_num">({{userCnt}})</span>
</div>
<div class="chat_item_desc">
{{lastMessage}}
</div> </div>
</div> </div>
</div> <div class="chat_item_r">
<div class="chat_item_r"> <div class="d-flex flex-column">
<div class="d-flex flex-column"> <span class="chat_item_time">{{time}}</span>
<span class="chat_item_time">{{time}}</span> {{#unreadMsgCnt}}
{{#unreadMsgCnt}} <span class="chat_item_unread room-{{roomId}}-unread">{{unreadMsgCnt}}</span>
<span class="chat_item_unread room-{{roomId}}-unread">{{unreadMsgCnt}}</span> {{/unreadMsgCnt}}
{{/unreadMsgCnt}} </div>
</div> </div>
</div> </div>
</div> </a>
</a> </li>
</li> </ul>
\ No newline at end of file \ No newline at end of file
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
</button> </button>
<div class="profile_desc_ d-flex flex-row"> <div class="profile_desc_ d-flex flex-row">
<img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/> <img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/>
<div class="profile_name"><span>{{name}}</span></div> <div class="profile_name d-flex justify-content-center align-items-center"><span>{{name}}</span></div>
</div> </div>
</div> </div>
<div class="modal-body" id="userNameCard-scroll"> <div class="modal-body" id="userNameCard-scroll">
......
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