/**
 * 粘贴剪切板
 * @author qi.li@yoho.cn
 * @date: 2017/03/09
 */

/* global gDomains injected from client.hbs*/ // eslint-disable-line
var $ = require('yoho-jquery');
var Handlebars = require('yoho-handlebars');

// dialog html
var $view = '<div class="mask-dialog preview-dialog">' +
                '<div class="dialog-mask"></div>' +
                '<div class="dialog-main">' +
                    '<div class="head-part">' +
                        '<span class="head-title">是否发送图片</span> ' +
                        '<span class="head-close">x</span>' +
                    '</div>' +
                    '<div class="body-part">' +
                        '<img class="clip-img" src="{{src}}">' +
                    '</div>' +
                    '<div class="foot-part">' +
                        '<a class="foot-btn confirm-btn" href="javascript:;">发送</a>' +
                        '<a class="foot-btn cancel-btn" href="javascript:;">取消</a>' +
                    '</div>' +
                '</div>' +
            '</div>';

var $viewHbs = Handlebars.compile($view);

/**
 * 粘贴事件
 * @param sl 事件元素选择器
 * @param cb 上传成功的回调
 */
function Paste(sl, cb) {
    if (typeof sl !== 'string') {
        return;
    }
    this.$el = document.querySelector(sl);
    this.formData = null;
    this.uploadCb = cb;
    this.isSending = false;
    this.bindEvents();
}

Paste.prototype = {
    bindEvents: function() {
        var self = this;

        this.$el.addEventListener('paste', function(e) {
            var cbd = e.clipboardData;
            var ua = window.navigator.userAgent;

            // 如果是 Safari 直接 return
            if (!(e.clipboardData && e.clipboardData.items)) {
                return;
            }

            // Mac平台下Chrome49版本以下 复制Finder中的文件的Bug Hack掉
            if (cbd.items && cbd.items.length === 2 && cbd.items[0].kind === 'string' && cbd.items[1].kind === 'file' &&
                cbd.types && cbd.types.length === 2 && cbd.types[0] === 'text/plain' && cbd.types[1] === 'Files' &&
                ua.match(/Macintosh/i) && Number(ua.match(/Chrome\/(\d{2})/i)[1]) < 49) {
                return;
            }

            for (var i = 0; i < cbd.items.length; i++) {
                var item = cbd.items[i];
                if (item.kind == 'file') {
                    var file = item.getAsFile();
                    if (file.size === 0) { return; }

                    self.formData = new FormData();
                    self.formData.append('files[]', file, 'clip.jpg');

                    var _upload = function() {
                        if (self.isSending) return;
                        self.isSending = true;

                        $.ajax({
                            type: 'POST',
                            url: gDomains.imCs + '/fileManage/uploadFile',
                            data: self.formData,
                            processData: false,  // 告诉jQuery不要去处理发送的数据
                            contentType: false
                        })
                        .done(function(res) {
                            if (res.code === 200) {
                                var path = res.data.filePath;
                                self.uploadCb(path);
                                self.close();
                            }
                        })
                        .fail(function() {
                            alert('图片发送失败、点击发送重试！');
                        })
                        .always(function() {
                            self.isSending = false;
                        });
                    };

                    var _bindPrevEvents = function() {
                        var $prev = self.$preview;

                        $prev.on('click', '.head-close, .cancel-btn', self.close.bind(self))
                             .on('click', '.confirm-btn', _upload);
                    };

                    var _drawPreview = function(url) {
                        var $prev = $('.preview-dialog');
                        var $img = $prev.find('.clip-img');
                        var len = $img.length;

                        if (len) {
                            $img.attr('src', url);
                            self.$preview = $prev;
                            return;
                        }

                        var html = $viewHbs({src: url});
                        $('body').append(html);
                        $('.preview-dialog').css('z-index', 1090);
                        self.$preview = $('.preview-dialog');

                        // 绑定预览内事件
                        _bindPrevEvents();
                    };

                    var reader = new FileReader();
                    reader.onload = function(e) {
                        var base64 = e.target.result;
                        var image = new Image();
                        image.src = base64;
                        image.onload = function() {
                            _drawPreview(base64);
                            self.open();
                        };
                    };

                    reader.readAsDataURL(file);
                }
            }
        }, false);
    },

    open: function() {
        var dh, vh = $(window).height();
        var $main = $('.preview-dialog .dialog-main');

        this.$preview.show();
        dh = $main.height();
        $main.css('top', (vh - dh - 40) / 2);
    },

    close: function() {
        this.$preview.hide();
    }
};

Paste.prototype.constructor = Paste;

module.exports = Paste;