server/org.argeo.slc.ria/src/argeo-ria-lib/jcr/class/org/argeo/jcr/ria/views/PlainXmlViewer.js

   1 qx.Class.define("org.argeo.jcr.ria.views.PlainXmlViewer", {
   2         extend : qx.ui.container.Composite,
   3         implement : [org.argeo.ria.components.IView],
   4
   5         properties : {
   6                 /**
   7                  * The commands definition Map that will be automatically added and wired to the menubar and toolbar.
   8                  * See {@link org.argeo.ria.event.CommandsManager#definitions} for the keys to use for defining commands.
   9                  */
  10                 commands : {
  11                         init : {
  12                                 "close" : {
  13                                         label           : "Close",
  14                                         shared          : true,
  15                                         icon            : "org.argeo.slc.ria/window-close.png",
  16                                         shortcut        : "Control+w",
  17                                         enabled         : true,
  18                                         menu            : null,
  19                                         toolbar         : null,
  20                                         callback        : function(e){
  21                                                 org.argeo.ria.components.ViewsManager.getInstance().getViewPaneById("editor").closeCurrent();
  22                                         },
  23                                         command         : null
  24                                 }
  25                         }
  26                 },
  27                 viewSelection : {
  28                         nullable:false,
  29                         check:"org.argeo.ria.components.ViewSelection"
  30                 },
  31                 instanceId : {
  32                         init:"XmlEditor",
  33                         event : "changeInstanceId"
  34                 },
  35                 instanceLabel : {
  36                         init:"Xml Editor",
  37                         event : "changeInstanceLabel"
  38                 }
  39         },
  40
  41         construct : function(){
  42                 this.base(arguments);
  43         },
  44
  45         members : {
  46                 /**
  47                  * The implementation should contain the GUI initialisation.
  48                  * This is the role of the manager to actually add the graphical component to the pane,
  49                  * so it's not necessary to do it here.
  50                  * @param viewPane {org.argeo.ria.components.ViewPane} The pane manager
  51                  * @param data {Mixed} Any object or data passed by the initiator of the view
  52                  * @return {Boolean}
  53                  */
  54                 init : function(viewPane, jcrNode){
  55                         this._viewPane = viewPane;
  56                         this.setViewSelection(new org.argeo.ria.components.ViewSelection(viewPane.getViewId()));
  57                         this.setLayout(new qx.ui.layout.VBox());
  58
  59                         this.setInstanceId("edit:" + jcrNode.getPath());
  60                         this.setInstanceLabel("Node '" + jcrNode.getName()+"'");
  61
  62                         this.htmlPane = new qx.ui.embed.Html();
  63                         this.htmlPane.setOverflow("auto", "auto");
  64                         this.htmlPane.setDecorator("input");
  65                         this.add(this.htmlPane, {flex:1});
  66
  67                 },
  68                 /**
  69                  * The implementation should contain the real data loading (i.o. query...)
  70                  * @return {Boolean}
  71                  */
  72                 load : function(jcrNode){
  73                         // Load full XML (deep)
  74                         //jcrNode.load(-1);
  75                         var fakeNode = new org.argeo.jcr.ria.model.Node(jcrNode.getName(), jcrNode.getNodeProvider(), true);
  76                         fakeNode.setPath(jcrNode.getPath());
  77                         fakeNode.addListener("changeLoadState", function(event){
  78                                 if(event.getData() == "loaded"){
  79                                         var xmlString = fakeNode.toXmlString(true);
  80                                         this._loadXmlString(xmlString);
  81                                 }
  82                         }, this);
  83                         fakeNode.load(-1);
  84                 },
  85
  86                 _loadXmlString : function(xmlString){
  87                     var TAG_START_PATTERN = new RegExp("<([0-9a-zA-Z\.:]+)([^>]*)>", "gi");
  88                     var TAG_END_PATTERN = new RegExp("</([0-9a-zA-Z\.:]+)>", "gi");
  89                     var TAG_CLOSE_PATTERN = new RegExp("(/?>)", "gi");
  90                     var TAG_ATTRIBUTE = new RegExp("\\s([0-9a-zA-Z:_]+)\\=\"([^\"]*)\"", "gi");
  91                     // Not implemented yet
  92                     var TAG_COMMENT = new RegExp("(<!--.*-->)", "gi");
  93                     var TAG_CDATA_START = new RegExp("(\\<!\\[CDATA\\[).*", "gi");
  94                     var TAG_CDATA_END = new RegExp(".*(]]>)", "gi");
  95
  96                     xmlString = xmlString.replace(TAG_START_PATTERN, 'xml_div_begin&lt;xml_tagname_begin$1xml_tagname_end$2&gt;');
  97                     xmlString = xmlString.replace(TAG_END_PATTERN, '&lt;/xml_tagname_begin$1xml_tagname_end&gt;xml_div_end');
  98                     xmlString = xmlString.replace(TAG_CLOSE_PATTERN, '&gt;');
  99
 100                     xmlString = xmlString.replace(TAG_ATTRIBUTE, ' xml_attname_begin$1xml_attname_end="xml_attvalue_begin$2xml_attvalue_end"');
 101
 102                         //xmlString = qx.xml.String.escape(xmlString);
 103                         xmlString = xmlString.replace(new RegExp("(xml_div_begin)", "g"), '<div style="padding:1px;line-height:17px;padding-left:15px;">');
 104                         xmlString = xmlString.replace(new RegExp("(xml_div_end)", "g"), '</div>');
 105                         xmlString = xmlString.replace(new RegExp("(xml_tagname_begin)", "g"), '<b style="color:rgb(63,127,127);">');
 106                         xmlString = xmlString.replace(new RegExp("(xml_tagname_end)", "g"), '</b>');
 107                         xmlString = xmlString.replace(new RegExp("(xml_attname_begin)", "g"), '<b>');
 108                         xmlString = xmlString.replace(new RegExp("(xml_attname_end)", "g"), '</b>');
 109                         xmlString = xmlString.replace(new RegExp("(xml_attvalue_begin)", "g"), '<span style="color:rgb(0,0,255)">');
 110                         xmlString = xmlString.replace(new RegExp("(xml_attvalue_end)", "g"), '</span>');
 111                         xmlString = '<div style="margin-left:-10px;">' + xmlString + '</div>';
 112                         this.htmlPane.setHtml(xmlString);
 113                         var call = new qx.util.DeferredCall(function(){
 114                                 var htmlDom = this.htmlPane.getContentElement().getDomElement();
 115                                 var spans = qx.bom.Selector.query("span", htmlDom);
 116                                 for(var i=0;i<spans.length;i++){
 117                                         var oThis = this;
 118                                         spans[i].onclick = function(){oThis._setAttributesSpanEditable(this)};
 119                                 }
 120                         }, this);
 121                         call.schedule();
 122                 },
 123
 124                 _setAttributesSpanEditable : function(span){
 125                         var width = qx.bom.element.Dimension.getWidth(span);
 126                         var value = span.innerHTML;
 127                         qx.bom.element.Style.set(span, "display", "none");
 128                         var input = qx.bom.Element.create("input", {value:value, style:'width:'+width+'px;height:14px;border-width:1px;padding:0px;font-size:11px;'});
 129                         //var input = new qx.html.Input("text");
 130                         //input.setStyles({width:width+'px', height:'14px', borderWidth:'1px', padding:'0px', fontSize:'11px'});
 131                         qx.dom.Element.insertAfter(input, span);
 132                         //input.setTextSelection(0);
 133                 },
 134
 135                 /**
 136                  * Whether this component is already contained in a scroller (return false) or not (return true).
 137                  * @return {Boolean}
 138                  */
 139                 addScroll : function(){
 140                         return false;
 141                 },
 142                 /**
 143                  * Called at destruction time
 144                  * Perform all the clean operations (stopping polling queries, etc.)
 145                  */
 146                 close : function(){
 147
 148                 }
 149         }
 150
 151
 152 });