pengjunjie/onlyoffice.github.io
1
0
Fork 1
mirror of https://github.com/ONLYOFFICE/onlyoffice.github.io.git synced 2026-04-07 14:04:30 +08:00
Code Issues Packages Projects Releases Wiki Activity
Files
513d1221d801de97efae214973ae51cb67567d84
onlyoffice.github.io/index.html
Nikita Khromov 5a4b552ec9 Fixed plugin view in zoom mode
2022-05-06 10:57:37 +03:00

726 lines
25 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--
(c) Copyright Ascensio System SIA 2020
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Zoom</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<link rel="stylesheet" href="vendor/select2-4.0.6-rc.1/dist/css/select2.css" />
<script src="vendor/select2-4.0.6-rc.1/dist/js/select2.js"></script>
<script type="text/javascript" src="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins.js"></script>
<script type="text/javascript" src="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins-ui.js"></script>
<link rel="stylesheet" href="https://onlyoffice.github.io/sdkjs-plugins/v1/plugins.css">
<script src="scripts/zoom.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<style>
html,
body {
min-height: 100% !important;
height: 100%;
overflow-y: hidden;
overflow-x: hidden;
font-family: Arial;
font-size: 11px;
}
.select {
margin-left: 12px;
}
.settings_group {
display: none
}
.cursor_pointer {
cursor: pointer;
}
.legend {
display: flex;
justify-content: start;
}
.arrow {
float: right;
align-self: center;
margin-left: 7px;
}
.button {
cursor: pointer;
}
.input_container {
display: flex;
}
.checkbox {
margin-top: 1px;
margin-left: 5px;
}
.radiobox {
margin-left: 7px;
}
.display-none {
display: none !important;
}
#flex-loader-container {
display: flex;
align-items: center;
justify-content: center;
width: 150px;
height: 50px;
border: none;
background-image: none;
background-color: rgba(68, 68, 68, 0.95);
color: #f1f1f1;
border-radius: 6px;
}
.asc-plugin-loader .asc-loader-image {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+PGNpcmNsZSBjeD0iMTQiIGN5PSIxNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjEuNSIgcj0iMTAuMjUiIHN0cm9rZS1kYXNoYXJyYXk9IjE2MCUsIDQwJSIgLz48L3N2Zz4=) !important;
}
i {
border: solid black;
border-width: 0 1px 1px 0;
display: inline-block;
padding: 2px;
}
.down {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
margin-top: 3px;
}
.up {
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
margin-top: 5px;
}
.reconf-label,
.switch-label,
.label-settings {
border-bottom: 1px dashed #444444;
}
.error_border {
border: 1px solid #D9534F !important;
}
.daterangepicker .drp-calendar.left {
padding: 8px 4px 8px 4px !important;
}
#body > div.daterangepicker.ltr.single.opensright.show-calendar {
color: #333 !important;
}
.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Chrome/Safari/Opera */
-khtml-user-select: none; /* Konqueror */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
not supported by any browser */
}
</style>
</head>
<body id="body" style="width: 100%;height: 100%; margin: 0; !important;">
<div id="loader-container" class="asc-plugin-loader display-none">
<div id="flex-loader-container">
<div>
<div class="asc-loader-image">
<div class="asc-loader-title"></div>
</div>
<div class="asc-loader-title"> Loading... </div>
</div>
</div>
</div>
<div id="iframe_join" class="display-none" style="width:100%; height:100%;margin:0;padding:0;"></div>
<div id="iframe_meeting" class="display-none" style="width:100%; height:100%;margin:0;padding:0;"></div>
<div id="create-meeting-container" class="display-none" style="width:100%; height:100%; margin:0;padding:0; display:flex; flex-direction:column; justify-content: space-between; position: relative;">
<div>
<div id="topic">
<div style="margin: 16px 0 4px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Topic</label>
</div>
<input type="text" id="topic-value" class="form-control" placeholder="Enter topic here" style="width: calc(100% - 24px); margin: 0 12px 0 12px; text-align: left;"> </div>
<div style="margin:16px 12px 0px 12px;">
<button id="start-meeting" onсlick="" class="btn-text-default" style="width:100%; height: 30px;">Start a meeting</button>
</div>
<div style="margin:16px 12px 0px 12px;">
<button id="schedule-meeting" onсlick="" class="btn-text-default" style="width:100%; height: 30px;">Schedule a meeting</button>
</div>
<div id="scheduler-container" style="display:none">
<div id="date">
<div style="margin: 16px 0 4px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Date</label>
</div> <span class="select">
<input id="date-value" style="width:calc(100% - 24px);" class="form-control" type="text" name="date"/>
</span> </div>
<div id="time">
<div style="margin: 16px 0 4px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Time</label>
</div> <span class="select">
<select id="time-hour" class="select_example group" data-id="time-hour">
</select>
</span> <span class="select">
<select id="time-am-pm"class="select_example group" style="float:right; margin-right: 12px;" data-id="time-am-pm">
<option value="am">
AM
</option>
<option value="pm">
PM
</option>
</select>
</span> </div>
<div id="duration">
<div style="margin: 16px 0 4px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Duration</label>
</div>
<div style="display:flex; flex-direction: row; justify-content: space-between;"> <span class="select" style="display:flex; flex-direction: column; width: calc(50% - 20px);">
<div>
<select id="duration-hour" class="select_example duration" data-id="duration-hour">
</select>
</div>
</span> <span class="select" style="display:flex; flex-direction: column; margin-right: 12px; width: calc(50% - 20px);">
<div>
<select id="duration-min" class="select_example duration" style="" data-id="duration-min">
</select>
</div>
</span> </div>
</div>
<div style="margin:16px 12px 0px 12px;">
<button id="create_meeting" onсlick="" class="btn-text-default" style="width:100%; height: 30px;">Create a meeting</button>
</div>
<div id="settings_wrapper" style="margin-top: 16px;">
<div class="legend">
<div id="adv_settings" class="button">
<label class="label-settings" class="header" style="margin-left: 12px; cursor: pointer;">Advanced settings</label><i class="arrow down"></i></div>
</div>
<div class="settings_group">
<div id="meeting_id" style="display: flex; flex-direction: column;">
<div style="margin: 16px 0 8px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Meeting ID</label>
</div>
<div class="input_container" style="margin-bottom: 8px;">
<label class="radiobox">
<input type="radio" checked="checked" value="false" name="meeting-id" id="auto-meet-id" data-id="auto-meet-id-zoom" class="button__radiobox checked"><span>Generate Automatically</span></label>
</div>
<div class="input_container">
<label class="radiobox">
<input type="radio" name="meeting-id" value="true" id="personal-meet-id" data-id="personal-meet-id-zoom" class="button__radiobox checked"><span>Personal Meeting ID XXX XXX XXXX</span></label>
</div>
</div>
<div id="password_container">
<div style="margin: 16px 0 4px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Password</label>
</div>
<input type="text" id="password" class="form-control" placeholder="Enter meeting password here" style="width: calc(100% - 24px); margin: 0 12px 0 12px; text-align: left;"> </div>
<div id="waiting_room" class="input_container" style="margin-top: 16px;">
<input type="checkbox" style="margin-left: 12px;" class="form-control" checked="checked" id="is-waiting-room" data-id="auto-meet-id-zoom">
<label class="checkbox">Waiting Room</label>
</div>
<div id="timezone_container">
<div style="margin: 16px 0 4px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Timezone</label>
</div> <span class="select">
<select id="timezone" class="select_example" data-id="timezone-zoom">
<option value="Pacific/Midway">
(GMT-11:00) Midway Island, Samoa
</option>
<option value="Pacific/Pago_Pago">
(GMT-11:00) Pago Pago
</option>
<option value="Pacific/Honolulu">
(GMT-10:00) Hawaii
</option>
<option value="America/Anchorage">
(GMT-8:00) Alaska
</option>
<option value="America/Vancouver">
(GMT-7:00) Vancouver
</option>
<option value="America/Los_Angeles">
(GMT-7:00) Pacific Time (US and Canada)
</option>
<option value="America/Tijuana">
(GMT-7:00) Tijuana
</option>
<option value="America/Phoenix">
(GMT-7:00) Arizona
</option>
<option value="America/Edmonton">
(GMT-6:00) Edmonton
</option>
<option value="America/Denver">
(GMT-6:00) Mountain Time (US and Canada)
</option>
<option value="America/Mazatlan">
(GMT-6:00) Mazatlan
</option>
<option value="America/Regina">
(GMT-6:00) Saskatchewan
</option>
<option value="America/Guatemala">
(GMT-6:00) Guatemala
</option>
<option value="America/El_Salvador">
(GMT-6:00) El Salvador
</option>
<option value="America/Managua">
(GMT-6:00) Managua
</option>
<option value="America/Costa_Rica">
(GMT-6:00) Costa Rica
</option>
<option value="America/Tegucigalpa">
(GMT-6:00) Tegucigalpa
</option>
<option value="America/Chicago">
(GMT-5:00) Central Time (US and Canada)
</option>
<option value="America/Winnipeg">
(GMT-5:00) Winnipeg
</option>
<option value="America/Mexico_City">
(GMT-5:00) Mexico City
</option>
<option value="America/Panama">
(GMT-5:00) Panama
</option>
<option value="America/Bogota">
(GMT-5:00) Bogota
</option>
<option value="America/Lima">
(GMT-5:00) Lima
</option>
<option value="America/Montreal">
(GMT-4:00) Montreal
</option>
<option value="America/New_York">
(GMT-4:00) Eastern Time (US and Canada)
</option>
<option value="America/Indianapolis">
(GMT-4:00) Indiana (East)
</option>
<option value="America/Puerto_Rico">
(GMT-4:00) Puerto Rico
</option>
<option value="America/Caracas">
(GMT-4:00) Caracas
</option>
<option value="America/Santiago">
(GMT-4:00) Santiago
</option>
<option value="America/Halifax">
(GMT-3:00) Halifax
</option>
<option value="America/Montevideo">
(GMT-3:00) Montevideo
</option>
<option value="America/Araguaina">
(GMT-3:00) Brasilia
</option>
<option value="America/Argentina/Buenos_Aires">
(GMT-3:00) Buenos Aires, Georgetown
</option>
<option value="America/Sao_Paulo">
(GMT-3:00) Sao Paulo
</option>
<option value="Canada/Atlantic">
(GMT-3:00) Atlantic Time (Canada)
</option>
<option value="America/St_Johns">
(GMT-2:30) Newfoundland and Labrador
</option>
<option value="America/Godthab">
(GMT-2:00) Greenland
</option>
<option value="Atlantic/Cape_Verde">
(GMT-1:00) Cape Verde Islands
</option>
<option value="Atlantic/Azores">
(GMT+0:00) Azores
</option>
<option value="UTC">
(GMT+0:00) Universal Time UTC
</option>
<option value="Etc/Greenwich">
(GMT+0:00) Greenwich Mean Time
</option>
<option value="Atlantic/Reykjavik">
(GMT+0:00) Reykjavik
</option>
<option value="Africa/Casablanca">
(GMT+0:00) Casablanca
</option>
<option value="Africa/Nouakchott">
(GMT+0:00) Nouakchott
</option>
<option value="Europe/Dublin">
(GMT+1:00) Dublin
</option>
<option value="Europe/London">
(GMT+1:00) London
</option>
<option value="Europe/Lisbon">
(GMT+1:00) Lisbon
</option>
<option value="Africa/Bangui">
(GMT+1:00) West Central Africa
</option>
<option value="Africa/Algiers">
(GMT+1:00) Algiers
</option>
<option value="Africa/Tunis">
(GMT+1:00) Tunis
</option>
<option value="Europe/Belgrade">
(GMT+2:00) Belgrade, Bratislava, Ljubljana
</option>
<option value="CET">
(GMT+2:00) Sarajevo, Skopje, Zagreb
</option>
<option value="Europe/Oslo">
(GMT+2:00) Oslo
</option>
<option value="Europe/Copenhagen">
(GMT+2:00) Copenhagen
</option>
<option value="Europe/Brussels">
(GMT+2:00) Brussels
</option>
<option value="Europe/Berlin">
(GMT+2:00) Amsterdam, Berlin, Rome, Stockholm, Vienna
</option>
<option value="Europe/Amsterdam">
(GMT+2:00) Amsterdam
</option>
<option value="Europe/Rome">
(GMT+2:00) Rome
</option>
<option value="Europe/Stockholm">
(GMT+2:00) Stockholm
</option>
<option value="Europe/Vienna">
(GMT+2:00) Vienna
</option>
<option value="Europe/Luxembourg">
(GMT+2:00) Luxembourg
</option>
<option value="Europe/Paris">
(GMT+2:00) Paris
</option>
<option value="Europe/Zurich">
(GMT+2:00) GMT+2:00)Zurich
</option>
<option value="Europe/Madrid">
(GMT+2:00) Madrid
</option>
<option value="Africa/Harare">
(GMT+2:00) Harare, Pretoria
</option>
<option value="Europe/Warsaw">
(GMT+2:00) Warsaw
</option>
<option value="Europe/Prague">
(GMT+2:00) Prague Bratislava
</option>
<option value="Europe/Budapest">
(GMT+2:00) Budapest
</option>
<option value="Africa/Tripoli">
(GMT+2:00) Tripoli
</option>
<option value="Africa/Cairo">
(GMT+2:00) Cairo
</option>
<option value="Africa/Johannesburg">
(GMT+2:00) Johannesburg
</option>
<option value="Africa/Khartoum">
(GMT+2:00) Khartoum
</option>
<option value="Africa/Nairobi">
(GMT+3:00) Nairobi
</option>
<option value="Europe/Helsinki">
(GMT+3:00) Helsinki
</option>
<option value="Europe/Sofia">
(GMT+3:00) Sofia
</option>
<option value="Europe/Istanbul">
(GMT+3:00) Istanbul
</option>
<option value="Europe/Athens">
(GMT+3:00) Athens
</option>
<option value="Europe/Bucharest">
(GMT+3:00) Bucharest
</option>
<option value="Europe/Kiev">
(GMT+3:00) Kiev
</option>
<option value="Asia/Nicosia">
(GMT+3:00) Nicosia
</option>
<option value="Asia/Beirut">
(GMT+3:00) Beirut
</option>
<option value="Asia/Damascus">
(GMT+3:00) Damascus
</option>
<option value="Asia/Jerusalem">
(GMT+3:00) Jerusalem
</option>
<option value="Asia/Amman">
(GMT+3:00) Amman
</option>
<option value="Europe/Moscow">
(GMT+3:00) Moscow
</option>
<option value="Asia/Baghdad">
(GMT+3:00) Baghdad
</option>
<option value="Asia/Kuwait">
(GMT+3:00) Kuwait
</option>
<option value="Asia/Riyadh">
(GMT+3:00) Riyadh
</option>
<option value="Asia/Bahrain">
(GMT+3:00) Bahrain
</option>
<option value="Asia/Qatar">
(GMT+3:00) Qatar
</option>
<option value="Asia/Aden">
(GMT+3:00) Aden
</option>
<option value="Africa/Djibouti">
(GMT+3:00) Djibouti
</option>
<option value="Africa/Mogadishu">
(GMT+3:00) Mogadishu
</option>
<option value="Asia/Dubai">
(GMT+4:00) Dubai
</option>
<option value="Asia/Muscat">
(GMT+4:00) Muscat
</option>
<option value="Asia/Baku">
(GMT+4:00) Baku, Tbilisi, Yerevan
</option>
<option value="Asia/Tehran">
(GMT+4:30) Tehran
</option>
<option value="Asia/Kabul">
(GMT+4:30) Kabul
</option>
<option value="Asia/Yekaterinburg">
(GMT+5:00) Yekaterinburg
</option>
<option value="Asia/Tashkent">
(GMT+5:00) Islamabad, Karachi, Tashkent
</option>
<option value="Asia/Calcutta">
(GMT+5:30) India
</option>
<option value="Asia/Kolkata">
(GMT+5:30) Mumbai, Kolkata, New Delhi
</option>
<option value="Asia/Kathmandu">
(GMT+5:45) Kathmandu
</option>
<option value="Asia/Almaty">
(GMT+6:00) Almaty
</option>
<option value="Asia/Dacca">
(GMT+6:00) Dacca
</option>
<option value="Asia/Dhaka">
(GMT+6:00) Astana, Dhaka
</option>
<option value="Asia/Novosibirsk">
(GMT+7:00) Novosibirsk
</option>
<option value="Asia/Krasnoyarsk">
(GMT+7:00) Krasnoyarsk
</option>
<option value="Asia/Bangkok">
(GMT+7:00) Bangkok
</option>
<option value="Asia/Saigon">
(GMT+7:00) Vietnam
</option>
<option value="Asia/Jakarta">
(GMT+7:00) Jakarta
</option>
<option value="Asia/Irkutsk">
(GMT+8:00) Irkutsk, Ulaanbaatar
</option>
<option value="Asia/Shanghai">
(GMT+8:00) Beijing, Shanghai
</option>
<option value="Asia/Hong_Kong">
(GMT+8:00) Hong Kong
</option>
<option value="Asia/Taipei">
(GMT+8:00) Taipei
</option>
<option value="Asia/Kuala_Lumpur">
(GMT+8:00) Kuala Lumpur
</option>
<option value="Asia/Singapore">
(GMT+8:00) Singapore
</option>
<option value="Australia/Perth">
(GMT+8:00) Perth
</option>
<option value="Asia/Yakutsk">
(GMT+9:00) Yakutsk
</option>
<option value="Asia/Seoul">
(GMT+9:00) Seoul
</option>
<option value="Asia/Tokyo">
(GMT+9:00) Osaka, Sapporo, Tokyo
</option>
<option value="Australia/Darwin">
(GMT+9:30) Darwin
</option>
<option value="Australia/Adelaide">
(GMT+9:30) Adelaide
</option>
<option value="Asia/Vladivostok">
(GMT+10:00) Vladivostok
</option>
<option value="Pacific/Port_Moresby">
(GMT+10:00) Guam, Port Moresby
</option>
<option value="Australia/Brisbane">
(GMT+10:00) Brisbane
</option>
<option value="Australia/Sydney">
(GMT+10:00) Canberra, Melbourne, Sydney
</option>
<option value="Australia/Hobart">
(GMT+10:00) Hobart
</option>
<option value="Asia/Magadan">
(GMT+11:00) Magadan
</option>
<option value="SST">
(GMT+11:00) Solomon Islands
</option>
<option value="Pacific/Noumea">
(GMT+11:00) New Caledonia
</option>
<option value="Asia/Kamchatka">
(GMT+12:00) Kamchatka
</option>
<option value="Pacific/Fiji">
(GMT+12:00) Fiji Islands, Marshall Islands
</option>
<option value="Pacific/Auckland">
(GMT+12:00) Auckland, Wellington
</option>
<option value="Pacific/Apia">
(GMT+13:00) Independent State of Samoa
</option>
</select>
</span> </div>
<div id="reccurr_conference">
<div style="margin: 16px 0 4px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Recurring conference</label>
</div> <span class="select">
<select id="recurring-conf" class="select_example" data-id="recurring-conf-zoom">
<option value="never">
Never
</option>
<option value="daily">
Daily
</option>
<option value="weekly">
Weekly
</option>
<option value="monthly">
Monthly
</option>
</select>
</span> </div>
<div id="screen_demonstration" style="display: none; flex-direction: column;">
<div style="margin: 16px 0 8px 0; font-weight: normal !important;">
<label style="margin-left:12px;">Screen Demonstration</label>
</div>
<div class="input_container" style="margin-bottom: 8px;">
<label class="radiobox">
<input type="radio" checked="checked" name="screen-share" id="screen-share-for-organizer" data-id="screen-share-for-organizer-zoom" class="button__radiobox checked"><span>Organizer only</span></label>
</div>
<div class="input_container">
<label class="radiobox">
<input type="radio" name="screen-share" id="screen-share-for-all" data-id="screen-share-for-all-zoom" class="button__radiobox checked"><span>All participants</span></label>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="margin: 16px 0 16px 0;">
<div id="reconf">
<label class="reconf-label noselect" style="float: right; margin-right: 12px; cursor:pointer;">Reconfigure</label>
</div>
<div id="switch">
<label class="switch-label noselect" style="margin-left: 12px; cursor:pointer;">Meeting mode</label>
</div>
</div>
</div>
<div id="configState">
<div>
<div style="margin:12px;"> <span class="i18n">To use Zoom plugin, register this editor as a JWT app.</span> <a target="_blank" href="https://github.com/ONLYOFFICE/plugin-zoom/tree/develop#configuration" class="link i18n">Learn more here.</a> </div>
<div style="margin:12px;"> In the form, enter any application name and description, accept Terms and Conditions and generate a secret. Enter Client ID, Secret ID, JWT token below and save it. </div>
</div>
<div style="display: flex; flex-direction: column; margin: 12px;"> <span>Email</span>
<input id="emailField" autocomplete="off" class="form-control" data-id="zoom-email-value" type="text" placeholder="Email" /> </div>
<div style="display: flex; flex-direction: column; margin: 12px;"> <span>API Key</span>
<input id="apiKeyField" autocomplete="off" class="form-control" data-id="zoom-client-key" type="text" placeholder="API Key" /> </div>
<div style="display: flex; flex-direction: column; margin: 12px;"> <span>API Secret</span>
<input id="secretKeyField" autocomplete="off" class="form-control" data-id="zoom-secret-key" type="password" placeholder="API Secret" /> </div>
<div style="display: flex; flex-direction: column; margin: 12px;"> <span>JWT Token</span>
<input id="tokenKeyField" autocomplete="off" class="form-control" data-id="zoom-jwt-token" type="text" placeholder="JWT Token" /> </div>
<div id="saveConfigBtn" class="button wide control i18n">
<button class="btn-text-default" style="width:calc(100% - 24px); margin: 0 12px 0px 12px; height: 30px;">Save</button>
</div>
</div>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink