/**
 * CmsTextManager File upload class
 *
 * @author Aivars Žukovskis <info@brsystems.lv>
 * @category CmsTextManager
 */
var FileUpload = (function() {

    function FileUpload(jqObj, d, maxFiles) {
        var _this = this;

        if(d) _this.oD = d;
        _this.jqModuleObj = $.isDefined(jqObj) ? jqObj : $(".form-data");

        _this.lMaxFilesInContainer = (maxFiles ? maxFiles : 1);

        _this.bindEvents();
    }
    FileUpload.prototype = {
        lMaxFilesInContainer : 1,
        jqModuleObj : {},
        oD : {}
    };

    FileUpload.prototype.bindEvents = function(){
        var _this = this;

        // Set up file upload;
        _this.setupFileUpload();

        _this.loadFile(_this.oD.cnt_files, _this.jqModuleObj.find("#cnt_files"));
        _this.loadImg(_this.oD.img, _this.jqModuleObj.find("#cnt_img"));


        _this.addNewImageNode(_this.jqModuleObj.find("#cnt_files"), false, true);
        _this.addNewImageNode(_this.jqModuleObj.find("#cnt_img"), false);


        var p = $("div.cnt_file_url");
        var pInput = p.find("#c_f_url");
        _this.jqModuleObj.find(".prod-img li .link").click(function(){

            var link = $(this).closest("li").find("#img").val();
            var re = /(?:\.([^.]+))?$/;
            var ext = re.exec(link)[1];

            if(CBase.dt.prevExt.indexOf(ext) != -1){
                pInput.val(link);
            }else{
                var id = $(this).closest("li").find("#img_id").val();
                CBase.jsModule.oTable.sendAjaxActionAdvanced({
                    action : "getFileLink",
                    link : link,
                    file_id : id
                }, function(d){
                    if(d && d.jsonok){
                        pInput.val(d.link);
                        jqObj.find("input#img_id").val(d.id);
                    }
                });
            }

            if(!p.is(":visible"))
                p.fadeIn("fast");
            pInput.addClass("update").focus().select();
            setTimeout( function() {
                pInput.removeClass("update");
            }, 700);
        });
        pInput.bind("click", function(){$(this).select();});


        // Delete image node;
        _this.jqModuleObj.find(".prod-img li .delete")
            .css({opacity : 0})
            .click(function(){ _this.deleteImageNode($(this).closest("li")); });

        // Team Card action
        _this.jqModuleObj.find(".prod-img li .team-card")
            .css({opacity : 0})
            .click(function(){ _this.addTeamCard($(this).closest("li")); });

    };

    FileUpload.prototype.setupFileUpload = function(){
        var _this = this;

        // Initiate uploadify plugin
        if($.isDefined(CBase.dt.uploadImg)){
            _this.cfg = CBase.dt.uploadImg;
            $.extend(_this.cfg, {
                onComplete:function(event, ID, fileObj, response){
                    $response = jQuery.parseJSON(response);
                    fileObj.name = $response.file;
                    fileObj.path = $response.path;
                    _this.showUploadedImage(event, fileObj);
                },
                onError : function(event,ID,fileObj,errorObj){}
            });
        }
        if($.isDefined(CBase.dt.uploadFile)){
            _this.fileCfg = CBase.dt.uploadFile;
            $.extend(_this.fileCfg, {
                onComplete:function(event, ID, fileObj, response){
                    response = jQuery.parseJSON(response);
                    fileObj.name = response.file;
                    fileObj.path = response.path;
                    _this.showUploadedImage(event, fileObj, response);
                },
                onError : function(event,ID,fileObj,errorObj){}
            });
        }


        // Disable the default browser drop action.
        $(document).on('drop dragover', function (e) {
            e.preventDefault();
        });
    };
    // Function to show newly uploaded image in field
    FileUpload.prototype.showUploadedImage = function(event, $fileObj){
        if(event){
            var oImg, $container = $(event.target).parent();
            var $file = CBase.dt.prevExt.indexOf($fileObj.file_ext) != -1 ? $fileObj.path + $fileObj.dir + '/' + $fileObj.file : '' ;
            if($fileObj.file_ext === 'svg')
                $file = $fileObj.path + $fileObj.file;

            $container.removeClass().addClass("click-to-addimg img-sample");
            $container.find(".upper").removeClass("upper");
            $container.find("input#img").val($fileObj.path + $fileObj.file);
            var p = $container.parent();
            p.find(".displayNone").removeClass("displayNone");
            if($file.length > 0){
                $container.append(oImg = $('<img src="' + $file + '" class="upper" />').hide());
                oImg.fadeIn("fast", function(){
                    $container.find("> img:not(.upper)").remove();
                });
            }else{
                $container.addClass("file " + $fileObj.file_ext).find("img").fadeOut("fast", function(){
                    $(this).remove();
                });
                p.find(".youtube, .pic").addClass("displayNone");
            }
            p.find("#img_name").val($fileObj.file_name);
            $container.parent().removeClass("upp empty");
        }
    };

    // Function to load saved images
    FileUpload.prototype.loadImg = function(img, obj){
        var _this = this;
        var $cont;
        // Set images data
        if(img){
            for(var i in img){
                if(img.hasOwnProperty(i)){
                    $cont = _this.addNewImageNode(obj, false, false);
                    if($cont.length){
                        if(typeof(img[i]['img_ppath']) != "undefined"){
                            $cont.find(".click-to-addimg").append('<img src="' + img[i]['img_ppath'] + '" class="upper" />');
                            $cont.find("input#img").val(img[i]['img_path']);
                            $cont.find("input#img_id").val(img[i]['img_id']);
                            $cont.find("input#img_name").val(img[i]['img_name']);
                        }
                        if(img[i]['img_blocked']){
                            if(img[i]['img_blocked'] == "1")
                                $cont.find(".chk").addClass("chked");
                        }

                        $cont.removeClass("upp empty").addClass("sbox");
                    }
                }
            }
        }
    };
    // Function to load saved file
    FileUpload.prototype.loadFile = function(dataObj, obj){
        var _this = this;
        var $cont;
        // Set images data
        if(dataObj){
            for(var i in dataObj){
                if(dataObj.hasOwnProperty(i)){
                    $cont = _this.addNewImageNode(obj, false, true);
                    if($cont.length){
                        if(typeof(dataObj[i]['img_ppath']) != "undefined"){
                            var ext =  dataObj[i]['img_ppath'].split('.').pop();

                            $cont.find("input#img").val(dataObj[i]['img_path']);
                            $cont.find("input#img_id").val(dataObj[i]['img_id']);
                            $cont.find("input#img_name").val(dataObj[i]['img_name']);

                            if(CBase.dt.prevExt.indexOf(ext) != -1){
                                $cont.find(".click-to-addimg").append('<img src="' + dataObj[i]['img_ppath'] + '" class="upper" />');
                            }else{
                                $cont.find(".click-to-addimg").addClass("file " + ext);
                                $cont.find(".youtube, .pic").addClass("displayNone");
                            }

                            $cont.removeClass("upp empty").addClass("sbox");
                        }
                    }
                }
            }
        }
    };
    // Function to delete row with image
    FileUpload.prototype.deleteImageNode = function(jqObj){
        var _this = this;
        if(!jqObj.hasClass("upp")){
            var jqFileCnt = jqObj.closest(".gbox");
            var jqFileCount = jqFileCnt.find(" > ul > li:not(.sample,.empty)").length;
            jqObj.fadeOut("fast", function(){
                $(this).remove();
                if(jqFileCount >= _this.lMaxFilesInContainer)
                    _this.addNewImageNode(jqFileCnt, false);
            });
        }
    };
    // Function to add new row with image sample at the end of the table
    FileUpload.prototype.addNewImageNode = function(obj, fade, file){
        var _this = this;

        fade = ($.isDefined(fade)?fade:true);
        if(!$.isDefined(obj))
            obj = $(".form-data");

        // Check how many files can be uploaded
        if(obj.find(" > ul > li:not(.sample)").length < _this.lMaxFilesInContainer){
            var $clone = obj.find(".sample").clone(true);

            var $i = 1;
            while(obj.find("#item-" + $i).length)
                $i++;

            // Set new node id
            $clone.attr("id", "item-" + $i).removeClass("sample").addClass("upp empty");

            var sFor = $clone.find(".placeh input").attr("id") + "-" + $i;

            // Update disabled checkbox names & ids
            $clone.find("label").attr("for", sFor);
            $clone.find(".placeh > input").attr("id", sFor).attr("name", sFor);

            // Append new input for uploadify
            $clone.find(".click-to-addimg").append('<input id="upload-' + $i + '" type="file" class="skip file-upload" />');
            obj.find(" > ul").append($clone);

            $clone.find("#upload-" + $i).fileupload({
                url: file ? _this.fileCfg.script : _this.cfg.script,
                dataType: 'json',
                formData: file ? _this.fileCfg.scriptData : _this.cfg.scriptData,
                acceptFileTypes: /(\.|\/)(file ? _this.fileCfg.fileExt. : _this.cfg.fileExt)$/i,
                maxFileSize:  file ? _this.fileCfg.sizeLimit : _this.cfg.sizeLimit, // 5 MB
                // Enable image resizing, except for Android and Opera,
                // which actually support image resizing, but fail to
                // send Blob objects via XHR requests:
                disableImageResize: true,
                previewCrop: false,
                dropZone: $clone,
                done: function (e, data) {
                    if($(this).closest("li").hasClass("upp"))
                        _this.addNewImageNode(obj, true, file);
                    _this.showUploadedImage(e, data.result);
                },
                drop: function (e) {
                    if(e.delegateTarget){
                        $(e.target).attr("data-trigger-type", $(e.delegateTarget).attr("class"));
                    }
                },
                add: function (e, data) {
                    // Rewrite formData variable
                    data.formData = $.extend({
                        type : $(e.target).attr("data-trigger-type"), // TODO: Is empty
                        type_id : $("#pbase").find("#a_type").val()
                    }, _this.cfg["scriptData"]);
                    data.submit();
                }
            }).prop('disabled', !$.support.fileInput)
                .parent().addClass($.support.fileInput ? undefined : 'disabled');

            if(fade)
                $clone.fadeIn();
            else
                $clone.show();

            return $clone;
        }
        return false;
    };

    // Function to add team card with simple alerts for name and description
    FileUpload.prototype.addTeamCard = function(jqObj){
        var _this = this;
        var imgPath = jqObj.find("input#img").val();

        if(!imgPath) return;

        // Alert for team member name
        var name = prompt("Team Member Name:", "");
        if(!name) return;

        // Alert for professional title
        var title = prompt("Professional Title (e.g., Web Designer):", "");
        if(!title) return;

        // Generate HTML card
        var cardHtml = '<div class="col-6 col-lg-3" data-animate="animate__fadeIn">' +
            '<div class="about-team-content banner-hover">' +
            '<div class="about-team-img">' +
            '<img src="' + imgPath + '" alt="' + name + '" />' +
            '</div>' +
            '<div class="about-team-info pst-25">' +
            '<h6>' + name + '</h6>' +
            '<span>' + title + '</span>' +
            '</div>' +
            '</div>' +
            '</div>';

        // Insert into TinyMCE
        if(tinymce.activeEditor) {
            tinymce.activeEditor.execCommand('mceInsertContent', false, cardHtml);
        }
    };


    return FileUpload;
})();