Skip to content

C
chat_webview
Commit 2db7333a by Lee Munkyeong
Options

動画、音声協業実装

parent 4811d860
Showing with 200 additions and 47 deletions
public_new/collaboration_video.html
......@@ -14,6 +14,7 @@
<link rel="stylesheet" href="./css/collaboration.css">
<link rel="stylesheet" href="./css/footer.css">
<link rel="stylesheet" href="./css/font-awesome.css">
<link rel="stylesheet" href="./css/share.css">
</head>
<body>
......@@ -35,14 +36,24 @@
</header><!-- header -->
<!-- 拡大縮小機能 -->
<!--#include virtual="zoom.html" -->
<div id="zoom"></div>
<!-- コンテンツ -->
<main id="collabo_main">
<main id="collabo_main" class="none">
<div class="document_wrap">
<div class="coview_share_body coview_share_area" id="coviewShare" style="z-index: 1;">
</div>
</div>
</main>
<div class="coview_share_photo_select_bubble none">
<button id="coviewSharePhotoCamera" class="coview_share_photo_select_bubble_in_button cam">
</button>
<BR>
<button id="coviewSharePhotoGalary" class="coview_share_photo_select_bubble_in_button gal">
</button>
</div>
<!-- ユーザー追加オーバーレイ -->
<div id="overlay_add_user_list" class="none">
<nav>
......@@ -77,25 +88,21 @@
</div>
<!-- オーバーレイ　メニュー -->
<!--#include virtual="collaboration_video_overlay_menu.html" -->
<div id="collaboration_picture_overlay_menu"></div>
<!-- オーバーレイ　ユーザーリスト -->
<div id="overlay_user_list" class="overlay noscroll">
<!--#include virtual="collabotarion_overlay_user_list.html" -->
<div id="collabotarion_overlay_user_list"></div>
</div>
<!-- キャプチャ　モーダル -->
<!--#include virtual="modal_collabo_capture.html" -->
<div id="modal_collabo_capture"></div>
<!-- プロフィールモーダル -->
<!--#include virtual="modal_collabo_profile.html" -->
<!--#include virtual="modal_collabo_profile2.html" -->
<div id="modal_collabo_profile"></div>
<div id="modal_collabo_profile2"></div>
<!-- ホスト変更モーダル -->
<!--#include virtual="modal_collabo_change_host.html" -->
<div id="modal_collabo_change_host"></div>
<!-- ホストリクエストモーダル -->
<!--#include virtual="modal_collabo_host_request.html" -->
<div id="modal_collabo_host_request"></div>
<!-- フッター -->
<footer id="collabo_footer_menu" class="active">
......@@ -104,7 +111,7 @@
<div class="d-flex align-items-center h-100">
<div class="footer_menu_item">
<a href="#">
<div class="img_wrap bg_blue">
<div class="img_wrap bg_red" id="penBtn">
<img src="icon/icon_collabo_pen_white.png" alt="ペン">
</div>
</a>
......@@ -118,7 +125,7 @@
</div>
<div class="footer_menu_item">
<a href="#">
<div class="img_wrap bg_blue">
<div class="img_wrap bg_blue" id="eraserBtn">
<img src="icon/icon_collabo_delete_white.png" alt="削除">
</div>
</a>
......@@ -126,8 +133,9 @@
</div>
<div class="d-flex align-items-center h-100">
<div class="footer_menu_item">
<a href="#" data-toggle="modal" data-target="#captyaModal">
<div class="img_wrap wide bg_blue">
<!-- <a href="#" data-toggle="modal" data-target="#captyaModal">-->
<a href="#">
<div class="img_wrap wide bg_blue" id="captureBtn">
<img src="icon/icon_collabo_capture.png" alt="キャプチャ">
<span>キャプチャ</span>
</div>
......@@ -137,15 +145,72 @@
</div>
</footer>
<!-- フッター -->
<!--#include virtual="footer_collabo.html" -->
<div id="footer_collabo"></div>
<script src="./js/libs/jquery-3.3.1.min.js"></script>
<script src="./js/libs/socket.io.js"></script>
<script src="./js/libs/moment.js"></script>
<script src="./js/libs/locale/ko.js" charset="UTF-8"></script>
<script src="./js/libs/locale/ja.js" charset="UTF-8"></script>
<script src="./js/libs/mustache.min.js"></script>
<script src="./js/libs/bootstrap.min.js"></script>
<script src="./js/libs/jquery.mark.min.js"></script>
<script src="./js/chat.js"></script>
<script src="./js/common.js"></script>
<script src="./js/constant.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/common.js"></script>
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/chat-util.js"></script>
<script src="./js/chat-db.js"></script>
<script src="./js/language.js"></script>
<script src="./js/language_ko.js" charset="UTF-8"></script>
<script src="./js/language_ja.js" charset="UTF-8"></script>
<script src="./js/language_en.js" charset="UTF-8"></script>
<script src="./js/chat-websocket.js"></script>
<script src="https://app.coview.co.kr:7443/coview_api.js"></script>
<script src="./js/share.js"></script>
</body>
<script>
$("#footer_collabo").load("./footer_collabo.html");
$("#modal_collabo_host_request").load("./modal_collabo_host_request.html");
$("#modal_collabo_change_host").load("./modal_collabo_change_host.html");
$("#modal_collabo_profile2").load("./modal_collabo_profile2.html");
$("#modal_collabo_profile").load("./modal_collabo_profile.html");
$("#modal_collabo_capture").load("./modal_collabo_capture.html");
$("#collabotarion_overlay_user_list").load("./collabotarion_overlay_user_list.html");
$("#collaboration_picture_overlay_menu").load("./collaboration_picture_overlay_menu.html");
$("#zoom").load("./zoom.html");
let CHAT_SERVER_URL = '';
let CMS_SERVER_URL = '';
let ASSET_PATH = './';
let PLATFORM = '';
let IS_MOBILE = true;
let IS_ONLINE = false;
let collaborationJoinFlg = 0;
if (typeof(android) != "undefined") {
android.getLoginParameter();
android.getGlobalParameter();
} else {
}
async function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
CHAT_SERVER_URL = chatServerUrl;
CMS_SERVER_URL = cmsServerUrl;
PLATFORM = platform;
IS_MOBILE = isMobile;
IS_ONLINE = isOnline;
if (CHAT_UTIL.isIOS()) {
} else if (CHAT_UTIL.isAndroid()) {
collaborationJoinFlg = android.getCollaborationJoinFlg();
console.log(collaborationJoinFlg);
}
globalUserInfo.coWorkType = collaborationTypeKey.VIDEO;
CHAT_SOCKET.connectSocket();
socket.emit('join', CHAT.globalLoginParameter, function() {
});
};
</script>
</html>
\ No newline at end of file
public_new/collaboration_voice.html
......@@ -14,6 +14,7 @@
<link rel="stylesheet" href="./css/collaboration.css">
<link rel="stylesheet" href="./css/footer.css">
<link rel="stylesheet" href="./css/font-awesome.css">
<link rel="stylesheet" href="./css/share.css">
</head>
<body>
......@@ -35,7 +36,11 @@
<!-- コンテンツ -->
<main id="collabo_main">
<!--#include virtual="collabotarion_overlay_user_list.html" -->
<div class="document_wrap">
<div class="coview_share_body coview_share_area" id="coviewShare" style="z-index: 1;">
</div>
</div>
<!-- <div id="collabotarion_overlay_user_list"></div>-->
</main>
<!-- ユーザー追加オーバーレイ -->
......@@ -72,31 +77,90 @@
</div>
<!-- オーバーレイ　メニュー -->
<!--#include virtual="collaboration_voice_overlay_menu.html" -->
<div id="collaboration_voice_overlay_menu"></div>
<!-- キャプチャ　モーダル -->
<!--#include virtual="modal_collabo_capture.html" -->
<div id="modal_collabo_capture"></div>
<!-- プロフィールモーダル -->
<!--#include virtual="modal_collabo_profile.html" -->
<!--#include virtual="modal_collabo_profile2.html" -->
<div id="modal_collabo_profile"></div>
<div id="modal_collabo_profile2"></div>
<!-- ホスト変更モーダル -->
<!--#include virtual="modal_collabo_change_host.html" -->
<div id="modal_collabo_change_host"></div>
<!-- ホストリクエストモーダル -->
<!--#include virtual="modal_collabo_host_request.html" -->
<div id="modal_collabo_host_request"></div>
<!-- フッター -->
<!--#include virtual="footer_collabo.html" -->
<div id="footer_collabo"></div>
<script src="./js/libs/jquery-3.3.1.min.js"></script>
<script src="./js/libs/socket.io.js"></script>
<script src="./js/libs/moment.js"></script>
<script src="./js/libs/locale/ko.js" charset="UTF-8"></script>
<script src="./js/libs/locale/ja.js" charset="UTF-8"></script>
<script src="./js/libs/mustache.min.js"></script>
<script src="./js/libs/bootstrap.min.js"></script>
<script src="./js/libs/jquery.mark.min.js"></script>
<script src="./js/chat.js"></script>
<script src="./js/common.js"></script>
<script src="./js/constant.js"></script>
<script src="./js/collaboration.js"></script>
<script src="./js/common.js"></script>
<script src="./js/chat.js"></script>
<script src="./js/chat-ui.js"></script>
<script src="./js/chat-util.js"></script>
<script src="./js/chat-db.js"></script>
<script src="./js/language.js"></script>
<script src="./js/language_ko.js" charset="UTF-8"></script>
<script src="./js/language_ja.js" charset="UTF-8"></script>
<script src="./js/language_en.js" charset="UTF-8"></script>
<script src="./js/chat-websocket.js"></script>
<script src="https://app.coview.co.kr:7443/coview_api.js"></script>
<script src="./js/share.js"></script>
<script>
$("#footer_collabo").load("./footer_collabo.html");
$("#modal_collabo_host_request").load("./modal_collabo_host_request.html");
$("#modal_collabo_change_host").load("./modal_collabo_change_host.html");
$("#modal_collabo_profile2").load("./modal_collabo_profile2.html");
$("#modal_collabo_profile").load("./modal_collabo_profile.html");
$("#modal_collabo_capture").load("./modal_collabo_capture.html");
$("#collabotarion_overlay_user_list").load("./collabotarion_overlay_user_list.html");
$("#collaboration_picture_overlay_menu").load("./collaboration_picture_overlay_menu.html");
$("#zoom").load("./zoom.html");
let CHAT_SERVER_URL = '';
let CMS_SERVER_URL = '';
let ASSET_PATH = './';
let PLATFORM = '';
let IS_MOBILE = true;
let IS_ONLINE = false;
let collaborationJoinFlg = 0;
if (typeof(android) != "undefined") {
android.getLoginParameter();
android.getGlobalParameter();
} else {
}
async function getGlobalParam(chatServerUrl, cmsServerUrl, platform, isMobile, isOnline) {
CHAT_SERVER_URL = chatServerUrl;
CMS_SERVER_URL = cmsServerUrl;
PLATFORM = platform;
IS_MOBILE = isMobile;
IS_ONLINE = isOnline;
if (CHAT_UTIL.isIOS()) {
} else if (CHAT_UTIL.isAndroid()) {
collaborationJoinFlg = android.getCollaborationJoinFlg();
console.log(collaborationJoinFlg);
}
globalUserInfo.coWorkType = collaborationTypeKey.AUDIO;
CHAT_SOCKET.connectSocket();
socket.emit('join', CHAT.globalLoginParameter, function() {
});
};
</script>
</body>
</html>
\ No newline at end of file
public_new/css/chat.css
......@@ -603,6 +603,7 @@ input[name="tab_item"] {
/* 自分の会話 */
.room_right {
margin-left: 40%;
position: relative;
margin-bottom: 20px;
max-width: 75%;
......
public_new/css/share.css
......@@ -5,7 +5,6 @@
.coview_share_area{
display: none;
position: absolute;
top: 0;
left: 0;
......@@ -147,4 +146,11 @@
.coview_on_screen_btn_area {
display: none; !important;
}
\ No newline at end of file
}
.coview_on_media_btn_back {
top: 70px !important;
}
#localVideo {
top: 0px !important;
}
public_new/footer_collabo.html
......@@ -10,7 +10,7 @@
</div>
<div class="footer_item">
<a href="#">
<div class="img_wrap bg_gray">
<div class="img_wrap bg_gray" id="recordBtn">
<img src="icon/icon_record.png" alt="録音">
</div>
</a>
......
public_new/js/chat-util.js
......@@ -103,11 +103,10 @@ function msToTime(s) {
function updateDuration() {
var now = new Date();
console.log('updateDuration');
$('.collaboration_duration').each(function() {
var insertDateString = $(this).data('insertdate');
$('.collaboration_duration').each(function(index, item) {
console.log(now);
var insertDateString = $(item).data('insertdate');
insertDateString = insertDateString.toString();
var insertDateString = "20210414103256";
var year = insertDateString.substring(0,4);
var month = insertDateString.substring(4,6);
var day = insertDateString.substring(6,8);
......@@ -115,7 +114,8 @@ function updateDuration() {
var min = insertDateString.substring(10,12);
var sec = insertDateString.substring(12,14);
var insertDate = new Date(year, month-1 , day, hour, min, sec);
$(this).html(msToTime(now - insertDate));
console.log(insertDate);
$(item).html(msToTime(now - insertDate));
});
}
......
public_new/js/collaboration.js
......@@ -111,8 +111,23 @@ $(function () {
$('#micBtn').removeClass('bg_red');
$('#micBtn').addClass('bg_blue');
} else {
$('#micBtn').addClass('bg_red');
$('#micBtn').removeClass('bg_blue');
$('#micBtn').addClass('bg_red');
}
})
$('#captureBtn').click(function () {
$('#coviewCaptureCtrBtn').click();
})
$('#recordBtn').click(function () {
$('#coviewRecCtrBtn').click();
if ($('#recordBtn').hasClass('bg_gray')) {
$('#recordBtn').removeClass('bg_gray');
$('#recordBtn').addClass('bg_red');
} else {
$('#recordBtn').addClass('bg_gray');
$('#recordBtn').removeClass('bg_red');
}
})
});
public_new/js/share.js
......@@ -151,14 +151,15 @@ $(function(){
switch (json.api){
case "LoginResponse":
if(globalUserInfo.coWorkType = collaborationTypeKey.CAMERA) {
if (collaborationJoinFlg == '1') {
coview_api.JoinRoom(globalUserInfo.roomId, globalUserInfo.coWorkType);
} else if (collaborationJoinFlg == '0') {
coview_api.CreateRoom(globalUserInfo.roomId, globalUserInfo.coWorkType);
}
Coview_moveToVideoShareArea();
console.log('------------------------------');
console.log(globalUserInfo.coWorkType);
console.log(collaborationJoinFlg);
if (collaborationJoinFlg == '1') {
coview_api.JoinRoom(globalUserInfo.roomId, globalUserInfo.coWorkType);
} else if (collaborationJoinFlg == '0') {
coview_api.CreateRoom(globalUserInfo.roomId, globalUserInfo.coWorkType);
}
Coview_moveToVideoShareArea();
break;
case "CreateRoomResponse":
......
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