mirror of
https://github.com/ONLYOFFICE/document-server-integration.git
synced 2026-04-07 14:06:11 +08:00
288 lines
19 KiB
HTML
288 lines
19 KiB
HTML
<!--*
|
||
*
|
||
* (c) Copyright Ascensio System SIA 2020
|
||
*
|
||
* The MIT License (MIT)
|
||
*
|
||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
||
* of this software and associated documentation files (the "Software"), to deal
|
||
* in the Software without restriction, including without limitation the rights
|
||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||
* copies of the Software, and to permit persons to whom the Software is
|
||
* furnished to do so, subject to the following conditions:
|
||
*
|
||
* The above copyright notice and this permission notice shall be included in all
|
||
* copies or substantial portions of the Software.
|
||
*
|
||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||
* SOFTWARE.
|
||
*
|
||
*-->
|
||
|
||
{% load static %}
|
||
|
||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
|
||
<html>
|
||
<head>
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
<meta name="viewport" content="width=device-width" />
|
||
<title>ONLYOFFICE Document Editors</title>
|
||
<link href="{% static "images/favicon.ico" %}" rel="shortcut icon" type="image/x-icon" />
|
||
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Open+Sans:900,800,700,600,500,400,300&subset=latin,cyrillic-ext,cyrillic,latin-ext" />
|
||
<link rel="stylesheet" type="text/css" href="{% static "css/stylesheet.css" %}" />
|
||
<link rel="stylesheet" type="text/css" href="{% static "css/jquery-ui.css" %}" />
|
||
</head>
|
||
<body>
|
||
<header>
|
||
<div class="center">
|
||
<a href="">
|
||
<img src="{% static "images/logo.svg" %}" alt="ONLYOFFICE" />
|
||
</a>
|
||
</div>
|
||
</header>
|
||
<div class="center main">
|
||
<table class="table-main">
|
||
<tbody>
|
||
<tr>
|
||
<td class="left-panel section">
|
||
<div class="help-block">
|
||
<span>Create new</span>
|
||
<div class="clearFix">
|
||
<div class="create-panel clearFix">
|
||
<ul class="try-editor-list clearFix">
|
||
<li>
|
||
<a class="try-editor word reload-page" target="_blank" data-type="word">Document</a>
|
||
</li>
|
||
<li>
|
||
<a class="try-editor cell reload-page" target="_blank" data-type="cell">Spreadsheet</a>
|
||
</li>
|
||
<li>
|
||
<a class="try-editor slide reload-page" target="_blank" data-type="slide">Presentation</a>
|
||
</li>
|
||
</ul>
|
||
<label class="create-sample">
|
||
<input type="checkbox" id="createSample" class="checkbox" />With sample content
|
||
</label>
|
||
</div>
|
||
|
||
<div class="upload-panel clearFix">
|
||
<a class="file-upload">Upload file
|
||
<input type="file" id="fileupload" name="uploadedFile" data-url="upload" />
|
||
</a>
|
||
</div>
|
||
|
||
<table class="user-block-table" cellspacing="0" cellpadding="0">
|
||
<tr>
|
||
<td valign="middle">
|
||
<span class="select-user">Username</span>
|
||
<img class="info" data-id="user" data-tooltip="You can open the same document using different users in different Web browser sessions, so you can check out multi-user editing functions" src="{% static "images/info.svg" %}" />
|
||
<select class="select-user" id="user">
|
||
{% for user in users %}
|
||
<option value="{{ user.uid }}">{{ user.uname }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td valign="middle">
|
||
<span class="select-user">Language</span>
|
||
<img class="info" data-id="language" data-tooltip="Choose the language for ONLYOFFICE editors interface" src="{% static "images/info.svg" %}" />
|
||
<select class="select-user" id="language">
|
||
{% for key, val in languages.items %}
|
||
<option value="{{ key }}">{{ val }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</td>
|
||
<td class="section">
|
||
<div class="main-panel">
|
||
{% if not files %}
|
||
<span class="portal-name">ONLYOFFICE Document Editors – Welcome!</span>
|
||
<span class="portal-descr">
|
||
Get started with a demo-sample of ONLYOFFICE Document Editors, the first html5-based editors.
|
||
<br /> You may upload your own documents for testing using the "<b>Upload file</b>" button and <b>selecting</b> the necessary files on your PC.
|
||
</span>
|
||
{% else %}
|
||
<div class="stored-list">
|
||
<span class="header-list">Your documents</span>
|
||
<table class="tableHeader" cellspacing="0" cellpadding="0" width="100%">
|
||
<thead>
|
||
<tr>
|
||
<td class="tableHeaderCell tableHeaderCellFileName">Filename</td>
|
||
<td class="tableHeaderCell tableHeaderCellEditors contentCells-shift">Editors</td>
|
||
<td class="tableHeaderCell tableHeaderCellViewers">Viewers</td>
|
||
<td class="tableHeaderCell tableHeaderCellDownload">Download</td>
|
||
<td class="tableHeaderCell tableHeaderCellRemove">Remove</td>
|
||
</tr>
|
||
</thead>
|
||
</table>
|
||
<div class="scroll-table-body">
|
||
<table cellspacing="0" cellpadding="0" width="100%">
|
||
<tbody>
|
||
{% for file in files %}
|
||
<tr class="tableRow" title="{{ file.title }}">
|
||
<td class="contentCells">
|
||
<a class="stored-edit {{ file.type }}" href="edit?filename={{ file.title }}" target="_blank">
|
||
<span title="{{ file.title }}">{{ file.title }}</span>
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon">
|
||
<a href="edit?filename={{ file.title }}&type=desktop&mode=edit" target="_blank">
|
||
<img src="{% static "images/desktop-24.png" %}" alt="Open in editor for full size screens" title="Open in editor for full size screens"/>
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon">
|
||
<a href="edit?filename={{ file.title }}&type=mobile&mode=edit" target="_blank">
|
||
<img src="{% static "images/mobile-24.png" %}" alt="Open in editor for mobile devices" title="Open in editor for mobile devices"/>
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon">
|
||
{% if file.type == 'word' %}
|
||
<a href="edit?filename={{ file.title }}&type=desktop&mode=review" target="_blank">
|
||
<img src="{% static "images/review-24.png" %}" alt="Open in editor for review" title="Open in editor for review"/>
|
||
</a>
|
||
{% elif file.type == 'cell' %}
|
||
<a href="edit?filename={{ file.title }}&type=desktop&mode=filter" target="_blank">
|
||
<img src="{% static "images/filter-24.png" %}" alt="Open in editor without access to change the filter" title="Open in editor without access to change the filter" />
|
||
</a>
|
||
{% endif %}
|
||
</td>
|
||
<td class="contentCells contentCells-icon">
|
||
<a href="edit?filename={{ file.title }}&type=desktop&mode=comment" target="_blank">
|
||
<img src="{% static "images/comment-24.png" %}" alt="Open in editor for comment" title="Open in editor for comment"/>
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon">
|
||
{% if file.type == 'word' %}
|
||
<a href="edit?filename={{ file.title }}&type=desktop&mode=fillForms" target="_blank">
|
||
<img src="{% static "images/fill-forms-24.png" %}" alt="Open in editor for filling in forms" title="Open in editor for filling in forms"/>
|
||
</a>
|
||
{% endif %}
|
||
</td>
|
||
<td class="contentCells contentCells-shift contentCells-icon">
|
||
{% if file.type == 'word' %}
|
||
<a href="edit?filename={{ file.title }}&type=desktop&mode=blockcontent" target="_blank">
|
||
<img src="{% static "images/block-content-24.png" %}" alt="Open in editor without content control modification" title="Open in editor without content control modification"/>
|
||
</a>
|
||
{% endif %}
|
||
</td>
|
||
|
||
<td class="contentCells contentCells-icon">
|
||
<a href="edit?filename={{ file.title }}&type=desktop&mode=view" target="_blank">
|
||
<img src="{% static "images/desktop-24.png" %}" alt="Open in viewer for full size screens" title="Open in viewer for full size screens"/>
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon">
|
||
<a href="edit?filename={{ file.title }}&type=mobile&mode=view" target="_blank">
|
||
<img src="{% static "images/mobile-24.png" %}" alt="Open in viewer for mobile devices" title="Open in viewer for mobile devices"/>
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon contentCells-shift">
|
||
<a href="edit?filename={{ file.title }}&type=embedded&mode=embedded" target="_blank">
|
||
<img src="{% static "images/embeded-24.png" %}" alt="Open in embedded mode" title="Open in embedded mode"/>
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon contentCells-shift">
|
||
<a href="download?filename={{ file.title }}">
|
||
<img class="icon-download" src="{% static "images/download-24.png" %}" alt="Download" title="Download" />
|
||
</a>
|
||
</td>
|
||
<td class="contentCells contentCells-icon contentCells-shift">
|
||
<a class="delete-file" data-filename="{{ file.title }}">
|
||
<img class="icon-delete" src="{% static "images/delete-24.png" %}" alt="Delete" title="Delete" />
|
||
</a>
|
||
</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div id="mainProgress">
|
||
<div id="uploadSteps">
|
||
<span id="uploadFileName" class="uploadFileName"></span>
|
||
<div class="describeUpload">After these steps are completed, you can work with your document.</div>
|
||
<span id="step1" class="step">1. Loading the file.</span>
|
||
<span class="step-descr">The loading speed depends on file size and additional elements it contains.</span>
|
||
<br />
|
||
<span id="step2" class="step">2. Conversion.</span>
|
||
<span class="step-descr">The file is converted to OOXML so that you can edit it.</span>
|
||
<br />
|
||
<span id="step3" class="step">3. Loading editor scripts.</span>
|
||
<span class="step-descr">They are loaded only once, they will be cached on your computer.</span>
|
||
<input type="hidden" name="hiddenFileName" id="hiddenFileName" />
|
||
<br />
|
||
<br />
|
||
<span class="progress-descr">Note the speed of all operations depends on your connection quality and server location.</span>
|
||
<br />
|
||
<br />
|
||
<div class="error-message">
|
||
<b>Upload error: </b><span></span>
|
||
<br />
|
||
Please select another file and try again.
|
||
</div>
|
||
</div>
|
||
<br />
|
||
<div id="beginEdit" class="button disable">Edit</div>
|
||
<div id="beginView" class="button gray disable">View</div>
|
||
<div id="beginEmbedded" class="button gray disable">Embedded view</div>
|
||
<div id="cancelEdit" class="button gray">Cancel</div>
|
||
</div>
|
||
|
||
<span id="loadScripts" data-docs="{{ preloadurl }}"></span>
|
||
|
||
<footer>
|
||
<div class="center">
|
||
<table>
|
||
<tbody>
|
||
<tr>
|
||
<td>
|
||
<a href="http://api.onlyoffice.com/editors/howitworks" target="_blank">API Documentation</a>
|
||
</td>
|
||
<td>
|
||
<a href="mailto:sales@onlyoffice.com">Submit your request</a>
|
||
</td>
|
||
<td class="copy">
|
||
© Ascensio Systems SIA 2020. All rights reserved.
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</footer>
|
||
|
||
<script type="text/javascript" src="{% static "js/jquery-1.8.2.js" %}"></script>
|
||
<script type="text/javascript" src="{% static "js/jquery-ui.js" %}"></script>
|
||
<script type="text/javascript" src="{% static "js/jquery.blockUI.js" %}"></script>
|
||
<script type="text/javascript" src="{% static "js/jquery.iframe-transport.js" %}"></script>
|
||
<script type="text/javascript" src="{% static "js/jquery.fileupload.js" %}"></script>
|
||
<script type="text/javascript" src="{% static "js/jscript.js" %}"></script>
|
||
|
||
<script type="text/javascript">
|
||
var ConverExtList = {{ convExt | safe }};
|
||
var EditedExtList = {{ editExt | safe }};
|
||
var UrlConverter = "convert";
|
||
var UrlEditor = "edit";
|
||
</script>
|
||
</body>
|
||
</html>
|