mirror of
https://github.com/overleaf/overleaf.git
synced 2025-04-07 14:32:16 +00:00
Merge branch 'sk-update-fineuploader'
This commit is contained in:
Shane Kilkelly
commit
8b5115ff03
7 changed files with 7427 additions and 3703 deletions
|
|
@ -164,5 +164,3 @@ block requirejs
|
|||
data-ace-base=buildJsPath(lib('ace'), {fingerprint:false}),
|
||||
src=buildJsPath('libs/require.js')
|
||||
)
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -333,6 +333,7 @@ script(type='text/ng-template', id='newDocModalTemplate')
|
|||
span(ng-hide="state.inflight") #{translate("create")}
|
||||
span(ng-show="state.inflight") #{translate("creating")}...
|
||||
|
||||
|
||||
script(type='text/ng-template', id='newFolderModalTemplate')
|
||||
.modal-header
|
||||
h3 #{translate("new_folder")}
|
||||
|
|
@ -363,6 +364,34 @@ script(type='text/ng-template', id='newFolderModalTemplate')
|
|||
span(ng-hide="state.inflight") #{translate("create")}
|
||||
span(ng-show="state.inflight") #{translate("creating")}...
|
||||
|
||||
|
||||
script(type="text/template", id="qq-file-uploader-template")
|
||||
div.qq-uploader-selector
|
||||
div(qq-hide-dropzone="").qq-upload-drop-area-selector.qq-upload-drop-area
|
||||
span.qq-upload-drop-area-text-selector #{translate('drop_files_here_to_upload')}
|
||||
div.qq-upload-button-selector.btn.btn-primary.btn-lg
|
||||
div #{translate('upload')}
|
||||
span.or.btn-lg #{translate('or')}
|
||||
span.drag-here.btn-lg #{translate('drag_here')}
|
||||
span.qq-drop-processing-selector
|
||||
span #{translate('processing')}
|
||||
span.qq-drop-processing-spinner-selector
|
||||
ul.qq-upload-list-selector
|
||||
li
|
||||
div.qq-progress-bar-container-selector
|
||||
div(
|
||||
role="progressbar"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
class="qq-progress-bar-selector qq-progress-bar"
|
||||
)
|
||||
span.qq-upload-file-selector.qq-upload-file
|
||||
span.qq-upload-size-selector.qq-upload-size
|
||||
a(type="button").qq-btn.qq-upload-cancel-selector.qq-upload-cancel #{translate('cancel')}
|
||||
button(type="button").qq-btn.qq-upload-retry-selector.qq-upload-retry #{translate('retry')}
|
||||
span(role="status").qq-upload-status-text-selector.qq-upload-status-text
|
||||
|
||||
script(type="text/ng-template", id="uploadFileModalTemplate")
|
||||
.modal-header
|
||||
h3 #{translate("upload_files")}
|
||||
|
|
@ -384,11 +413,7 @@ script(type="text/ng-template", id="uploadFileModalTemplate")
|
|||
.modal-body(
|
||||
fine-upload
|
||||
endpoint="/project/{{ project_id }}/upload"
|
||||
waiting-for-response-text="{{inserting_files}}"
|
||||
failed-upload-text="{{upload_failed_sorry}}"
|
||||
upload-button-text="{{select_files}}"
|
||||
drag-area-text="{{drag_files}}"
|
||||
hint-text="{{hint_press_and_hold_control_key}}"
|
||||
template-id="qq-file-uploader-template"
|
||||
multiple="true"
|
||||
auto-upload="false"
|
||||
on-complete-callback="onComplete"
|
||||
|
|
@ -400,10 +425,10 @@ script(type="text/ng-template", id="uploadFileModalTemplate")
|
|||
control="control"
|
||||
params="{'folder_id': parent_folder_id}"
|
||||
)
|
||||
span #{translate("upload_files")}
|
||||
.modal-footer
|
||||
button.btn.btn-default(ng-click="cancel()") #{translate("cancel")}
|
||||
|
||||
|
||||
script(type='text/ng-template', id='deleteEntityModalTemplate')
|
||||
.modal-header
|
||||
h3 #{translate("delete")} {{ entity.name }}
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ block content
|
|||
script#data(type="application/json").
|
||||
!{JSON.stringify({ projects: projects, tags: tags, notifications: notifications }).replace(/\//g, '\\/')}
|
||||
|
||||
|
||||
script(type="text/javascript").
|
||||
window.data = JSON.parse($("#data").text());
|
||||
window.algolia = {
|
||||
|
|
|
|||
|
|
@ -213,6 +213,33 @@ script(type='text/ng-template', id='deleteProjectsModalTemplate')
|
|||
ng-click="delete()"
|
||||
) #{translate("confirm")}
|
||||
|
||||
script(type="text/template", id="qq-project-uploader-template")
|
||||
div.qq-uploader-selector
|
||||
div(qq-hide-dropzone="").qq-upload-drop-area-selector.qq-upload-drop-area
|
||||
span.qq-upload-drop-area-text-selector #{translate('drop_files_here_to_upload')}
|
||||
div.qq-upload-button-selector.btn.btn-primary.btn-lg
|
||||
div #{translate('select_a_zip_file')}
|
||||
span.or.btn-lg #{translate('or')}
|
||||
span.drag-here.btn-lg #{translate('drag_a_zip_file')}
|
||||
span.qq-drop-processing-selector
|
||||
span #{translate('creating_project')}
|
||||
span.qq-drop-processing-spinner-selector
|
||||
ul.qq-upload-list-selector
|
||||
li
|
||||
div.qq-progress-bar-container-selector
|
||||
div(
|
||||
role="progressbar"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
class="qq-progress-bar-selector qq-progress-bar"
|
||||
)
|
||||
span.qq-upload-file-selector.qq-upload-file
|
||||
span.qq-upload-size-selector.qq-upload-size
|
||||
a(type="button").qq-btn.qq-upload-cancel-selector.qq-upload-cancel #{translate('cancel')}
|
||||
button(type="button").qq-btn.qq-upload-retry-selector.qq-upload-retry #{translate('retry')}
|
||||
span(role="status").qq-upload-status-text-selector.qq-upload-status-text
|
||||
|
||||
script(type="text/ng-template", id="uploadProjectModalTemplate")
|
||||
.modal-header
|
||||
button.close(
|
||||
|
|
@ -224,15 +251,11 @@ script(type="text/ng-template", id="uploadProjectModalTemplate")
|
|||
.modal-body(
|
||||
fine-upload
|
||||
endpoint="/project/new/upload"
|
||||
waiting-for-response-text="Creating project..."
|
||||
failed-upload-text="Upload failed. Is it a valid zip file?"
|
||||
upload-button-text="Select a .zip file"
|
||||
drag-area-text="drag .zip file"
|
||||
template-id="qq-project-uploader-template"
|
||||
multiple="false"
|
||||
allowed-extensions="['zip']"
|
||||
on-complete-callback="onComplete"
|
||||
)
|
||||
span #{translate("upload_a_zipped_project")}
|
||||
.modal-footer
|
||||
button.btn.btn-default(ng-click="cancel()") #{translate("cancel")}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,16 +1,13 @@
|
|||
define [
|
||||
"base"
|
||||
], (App) ->
|
||||
"libs/fineuploader"
|
||||
], (App, qq) ->
|
||||
App.directive 'fineUpload', ($timeout) ->
|
||||
return {
|
||||
scope: {
|
||||
multiple: "="
|
||||
endpoint: "@"
|
||||
waitingForResponseText: "@"
|
||||
failedUploadText: "@"
|
||||
uploadButtonText: "@"
|
||||
dragAreaText: "@"
|
||||
hintText: "@"
|
||||
templateId: "@"
|
||||
allowedExtensions: "="
|
||||
onCompleteCallback: "="
|
||||
onUploadCallback: "="
|
||||
|
|
@ -25,17 +22,12 @@ define [
|
|||
link: (scope, element, attrs) ->
|
||||
multiple = scope.multiple or false
|
||||
endpoint = scope.endpoint
|
||||
templateId = scope.templateId
|
||||
if scope.allowedExtensions?
|
||||
validation =
|
||||
validation =
|
||||
allowedExtensions: scope.allowedExtensions
|
||||
else
|
||||
validation = {}
|
||||
text =
|
||||
waitingForResponse: scope.waitingForResponseText or "Processing..."
|
||||
failUpload: scope.failedUploadText or "Failed :("
|
||||
uploadButton: scope.uploadButtonText or "Upload"
|
||||
dragAreaText = scope.dragAreaText or "drag here"
|
||||
hintText = scope.hintText or ""
|
||||
maxConnections = scope.maxConnections or 1
|
||||
onComplete = scope.onCompleteCallback or () ->
|
||||
onUpload = scope.onUploadCallback or () ->
|
||||
|
|
@ -69,21 +61,8 @@ define [
|
|||
onError: onError
|
||||
onSubmit: onSubmit
|
||||
onCancel: onCancel
|
||||
text: text
|
||||
template: """
|
||||
<div class="qq-uploader">
|
||||
<div class="qq-upload-drop-area"><span>{dragZoneText}</span></div>
|
||||
<div class="qq-upload-button btn btn-primary btn-lg">
|
||||
<div>{uploadButtonText}</div>
|
||||
</div>
|
||||
<span class="or btn-lg"> or </span>
|
||||
<span class="drag-here btn-lg">#{dragAreaText}</span>
|
||||
<span class="qq-drop-processing"><span>{dropProcessingText}</span><span class="qq-drop-processing-spinner"></span></span>
|
||||
<div class="small">#{hintText}</div>
|
||||
<ul class="qq-upload-list"></ul>
|
||||
</div>
|
||||
"""
|
||||
template: templateId
|
||||
window.q = q
|
||||
scope.control?.q = q
|
||||
return q
|
||||
}
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
|
|
@ -4,11 +4,11 @@
|
|||
*
|
||||
* Licensed under MIT license, GNU GPL 2 or later, GNU LGPL 2 or later, see license.txt.
|
||||
*/
|
||||
.qq-uploader {
|
||||
.qq-uploader-selector {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
.qq-uploader {
|
||||
.qq-uploader-selector {
|
||||
text-align: center;
|
||||
.drag-here {
|
||||
border: 1px dashed #666;
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
/*.qq-upload-button {
|
||||
/*.qq-upload-button-selector {
|
||||
display: block;
|
||||
width: 105px;
|
||||
padding: 7px 0;
|
||||
|
|
@ -27,13 +27,13 @@
|
|||
border-bottom: 1px solid #DDD;
|
||||
color: #FFF;
|
||||
}
|
||||
.qq-upload-button-hover {
|
||||
.qq-upload-button-hover-selector {
|
||||
background: #CC0000;
|
||||
}
|
||||
.qq-upload-button-focus {
|
||||
.qq-upload-button-focus-selector {
|
||||
outline: 1px dotted #000000;
|
||||
}*/
|
||||
.qq-upload-drop-area, .qq-upload-extra-drop-area {
|
||||
.qq-upload-drop-area-selector, .qq-upload-extra-drop-area-selector {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
background: @orange;
|
||||
text-align: center;
|
||||
}
|
||||
.qq-upload-drop-area span {
|
||||
.qq-upload-drop-area-selector span {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
font-size: 16px;
|
||||
color: white;
|
||||
}
|
||||
.qq-upload-extra-drop-area {
|
||||
.qq-upload-extra-drop-area-selector {
|
||||
position: relative;
|
||||
margin-top: 50px;
|
||||
font-size: 16px;
|
||||
|
|
@ -61,15 +61,15 @@
|
|||
height: 20px;
|
||||
min-height: 40px;
|
||||
}
|
||||
.qq-upload-drop-area-active {
|
||||
.qq-upload-drop-area-active-selector {
|
||||
background: darken(@orange, 15%);
|
||||
}
|
||||
.qq-upload-list {
|
||||
.qq-upload-list-selector {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.qq-upload-list li {
|
||||
.qq-upload-list-selector li {
|
||||
margin: 0;
|
||||
margin-top: 10px;
|
||||
padding: 9px;
|
||||
|
|
@ -77,74 +77,74 @@
|
|||
font-size: 16px;
|
||||
background-color: @gray-lightest;
|
||||
}
|
||||
.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-retry, .qq-upload-failed-text, .qq-upload-finished, .qq-upload-delete {
|
||||
.qq-upload-file-selector, .qq-upload-spinner-selector, .qq-upload-size-selector, .qq-upload-cancel-selector, .qq-upload-retry-selector, .qq-upload-failed-text-selector, .qq-upload-finished-selector, .qq-upload-delete-selector {
|
||||
margin-right: 12px;
|
||||
}
|
||||
.qq-upload-file {
|
||||
.qq-upload-file-selector {
|
||||
}
|
||||
.qq-upload-spinner {
|
||||
.qq-upload-spinner-selector {
|
||||
display: inline-block;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
.qq-drop-processing {
|
||||
.qq-drop-processing-selector {
|
||||
display: none;
|
||||
}
|
||||
.qq-drop-processing-spinner {
|
||||
.qq-drop-processing-spinner-selector {
|
||||
display: inline-block;
|
||||
background: url("processing.gif");
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
.qq-upload-finished {
|
||||
.qq-upload-finished-selector {
|
||||
display:none;
|
||||
width:15px;
|
||||
height:15px;
|
||||
vertical-align:text-bottom;
|
||||
}
|
||||
.qq-upload-retry, .qq-upload-delete {
|
||||
.qq-upload-retry-selector, .qq-upload-delete-selector {
|
||||
display: none;
|
||||
// color: #000000;
|
||||
}
|
||||
.qq-upload-cancel, .qq-upload-delete {
|
||||
.qq-upload-cancel-selector, .qq-upload-delete-selector {
|
||||
// color: #000000;
|
||||
}
|
||||
.qq-upload-retryable .qq-upload-retry {
|
||||
.qq-upload-retryable-selector .qq-upload-retry-selector {
|
||||
display: inline;
|
||||
}
|
||||
.qq-upload-size, .qq-upload-cancel, .qq-upload-retry, .qq-upload-delete {
|
||||
.qq-upload-size-selector, .qq-upload-cancel-selector, .qq-upload-retry-selector, .qq-upload-delete-selector {
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.qq-upload-failed-text {
|
||||
.qq-upload-failed-text-selector {
|
||||
display: none;
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
}
|
||||
.qq-upload-failed-icon {
|
||||
.qq-upload-failed-icon-selector {
|
||||
display:none;
|
||||
width:15px;
|
||||
height:15px;
|
||||
vertical-align:text-bottom;
|
||||
}
|
||||
.qq-upload-fail .qq-upload-failed-text {
|
||||
.qq-upload-fail-selector .qq-upload-failed-text-selector {
|
||||
display: inline;
|
||||
}
|
||||
.qq-upload-retrying .qq-upload-failed-text {
|
||||
.qq-upload-retrying-selector .qq-upload-failed-text-selector {
|
||||
display: inline;
|
||||
color: #D60000;
|
||||
}
|
||||
.qq-upload-list li.qq-upload-success {
|
||||
.qq-upload-list-selector li.qq-upload-success-selector {
|
||||
background-color: @green;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.qq-upload-list li.qq-upload-fail {
|
||||
.qq-upload-list-selector li.qq-upload-fail-selector {
|
||||
background-color: @red;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.qq-progress-bar {
|
||||
.qq-progress-bar-selector {
|
||||
width: 0%;
|
||||
height: @line-height-computed;
|
||||
margin-bottom: @line-height-computed / 2;
|
||||
|
|
@ -156,5 +156,9 @@
|
|||
.box-shadow(inset 0 -1px 0 rgba(0,0,0,.15));
|
||||
.transition(width .6s ease);
|
||||
border-radius: @border-radius-base 0 0 @border-radius-base;
|
||||
display: none;
|
||||
}
|
||||
a.qq-btn {
|
||||
&:hover {
|
||||
cursor: pointer !important;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue