ide.js 13.4 KB

;(function(window){
    function gxbIde(){
        this.init.apply(this, arguments);
    }

    var treeLinkEditor  = [],   // 缓存整个目录树结构和代码编辑器的关系
        treeData        = {},   // 缓存目录树返回结果
        mainPath,               // 运行编译时候需要知道当前是哪个文件
        fileList,               // 有值的文件数据结构
        treeObj;                // 获取ztree对象

    var isReplayPage = false; // initJavaPage 判断输出

    var ZTREE = {
        /**
         * ztreeSetting 配置文件
         * @Author syantao
         * Created by Keystion on 2017-01-19
         */
        config: {
            view: { showLine: false }
            ,data: {
                simpleData: { enable: true }
            }
            ,callback: {
                /**
                 * ztree 每一项点击事件
                 * @Author syantao
                 * Created by Keystion on 2017-01-19
                 */
                beforeClick: function(treeId, treeNode){
                    console.log('点击了 ' + treeNode.name);
                    console.log(treeNode);
                    // 判断是否点击了文件夹
                    if (treeNode.isParent) {
                        return false;
                    }
                    treeObj = $.fn.zTree.getZTreeObj("folder");
                    treeObj.expandNode(treeNode);

                    // 处理显示目录树对应的编辑器目录
                    ZTREE.showEdite({'treeNode': treeNode});
                }
            }
        },
        /**
         * 通过目录树的点击来显示对应的编辑器
         * @Author syantao
         * Created by Keystion on 2017-01-19
         * @param  {[type]} treeNode 点击了哪一个目录
         * TODO treeNode放到一个变量或者隐藏域里面
         */
        showEdite: function (obj){
            console.info('ZTREE.showEdite');
            console.log(obj);
            var _this = this,
                _file, 
                _CodeMirrorRecordId, 
                _CodeMirrorReplayId,
                _num = 0;
            // 判断是否是初始化选时候调用 showEdite
            if(obj){
                for (var i = 0; i < treeLinkEditor.length; i++) {
                    if(treeLinkEditor[i].name == _this.manageName(obj.treeNode.name)){
                        _num = i;
                    }
                }
                if(typeof obj.record != 'undefined' && obj.record){
                    $('#recordertab a:eq(0)').tab('show');
                }else if(typeof obj.replay != 'undefined'&& obj.replay){
                    $('#recordertab a:eq(1)').tab('show');
                }
            }

            _file               = treeLinkEditor[_num].file;
            _CodeMirrorRecordId = treeLinkEditor[_num].CodeMirrorRecordId;
            _CodeMirrorReplayId = treeLinkEditor[_num].CodeMirrorReplayId;
            mainPath            = treeLinkEditor[_num].filePath; // 更新mainPath值
            
            // 显示代码编辑器
            $('#' + _CodeMirrorRecordId).show().parent().show().siblings().hide().find('.CodeMirror').hide();
            $('#' + _CodeMirrorReplayId).show().parent().show().siblings().hide().find('.CodeMirror').hide();
            
            console.log('当前选中文件(mainPath):'+ mainPath);
            console.log('当前显示代码编辑器:'+ '#' + _CodeMirrorReplayId);

            // 更新目录树选中状态
            _this.selectTreeItem(_file);
        },
        /**
         * 返回目录结构路径
         * @Author syantao
         * Created by Keystion on 2017-01-19
         * @param  {[type]} treeNode 点击了哪一个目录
         * TODO treeNode放到一个变量或者隐藏域里面
         */
        // 根据提供的 name 获取 pId , 再根据 pId 获取 夫级 name
        getTreePath: function (name){
            console.info('ZTREE.getTreePath');
            var _pid, _folder, _filename;
            for (var i = 0; i < treeData.length; i++) {
                if(treeData[i].name == name){
                    _pid = treeData[i].pId;
                    _filename = treeData[i].name;
                }
            }
            for (var i = 0; i < treeData.length; i++) {
                if(treeData[i].id == _pid){
                    _folder = treeData[i].name;
                }
            }
            return _folder + '/' + _filename;
        }
        /**
         * 处理name 
         * @Author syantao
         * Created by Keystion on 2017-01-23
         * @param  {[type]} name Class1.java
         * @return {[type]}      Class1
         */
        ,manageName: function (name){
            console.info('ZTREE.manageName');
            if(!name){
                return false;
            }
            return name.split('.')[0];
        }
        /**
         * 根据id获取当前编辑器对应的目录树文件
         * @Author syantao
         * Created by Keystion on 2017-01-19
         * @param  {[type]} id 代码编辑器的id
         */
        ,getCurrentEditor: function (id){
            // console.info('ZTREE.getCurrentEditor');
            var _id = id || treeLinkEditor[0].CodeMirrorRecordId,
                _name;

            for (var i = 0; i < treeLinkEditor.length; i++) {
                if(treeLinkEditor[i].CodeMirrorRecordId == _id){
                    // console.log(treeLinkEditor[i]);
                    _name = treeLinkEditor[i].name;
                }
            }

            return _name;
        }
        /**
         * 返回编辑器的数据,
         * @Author syantao
         * Created by Keystion on 2017-01-22
         * @param  {[type]} name 非必选,如果有折返回单个文件的数据
         * @return {[type]}      Array/false  false 每一个编辑器均无值
         */
        ,getTreeData: function(name){
            console.info('ZTREE.getTreeData');
            var _arr = [];
            if(!isReplayPage){
                // 判断是否是需要返回单文件结果
                if(name){
                    for (var i = 0; i < treeLinkEditor.length; i++) {
                        if(treeLinkEditor[i].name == name && $.trim(treeLinkEditor[i].CodeMirrorRecord.getValue()) != ''){
                            _arr.push({
                                "path": treeLinkEditor[i].filePath,
                                "content": $.trim(treeLinkEditor[i].CodeMirrorRecord.getValue())
                            })
                        }
                    }
                }else{
                    for (var i = 0; i < treeLinkEditor.length; i++) {
                        if($.trim(treeLinkEditor[i].CodeMirrorRecord.getValue()) != ''){
                            _arr.push({
                                "path": treeLinkEditor[i].filePath,
                                "content": $.trim(treeLinkEditor[i].CodeMirrorRecord.getValue())
                            })
                        }
                    }
                }
            }else{
                // 判断是否是需要返回单文件结果
                if(name){
                    for (var i = 0; i < treeLinkEditor.length; i++) {
                        if(treeLinkEditor[i].name == name && $.trim(treeLinkEditor[i].CodeMirrorReplay.getValue()) != ''){
                            _arr.push({
                                "path": treeLinkEditor[i].filePath,
                                "content": $.trim(treeLinkEditor[i].CodeMirrorReplay.getValue())
                            })
                        }
                    }
                }else{
                    for (var i = 0; i < treeLinkEditor.length; i++) {
                        if($.trim(treeLinkEditor[i].CodeMirrorReplay.getValue()) != ''){
                            _arr.push({
                                "path": treeLinkEditor[i].filePath,
                                "content": $.trim(treeLinkEditor[i].CodeMirrorReplay.getValue())
                            })
                        }
                    }
                }
            }

            // 
            if(_arr < 1){
                return false;
            }

            return _arr;
        }
        /**
         * 通过文件名选中对应的目录
         * @Author syantao
         * Created by Keystion on 2017-01-23
         * @param  {[type]} name 例:Class1.java
         */
        ,selectTreeItem: function (name){
            console.info('ZTREE.selectTreeItem');
            var _thisName = name || treeData[1].name;
            // 处理菜单选中状态
            var node = treeObj.getNodeByParam("name", _thisName, null);
            
            treeObj.selectNode(node, false, true);
        }
    }

    gxbIde.prototype = {
        config: {
            tree: true,
            languageid: null
        },
        init: function(config){

            this.config = $.extend(this.options, config);

            console.log(this.options)

            this.getTreeList();
        },
        template: function(){
            console.log('--------') 

        },
        controler: function(){

        },
        getTreeList: function(){
            var setting = { };

            $.ajax({
                type: "GET",
                url: "js/tree.json",
                dataType: "json",
                contentType: "application/json",
                success: function(data) {
                    console.log(data);

                    treeData = data.tree;

                    $.fn.zTree.init($("#folder"), ZTREE.config, treeData);
                    initJavaPage(treeData)
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    console.log('Ajax tree.json error');
                    console.log(XMLHttpRequest);
                }
            });
        },

    }

    function initJavaPage(treeData){
        console.info('initJavaPage');

        var _datalist = treeData || [];
        var recordTemplate = '';
        var replayTemplate = '';
        var obj = []
        if(!_datalist.length){
            return false;
        }
        
        // setHtmlButton(_languageid, 'JAVA');

        // 生成 textarea
        for (var i = 0; i < _datalist.length; i++) {
            if(!_datalist[i].isParent){
                var _file = _datalist[i].name;
                var _name = ZTREE.manageName(_file);
                var defaultValue;
                defaultValue = 'package '+ ZTREE.getTreePath(_file).split('/')[0] +';';
                treeLinkEditor.push({
                    "name": _name, 
                    "file": _file,
                    "filePath": ZTREE.getTreePath(_file),
                    "record": _name + 'Record', 
                    "replay": _name + 'Replay'
                });
                // 判断是否是播放页面,如果是则不显示录制区相关dom
                if(!isReplayPage){
                    recordTemplate += '<div id="'+ _name +'RecordWrap"><textarea id="'+ _name + 'Record" title="'+ _name +'" style="display: none;">'+defaultValue+'</textarea></div>'
                }

                replayTemplate += '<div id="'+ _name +'ReplayWrap"><textarea id="'+ _name + 'Replay" title="'+ _name +'" style="display: none;"></textarea></div>'
            }
        }
        // 判断是否是播放页面,如果是则不显示录制区相关dom
        if(!isReplayPage){
            $('#recordzone').append(recordTemplate);
        }
        $('#replayzone').append(replayTemplate);
        
        // 生成 CodeMirror
        for (var i = 0; i < treeLinkEditor.length; i++) {
            // 判断是否是播放页面,如果是则不显示录制区相关dom
            if(!isReplayPage){
                treeLinkEditor[i].CodeMirrorRecord = CodeMirror.fromTextArea($('#' + treeLinkEditor[i].record)[0], {
                    value: '',
                    mode: "text/x-java",
                    lineNumbers: true,
                    smartIndent: false,
                    onChange: function(em, changeobj) {

                    },
                    onFocus: function(em) {
                        // console.log('onFocus');
                        // console.log(em);
                    },
                    onCursorActivity: function(em) {
                        // console.log('onCursorActivity');
                        // console.log(em);
                    }
                });
                treeLinkEditor[i].CodeMirrorRecordId = treeLinkEditor[i].record + 'CodeMirror';
                $('#' + treeLinkEditor[i].record).next().attr('id', treeLinkEditor[i].CodeMirrorRecordId).hide();
            }

            treeLinkEditor[i].CodeMirrorReplay = CodeMirror.fromTextArea($('#' + treeLinkEditor[i].replay)[0], {
                value: '',
                mode: "text/x-java",
                lineNumbers: true,
                smartIndent: false,
                onChange: function(em, changeobj) {
                },
                onFocus: function(em) {
                },
                onCursorActivity: function(em) {
                }
            });
            treeLinkEditor[i].CodeMirrorReplayId = treeLinkEditor[i].replay + 'CodeMirror';
            $('#' + treeLinkEditor[i].replay).next().attr('id', treeLinkEditor[i].CodeMirrorReplayId).hide();
        }
        // treeLinkEditor[0].CodeMirrorEditor.hide()
        // 默认显示第一个文件夹的第一个文件
        ZTREE.showEdite();
    }

    window.gxbIde = gxbIde;

})(window)