Merge branch 'dev' of https://github.com/metalgvc/monstra-cms into metalgvc-dev

Conflicts:
	plugins/box/filesmanager/views/backend/index.view.php

plugins/box/filesmanager/css/style.css

@@ -0,0 +1,42 @@
+.upload-area {
+    border:2px dotted #0B85A1;
+    width:200px;
+    color:#92AAB0;
+    text-align: center;
+    padding-top:4px;
+    height: 34px;
+    display: inline-block;
+    float:left;
+    margin-left: 10px;
+}
+
+.upload-area-dragenter {
+    border: 2px solid #ff85A1 !important;
+}
+
+.upload-area-drop {
+    border: 2px dotted #0B85A1;
+}
+
+.upload-area-dragover {
+    border: 2px dotted #0B85A1;
+}
+
+.upload-progress {
+    height: 100%;
+    width: 0;
+    background-color: #0B85A1;
+    position: relative;
+    float: left;
+    max-width: 100%;
+    color: #ffffff;
+}
+
+.upload-file-info {
+    display: inline-block;
+    float: left;
+}
+
+.fileupload-controls {
+    float: left;
+}

plugins/box/filesmanager/filesmanager.admin.php

@@ -1,5 +1,9 @@
 <?php
 
+// Add Plugin Javascript
+Stylesheet::add('plugins/box/filesmanager/css/style.css', 'backend');
+Javascript::add('plugins/box/filesmanager/js/fileuploader.js', 'backend');
+
 // Add plugin navigation link
 Navigation::add(__('Files', 'filesmanager'), 'content', 'filesmanager', 3);
 
@@ -166,7 +170,10 @@ class FilesmanagerAdmin extends Backend
                 ->assign('image_types', $image_types)
                 ->assign('site_url', $site_url)
                 ->assign('files_path', $files_path)
-                ->display();
+                ->assign('fileuploader', array(
+                    'uploadUrl' => $site_url.'/admin/index.php?id=filesmanager&path='.$path,
+                    'csrf'      => Security::token()
+                ))->display();
 
     }
 

plugins/box/filesmanager/js/fileuploader.js

@@ -0,0 +1,114 @@
+if (typeof $.monstra == 'undefined') $.monstra = {};
+
+$.monstra.fileuploader = {
+    
+    conf: {
+        uploadUrl: '',
+        csrf: ''
+    },
+    
+    init: function(conf){
+        $.extend(this.conf, conf);
+        var area = $('#uploadArea');
+        area.on('dragenter', function(e){
+            e.stopPropagation();
+            e.preventDefault();
+            $(this).addClass('upload-area-dragenter');
+        });
+        area.on('dragover', function(e){
+            e.stopPropagation();
+            e.preventDefault();
+        });
+        area.on('drop', function(e){
+            $(this).removeClass('upload-area-dragenter').removeClass('upload-area-dragover').addClass('upload-area-drop');
+            e.preventDefault();
+            var files = e.originalEvent.dataTransfer.files;
+            $.monstra.fileuploader.uploadFileHandle(files, area);
+        });
+        $(document).on('dragover', function(e){
+            e.stopPropagation();
+            e.preventDefault();
+            area.removeClass('upload-area-dragenter').removeClass('upload-area-drop').addClass('upload-area-dragover');
+        });
+        $(document).on('dragenter', function(e){
+            e.stopPropagation();
+            e.preventDefault();
+        });
+        $(document).on('drop', function(e){
+            e.stopPropagation();
+            e.preventDefault();
+        });
+    },
+    
+    uploadFileHandle: function(files, area){
+        for (var i = 0; i < files.length; i++){
+            var fd = new FormData();
+            fd.append('file', files[i]);
+            fd.append('upload_file', 'upload_file');
+            fd.append('csrf', $.monstra.fileuploader.conf.csrf);
+            //this.setFileNameSize(files[i].name, files[i].size);
+            
+            this.uploadFile(fd, status);
+        }
+    },
+    
+    uploadFile: function(formData, status){
+        var jqXHR = $.ajax({
+            url: $.monstra.fileuploader.conf.uploadUrl,
+            type: 'POST',
+            contentType: false,
+            processData: false,
+            cache: false,
+            data: formData,
+            xhr: function() {
+                var xhrobj = $.ajaxSettings.xhr();
+                if (xhrobj.upload) {
+                    xhrobj.upload.addEventListener('progress', function(event) {
+                        var percent = 0;
+                        var position = event.loaded || event.position;
+                        var total = event.total;
+                        if (event.lengthComputable) {
+                            percent = Math.ceil(position / total * 100);
+                        }
+                        $.monstra.fileuploader.setProgress(percent);
+                    }, false);
+                }
+                return xhrobj;
+            },
+            success: function(data){
+                $.monstra.fileuploader.setProgress(100);
+                location.href = $.monstra.fileuploader.conf.uploadUrl;
+                /*$('#fuProgress').fadeOut('slow', function(){
+                    $('#fuProgress').css({width: 0, display: 'block'});
+                    $('#fuPlaceholder').show();
+                });*/
+            }
+        });
+    },
+    
+    setProgress: function(progress){
+        if (parseInt(progress) > 0) {
+            $('#fuPlaceholder').hide();
+        }
+        var progressBarWidth = progress * $('#uploadArea').width() / 100;  
+        $('#fuProgress').animate({ width: progressBarWidth }, 10).html(progress + "% ");
+    },
+    
+    setFileNameSize: function(fname, fsize){
+        var sizeStr = '';
+        var sizeKB = fsize / 1024;
+        if(parseInt(sizeKB) > 1024){
+            var sizeMB = sizeKB/1024;
+            sizeStr = sizeMB.toFixed(2)+' MB';
+        } else {
+            sizeStr = sizeKB.toFixed(2)+' KB';
+        }
+        
+        $('#fileInfo').html(fname +' '+ sizeStr);
+    }
+};
+
+$(document).ready(function(){
+    $.monstra.fileuploader.init($.parseJSON($('#fUploaderInit').val()));
+});
+