directives.js 10.3 KB
/**
 * Created by Administrator on 2015/2/27.
 */

(function() {
    var xnKindEditor = function ($timeout,xnConfig,kindeditorService) {
        return {
            restrict: "AC",
            scope: {
                content: '=ngModel',
                readonly:"=",
                diskId:"=",
                filterMode:"="
            },
            template:"<div>"+
            "<textarea   id=\"{{id}}\"  name=\"kindEdit\"></textarea>"+
            " <div xn-img-box  ng-Model=\"attachmentPopupMuch\"  data-is-open=\"isOpenMuch\" " +
            "   data-type='image' data-disk-id='diskId' ></div>"+
            "<div xn-img-box-single  data-type='image'   ng-Model=\"attachmentPopup\"  data-is-open-single=\"isOpen\" data-disk-id='diskId' ></div>"+

            "</div>",
            require: "?ngModel",
            link: function (scope, elem,atter,ngModel) {
                if(!atter.url){
                    return ;
                }
                scope.height="500px";
                if(atter.height){
                    scope.height=atter.height;
                }
                scope.isOpen = false;
                scope.isOpenMuch = false;
                //图片预览
                scope.newData={
                    newData:""
                };

                scope.attachmentPopupMuch = {
                    idList: [],
                    attachmentList:[]
                };
                scope.attachmentPopup = {
                    idList: "",
                    attachmentList: ""
                };
                scope.id="editor"+new Date().getTime()+Math.ceil(Math.random()*1000);

                var editor;
                var hasLoad = false;
                var filterMode= true;
                if(scope.filterMode===false){
                    filterMode=scope.filterMode;
                }

                $timeout(function(){
                    editor=KindEditor.create('#'+scope.id,{
                        basePath:atter.url,
                        // uploadJson:xnConfig.myUrl+"api/diskFileUpload.do",
                        uploadJson:atter.diskUpload||"/api/diskFileUpload.do",
                        width:"100%",
                        height:scope.height,
                        resizeType : 1,
                        filterMode:filterMode,
                        readonlyMode : scope.readonly,
                        /* items:[
                         'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',
                         'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
                         'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
                         'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
                         'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
                         'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
                         'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
                         'anchor', 'link', 'unlink', '|', 'about'
                         ],*/
                        items:[
                            'source', '|', 'undo', 'redo', '|', 'preview', 'cut', 'copy', 'paste',
                            'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
                            'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
                            'superscript', 'clearhtml', 'quickformat', 'selectall',
                            'formatblock', 'fontname','fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
                            'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|','xn-image', 'xn-multiimage',"flash",
                            /*  'insertfile',*/ 'table', 'hr',  'pagebreak',
                            'anchor', 'link', 'unlink'
                        ],
                        afterBlur: function(){
                            getVal(editor.html());
                        }
                    });

                    scope.$watch("content",function(data){
                        if(!hasLoad && data){
                            hasLoad = true;
                            editor.html(data);
                        }
                    });

                    scope.$watch("diskId",function(newData){
                      if(newData){
                          kindeditorService.apiFoundationDiskGet({id:newData}).then(function(data) {
                              if (data.errors === null || data.errors.length > 0) {
                                  dialogService.tip(data.errors);
                              }else{
                                  editor.diskId=data.disk.id;
                                  editor.folderId=data.disk.rootFolderId;
                              }
                          });
                      }
                    });

                    if(!scope.readonly){
                        elem.find(".ke-icon-xn-image").on("click",function(){
                            scope.isOpen=true;
                            scope.$apply();
                        });

                        elem.find(".ke-icon-xn-multiimage").on("click",function(){
                            scope.isOpenMuch=true;
                            scope.$apply();
                        });
                    }
                },0);

                //监控单选
                scope.$watch(function(){
                    return  scope.isOpen;
                },function(newdata){
                    if(!newdata){
                        if(scope.attachmentPopup.idList){
                            if(editor){
                                editor.insertHtml("<img  src="+scope.attachmentPopup.attachmentList.path+"  alt="+scope.attachmentPopup.attachmentList.fileName+" >");
                            }
                        }else{

                        }
                    }
                });

                //监控多选
                scope.$watch(function(){
                    return  scope.isOpenMuch;
                },function(newdata){
                    if(!newdata){
                        if(scope.attachmentPopupMuch.idList.length>0){
                            var newDome="";
                            for(var i=0;i<scope.attachmentPopupMuch.idList.length;i++){
                                newDome=newDome+"<img src="+scope.attachmentPopupMuch.attachmentList[i].path+"  alt="+scope.attachmentPopupMuch.attachmentList[i].fileName+">"
                            }
                            if(editor){
                                editor.insertHtml(newDome);
                            }
                        }else{

                        }

                    }
                });


                //同步数据
                function getVal(data){
                    hasLoad = true;
                    scope.content=angular.copy(data);
                    scope.$apply();
                }

            }
        };
    };
    angular.module("xn.kindeditor",[])
        .config(['$httpProvider',
            function ($httpProvider) {
                $httpProvider.defaults.headers.post['Content-Type'] = 'text/plain';
                $httpProvider.defaults.withCredentials=true;
                /*     // Override $http service's default transformRequest
                 $httpProvider.defaults.transformRequest = [function(data)
                 {
                 /!**
                 * The workhorse; converts an object to x-www-form-urlencoded serialization.
                 * @param {Object} obj
                 * @return {String}
                 *!/
                 var param = function(obj){
                 var query = '';
                 var name, value, fullSubName, subName, subValue, innerObj, i;
                 console.log(obj);


                 for(name in obj)
                 {
                 value = obj[name];
                 console.log(value);


                 if(value instanceof Array)
                 {
                 console.log("Array");
                 for(i=0; i<value.length; ++i)
                 {
                 subValue = value[i];
                 fullSubName = name + '[' + i + ']';
                 innerObj = {};
                 innerObj[fullSubName] = subValue;
                 query += param(innerObj) + '&';
                 }
                 }
                 else if(value instanceof Object)
                 {
                 console.log("object");
                 for(subName in value)
                 {


                 subValue = value[subName];
                 if(subValue != null){
                 // fullSubName = name + '[' + subName + ']';
                 //user.userName = hmm & user.userPassword = 111
                 fullSubName = name + '.' + subName;
                 // fullSubName =  subName;
                 innerObj = {};
                 innerObj[fullSubName] = subValue;
                 query += param(innerObj) + '&';
                 }
                 }
                 }
                 else if(value !== undefined ) //&& value !== null
                 {
                 console.log("undefined");
                 query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
                 }
                 }


                 return query.length ? query.substr(0, query.length - 1) : query;
                 };


                 return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
                 }]

                 */
                $httpProvider.defaults.useXDomain = true;
            }])
        .directive('xnKindEditor',["$timeout","xnConfig","kindeditorService",xnKindEditor])
        .factory('kindeditorService', ['$http',"xnConfig", function ($http,xnConfig ) {

            var service = {};
            var url = xnConfig.myUrl + "api/foundation.do";

            /*获取网盘*/
            service.apiFoundationDiskGet = function (data) {
                return $http({
                    method: 'POST',
                    url: url,
                    data: data,
                    params: {"method": "api.foundation.disk.get"} });
            };
            return service;
        }]);

})();