Implement chunk uploading

dmoj/settings.py

@@ -244,6 +244,7 @@ INSTALLED_APPS += (
     'django_jinja',
     'chat_box',
     'newsletter',
+    'django.forms',
 )
 
 MIDDLEWARE = (
@@ -266,6 +267,8 @@ MIDDLEWARE = (
     'django.contrib.redirects.middleware.RedirectFallbackMiddleware',
 )
 
+FORM_RENDERER = 'django.forms.renderers.TemplatesSetting'
+
 IMPERSONATE_REQUIRE_SUPERUSER = True
 IMPERSONATE_DISABLE_LOGGING = True
 

dmoj/urls.py

@@ -22,7 +22,7 @@ from judge.views import TitledTemplateView, about, api, blog, comment, contests,
     notification, organization, preview, problem, problem_manage, ranked_submission, register, stats, status, submission, tasks, \
     ticket, totp, user, widgets
 from judge.views.problem_data import ProblemDataView, ProblemSubmissionDiff, \
-    problem_data_file, problem_init_view
+    problem_data_file, problem_init_view, ProblemZipUploadView
 from judge.views.register import ActivationView, RegistrationView
 from judge.views.select2 import AssigneeSelect2View, ChatUserSearchSelect2View, CommentSelect2View, \
     ContestSelect2View, ContestUserSearchSelect2View, OrganizationSelect2View, ProblemSelect2View, TicketUserSelect2View, \
@@ -132,6 +132,7 @@ urlpatterns = [
         url(r'^/test_data$', ProblemDataView.as_view(), name='problem_data'),
         url(r'^/test_data/init$', problem_init_view, name='problem_data_init'),
         url(r'^/test_data/diff$', ProblemSubmissionDiff.as_view(), name='problem_submission_diff'),
+        url(r'^/test_data/upload$', ProblemZipUploadView.as_view(), name='problem_zip_upload'),
         url(r'^/data/(?P<path>.+)$', problem_data_file, name='problem_data_file'),
 
         url(r'^/tickets$', ticket.ProblemTicketListView.as_view(), name='problem_ticket_list'),

judge/utils/fine_uploader.py

@@ -0,0 +1,87 @@
+# https://github.com/FineUploader/server-examples/blob/master/python/django-fine-uploader
+
+from django.conf import settings
+from django import forms
+from django.forms import ClearableFileInput
+
+import os, os.path
+import tempfile
+import shutil
+
+__all__ = (
+    'handle_upload', 'save_upload', 'FineUploadForm', 'FineUploadFileInput'
+)
+
+
+def combine_chunks(total_parts, total_size, source_folder, dest):
+    if not os.path.exists(os.path.dirname(dest)):
+        os.makedirs(os.path.dirname(dest))
+
+    with open(dest, 'wb+') as destination:
+        for i in range(total_parts):
+            part = os.path.join(source_folder, str(i))
+            with open(part, 'rb') as source:
+                destination.write(source.read())
+
+
+def save_upload(f, path):
+    if not os.path.exists(os.path.dirname(path)):
+        os.makedirs(os.path.dirname(path))
+    with open(path, 'wb+') as destination:
+        if hasattr(f, 'multiple_chunks') and f.multiple_chunks():
+            for chunk in f.chunks():
+                destination.write(chunk)
+        else:
+            destination.write(f.read())
+
+
+# pass callback function to post_upload
+def handle_upload(f, fileattrs, upload_dir, post_upload=None):
+    chunks_dir = os.path.join(tempfile.gettempdir(), 'chunk_upload_tmp')
+    if not os.path.exists(os.path.dirname(chunks_dir)):
+        os.makedirs(os.path.dirname(chunks_dir))
+    chunked = False
+    dest_folder = upload_dir
+    dest = os.path.join(dest_folder, fileattrs['qqfilename'])
+
+    # Chunked
+    if fileattrs.get('qqtotalparts') and int(fileattrs['qqtotalparts']) > 1:
+        chunked = True
+        dest_folder = os.path.join(chunks_dir, fileattrs['qquuid'])
+        dest = os.path.join(dest_folder, fileattrs['qqfilename'], str(fileattrs['qqpartindex']))
+    save_upload(f, dest)
+
+    # If the last chunk has been sent, combine the parts.
+    if chunked and (fileattrs['qqtotalparts'] - 1 == fileattrs['qqpartindex']):
+        combine_chunks(fileattrs['qqtotalparts'],
+            fileattrs['qqtotalfilesize'],
+            source_folder=os.path.dirname(dest),
+            dest=os.path.join(upload_dir, fileattrs['qqfilename']))
+        shutil.rmtree(os.path.dirname(os.path.dirname(dest)))
+    
+    if post_upload and (not chunked or fileattrs['qqtotalparts'] - 1 == fileattrs['qqpartindex']):
+        post_upload()
+
+
+class FineUploadForm(forms.Form):
+    qqfile = forms.FileField()
+    qquuid = forms.CharField()
+    qqfilename = forms.CharField()
+    qqpartindex = forms.IntegerField(required=False)
+    qqchunksize = forms.IntegerField(required=False)
+    qqpartbyteoffset = forms.IntegerField(required=False)
+    qqtotalfilesize = forms.IntegerField(required=False)
+    qqtotalparts = forms.IntegerField(required=False)
+
+
+class FineUploadFileInput(ClearableFileInput):
+    template_name = 'widgets/fine_uploader.html'
+    def fine_uploader_id(self, name):
+        return name + '_' + 'fine_uploader'
+
+    def get_context(self, name, value, attrs):
+        context = super().get_context(name, value, attrs)
+        context['widget'].update({
+            'fine_uploader_id': self.fine_uploader_id(name),
+        })
+        return context

judge/views/problem_data.py

@@ -2,14 +2,24 @@ import json
 import mimetypes
 import os
 from itertools import chain
+import shutil
+from tempfile import gettempdir
 from zipfile import BadZipfile, ZipFile
 
+from django import forms
+from django.conf import settings
+from django.http import HttpResponse, HttpRequest
+from django.shortcuts import render
+from django.views.decorators.csrf import csrf_exempt
+from django.views.generic import View
+
 from django.conf import settings
 from django.contrib.auth.decorators import login_required
 from django.contrib.auth.mixins import LoginRequiredMixin
+from django.core.files import File
 from django.core.exceptions import ValidationError
 from django.forms import BaseModelFormSet, HiddenInput, ModelForm, NumberInput, Select, formset_factory, FileInput
-from django.http import Http404, HttpResponse, HttpResponseRedirect
+from django.http import Http404, HttpResponse, HttpResponseRedirect, JsonResponse
 from django.shortcuts import get_object_or_404, render
 from django.urls import reverse
 from django.utils.html import escape, format_html
@@ -22,6 +32,7 @@ from judge.models import Problem, ProblemData, ProblemTestCase, Submission, prob
 from judge.utils.problem_data import ProblemDataCompiler
 from judge.utils.unicode import utf8text
 from judge.utils.views import TitleMixin
+from judge.utils.fine_uploader import combine_chunks, save_upload, handle_upload, FineUploadFileInput, FineUploadForm
 from judge.views.problem import ProblemMixin
 
 mimetypes.init()
@@ -52,6 +63,7 @@ class ProblemDataForm(ModelForm):
         model = ProblemData
         fields = ['zipfile', 'checker', 'checker_args', 'custom_checker', 'custom_validator']
         widgets = {
+            'zipfile': FineUploadFileInput,
             'checker_args': HiddenInput,
             'generator': HiddenInput,
             'output_limit': HiddenInput,
@@ -76,6 +88,7 @@ class ProblemCaseForm(ModelForm):
         }
 
 
+
 class ProblemCaseFormSet(formset_factory(ProblemCaseForm, formset=BaseModelFormSet, extra=1, max_num=1,
                                          can_delete=True)):
     model = ProblemTestCase
@@ -242,3 +255,39 @@ def problem_init_view(request, problem):
             format_html('<a href="{1}">{0}</a>', problem.name,
                         reverse('problem_detail', args=[problem.code])))),
     })
+
+
+class ProblemZipUploadView(ProblemManagerMixin, View):
+    def dispatch(self, *args, **kwargs):
+        return super(ProblemZipUploadView, self).dispatch(*args, **kwargs)
+    
+    def post(self, request, *args, **kwargs):
+        self.object = problem = self.get_object()
+        problem_data = get_object_or_404(ProblemData, problem=self.object)
+        form = FineUploadForm(request.POST, request.FILES)
+        
+        if form.is_valid():
+            fileuid = form.cleaned_data['qquuid']
+            filename = form.cleaned_data['qqfilename']
+            dest = os.path.join(gettempdir(), fileuid)
+
+            def post_upload():
+                zip_dest = os.path.join(dest, filename)
+                try:
+                    ZipFile(zip_dest).namelist() # check if this file is valid
+                    with open(zip_dest, 'rb') as f:
+                        problem_data.zipfile.delete()
+                        problem_data.zipfile.save(filename, File(f))
+                        f.close()
+                except Exception as e:
+                    raise Exception(e)
+                finally:
+                    shutil.rmtree(dest)
+                    
+            try:
+                handle_upload(request.FILES['qqfile'], form.cleaned_data, dest, post_upload=post_upload)
+            except Exception as e:
+                return JsonResponse({'success': False, 'error': str(e)})
+            return JsonResponse({'success': True})
+        else:
+            return HttpResponse(status_code=400)

resources/fine-uploader/LICENSE

@@ -0,0 +1,23 @@
+The MIT License (MIT)
+
+Copyright (c) 2010-2012, Andrew Valums
+Copyright (c) 2012-2013, Andrew Valums and Raymond S. Nicholus, III
+Copyright (c) 2013-present, Widen Enterprises, Inc.
+
+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.

resources/fine-uploader/fine-uploader-gallery.css

@@ -0,0 +1,471 @@
+/* ---------------------------------------
+/* Fine Uploader Gallery View Styles
+/* ---------------------------------------
+
+
+/* Buttons
+------------------------------------------ */
+.qq-gallery .qq-btn
+{
+    float: right;
+    border: none;
+    padding: 0;
+    margin: 0;
+    box-shadow: none;
+}
+
+/* Upload Button
+------------------------------------------ */
+.qq-gallery .qq-upload-button {
+    display: inline;
+    width: 105px;
+    padding: 7px 10px;
+    float: left;
+    text-align: center;
+    background: #00ABC7;
+    color: #FFFFFF;
+    border-radius: 2px;
+    border: 1px solid #37B7CC;
+    box-shadow: 0 1px 1px rgba(255, 255, 255, 0.37) inset,
+    1px 0 1px rgba(255, 255, 255, 0.07) inset,
+    0 1px 0 rgba(0, 0, 0, 0.36),
+    0 -2px 12px rgba(0, 0, 0, 0.08) inset
+}
+.qq-gallery .qq-upload-button-hover {
+    background: #33B6CC;
+}
+.qq-gallery .qq-upload-button-focus {
+    outline: 1px dotted #000000;
+}
+
+
+/* Drop Zone
+------------------------------------------ */
+.qq-gallery.qq-uploader {
+    position: relative;
+    min-height: 200px;
+    max-height: 490px;
+    overflow-y: hidden;
+    width: inherit;
+    border-radius: 6px;
+    border: 1px dashed #CCCCCC;
+    background-color: #FAFAFA;
+    padding: 20px;
+}
+.qq-gallery.qq-uploader:before {
+    content: attr(qq-drop-area-text) " ";
+    position: absolute;
+    font-size: 200%;
+    left: 0;
+    width: 100%;
+    text-align: center;
+    top: 45%;
+    opacity: 0.25;
+    filter: alpha(opacity=25);
+}
+.qq-gallery .qq-upload-drop-area, .qq-upload-extra-drop-area {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    min-height: 30px;
+    z-index: 2;
+    background: #F9F9F9;
+    border-radius: 4px;
+    text-align: center;
+}
+.qq-gallery .qq-upload-drop-area span {
+    display: block;
+    position: absolute;
+    top: 50%;
+    width: 100%;
+    margin-top: -8px;
+    font-size: 16px;
+}
+.qq-gallery .qq-upload-extra-drop-area {
+    position: relative;
+    margin-top: 50px;
+    font-size: 16px;
+    padding-top: 30px;
+    height: 20px;
+    min-height: 40px;
+}
+.qq-gallery .qq-upload-drop-area-active {
+    background: #FDFDFD;
+    border-radius: 4px;
+}
+.qq-gallery .qq-upload-list {
+    margin: 0;
+    padding: 10px 0 0;
+    list-style: none;
+    max-height: 450px;
+    overflow-y: auto;
+    clear: both;
+    box-shadow: none;
+}
+
+
+/* Uploaded Elements
+------------------------------------------ */
+.qq-gallery .qq-upload-list li {
+    display: inline-block;
+    position: relative;
+    max-width: 120px;
+    margin: 0 25px 25px 0;
+    padding: 0;
+    line-height: 16px;
+    font-size: 13px;
+    color: #424242;
+    background-color: #FFFFFF;
+    border-radius: 2px;
+    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.22);
+    vertical-align: top;
+
+    /* to ensure consistent size of tiles - may need to change if qq-max-size attr on preview img changes */
+    height: 186px;
+}
+
+.qq-gallery .qq-upload-spinner,
+.qq-gallery .qq-upload-size,
+.qq-gallery .qq-upload-retry,
+.qq-gallery .qq-upload-failed-text,
+.qq-gallery .qq-upload-delete,
+.qq-gallery .qq-upload-pause,
+.qq-gallery .qq-upload-continue {
+    display: inline;
+}
+.qq-gallery .qq-upload-retry:hover,
+.qq-gallery .qq-upload-delete:hover,
+.qq-gallery .qq-upload-pause:hover,
+.qq-gallery .qq-upload-continue:hover {
+    background-color: transparent;
+}
+.qq-gallery .qq-upload-delete,
+.qq-gallery .qq-upload-pause,
+.qq-gallery .qq-upload-continue,
+.qq-gallery .qq-upload-cancel {
+    cursor: pointer;
+}
+.qq-gallery .qq-upload-delete,
+.qq-gallery .qq-upload-pause,
+.qq-gallery .qq-upload-continue {
+    border:none;
+    background: none;
+    color: #00A0BA;
+    font-size: 12px;
+    padding: 0;
+}
+/* to ensure consistent size of tiles - only display status text before auto-retry or after failure */
+.qq-gallery .qq-upload-status-text {
+    color: #333333;
+    font-size: 12px;
+    padding-left: 3px;
+    padding-top: 2px;
+    width: inherit;
+    display: none;
+    width: 108px;
+}
+.qq-gallery .qq-upload-fail .qq-upload-status-text {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow-x: hidden;
+    display: block;
+}
+.qq-gallery .qq-upload-retrying .qq-upload-status-text {
+    display: inline-block;
+}
+.qq-gallery .qq-upload-retrying .qq-progress-bar-container {
+    display: none;
+}
+
+.qq-gallery .qq-upload-cancel {
+    background-color: #525252;
+    color: #F7F7F7;
+    font-weight: bold;
+    font-family: Arial, Helvetica, sans-serif;
+    border-radius: 12px;
+    border: none;
+    height: 22px;
+    width: 22px;
+    padding: 4px;
+    position: absolute;
+    right: -5px;
+    top: -6px;
+    margin: 0;
+    line-height: 17px;
+}
+.qq-gallery .qq-upload-cancel:hover {
+    background-color: #525252;
+}
+.qq-gallery .qq-upload-retry {
+    cursor: pointer;
+    position: absolute;
+    top: 30px;
+    left: 50%;
+    margin-left: -31px;
+    box-shadow: 0 1px 1px rgba(255, 255, 255, 0.37) inset,
+                1px 0 1px rgba(255, 255, 255, 0.07) inset,
+                0 4px 4px rgba(0, 0, 0, 0.5),
+                0 -2px 12px rgba(0, 0, 0, 0.08) inset;
+    padding: 3px 4px;
+    border: 1px solid #d2ddc7;
+    border-radius: 2px;
+    color: inherit;
+    background-color: #EBF6E0;
+    z-index: 1;
+}
+.qq-gallery .qq-upload-retry:hover {
+    background-color: #f7ffec;
+}
+
+.qq-gallery .qq-file-info {
+    padding: 10px 6px 4px;
+    margin-top: -3px;
+    border-radius: 0 0 2px 2px;
+    text-align: left;
+    overflow: hidden;
+}
+
+.qq-gallery .qq-file-info .qq-file-name {
+    position: relative;
+}
+
+.qq-gallery .qq-upload-file {
+    display: block;
+    margin-right: 0;
+    margin-bottom: 3px;
+    width: auto;
+
+    /* to ensure consistent size of tiles - constrain text to single line */
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow-x: hidden;
+}
+.qq-gallery .qq-upload-spinner {
+    display: inline-block;
+    background: url("loading.gif");
+    position: absolute;
+    left: 50%;
+    margin-left: -7px;
+    top: 53px;
+    width: 15px;
+    height: 15px;
+    vertical-align: text-bottom;
+}
+.qq-gallery .qq-drop-processing {
+    display: block;
+}
+.qq-gallery .qq-drop-processing-spinner {
+    display: inline-block;
+    background: url("processing.gif");
+    width: 24px;
+    height: 24px;
+    vertical-align: text-bottom;
+}
+.qq-gallery .qq-upload-failed-text {
+    display: none;
+    font-style: italic;
+    font-weight: bold;
+}
+.qq-gallery .qq-upload-failed-icon {
+    display:none;
+    width:15px;
+    height:15px;
+    vertical-align:text-bottom;
+}
+.qq-gallery .qq-upload-fail .qq-upload-failed-text {
+    display: inline;
+}
+.qq-gallery .qq-upload-retrying .qq-upload-failed-text {
+    display: inline;
+}
+.qq-gallery .qq-upload-list li.qq-upload-success {
+    background-color: #F2F7ED;
+}
+.qq-gallery .qq-upload-list li.qq-upload-fail {
+    background-color: #F5EDED;
+    box-shadow: 0 0 1px 0 red;
+    border: 0;
+}
+.qq-gallery .qq-progress-bar {
+    display: block;
+    background: #00abc7;
+    width: 0%;
+    height: 15px;
+    border-radius: 6px;
+    margin-bottom: 3px;
+}
+
+.qq-gallery .qq-total-progress-bar {
+    height: 25px;
+    border-radius: 9px;
+}
+
+.qq-gallery .qq-total-progress-bar-container {
+    margin-left: 9px;
+    display: inline;
+    float: right;
+    width: 500px;
+}
+
+.qq-gallery .qq-upload-size {
+    float: left;
+    font-size: 11px;
+    color: #929292;
+    margin-bottom: 3px;
+    margin-right: 0;
+    display: inline-block;
+}
+
+.qq-gallery INPUT.qq-edit-filename {
+    position: absolute;
+    opacity: 0;
+    filter: alpha(opacity=0);
+    z-index: -1;
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+}
+
+.qq-gallery .qq-upload-file.qq-editable {
+    cursor: pointer;
+    margin-right: 20px;
+}
+
+.qq-gallery .qq-edit-filename-icon.qq-editable {
+    display: inline-block;
+    cursor: pointer;
+    position: absolute;
+    right: 0;
+    top: 0;
+}
+
+.qq-gallery INPUT.qq-edit-filename.qq-editing {
+    position: static;
+    height: 28px;
+    width: 90px;
+    width: -moz-available;
+    padding: 0 8px;
+    margin-bottom: 3px;
+    border: 1px solid #ccc;
+    border-radius: 2px;
+    font-size: 13px;
+
+    opacity: 1;
+    filter: alpha(opacity=100);
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+}
+
+.qq-gallery .qq-edit-filename-icon {
+    display: none;
+    background: url("edit.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: text-bottom;
+}
+.qq-gallery .qq-delete-icon {
+    background: url("trash.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: sub;
+    display: inline-block;
+}
+.qq-gallery .qq-retry-icon {
+    background: url("retry.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: sub;
+    display: inline-block;
+    float: none;
+}
+.qq-gallery .qq-continue-icon {
+    background: url("continue.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: sub;
+    display: inline-block;
+}
+.qq-gallery .qq-pause-icon {
+    background: url("pause.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: sub;
+    display: inline-block;
+}
+
+.qq-gallery .qq-hide {
+    display: none;
+}
+
+
+/* Thumbnail
+------------------------------------------ */
+.qq-gallery .qq-in-progress .qq-thumbnail-wrapper {
+    /* makes the spinner on top of the thumbnail more visible */
+    opacity: 0.5;
+    filter: alpha(opacity=50);
+}
+.qq-gallery .qq-thumbnail-wrapper {
+    overflow: hidden;
+    position: relative;
+
+    /* to ensure consistent size of tiles - should match qq-max-size attribute value on qq-thumbnail-selector IMG element */
+    height: 120px;
+    width: 120px;
+}
+.qq-gallery .qq-thumbnail-selector {
+    border-radius: 2px 2px 0 0;
+    bottom: 0;
+
+    /* we will override this in the :root thumbnail selector (to help center the preview) for everything other than IE8 */
+    top: 0;
+
+    /* center the thumb horizontally in the tile */
+    margin:auto;
+    display: block;
+}
+
+/* hack to ensure we don't try to center preview in IE8, since -ms-filter doesn't mimic translateY as expected in all cases */
+:root *> .qq-gallery .qq-thumbnail-selector {
+    /* vertically center preview image on tile */
+    position: relative;
+    top: 50%;
+    transform: translateY(-50%);
+    -moz-transform: translateY(-50%);
+    -ms-transform: translateY(-50%);
+    -webkit-transform: translateY(-50%);
+}
+
+/* <dialog> element styles */
+.qq-gallery.qq-uploader DIALOG {
+    display: none;
+}
+
+.qq-gallery.qq-uploader DIALOG[open] {
+    display: block;
+}
+
+.qq-gallery.qq-uploader DIALOG {
+    display: none;
+}
+
+.qq-gallery.qq-uploader DIALOG[open] {
+    display: block;
+}
+
+.qq-gallery.qq-uploader DIALOG .qq-dialog-buttons {
+    text-align: center;
+    padding-top: 10px;
+}
+
+.qq-gallery.qq-uploader DIALOG .qq-dialog-buttons BUTTON {
+    margin-left: 5px;
+    margin-right: 5px;
+}
+
+.qq-gallery.qq-uploader DIALOG .qq-dialog-message-selector {
+    padding-bottom: 10px;
+}
+
+.qq-gallery .qq-uploader DIALOG::backdrop {
+    background-color: rgba(0, 0, 0, 0.7);
+}

resources/fine-uploader/fine-uploader-gallery.min.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["_build/fine-uploader-gallery.css"],"names":[],"mappings":"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"}

resources/fine-uploader/fine-uploader-new.css

@@ -0,0 +1,354 @@
+/* ---------------------------------------
+/* Fine Uploader Styles
+/* ---------------------------------------
+
+/* Buttons
+------------------------------------------ */
+.qq-btn
+{
+    box-shadow: 0 1px 1px rgba(255, 255, 255, 0.37) inset,
+                1px 0 1px rgba(255, 255, 255, 0.07) inset,
+                0 1px 0 rgba(0, 0, 0, 0.36),
+                0 -2px 12px rgba(0, 0, 0, 0.08) inset;
+    padding: 3px 4px;
+    border: 1px solid #CCCCCC;
+    border-radius: 2px;
+    color: inherit;
+    background-color: #FFFFFF;
+}
+.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
+    display: inline;
+}
+.qq-upload-delete
+{
+    background-color: #e65c47;
+    color: #FAFAFA;
+    border-color: #dc523d;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.55);
+}
+.qq-upload-delete:hover {
+    background-color: #f56b56;
+ }
+.qq-upload-cancel
+{
+    background-color: #F5D7D7;
+    border-color: #e6c8c8;
+}
+.qq-upload-cancel:hover {
+    background-color: #ffe1e1;
+}
+.qq-upload-retry
+{
+    background-color: #EBF6E0;
+    border-color: #d2ddc7;
+}
+.qq-upload-retry:hover {
+    background-color: #f7ffec;
+}
+.qq-upload-pause, .qq-upload-continue {
+    background-color: #00ABC7;
+    color: #FAFAFA;
+    border-color: #2dadc2;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.55);
+}
+.qq-upload-pause:hover, .qq-upload-continue:hover {
+    background-color: #0fbad6;
+}
+
+/* Upload Button
+------------------------------------------ */
+.qq-upload-button {
+    display: inline;
+    width: 105px;
+    margin-bottom: 10px;
+    padding: 7px 10px;
+    text-align: center;
+    float: left;
+    background: #00ABC7;
+    color: #FFFFFF;
+    border-radius: 2px;
+    border: 1px solid #2dadc2;
+    box-shadow: 0 1px 1px rgba(255, 255, 255, 0.37) inset,
+                1px 0 1px rgba(255, 255, 255, 0.07) inset,
+                0 1px 0 rgba(0, 0, 0, 0.36),
+                0 -2px 12px rgba(0, 0, 0, 0.08) inset;
+}
+.qq-upload-button-hover {
+    background: #33B6CC;
+}
+.qq-upload-button-focus {
+    outline: 1px dotted #000000;
+}
+
+
+/* Drop Zone
+------------------------------------------ */
+.qq-uploader {
+    position: relative;
+    min-height: 200px;
+    max-height: 490px;
+    overflow-y: hidden;
+    width: inherit;
+    border-radius: 6px;
+    background-color: #FDFDFD;
+    border: 1px dashed #CCCCCC;
+    padding: 20px;
+}
+.qq-uploader:before {
+    content: attr(qq-drop-area-text) " ";
+    position: absolute;
+    font-size: 200%;
+    left: 0;
+    width: 100%;
+    text-align: center;
+    top: 45%;
+    opacity: 0.25;
+}
+.qq-upload-drop-area, .qq-upload-extra-drop-area {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    min-height: 30px;
+    z-index: 2;
+    background: #F9F9F9;
+    border-radius: 4px;
+    border: 1px dashed #CCCCCC;
+    text-align: center;
+}
+.qq-upload-drop-area span {
+    display: block;
+    position: absolute;
+    top: 50%;
+    width: 100%;
+    margin-top: -8px;
+    font-size: 16px;
+}
+.qq-upload-extra-drop-area {
+    position: relative;
+    margin-top: 50px;
+    font-size: 16px;
+    padding-top: 30px;
+    height: 20px;
+    min-height: 40px;
+}
+.qq-upload-drop-area-active {
+    background: #FDFDFD;
+    border-radius: 4px;
+    border: 1px dashed #CCCCCC;
+}
+.qq-upload-list {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    max-height: 450px;
+    overflow-y: auto;
+    box-shadow: 0px 1px 0px rgba(15, 15, 50, 0.14);
+    clear: both;
+}
+
+
+/* Uploaded Elements
+------------------------------------------ */
+.qq-upload-list li {
+    margin: 0;
+    padding: 9px;
+    line-height: 15px;
+    font-size: 16px;
+    color: #424242;
+    background-color: #F6F6F6;
+    border-top: 1px solid #FFFFFF;
+    border-bottom: 1px solid #DDDDDD;
+}
+.qq-upload-list li:first-child {
+    border-top: none;
+}
+.qq-upload-list li:last-child {
+    border-bottom: none;
+}
+
+.qq-upload-file, .qq-upload-spinner, .qq-upload-size,
+.qq-upload-cancel, .qq-upload-retry, .qq-upload-failed-text,
+.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
+    margin-right: 12px;
+    display: inline;
+}
+.qq-upload-file {
+    vertical-align: middle;
+    display: inline-block;
+    width: 300px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow-x: hidden;
+    height: 18px;
+}
+.qq-upload-spinner {
+    display: inline-block;
+    background: url("loading.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: text-bottom;
+}
+.qq-drop-processing {
+    display: block;
+}
+.qq-drop-processing-spinner {
+    display: inline-block;
+    background: url("processing.gif");
+    width: 24px;
+    height: 24px;
+    vertical-align: text-bottom;
+}
+.qq-upload-size, .qq-upload-cancel, .qq-upload-retry,
+.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
+    font-size: 12px;
+    font-weight: normal;
+    cursor: pointer;
+    vertical-align: middle;
+}
+.qq-upload-status-text {
+    font-size: 14px;
+    font-weight: bold;
+    display: block;
+}
+.qq-upload-failed-text {
+    display: none;
+    font-style: italic;
+    font-weight: bold;
+}
+.qq-upload-failed-icon {
+    display:none;
+    width:15px;
+    height:15px;
+    vertical-align:text-bottom;
+}
+.qq-upload-fail .qq-upload-failed-text {
+    display: inline;
+}
+.qq-upload-retrying .qq-upload-failed-text {
+    display: inline;
+}
+.qq-upload-list li.qq-upload-success {
+    background-color: #EBF6E0;
+    color: #424242;
+    border-bottom: 1px solid #D3DED1;
+    border-top: 1px solid #F7FFF5;
+}
+.qq-upload-list li.qq-upload-fail {
+    background-color: #F5D7D7;
+    color: #424242;
+    border-bottom: 1px solid #DECACA;
+    border-top: 1px solid #FCE6E6;
+}
+.qq-progress-bar {
+    display: block;
+    display: block;
+    background: #00abc7;
+    width: 0%;
+    height: 15px;
+    border-radius: 6px;
+    margin-bottom: 3px;
+}
+
+.qq-total-progress-bar {
+    height: 25px;
+    border-radius: 9px;
+}
+
+.qq-total-progress-bar-container {
+    margin-left: 9px;
+    display: inline;
+    float: right;
+    width: 500px;
+}
+
+INPUT.qq-edit-filename {
+    position: absolute;
+    opacity: 0;
+    filter: alpha(opacity=0);
+    z-index: -1;
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+}
+
+.qq-upload-file.qq-editable {
+    cursor: pointer;
+    margin-right: 4px;
+}
+
+.qq-edit-filename-icon.qq-editable {
+    display: inline-block;
+    cursor: pointer;
+}
+
+INPUT.qq-edit-filename.qq-editing {
+    position: static;
+    height: 28px;
+    padding: 0 8px;
+    margin-right: 10px;
+    margin-bottom: -5px;
+    border: 1px solid #ccc;
+    border-radius: 2px;
+    font-size: 16px;
+
+    opacity: 1;
+    filter: alpha(opacity=100);
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+}
+
+.qq-edit-filename-icon {
+    display: none;
+    background: url("edit.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: text-bottom;
+    margin-right: 16px;
+}
+
+.qq-hide {
+    display: none;
+}
+
+
+/* Thumbnail
+------------------------------------------ */
+.qq-thumbnail-selector {
+    vertical-align: middle;
+    margin-right: 12px;
+}
+
+
+/* <dialog> element styles */
+.qq-uploader DIALOG {
+    display: none;
+}
+
+.qq-uploader DIALOG[open] {
+    display: block;
+}
+
+.qq-uploader DIALOG {
+    display: none;
+}
+
+.qq-uploader DIALOG[open] {
+    display: block;
+}
+
+.qq-uploader DIALOG .qq-dialog-buttons {
+    text-align: center;
+    padding-top: 10px;
+}
+
+.qq-uploader DIALOG .qq-dialog-buttons BUTTON {
+    margin-left: 5px;
+    margin-right: 5px;
+}
+
+.qq-uploader DIALOG .qq-dialog-message-selector {
+    padding-bottom: 10px;
+}
+
+.qq-uploader DIALOG::backdrop {
+    background-color: rgba(0, 0, 0, 0.7);
+}

resources/fine-uploader/fine-uploader-new.min.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["_build/fine-uploader-new.css"],"names":[],"mappings":"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"}

resources/fine-uploader/fine-uploader.css

@@ -0,0 +1,225 @@
+.qq-uploader {
+    position: relative;
+    width: 100%;
+}
+.qq-upload-button {
+    display: block;
+    width: 105px;
+    padding: 7px 0;
+    text-align: center;
+    background: #880000;
+    border-bottom: 1px solid #DDD;
+    color: #FFF;
+}
+.qq-upload-button-hover {
+    background: #CC0000;
+}
+.qq-upload-button-focus {
+    outline: 1px dotted #000000;
+}
+.qq-upload-drop-area, .qq-upload-extra-drop-area {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    min-height: 30px;
+    z-index: 2;
+    background: #FF9797;
+    text-align: center;
+}
+.qq-upload-drop-area span {
+    display: block;
+    position: absolute;
+    top: 50%;
+    width: 100%;
+    margin-top: -8px;
+    font-size: 16px;
+}
+.qq-upload-extra-drop-area {
+    position: relative;
+    margin-top: 50px;
+    font-size: 16px;
+    padding-top: 30px;
+    height: 20px;
+    min-height: 40px;
+}
+.qq-upload-drop-area-active {
+    background: #FF7171;
+}
+.qq-upload-list {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+}
+.qq-upload-list li {
+    margin: 0;
+    padding: 9px;
+    line-height: 15px;
+    font-size: 16px;
+    background-color: #FFF0BD;
+}
+.qq-upload-file, .qq-upload-spinner, .qq-upload-size,
+.qq-upload-cancel, .qq-upload-retry, .qq-upload-failed-text,
+.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
+    margin-right: 12px;
+    display: inline;
+}
+.qq-upload-file {
+}
+.qq-upload-spinner {
+    display: inline-block;
+    background: url("loading.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: text-bottom;
+}
+.qq-drop-processing {
+    display: block;
+}
+.qq-drop-processing-spinner {
+    display: inline-block;
+    background: url("processing.gif");
+    width: 24px;
+    height: 24px;
+    vertical-align: text-bottom;
+}
+
+.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
+    display: inline;
+}
+
+.qq-upload-retry, .qq-upload-delete, .qq-upload-cancel,
+.qq-upload-pause, .qq-upload-continue {
+    color: #000000;
+}
+
+.qq-upload-size, .qq-upload-cancel, .qq-upload-retry,
+.qq-upload-delete, .qq-upload-pause, .qq-upload-continue {
+    font-size: 12px;
+    font-weight: normal;
+}
+.qq-upload-failed-text {
+    display: none;
+    font-style: italic;
+    font-weight: bold;
+}
+.qq-upload-failed-icon {
+    display:none;
+    width:15px;
+    height:15px;
+    vertical-align:text-bottom;
+}
+.qq-upload-fail .qq-upload-failed-text {
+    display: inline;
+}
+.qq-upload-retrying .qq-upload-failed-text {
+    display: inline;
+    color: #D60000;
+}
+.qq-upload-list li.qq-upload-success {
+    background-color: #5DA30C;
+    color: #FFFFFF;
+}
+.qq-upload-list li.qq-upload-fail {
+    background-color: #D60000;
+    color: #FFFFFF;
+}
+.qq-progress-bar {
+    display: block;
+    background: -moz-linear-gradient(top,  rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6+ */
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(125,185,232,1))); /* Chrome,Safari4+ */
+    background: -webkit-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10+,Safari5.1+ */
+    background: -o-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Opera 11.10+ */
+    background: -ms-linear-gradient(top,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* IE10+ */
+    background: linear-gradient(to bottom,  rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C */
+    width: 0%;
+    height: 15px;
+    border-radius: 6px;
+    margin-bottom: 3px;
+}
+
+.qq-total-progress-bar {
+    height: 25px;
+    border-radius: 9px;
+}
+
+.qq-total-progress-bar-container {
+    margin: 9px;
+}
+
+INPUT.qq-edit-filename {
+    position: absolute;
+    opacity: 0;
+    filter: alpha(opacity=0);
+    z-index: -1;
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+}
+
+.qq-upload-file.qq-editable {
+    cursor: pointer;
+}
+
+.qq-edit-filename-icon.qq-editable {
+    display: inline-block;
+    cursor: pointer;
+}
+
+INPUT.qq-edit-filename.qq-editing {
+    position: static;
+    margin-top: -5px;
+    margin-right: 10px;
+    margin-bottom: -5px;
+
+    opacity: 1;
+    filter: alpha(opacity=100);
+    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+}
+
+.qq-edit-filename-icon {
+    display: none;
+    background: url("edit.gif");
+    width: 15px;
+    height: 15px;
+    vertical-align: text-bottom;
+    margin-right: 5px;
+}
+
+.qq-hide {
+    display: none;
+}
+
+/* <dialog> element styles */
+.qq-uploader DIALOG {
+    display: none;
+}
+
+.qq-uploader DIALOG[open] {
+    display: block;
+}
+
+.qq-uploader DIALOG {
+    display: none;
+}
+
+.qq-uploader DIALOG[open] {
+    display: block;
+}
+
+.qq-uploader DIALOG .qq-dialog-buttons {
+    text-align: center;
+    padding-top: 10px;
+}
+
+.qq-uploader DIALOG .qq-dialog-buttons BUTTON {
+    margin-left: 5px;
+    margin-right: 5px;
+}
+
+.qq-uploader DIALOG .qq-dialog-message-selector {
+    padding-bottom: 10px;
+}
+
+.qq-uploader DIALOG::backdrop {
+    background-color: rgba(0, 0, 0, 0.7);
+}

resources/fine-uploader/fine-uploader.min.css

@@ -0,0 +1 @@
+.qq-uploader{position:relative;width:100%}.qq-upload-button{display:block;width:105px;padding:7px 0;text-align:center;background:#800;border-bottom:1px solid #ddd;color:#fff}.qq-upload-button-hover{background:#c00}.qq-upload-button-focus{outline:1px dotted #000}.qq-upload-drop-area,.qq-upload-extra-drop-area{position:absolute;top:0;left:0;width:100%;height:100%;min-height:30px;z-index:2;background:#ff9797;text-align:center}.qq-upload-drop-area span{display:block;position:absolute;top:50%;width:100%;margin-top:-8px;font-size:16px}.qq-upload-extra-drop-area{position:relative;margin-top:50px;font-size:16px;padding-top:30px;height:20px;min-height:40px}.qq-upload-drop-area-active{background:#ff7171}.qq-upload-list{margin:0;padding:0;list-style:none}.qq-upload-list li{margin:0;padding:9px;line-height:15px;font-size:16px;background-color:#fff0bd}.qq-upload-cancel,.qq-upload-continue,.qq-upload-delete,.qq-upload-failed-text,.qq-upload-file,.qq-upload-pause,.qq-upload-retry,.qq-upload-size,.qq-upload-spinner{margin-right:12px;display:inline}.qq-upload-spinner{display:inline-block;background:url(loading.gif);width:15px;height:15px;vertical-align:text-bottom}.qq-drop-processing{display:block}.qq-drop-processing-spinner{display:inline-block;background:url(processing.gif);width:24px;height:24px;vertical-align:text-bottom}.qq-upload-continue,.qq-upload-delete,.qq-upload-pause{display:inline}.qq-upload-cancel,.qq-upload-continue,.qq-upload-delete,.qq-upload-pause,.qq-upload-retry{color:#000}.qq-upload-cancel,.qq-upload-continue,.qq-upload-delete,.qq-upload-pause,.qq-upload-retry,.qq-upload-size{font-size:12px;font-weight:400}.qq-upload-failed-text{display:none;font-style:italic;font-weight:700}.qq-upload-failed-icon{display:none;width:15px;height:15px;vertical-align:text-bottom}.qq-upload-fail .qq-upload-failed-text{display:inline}.qq-upload-retrying .qq-upload-failed-text{display:inline;color:#d60000}.qq-upload-list li.qq-upload-success{background-color:#5da30c;color:#fff}.qq-upload-list li.qq-upload-fail{background-color:#d60000;color:#fff}.qq-progress-bar{display:block;background:-moz-linear-gradient(top,rgba(30,87,153,1) 0,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(30,87,153,1)),color-stop(50%,rgba(41,137,216,1)),color-stop(51%,rgba(32,124,202,1)),color-stop(100%,rgba(125,185,232,1)));background:-webkit-linear-gradient(top,rgba(30,87,153,1) 0,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);background:-o-linear-gradient(top,rgba(30,87,153,1) 0,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);background:-ms-linear-gradient(top,rgba(30,87,153,1) 0,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);background:linear-gradient(to bottom,rgba(30,87,153,1) 0,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);width:0;height:15px;border-radius:6px;margin-bottom:3px}.qq-total-progress-bar{height:25px;border-radius:9px}.qq-total-progress-bar-container{margin:9px}INPUT.qq-edit-filename{position:absolute;opacity:0;z-index:-1}.qq-upload-file.qq-editable{cursor:pointer}.qq-edit-filename-icon.qq-editable{display:inline-block;cursor:pointer}INPUT.qq-edit-filename.qq-editing{position:static;margin-top:-5px;margin-right:10px;margin-bottom:-5px;opacity:1}.qq-edit-filename-icon{display:none;background:url(edit.gif);width:15px;height:15px;vertical-align:text-bottom;margin-right:5px}.qq-hide{display:none}.qq-uploader DIALOG{display:none}.qq-uploader DIALOG[open]{display:block}.qq-uploader DIALOG{display:none}.qq-uploader DIALOG[open]{display:block}.qq-uploader DIALOG .qq-dialog-buttons{text-align:center;padding-top:10px}.qq-uploader DIALOG .qq-dialog-buttons BUTTON{margin-left:5px;margin-right:5px}.qq-uploader DIALOG .qq-dialog-message-selector{padding-bottom:10px}.qq-uploader DIALOG::backdrop{background-color:rgba(0,0,0,.7)}/*# sourceMappingURL=fine-uploader.min.css.map */

resources/fine-uploader/fine-uploader.min.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["_build/fine-uploader.css"],"names":[],"mappings":"AAAA,aACI,SAAU,SACV,MAAO,KAEX,kBACI,QAAS,MACT,MAAO,MACP,QAAS,IAAI,EACb,WAAY,OACZ,WAAY,KACZ,cAAe,IAAI,MAAM,KACzB,MAAO,KAEX,wBACI,WAAY,KAEhB,wBACI,QAAS,IAAI,OAAO,KAExB,qBAAsB,2BAClB,SAAU,SACV,IAAK,EACL,KAAM,EACN,MAAO,KACP,OAAQ,KACR,WAAY,KACZ,QAAS,EACT,WAAY,QACZ,WAAY,OAEhB,0BACI,QAAS,MACT,SAAU,SACV,IAAK,IACL,MAAO,KACP,WAAY,KACZ,UAAW,KAEf,2BACI,SAAU,SACV,WAAY,KACZ,UAAW,KACX,YAAa,KACb,OAAQ,KACR,WAAY,KAEhB,4BACI,WAAY,QAEhB,gBACI,OAAQ,EACR,QAAS,EACT,WAAY,KAEhB,mBACI,OAAQ,EACR,QAAS,IACT,YAAa,KACb,UAAW,KACX,iBAAkB,QAGtB,kBACqC,oBAArC,kBADqC,uBADrC,gBAEmB,iBADA,iBADkB,gBAApB,mBAGb,aAAc,KACd,QAAS,OAIb,mBACI,QAAS,aACT,WAAY,iBACZ,MAAO,KACP,OAAQ,KACR,eAAgB,YAEpB,oBACI,QAAS,MAEb,4BACI,QAAS,aACT,WAAY,oBACZ,MAAO,KACP,OAAQ,KACR,eAAgB,YAGiB,oBAArC,kBAAmB,iBACf,QAAS,OAGwB,kBACnB,oBADA,kBAClB,iBADA,iBAEI,MAAO,KAGM,kBACoB,oBAArC,kBAAmB,iBADiB,iBAApC,gBAEI,UAAW,KACX,YAAa,IAEjB,uBACI,QAAS,KACT,WAAY,OACZ,YAAa,IAEjB,uBACI,QAAQ,KACR,MAAM,KACN,OAAO,KACP,eAAe,YAEnB,uCACI,QAAS,OAEb,2CACI,QAAS,OACT,MAAO,QAEX,qCACI,iBAAkB,QAClB,MAAO,KAEX,kCACI,iBAAkB,QAClB,MAAO,KAEX,iBACI,QAAS,MACT,WAAY,qHACZ,WAAY,yLACZ,WAAY,wHACZ,WAAY,mHACZ,WAAY,oHACZ,WAAY,sHACZ,MAAO,EACP,OAAQ,KACR,cAAe,IACf,cAAe,IAGnB,uBACI,OAAQ,KACR,cAAe,IAGnB,iCACI,OAAQ,IAGZ,uBACI,SAAU,SACV,QAAS,EAET,QAAS,GAIb,4BACI,OAAQ,QAGZ,mCACI,QAAS,aACT,OAAQ,QAGZ,kCACI,SAAU,OACV,WAAY,KACZ,aAAc,KACd,cAAe,KAEf,QAAS,EAKb,uBACI,QAAS,KACT,WAAY,cACZ,MAAO,KACP,OAAQ,KACR,eAAgB,YAChB,aAAc,IAGlB,SACI,QAAS,KAIb,oBACI,QAAS,KAGb,0BACI,QAAS,MAGb,oBACI,QAAS,KAGb,0BACI,QAAS,MAGb,uCACI,WAAY,OACZ,YAAa,KAGjB,8CACI,YAAa,IACb,aAAc,IAGlB,gDACI,eAAgB,KAGpB,8BACI,iBAAkB"}

resources/fine-uploader/templates/default.html

@@ -0,0 +1,62 @@
+<!--
+    This is a legacy template and is not meant to be used in new Fine Uploader integrated projects.
+    Read the "Getting Started Guide" at http://docs.fineuploader.com/quickstart/01-getting-started.html
+    if you are not yet familiar with Fine Uploader UI.
+-->
+<script type="text/template" id="qq-template">
+    <div class="qq-uploader-selector qq-uploader" qq-drop-area-text="Drop files here">
+        <div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container">
+            <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-total-progress-bar-selector qq-progress-bar qq-total-progress-bar"></div>
+        </div>
+        <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
+            <span class="qq-upload-drop-area-text-selector"></span>
+        </div>
+        <div class="qq-upload-button-selector qq-upload-button">
+            <div>Upload a file</div>
+        </div>
+            <span class="qq-drop-processing-selector qq-drop-processing">
+                <span>Processing dropped files...</span>
+                <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
+            </span>
+        <ul class="qq-upload-list-selector qq-upload-list" aria-live="polite" aria-relevant="additions removals">
+            <li>
+                <div class="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"></div>
+                </div>
+                <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
+                <span class="qq-upload-file-selector qq-upload-file"></span>
+                <span class="qq-edit-filename-icon-selector qq-edit-filename-icon" aria-label="Edit filename"></span>
+                <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
+                <span class="qq-upload-size-selector qq-upload-size"></span>
+                <button type="button" class="qq-btn qq-upload-cancel-selector qq-upload-cancel">Cancel</button>
+                <button type="button" class="qq-btn qq-upload-retry-selector qq-upload-retry">Retry</button>
+                <button type="button" class="qq-btn qq-upload-delete-selector qq-upload-delete">Delete</button>
+                <span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
+            </li>
+        </ul>
+
+        <dialog class="qq-alert-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">Close</button>
+            </div>
+        </dialog>
+
+        <dialog class="qq-confirm-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">No</button>
+                <button type="button" class="qq-ok-button-selector">Yes</button>
+            </div>
+        </dialog>
+
+        <dialog class="qq-prompt-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <input type="text">
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">Cancel</button>
+                <button type="button" class="qq-ok-button-selector">Ok</button>
+            </div>
+        </dialog>
+    </div>
+</script>

resources/fine-uploader/templates/gallery.html

@@ -0,0 +1,82 @@
+<!--
+    Read the "Getting Started Guide" at http://docs.fineuploader.com/quickstart/01-getting-started.html
+    if you are not yet familiar with Fine Uploader UI.
+    Please see http://docs.fineuploader.com/features/styling.html for information
+    on how to customize this template.
+-->
+<script type="text/template" id="qq-template">
+    <div class="qq-uploader-selector qq-uploader qq-gallery" qq-drop-area-text="Drop files here">
+        <div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container">
+            <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-total-progress-bar-selector qq-progress-bar qq-total-progress-bar"></div>
+        </div>
+        <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
+            <span class="qq-upload-drop-area-text-selector"></span>
+        </div>
+        <div class="qq-upload-button-selector qq-upload-button">
+            <div>Upload a file</div>
+        </div>
+        <span class="qq-drop-processing-selector qq-drop-processing">
+            <span>Processing dropped files...</span>
+            <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
+        </span>
+        <ul class="qq-upload-list-selector qq-upload-list" role="region" aria-live="polite" aria-relevant="additions removals">
+            <li>
+                <span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
+                <div class="qq-progress-bar-container-selector qq-progress-bar-container">
+                    <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-progress-bar-selector qq-progress-bar"></div>
+                </div>
+                <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
+                <div class="qq-thumbnail-wrapper">
+                    <img class="qq-thumbnail-selector" qq-max-size="120" qq-server-scale>
+                </div>
+                <button type="button" class="qq-upload-cancel-selector qq-upload-cancel">X</button>
+                <button type="button" class="qq-upload-retry-selector qq-upload-retry">
+                    <span class="qq-btn qq-retry-icon" aria-label="Retry"></span>
+                    Retry
+                </button>
+
+                <div class="qq-file-info">
+                    <div class="qq-file-name">
+                        <span class="qq-upload-file-selector qq-upload-file"></span>
+                        <span class="qq-edit-filename-icon-selector qq-btn qq-edit-filename-icon" aria-label="Edit filename"></span>
+                    </div>
+                    <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
+                    <span class="qq-upload-size-selector qq-upload-size"></span>
+                    <button type="button" class="qq-btn qq-upload-delete-selector qq-upload-delete">
+                        <span class="qq-btn qq-delete-icon" aria-label="Delete"></span>
+                    </button>
+                    <button type="button" class="qq-btn qq-upload-pause-selector qq-upload-pause">
+                        <span class="qq-btn qq-pause-icon" aria-label="Pause"></span>
+                    </button>
+                    <button type="button" class="qq-btn qq-upload-continue-selector qq-upload-continue">
+                        <span class="qq-btn qq-continue-icon" aria-label="Continue"></span>
+                    </button>
+                </div>
+            </li>
+        </ul>
+
+        <dialog class="qq-alert-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">Close</button>
+            </div>
+        </dialog>
+
+        <dialog class="qq-confirm-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">No</button>
+                <button type="button" class="qq-ok-button-selector">Yes</button>
+            </div>
+        </dialog>
+
+        <dialog class="qq-prompt-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <input type="text">
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">Cancel</button>
+                <button type="button" class="qq-ok-button-selector">Ok</button>
+            </div>
+        </dialog>
+    </div>
+</script>

resources/fine-uploader/templates/simple-thumbnails.html

@@ -0,0 +1,64 @@
+<!--
+    Read the "Getting Started Guide" at http://docs.fineuploader.com/quickstart/01-getting-started.html
+    if you are not yet familiar with Fine Uploader UI.
+    Please see http://docs.fineuploader.com/features/styling.html for information
+    on how to customize this template.
+-->
+<script type="text/template" id="qq-simple-thumbnails-template">
+    <div class="qq-uploader-selector qq-uploader" qq-drop-area-text="Drop files here">
+        <div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container">
+            <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-total-progress-bar-selector qq-progress-bar qq-total-progress-bar"></div>
+        </div>
+        <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
+            <span class="qq-upload-drop-area-text-selector"></span>
+        </div>
+        <div class="qq-upload-button-selector qq-upload-button">
+            <div>Upload a file</div>
+        </div>
+        <span class="qq-drop-processing-selector qq-drop-processing">
+            <span>Processing dropped files...</span>
+            <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
+        </span>
+        <ul class="qq-upload-list-selector qq-upload-list" aria-live="polite" aria-relevant="additions removals">
+            <li>
+                <div class="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"></div>
+                </div>
+                <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
+                <img class="qq-thumbnail-selector" qq-max-size="100" qq-server-scale>
+                <span class="qq-upload-file-selector qq-upload-file"></span>
+                <span class="qq-edit-filename-icon-selector qq-edit-filename-icon" aria-label="Edit filename"></span>
+                <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
+                <span class="qq-upload-size-selector qq-upload-size"></span>
+                <button type="button" class="qq-btn qq-upload-cancel-selector qq-upload-cancel">Cancel</button>
+                <button type="button" class="qq-btn qq-upload-retry-selector qq-upload-retry">Retry</button>
+                <button type="button" class="qq-btn qq-upload-delete-selector qq-upload-delete">Delete</button>
+                <span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
+            </li>
+        </ul>
+
+        <dialog class="qq-alert-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">Close</button>
+            </div>
+        </dialog>
+
+        <dialog class="qq-confirm-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">No</button>
+                <button type="button" class="qq-ok-button-selector">Yes</button>
+            </div>
+        </dialog>
+
+        <dialog class="qq-prompt-dialog-selector">
+            <div class="qq-dialog-message-selector"></div>
+            <input type="text">
+            <div class="qq-dialog-buttons">
+                <button type="button" class="qq-cancel-button-selector">Cancel</button>
+                <button type="button" class="qq-ok-button-selector">Ok</button>
+            </div>
+        </dialog>
+    </div>
+</script>

templates/fine_uploader/script.html

@@ -0,0 +1,32 @@
+<script type="text/template" id="qq-template">
+    <div class="qq-uploader-selector qq-uploader">
+        <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
+            <span>{{_('Drop files here to upload')}}</span>
+        </div>
+        <div class="qq-upload-button-selector qq-upload-button">
+            <div>{{_('Upload file')}}</div>
+        </div>
+        <span class="qq-drop-processing-selector qq-drop-processing">
+            <span>Processing dropped files...</span>
+            <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
+        </span>
+        <ul class="qq-upload-list-selector qq-upload-list">
+            <li>
+                <div class="qq-progress-bar-container-selector">
+                    <div class="qq-progress-bar-selector qq-progress-bar"></div>
+                </div>
+                <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
+                <span class="qq-edit-filename-icon-selector qq-edit-filename-icon"></span>
+                <span class="qq-upload-file-selector qq-upload-file"></span>
+                <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
+                <span class="qq-upload-size-selector qq-upload-size"></span>
+                <a class="qq-upload-cancel-selector qq-upload-cancel" href="#">{{_('Cancel')}}</a>
+                <a class="qq-upload-retry-selector qq-upload-retry" href="#">{{_('Retry')}}</a>
+                <a class="qq-upload-delete-selector qq-upload-delete" href="#">{{_('Delete')}}</a>
+                <button class="qq-upload-pause-selector qq-upload-pause">{{_('Pause')}}</button>
+                <button class="qq-upload-continue-selector qq-upload-continue">{{_('Continue')}}</button>
+                <span class="qq-upload-status-text-selector qq-upload-status-text"></span>
+            </li>
+        </ul>
+    </div>
+</script>

templates/problem/data.html

@@ -3,14 +3,38 @@
 {% block js_media %}
     <script type="text/javascript">
         window.valid_files = {{valid_files_json}};
-
+        window.big_input = (window.valid_files.length > 100);
-        $(function () {
-        });
     </script>
     <script type="text/javascript" src="{{ static('jquery-ui.min.js') }}"></script>
     <script type="text/javascript" src="{{ static('libs/featherlight/featherlight.min.js') }}"></script>
+    <script type="text/javascript" src="{{ static('fine-uploader/jquery.fine-uploader.js') }}"></script>
     <script type="text/javascript">
         $(function () {
+            $("#problem-data-zipfile_fine_uploader").fineUploader({
+                    request: {
+                        endpoint: "{{url('problem_zip_upload', problem.code)}}",
+                        params: {
+                            'csrfmiddlewaretoken': '{{ csrf_token }}'
+                        }
+                    },
+                    chunking: {
+                        enabled: true,
+                        partSize: 40000000,
+                    },
+                    resume: {
+                        enabled: true
+                    },
+                    validation: {
+                        allowedExtensions: ['zip'],
+                    },
+                }).on('complete', function (event, id, name, responseJSON) {
+                    console.log(responseJSON);
+                    if (!responseJSON.success) {
+                        alert('Fail to upload: ' + responseJSON.error);
+                    }
+                    else window.location.reload();
+                });;
+
             function update_select2() {
                 $('tbody:not(.extra-row-body) .type-column select').select2({
                     minimumResultsForSearch: -1
@@ -20,6 +44,7 @@
             update_select2();
 
             function autofill_if_exists($select, file) {
+                console.log(1);
                 if (!$select.val() && ~window.valid_files.indexOf(file))
                     $select.val(file).trigger('change');
             }
@@ -34,7 +59,7 @@
                         style: 'width: 100%'
                     })).val();
                     $select.select2({
-                        data: window.valid_files,
+                        data: window.big_input ? [val] : window.valid_files,
                         allowClear: true,
                         placeholder: ''
                     }).val(val).trigger('change').on('change', function () {
@@ -269,16 +294,25 @@
                 inFiles.sort();
                 outFiles.sort();
 
+                // big number of input
+                if (inFiles.length > 100) {
+                    window.big_input = true;
+                }
+
                 // add boxes
                 while ($total.val() < inFiles.length) {
                     $('a#add-case-row').click();
                 }
                 // fill cases
                 for (var i = 0; i < inFiles.length; i++) {
-                    $("#id_cases-" + i + "-input_file").val(inFiles[i]).change();
+                    var $select = $("#id_cases-" + i + "-input_file");
+                    $select.select2('destroy').empty().select2({ data: [inFiles[i]] });
+                    $select.val(inFiles[i]).change();
                 }
                 for (var i = 0; i < outFiles.length; i++) {
-                    $("#id_cases-" + i + "-output_file").val(outFiles[i]).change();
+                    var $select = $("#id_cases-" + i + "-output_file");
+                    $select.select2('destroy').empty().select2({ data: [outFiles[i]] });
+                    $select.val(outFiles[i]).change();
                 }
 
                 // add points
@@ -336,9 +370,11 @@
 
         }).change();
     </script>
+    {% include 'fine_uploader/script.html' %}
 {% endblock %}
 
 {% block media %}
+    <link href="{{ static ('fine-uploader/fine-uploader.css') }}" rel="stylesheet">
     <style>
         #case-table .select2 {
             text-align: initial;

templates/widgets/fine_uploader.html

@@ -0,0 +1,4 @@
+{% if widget.is_initial %}
+{{ widget.initial_text }}: <a href="{{ widget.value.url }}">{{ widget.value }}</a>
+{% endif %}
+<center id={{widget.fine_uploader_id}} class="fine-uploader"></center>