Add dropzone uploader.

TheReverend403 · Jul 26, 2019 · 7e13144 · 7e13144
1 parent ea51dbc
commit 7e13144
Show file tree

Hide file tree

Showing 5 changed files with 79 additions and 2 deletions.
diff --git a/app/static/css/app.css b/app/static/css/app.css
@@ -27,3 +27,20 @@
 .swg-c3po-2 {
     color: #EDA35C;
 }
+
+.dropzone {
+    border-radius: 5px;
+    background: #eee;
+    font-size: 1.2em;
+    border: 2px solid #754DAC;
+}
+.dz-preview {
+    border-radius: 5px;
+    border: 2px solid #754DAC;
+}
+
+.dz-image {
+    border-radius: 0 !important;
+    background: none !important;
+    border-bottom: 2px solid #754DAC;
+}
diff --git a/app/static/js/dropzone.js b/app/static/js/dropzone.js
@@ -0,0 +1,29 @@
+/*
+ * This file is part of pste.
+ *
+ * pste is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * pste is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with pste.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+Dropzone.options.psteUpload = {
+    paramName: "file", // The name that will be used to transfer the file
+    init: function () {
+        this.on("success", function (file, responseText) {
+            $(file.previewTemplate).append($("<a>", {
+                "target": "_blank",
+                "href": responseText.url,
+                html: "Open..."
+            }))
+        })
+    }
+};
diff --git a/app/templates/base.html b/app/templates/base.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    {% block meta %}{% endblock %}
 
     <link rel="shortcut icon" type="image/png" href="{{ url_for('static', filename='img/favicon.png') }}"/>
     <title>{{ config.APP_NAME }}{{ ' - ' + title if title else '' }}</title>
@@ -20,6 +21,11 @@
                 <a class="navbar-brand" href="{{ url_for('web.index') }}">
                     <img src="{{ url_for('static', filename='img/favicon.png') }}" width="30" height="30" alt="">
                 </a>
+                {% if current_user.is_authenticated %}
+                    <div class="nav-item">
+                        <a href="{{ url_for('auth.logout') }}">Logout</a>
+                    </div>
+                {% endif %}
             </nav>
             {% block flash_messages %}
                 {%- with messages = get_flashed_messages(with_categories=true) -%}
@@ -41,11 +47,17 @@
             {% endblock %}
             {% block content %}{% endblock %}
             <hr>
-            <a href="https://github.com/FoxDev/pste" class="text-muted" target="_blank">pste {{ config.APP_VERSION }}</a>
+            <div class="row">
+                <div class="col-sm-6">
+                    <a href="https://github.com/FoxDev/pste" class="text-muted"
+                       target="_blank">pste {{ config.APP_VERSION }}</a>
+                </div>
+            </div>
         </div>
     </div>
 </div>
 
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
 {% block scripts %}{% endblock %}
 
 </body>

diff --git a/app/templates/main/index.html b/app/templates/main/index.html
@@ -1,5 +1,20 @@
 {% extends 'base.html' %}
 
+{% block stylesheets %}
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/min/dropzone.min.css" integrity="sha256-e47xOkXs1JXFbjjpoRr1/LhVcqSzRmGmPqsrUQeVs+g=" crossorigin="anonymous"/>
+{% endblock %}
+
+{% block scripts %}
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/min/dropzone.min.js" integrity="sha256-cs4thShDfjkqFGk5s2Lxj35sgSRr4MRcyccmi0WKqCM=" crossorigin="anonymous"></script>
+    <script src="{{ url_for('static', filename='js/dropzone.js') }}"></script>
+{% endblock %}
+
 {% block content %}
-<code>curl -H "Authorization: Bearer {{ current_user.api_key }}" -F file=@/path/to/file {{ url_for('api.upload', _external=True) }}</code>
+    <div>
+        <code>curl -H "Authorization: Bearer {{ current_user.api_key }}" -F file=@/path/to/file {{ url_for('api.upload', _external=True) }}</code>
+    </div>
+    <hr>
+    <div>
+        <form action="{{ url_for('api.upload') }}" class="dropzone text-center" id="pste-upload"></form>
+    </div>
 {% endblock %}
diff --git a/app/views/auth.py b/app/views/auth.py
@@ -77,6 +77,10 @@ def register():
         flash_errors(form)
         return redirect(url_for('auth.register'))
 
+    if User.query.filter_by(email=form.email.data).first():
+        flash('Email is already in use.', 'error')
+        return redirect(url_for('auth.register'))
+
     user = User()
     user.email = form.email.data
     user.set_password(form.password.data)