function ModelToWireframe(model, editor) {

    var xml = '<WireframeMeta><WireframeModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></WireframeModel></WireframeMeta>';
    var doc = mxUtils.parseXml(xml);
    var wireframe = doc.documentElement;
    var root = wireframe.getElementsByTagName('root')[0];
    
    var childMap = {};
    for (var key in model.edges) {
        if (model.edges.hasOwnProperty(key)) {
            var edge = model.edges[key];
            if (edge.type === 'hasChild') {
                childMap[edge.target] = edge.source;
            }
        }
    }

    for (var key in model.nodes) {
        if (model.nodes.hasOwnProperty(key)) {
            var node = model.nodes[key];
            switch(node.type){
                case 'Widget':{
                    wireframe.setAttribute('height', Util.GetValueFormAttributes(node, 'height'));
                    wireframe.setAttribute('width', Util.GetValueFormAttributes(node, 'width'));
                    wireframe.setAttribute('id', key);
                    break;
                }
                case 'HTML Element':{
                    var type = Util.GetValueFormAttributes(node, 'type');
                    var Ctor = editor.getUIComponentFromHTMLName(type);
                    if(Ctor){
                        var ui = new Ctor();
                        ui.setId(key);
                        var doc = mxUtils.parseXml(ui.toXML());
                        var uiObj = doc.documentElement;
                        
                        //geometry
                        uiObj.lastElementChild.firstChild.setAttribute('x', 0);
                        uiObj.lastElementChild.firstChild.setAttribute('y', 0);

                        //tagRoot
                        var collaborative = Util.GetValueFormAttributes(node, 'collaborative');
                        if(collaborative){
                            var sharedTagXml = '<tagObj id="'+ key + '_'+ Util.GUID() +'" parent="#" tagType="Shared" isUnique="true"/>';
                            var tagObj = mxUtils.parseXml(sharedTagXml).documentElement;
                            uiObj.firstChild.appendChild(tagObj);
                        }

                        if(childMap.hasOwnProperty(key))
                            uiObj.lastElementChild.setAttribute('parent', childMap[key]);
                        else uiObj.lastElementChild.setAttribute('parent', '1');
                        
                        if(ui.constructor.name === 'DivContainer')
                            root.prepend(uiObj);
                        else
                            root.appendChild(uiObj);
                    }
                    break;
                }
            }
        }
    }

   //return mxUtils.getPrettyXml(wireframe);
   return mxUtils.getXml(wireframe);
}
/**
 * Transform a frontend component model from syncmeta to a wireframe XML
 * @param {Object} model the front end component model 
 * @param {mxEditor} editor the editor
 * @return {XMLDocument} the wireframe model as XML
 */
Transform a frontend component model from syncmeta to a wireframe XML
@param {Object} model the front end component model
@param {mxEditor} editor the editor
@return {XMLDocument} the wireframe model as XML
Transform a frontend component model from syncmeta to a wireframe XML @param { Object } model the front end component model @param { mxEditor } editor the editor @return { XMLDocument } the wireframe model as XML
function ModelToWireframe(model, editor) {
    var xml = '<WireframeMeta><WireframeModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></WireframeModel></WireframeMeta>';
    var doc = mxUtils.parseXml(xml);
    var wireframe = doc.documentElement;
    var root = wireframe.getElementsByTagName('root')[0];
    var childMap = {};
    for (var key in model.edges) {
        if (model.edges.hasOwnProperty(key)) {
            var edge = model.edges[key];
            if (edge.type === 'hasChild') {
                childMap[edge.target] = edge.source;
            }
        }
    }
    for (var key in model.nodes) {
        if (model.nodes.hasOwnProperty(key)) {
            var node = model.nodes[key];
            switch(node.type){
                case 'Widget':{
                    wireframe.setAttribute('height', Util.GetValueFormAttributes(node, 'height'));
                    wireframe.setAttribute('width', Util.GetValueFormAttributes(node, 'width'));
                    wireframe.setAttribute('id', key);
                    break;
                }
                case 'HTML Element':{
                    var type = Util.GetValueFormAttributes(node, 'type');
                    var Ctor = editor.getUIComponentFromHTMLName(type);
                    if(Ctor){
                        var ui = new Ctor();
                        ui.setId(key);
                        var doc = mxUtils.parseXml(ui.toXML());
                        var uiObj = doc.documentElement;
                        uiObj.lastElementChild.firstChild.setAttribute('x', 0);
                        uiObj.lastElementChild.firstChild.setAttribute('y', 0);
                        var collaborative = Util.GetValueFormAttributes(node, 'collaborative');
                        if(collaborative){
                            var sharedTagXml = '<tagObj id="'+ key + '_'+ Util.GUID() +'" parent="#" tagType="Shared" isUnique="true"/>';
                            var tagObj = mxUtils.parseXml(sharedTagXml).documentElement;
                            uiObj.firstChild.appendChild(tagObj);
                        }
                        if(childMap.hasOwnProperty(key))
                            uiObj.lastElementChild.setAttribute('parent', childMap[key]);
                        else uiObj.lastElementChild.setAttribute('parent', '1');
                        if(ui.constructor.name === 'DivContainer')
                            root.prepend(uiObj);
                        else
                            root.appendChild(uiObj);
                    }
                    break;
                }
            }
        }
    }
   return mxUtils.getXml(wireframe);
}
function ModelToWireframe ( model , editor ) { var xml = '<WireframeMeta><WireframeModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></WireframeModel></WireframeMeta>' ; var doc = mxUtils . parseXml ( xml ) ; var wireframe = doc . documentElement ; var root = wireframe . getElementsByTagName ( 'root' ) [ 0 ] ; var childMap = { } ; for ( var key in model . edges ) { if ( model . edges . hasOwnProperty ( key ) ) { var edge = model . edges [ key ] ; if ( edge . type === 'hasChild' ) { childMap [ edge . target ] = edge . source ; } } } for ( var key in model . nodes ) { if ( model . nodes . hasOwnProperty ( key ) ) { var node = model . nodes [ key ] ; switch ( node . type ) { case 'Widget' : { wireframe . setAttribute ( 'height' , Util . GetValueFormAttributes ( node , 'height' ) ) ; wireframe . setAttribute ( 'width' , Util . GetValueFormAttributes ( node , 'width' ) ) ; wireframe . setAttribute ( 'id' , key ) ; break ; } case 'HTML Element' : { var type = Util . GetValueFormAttributes ( node , 'type' ) ; var Ctor = editor . getUIComponentFromHTMLName ( type ) ; if ( Ctor ) { var ui = new Ctor ( ) ; ui . setId ( key ) ; var doc = mxUtils . parseXml ( ui . toXML ( ) ) ; var uiObj = doc . documentElement ; uiObj . lastElementChild . firstChild . setAttribute ( 'x' , 0 ) ; uiObj . lastElementChild . firstChild . setAttribute ( 'y' , 0 ) ; var collaborative = Util . GetValueFormAttributes ( node , 'collaborative' ) ; if ( collaborative ) { var sharedTagXml = '<tagObj id="' + key + '_' + Util . GUID ( ) + '" parent="#" tagType="Shared" isUnique="true"/>' ; var tagObj = mxUtils . parseXml ( sharedTagXml ) . documentElement ; uiObj . firstChild . appendChild ( tagObj ) ; } if ( childMap . hasOwnProperty ( key ) ) uiObj . lastElementChild . setAttribute ( 'parent' , childMap [ key ] ) ; else uiObj . lastElementChild . setAttribute ( 'parent' , '1' ) ; if ( ui . constructor . name === 'DivContainer' ) root . prepend ( uiObj ) ; else root . appendChild ( uiObj ) ; } break ; } } } } return mxUtils . getXml ( wireframe ) ; }
Transform a frontend component model from syncmeta to a wireframe XML
 @param {Object} model the front end component model
 @param {mxEditor} editor the editor
 @return {XMLDocument} the wireframe model as XML
Transform a frontend component model from syncmeta to a wireframe XML @param { Object } model the front end component model @param { mxEditor } editor the editor @return { XMLDocument } the wireframe model as XML
//geometry //tagRoot //return mxUtils.getPrettyXml(wireframe);