重构遍历生成表格

_server/css/editor_mode.css

@@ -167,10 +167,14 @@ div.etableInputDiv {
   border: none;
 }
 
-.etableInputDiv input {
+.etableInputDiv input[type="text"] {
 
 }
 
+.etableInputDiv input[type="checkbox"] {
+  
+}
+
 .etableInputDiv select {
   
 }

_server/editor.js

@@ -323,6 +323,10 @@ editor.prototype.guid = function() {
   });
 }
 
+editor.prototype.HTMLescape = function(str_) {
+  return String(str_).split('').map(function(v){return '&#'+v.charCodeAt(0)+';'}).join('');
+}
+
 editor.prototype.listen = function() {
 
   var uc = eui.getContext('2d');

_server/editor_mode.js

@@ -37,14 +37,39 @@ editor_mode.prototype.init_dom_ids = function(callback){
 editor_mode.prototype.objToTable_ = function(obj,commentObj){
   var outstr=["\n<tr><td>条目</td><td>注释</td><td>值</td></tr>\n"];
   var guids=[];
+  var defaultcobj={
+    _type:'textarea',
+    _data:'',
+    _string:function(args){//object~[field,cfield,vobj,cobj]
+      var thiseval = args.vobj;
+      return (typeof(thiseval) === typeof('')) && thiseval[0]==='"';
+    },
+    _leaf:function(args){//object~[field,cfield,vobj,cobj]
+      var thiseval = args.vobj;
+      if (thiseval == null || thiseval == undefined)return true;//null,undefined
+      if (typeof(thiseval) === typeof(''))return true;//字符串
+      if (Object.keys(thiseval).length === 0)return true;//数字,true,false,空数组,空对象
+      return false;
+    },
+  }
   var recursionParse = function(pfield,pcfield,pvobj,pcobj) {
     for(var ii in pvobj){
       var field = pfield+"['"+ii+"']";
-      var cfield = pcfield+"['"+ii+"']['_data']";
+      var cfield = pcfield+"['_data']['"+ii+"']";
       var vobj = pvobj[ii];
-      var cobj = pcobj[ii]['_data'];
+      var cobj = null;
-      var isleaf = checkIsLeaf(vobj,cobj);
+      if(pcobj && pcobj['_data'] && pcobj['_data'][ii]){
-      if (isleaf) {
+        cobj = Object.assign({},defaultcobj,pcobj['_data'][ii]);
+      } else {
+        if(pcobj && (pcobj['_data'] instanceof Function))cobj = Object.assign({},defaultcobj,pcobj['_data'](ii));
+        else cobj = Object.assign({},defaultcobj);
+      }
+      var args = {field:field,cfield:cfield,vobj:vobj,cobj:cobj}
+      for(var key in cobj){
+        if(key==='_data')continue;
+        if(cobj[key] instanceof Function)cobj[key]=cobj[key](args);
+      }
+      if (cobj._leaf) {
         var leafnode = editor_mode.objToTr_(obj,commentObj,field,cfield,vobj,cobj);
         outstr.push(leafnode[0]);
         guids.push(leafnode[1]);
@@ -55,6 +80,93 @@ editor_mode.prototype.objToTable_ = function(obj,commentObj){
     }
   }
   recursionParse("","",obj,commentObj);
+  var checkRange = function(evalstr,thiseval){
+    if(evalstr){
+      return eval(evalstr);
+    }
+    return true;
+  }
+  var listen = function(guids) {
+    guids.forEach(function(guid){
+      // tr>td[title=field]
+      //   >td[title=comment,cobj=cobj:json]
+      //   >td>div>input[value=thiseval]
+      var thisTr = document.getElementById(guid);
+      var input = thisTr.children[2].children[0].children[0];
+      var field = thisTr.children[0].getAttribute('title');
+      var cobj = JSON.parse(thisTr.children[1].getAttribute('cobj'));
+      input.onchange = function(){
+        var node = thisTr.parentNode;
+        while (!editor_mode._ids.hasOwnProperty(node.getAttribute('id'))) {
+          node = node.parentNode;
+        }
+        editor_mode.onmode(editor_mode._ids[node.getAttribute('id')]);
+        var thiseval=null;
+        if(input.checked!=null)input.value=input.checked;
+        try{
+          thiseval = JSON.parse(input.value);
+        }catch(ee){
+          printe(field+' : '+ee);
+          throw ee;
+        }
+        if(checkRange(cobj._range,thiseval)){
+          editor_mode.addAction(['change',field,thiseval]);
+        } else {
+          printe(field+' : 输入的值不合要求,请鼠标放置在注释上查看说明');
+        }
+      }
+      input.ondblclick = function(){
+        if(cobj.type==='event')editor_blockly.import(guid,{type:cobj._event});
+        if(cobj.type==='textarea')editor_multi.import(guid,{lint:cobj._lint});
+        
+      }
+    });
+  }
+  return {"HTML":outstr.join(''),"guids":guids,"listen":listen};
+}
+
+editor_mode.prototype.objToTr_ = function(obj,commentObj,field,cfield,vobj,cobj){
+  var guid = editor.guid();
+  var thiseval = vobj;
+  var comment = cobj._data;
+
+  var charlength=10;
+
+  var shortField = field.split("']").slice(-2)[0].split("['").slice(-1)[0];
+  shortField = (shortField.length<charlength?shortField:shortField.slice(0,charlength)+'...');
+
+  var commentHTMLescape=editor.HTMLescape(comment);
+  var shortCommentHTMLescape=(comment.length<charlength?commentHTMLescape:editor.HTMLescape(comment.slice(0,charlength))+'...');
+
+  var cobjstr = Object.assign({},cobj);
+  delete cobjstr._data;
+  cobjstr = editor.HTMLescape(JSON.stringify(cobjstr));
+
+  var outstr=['<tr id="',guid,'"><td title="',field,'">',shortField,'</td>',
+  '<td title="',commentHTMLescape,'" cobj="',cobjstr,'">',shortCommentHTMLescape,'</td>',
+  '<td><div class="etableInputDiv">',editor_mode.objToTd_(obj,commentObj,field,cfield,vobj,cobj),'</div></td></tr>\n',
+  ];
+  return [outstr.join(''),guid];
+}
+
+editor_mode.prototype.objToTd_ = function(obj,commentObj,field,cfield,vobj,cobj){
+  var thiseval = vobj;
+  if(cobj._select){
+    var values = cobj._select.values;
+    var outstr = ['<select>\n',"<option value='",JSON.stringify(thiseval),"'>",JSON.stringify(thiseval),'</option>\n'];
+    values.forEach(function(v){
+      outstr.push(["<option value='",JSON.stringify(v),"'>",JSON.stringify(v),'</option>\n'].join(''))
+    });
+    outstr.push('</select>');
+    return outstr.join('');
+  } else if(cobj._input){
+    return ["<input type='text' spellcheck='false' value='",JSON.stringify(thiseval),"'/>\n"].join('');
+  } else if(cobj._bool){
+    return ["<input type='checkbox' ",(thiseval?'checked ':''),"/>\n"].join('');
+  } else {
+    var num = 0;//editor_mode.indent(field);
+    return ["<textarea spellcheck='false' >",JSON.stringify(thiseval,null,num),'</textarea>\n'].join('');
+  }
 }
 
 editor_mode.prototype.objToTable = function(obj,commentObj){
@@ -149,8 +261,8 @@ editor_mode.prototype.objToTr = function(obj,commentObj,field){
   var shortField = field.split("']").slice(-2)[0].split("['").slice(-1)[0];
   shortField = (shortField.length<charlength?shortField:shortField.slice(0,charlength)+'...');
 
-  var commentHTMLescape=comment.split('').map(function(v){return '&#'+v.charCodeAt(0)+';'}).join('');
+  var commentHTMLescape=editor.HTMLescape(comment);
-  var shortCommentHTMLescape=(comment.length<charlength?commentHTMLescape:comment.slice(0,charlength).split('').map(function(v){return '&#'+v.charCodeAt(0)+';'}).join('')+'...');
+  var shortCommentHTMLescape=(comment.length<charlength?commentHTMLescape:editor.HTMLescape(comment.slice(0,charlength))+'...');
 
   var outstr=['<tr id="',guid,'"><td title="',field,'">',shortField,'</td>',
   '<td title="',commentHTMLescape,'">',shortCommentHTMLescape,'</td>',