// 图片上传demo
function uploadimg() {
    var $ = jQuery;
    //建立html
    var file_count = 0;
    var picker = "add_file_button";
    var add_files;
    //
    var
    // 优化retina, 在retina下这个值是2
    ratio = window.devicePixelRatio || 1,
    // Web Uploader实例
    uploader;

    // 初始化Web Uploader
    uploader = WebUploader.create({
        // 自动上传。
        auto: true,
        // swf文件路径
        swf: 'Public/webuploader/Uploader.swf',
        threads:1,//上传并发数。允许同时最大上传进程数。 这里建议设置为1，否则上传后的文件顺序和本地的不一样，如（1,jpg,2,jpg,3.jpg）上传到服务器口顺序可能是(2.jpg,1,jpg,3.jpg)
        // 文件接收服务端。
        server: upload_url,
        // 选择文件的按钮。可选。
        // 内部根据当前运行是创建，可能是input元素，也可能是flash.
        pick: {
            id: "#" + picker,
        },
        duplicate: true, //可重复上传
        // 只允许选择文件，可选。
        accept: upload_accept
    });
    //当一组文件加入时触发
    uploader.on('filesQueued', function (files) {
        uploader.sort(function(fiels) {
            return -1;//设置文件上传顺序，这里一定要加上，如本地文件上为1,2,3如不加上，上传后在数据库的顺序是3，2，1，加上后就可和本地一样了
        });
        add_files = files.length;
        //打开上传窗口
        $(".upload_box").show();
    });
    uploader.addButton({
        id: '#btnContainer',
      
    });
    //获取图片宽度，自动压缩
    uploader.option( 'compress', {
        width: imgwidth?imgwidth:1920,
        height: imgheight>0?imgheight:9000,
        quality: 60,
    });    
    // 当有文件添加进来的时候
    uploader.on('fileQueued', function (file) {

        var $li = $('<li data-icon="ckf-cancel" class="ui-li-has-alt upload_list_li" id="upload_list_' + file.id + '"><a class="ckf-upload-item ui-btn"><h3>' + file.name + '</h3><div class="ckf-progress"><div class="ckf-progress-bar" style="width:0%;"></div></div><p class="ckf-upload-message"></p></a><a class="ckf-upload-item ckf-upload-item-button ui-btn ui-btn-icon-notext ui-icon-ckf-cancel" title="取消"></a></li>');
        $("#upload_list").prepend($li);

        file_count++;
        $("#file_count").html(file_count);
        open_uploading();//打开进度窗口	

    });

    /*
     $li.on('click', '.remove-this', function() {
     uploader.cancelFile( file );
     })	
     */
    // 文件上传过程中创建进度条实时显示。
    uploader.on('uploadProgress', function (file, percentage) {
        var $li = $('#upload_list_' + file.id),
                $percent = $li.find('.ckf-progress-bar');
        $percent.css('width', percentage * 100 + '%');

        //剩余数量
        var waiting_num = $(".upload_list_li").length;
        var successful_num = add_files - waiting_num;
        var all_percent = ((successful_num + percentage) / add_files) * 100;
        $(".ckf-progress-bar").css("width", all_percent + "%");
        $(".ckf-upload-status").html(successful_num + "/" + add_files);

    });
    // 文件上传成功 删除状态框
    uploader.on('uploadSuccess', function (file, result) {
        if (result.status == 0) {
            var $li = $('#upload_list_' + file.id);
            $li.find('.ckf-upload-item').addClass('ckf-upload-item-error');
            $li.find('.ckf-progress').addClass('ckf-progress-error');
            $li.find('.ckf-upload-message').html(result.info);
        } else {
            file_count--;
            $('#upload_list_' + file.id).remove();
            //视图增加图片
            page = 0;
            getlist(result.id);//重新加载列表				
        }

    });

    // 文件上传失败，现实上传出错。
    uploader.on('uploadError', function (file, reason) {

        var $li = $('#upload_list_' + file.id);
        $li.find('.ckf-upload-item').addClass('ckf-upload-item-error');
        $li.find('.ckf-progress').addClass('ckf-progress-error');
        $li.find('.ckf-upload-message').html("上传错误");

    });
    // 列表上传完成触发
    uploader.on('uploadFinished', function () {
        var fail_li = $(".upload_list_li").length;
        if (fail_li == 0) {
            $(".ckf-upload-status").html("所有文件上传成功");
            remove_uploading();
        } else {
        }

    });
    // 完成上传完了，成功或者失败，先删除进度条。
    uploader.on('uploadComplete', function (file, result) {

    });
    //
    uploader.on("error", function (type) {
        if (type == "Q_TYPE_DENIED") {
            alert("请上传" + upload_accept.extensions + "格式文件");
        } else if (type == "Q_EXCEED_SIZE_LIMIT") {
            alert("文件大小不能超过2M");
        } else {
            alert("上传出错！请检查后重新上传！错误代码" + type);
        }
    });
}

var uploading_status = 0;

//打开上传文件窗口
function open_upload_box() {
    $(".ckf-progress-bar").css("width", "0%");
    $(".ckf-upload-status").html("选择文件上传");
    uploadimg();
    $(".upload_box").show();
}
//第一个上传按钮直接显示
$(function(){
    $(".ckf-progress-bar").css("width", "0%");
    $(".ckf-upload-status").html("选择文件上传");
    uploadimg();
})

//关闭上传文件窗口
function close_upload_box() {
    $(".upload_box").hide();
}


//移出上传详情窗口
function remove_uploading() {
    $("#uploading_status").animate({"width": "0em"}, function () {
        $("#uploading_status").hide();
    });
    $(".ui-panel-wrapper").animate({"margin-right": "17em"});
    uploading_status = 0;
}
//打开上传详情窗口
function open_uploading() {
    $("#uploading_status").show();
    $("#uploading_status").animate({"width": "17em"});
    $(".ui-panel-wrapper").animate({"margin-right": "34em"});
    uploading_status = 1;
}
//根据情况打开或关闭上传详情窗口
function check_open_uploading() {
    if (!uploading_status) {
        open_uploading();
    } else {
        remove_uploading();
    }
}