delete view

diff --git a/qcg/templates/qcg/base.html b/qcg/templates/qcg/base.html
index 9f38b0c..8318ed3 100644 (file)
--- a/qcg/templates/qcg/base.html
+++ b/qcg/templates/qcg/base.html
@@ -103,15 +103,18 @@
         {% endblock container %}
     </div><!-- /.container -->
 
-    <footer class="navbar navbar-default navbar-fixed-bottom">
-        <div class="container">
-            <div class="row">
-                <p class="navbar-text text-center" style="float: none">
-                    Copyright &copy; 2015, <a href="http://www.man.poznan.pl" class="navbar-link">PCSS</a>
-                </p>
+    {% block footer %}
+        <footer class="navbar navbar-default navbar-fixed-bottom">
+            <div class="container">
+                <div class="row">
+                    <p class="navbar-text text-center" style="float: none">
+                        Copyright &copy; 2015, <a href="http://www.man.poznan.pl" class="navbar-link">PCSS</a>
+                    </p>
+                </div>
             </div>
-        </div>
-    </footer>
+        </footer>
+    {% endblock footer %}
+
     {% endblock body %}
 
     <script src="{% static 'qcg/jquery/jquery.min.js' %}"></script>

diff --git a/qcg/templates/qcg/gridftp.html b/qcg/templates/qcg/gridftp.html
index 490c66e..d0e77c1 100644 (file)
--- a/qcg/templates/qcg/gridftp.html
+++ b/qcg/templates/qcg/gridftp.html
@@ -6,38 +6,140 @@
 {% endblock %}
 
 {% block extra_js %}
+    <script src="{% static 'qcg/cookie/jquery.cookie.min.js' %}"></script>
+    <script src="{% static 'qcg/globals.js' %}"></script>
     {% include 'filex/source.js.html' %}
 
     <script>
         $(function () {
-            $('#upload').click(function(e) {
-                e.preventDefault();
+            var statusTimeout;
 
-                var url = this.href + '?' + $.param({host: filex.host, path: filex.path.full() + '/'});
+            $('#btn-upload').on('click', function() {
+                var url = '{% url 'gridftp_upload' %}?' + $.param({host: filex.host, path: filex.path.full() + '/'});
 
                 var win = window.open(url, url, 'height=500,width=800');
                 win.focus();
             });
+
+            $('#btn-delete').on('click', function() {
+                var selected = _.groupBy(filex.selectedFiles(), function(item) { return item.get('type') }),
+                    dirs = _.map(selected.directory || [], function (item) { return item.get('name') }),
+                    files = _.map(selected.file || [], function (item) { return item.get('name') }),
+                    data = {
+                        host: filex.host,
+                        path: filex.path.full() + '/',
+                        dirs: dirs,
+                        files: files
+                    },
+                    $confirmModal = $('#confirm-modal'),
+                    $confirmList = $confirmModal.find('ul').html('');
+
+                _.each(filex.selectedFiles(), function(item) {
+                    $('<li>', {text: item.get('name')}).appendTo($confirmList);
+                });
+
+                $('#btn-confirm').off().on('click', function() {
+                    filex.busy();
+
+                    $.post('{% url 'filex:delete' %}', data, function(response) {
+                        var keys = Object.keys(response.fail);
+
+                        if (keys.length) {
+                            var $errorModal = $('#error-modal'),
+                                $errorList = $errorModal.find('dl').html('');
+
+                            for (var i in keys) {
+                                $('<dt>', {text: keys[i]}).appendTo($errorList);
+                                $('<dd>', {text: response.fail[keys[i]]}).appendTo($errorList);
+                            }
+
+                            $errorModal.modal();
+                            filex.idle();
+                        }
+                        else {
+                            clearTimeout(statusTimeout);
+                            statusTimeout = setTimeout(function() {
+                                $('#status').text('');
+                            }, 3000);
+
+                            $('#status').text('Usuwanie zakończone pomyślnie');
+                        }
+
+                        if (response.done.length)
+                            filex.reloadFiles();
+
+                    }, 'json');
+
+                    $confirmModal.modal('hide');
+                });
+
+                $confirmModal.modal();
+            });
         })
     </script>
 {% endblock extra_js %}
 
-{% block container %}
-    <h1 class="page-header">{% block title %}Zarządzanie plikami GridFTP{% endblock %}</h1>
+{% block title %}Zarządzanie plikami GridFTP{% endblock %}
 
+{% block container %}
     {% include 'filex/source.html' %}
 
-    <div class="well well-sm">
-        <div class="btn-toolbar" role="toolbar">
-            <div class="btn-group" role="group">
-                <a id="upload" href="{% url 'gridftp_upload' %}" class="btn btn-default" target="_blank">Wgraj plik</a>
-                <button class="btn btn-default">Utwórz katalog</button>
-            </div>
-            <div class="btn-group" role="group">
-                <button class="btn btn-default disabled">Zmień nazwę</button>
-                <button class="btn btn-default disabled">Usuń</button>
+    <div id="confirm-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="confirm-modal-label" aria-hidden="true">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                        <span aria-hidden="true">&times;</span>
+                    </button>
+                    <h4 class="modal-title" id="confirm-modal-label">Usuwanie plików</h4>
+                </div>
+                <div class="modal-body">
+                    <h4>Czy na pewno usunąć następujące elementy?</h4>
+                    <ul></ul>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-default" data-dismiss="modal">Anuluj</button>
+                    <button id="btn-confirm" type="button" class="btn btn-primary">OK</button>
+                </div>
             </div>
         </div>
     </div>
 
+    <div id="error-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="error-modal-label" aria-hidden="true">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                        <span aria-hidden="true">&times;</span>
+                    </button>
+                    <h4 class="modal-title" id="error-modal-label">Błąd</h4>
+                </div>
+                <div class="modal-body">
+                    <h4>Wystąpiły problemy podczas usuwania:</h4>
+                    <dl class="dl-horizontal"></dl>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-primary" data-dismiss="modal">OK</button>
+                </div>
+            </div>
+        </div>
+    </div>
 {% endblock container %}
+
+{% block footer %}
+    <footer class="navbar navbar-default navbar-fixed-bottom" style="position:fixed">
+        <div class="container">
+            <div class="btn-toolbar" role="toolbar" style="float: left">
+                <div class="btn-group" role="group">
+                    <button id="btn-upload" class="btn btn-default navbar-btn">Wgraj plik</button>
+                    <button class="btn btn-default navbar-btn">Utwórz katalog</button>
+                </div>
+                <div class="btn-group" role="group">
+                    <button class="btn btn-default navbar-btn disabled">Zmień nazwę</button>
+                    <button id="btn-delete" class="btn btn-default navbar-btn">Usuń</button>
+                </div>
+            </div>
+            <p id="status" class="navbar-text"></p>
+        </div>
+    </footer>
+{% endblock footer %}