commit.js

/**
 * @file editor-main.js
 * @brief   editor upload mod
 * @author baozi
 * @version 
 * @date 2014-11-19
 */

define("comment",["mf/login","jquery",'handlebars'],function(require, exports, module) {

    var login = require("mf/login");
    var $ = require("jquery");
    var _h = require("handlebars");

    var uploader, um;
    
    var loginBtn = $("#login");
    var reply = $(".feed-editor-btn");
    var editorTit = $(".feed-editor-text");
    var diggerObj = $(".J_digger_cont");

    /** FORM **/
    var editorForm = $("#editor-form"),
        tid = $(".editor-tid"),
        pid = $(".editor-pid"),
        cont = $(".editor-cont"),
        pic = $(".editor-pic"),
        posttit = $(".post-tit");


    var arrData = [];
    var editorCont = "";
    var feedFlag = 0;

    var urlBase = {
        loginURL: defaultURL+"/account/login?more=1", // 登陆send url
        regURL: defaultURL+"/account/register?more=1", // 注册send url
        logoutURL: defaultURL+"/account/logout" // 退出send url
    }

    login.urlBase = $.extend(login.urlBase,urlBase);

    
    /***标题判断***/
    function checkTitle (o) {
        $(o).focus(function () {
            $(this).css("color","#000");
        })
        $(o).blur(function(){
            if($(this).val().length > 30) {
                alert("标题过长")
             }
        })
    }

    /**实例化编辑器**/
    function editorInit () {
        um = UM.getEditor('myEditor',{
            //toolbar: ['undo redo | bold italic underline | emotion insertimage simpleupload link']
            toolbar: [],
            //autoClearinitialContent:true
        });
        $("#myEditor").click(function () {
            if(um.hasContents() && um.getContentTxt() =="请输入文字") {
                um.setContent("")
            }
        })
    }

    /**内容检查**/
    function checkEditor (status) {
         if(editorTit.length) {
            if(editorTit.val() == "") {
                alert("标题不能空");
                editorTit.focus();
                return false;
            }
        };
         //var reg = /^(([\d]+)||([a-zA-Z]+)||(\s+)||([^u4e00-u9fa5]{0,5})
         //||([\\<>&|.?\[\]{}|'*!`~@#$^&=:;,/~！@#￥……&*（）;—{}【】‘；：”“。，、？\(\)\s]+))$/g;
        if(um.hasContents() && um.getContentTxt() !="请输入文字") {
            editorCont = um.getPlainTxt();//getContent();
           // if(reg.test(editorCont) || editorCont.length<=10){
           //     alert("请按正确的发表");
            //   } else {
                formSubmit();
            //}
        } else {
            alert("请输入内容");
            $('#myEditor').focus();
             um.setContent("");
        }
    }

    /**渲染用户**/
    var tpl = '<div class="feed-user">'+
                '<span class="feed-art-user">'+
                    '<img src="{{avatar}}" alt="">'+
                    '<span>{{nickname}}</span>'+
                '</span>'+
            '</div>';

    login.onLoginSuc = function (data) {
        var userinfo = data.data;
        render(userinfo);
    }

    function render (data) {
        var rendHelp = $(".j-usr-post"),
        temp = _h.compile(tpl),
        html = temp(data);

        rendHelp.html(html);
        rendHelp.show();
    }

    /**登录检查**/
    login.isLogin(function (status) {
        if(status) {
        isLogin = true;
        }
    })

    reply.on("click",function (){
       if(isLogin) {
             //$("#Overlay").hide();
             checkEditor();
       } else {
            loginBtn.trigger("click");
            return false;
       }
     })


    /***点评***/
    diggerObj.each(function(idx,obj){
        var self = $(this);
        $(obj).find(".J_contact").on("click",function() {
            var name = $(this).attr("data-name");
            var text = self.find(".J_text");
            text.val("@" + name + "：").focus();
        })

        self.find(".post-digg").click(function() {
            var text = self.find(".J_text");
            if(isLogin) {
                if(text.val() != "点评" && $.trim(text.val()) !="")  {
                    self.find(".dig-form").submit();
                } else {
                    alert("内容不能为空");
                    text.focus();
                    return false;
                }
            } else {
                //$("#Overlay").hide();
                loginBtn.trigger("click")
                return false;
            }
        })
    })


    /**PHP 后端需要的数据**/
    function formSubmit (data) {
        cont.val(editorCont)
        if(posttit.length) {
            posttit.val($(".feed-editor-text").val())
        }
        $(this).serialize();
        editorForm.submit();
    }

    /**上传组件**/
    $(function() {
        var $list = $('#fileList'),
            $btn = $('#ctlBtn'),
            state = 'pending',

            // 优化retina, 在retina下这个值是2
            ratio = window.devicePixelRatio || 1,

            // 缩略图大小
            thumbnailWidth = 100 * ratio,
            thumbnailHeight = 100 * ratio,

        // Web Uploader实例

        /** 初始化Web Uploader **/
        uploader = WebUploader.create({
            // 自动上传。
            auto: true,
            //runtimeOrder: 'flash',
            // swf文件路径
            swf: __uri('./upjs/Uploader.swf'),
            //fileNumLimit: 5,//$("#fileList").attr("data-num"),
            //fileSizeLimit: 10 * 1024 * 1024,    // 200 M
            //fileSingleSizeLimit: 1024 * 1024, //50 * 1024 * 1024,    // 50 M

            // 文件接收服务端。
            server: '/upload/image',

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: '#filePicker',
            // 只允许选择文件，可选。
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/*'
            }
        });

        var flag = false;
        uploader.on("beforeFileQueued",function() {
            if($("#fileList").children().length >=10) {
                if(flag == false) {
                    flag = true;
                    uploader.stop()
                    alert("最多上传10张图片");
                }
                return false;
            } else {
                flag = false;
            }
        })
        // uploader.on("beforeFileQueued",function() {
        //    if($("#fileList").children().length >=10) {
        //        if($("#fileList").children().length==10) {
        //            alert("最多上传10张图片");
        //        }
        //        return false;
        //    }
        //})
        
        // 当有文件添加进来的时候
        uploader.on( 'fileQueued', function( file ) {
            //重置数据
            //arrData.length = 0;
            var strHtml = "";
            //console.log(file)
            //垃圾处理
             if($.browser.version == "6.0") {
               strHtml = '<div id="' + file.id + '" class="item">' +
                    '<h4 class="info">' + file.name + '</h4>' +
                    '<p class="state">正在上传...</p>' +
                '</div>';

             } else {
                strHtml = '<div id="' + file.id + '" class="file-item thumbnail">' +
                                '<img>' + '<div class="info">' + file.name + '</div>' +
                                '<a href="javascript:;" class="remove-this">X</a>' +
                          '</div>';
            }
            var $li = $(strHtml);
            var $img = $li.find('img');

            /**删除队列id**/
            $li.on('click', '.remove-this', function() {
                uploader.removeFile( file.id );
                $(this).parents("#"+file.id+"").fadeOut().remove();

                var newVal = $(this).parent().attr("data-url");
                var picVale = pic.val().split(",");
                arrData = replaceArr(picVale,newVal);
                pic.val(arrData);
            })

            $btn.removeClass("ok-disabled");
            $list.append( $li );
            // 创建缩略图
            if($.browser.version != "6.0") {
                uploader.makeThumb( file, function( error, src ) {
                    if ( error ) {
                        $img.replaceWith('<span>不能预览</span>');
                        return;
                    }

                    $img.attr( 'src', src );
                }, thumbnailWidth, thumbnailHeight );
            }
        });
        //上传中
        var up_flag = false;
        uploader.on("uploadProgress",function( file, percentage ) {
            up_flag = true;
            if(up_flag) {
                reply.attr("disabled",true).css("background","#ccc");
                up_flag = false;
            }
        });
        uploader.on("uploadFinished",function( file, percentage ) {
            reply.attr("disabled",false).css("background","#f4971e");
        });

        /** 文件上传成功 **/
        uploader.on( 'uploadSuccess', function( file,ret ) {
             var $li = $( '#'+file.id ),
                $error = $li.find('div.success');
                $btn.addClass("ok-disabled");
                $( '#'+file.id ).find('p.state').text('已上传');
                feedFlag = 1;
                //response
                if(ret && ret.data) {
                if(pic.val() != ""){
                    arrData = pic.val().split(",");
                }else{
                    arrData = [];
                }
                arrData.push(ret.data.url);
                pic.val(arrData)
                $li.attr("data-url",ret.data.url)
            }

            // 避免重复创建
            if ( !$error.length ) {
                $error = $('<div class="success"></div>').appendTo( $li );
            }
            
        });

        /** 文件上传失败，现实上传出错。**/
        uploader.on( 'uploadError', function( file ) {
            var $li = $( '#'+file.id ),
                $error = $li.find('div.error');

            // 避免重复创建
            if ( !$error.length ) {
                $error = $('<div class="error"></div>').appendTo( $li );
            }

            $error.text('上传失败');
        });

        /**出错监听**/
        uploader.on("error",function (type) {
            switch (type) {
                case 'Q_EXCEED_NUM_LIMIT':
                alert("最多上传"+$("#fileList").attr("data-num")+"张")
                    break;
                case 'Q_EXCEED_SIZE_LIMIT':
                alert("图片过大")
                    break;
                case 'Q_TYPE_DENIED':
                    alert("请上传图片文件")
                    break;
                case 'F_DUPLICATE':
                    alert("重复文件")
                    break;
                default:
                    alert("上传出错")
            }
        })

        $btn.on( 'click', function() {
            if ( $(this).hasClass( 'ok-disabled' ) ) {
                return false;
            }
            if ( state === 'uploading' ) {
                uploader.stop();
            } else {
                uploader.upload();
            }
        });
        $(".editor-remove-this").click(function() {
            var newVal = $(this).parent().attr("data-url");
            $(this).parent().remove();
            //console.log(uploader)
            uploader.option("fileNumLimit",10);
            var picVale = pic.val().split(",");
            editorArrData = replaceArr(picVale,newVal);
            pic.val(editorArrData);
        })
        
    })
    //重新赋值
    function replaceArr (arr,val) {
        var empty =[];
        for(var i=0;i<arr.length;i++) {
            if(arr[i] != val) {
                empty.push(arr[i]);
            }
        }
        return empty;
    }

    $(function () {
        editorInit();
        checkTitle(editorTit)
    })

});