Creating new Parent dynamically while adding child.

54 views
Skip to first unread message

dyapa srikanth

unread,
Oct 16, 2013, 8:57:59 AM10/16/13
to maqett...@googlegroups.com

Hi all,

I want to wrap a div(widget) around the widget(button) while adding it to another div(widget), Is there any way to do that.

Ex:

tRow (Parent widget)
html button (child)
tCell (need to wrap child)

How can I add tCell as child to tRow when button adding to tRow. Then make button as child to tCell instead of tRow (something like reparent)?

I tried with helper classes (tRowHelper:addChild), but unable to create tCell widget dynamically and add it as child to tRow.

Please help me,

Regards,
Srikanth D.

Bill Reed

unread,
Oct 16, 2013, 9:36:06 AM10/16/13
to maqett...@googlegroups.com
I would think it would be easier to add a new widget to widget.json called TcellButton something like:

 {
            "name": "<TcellButton>",
            "description": "Defines a standard cell in an HTML table with a HTML button",
            "type": "html.td",
            "category": "html",
            "collection": "html",
            "tags": "<td>",
            "children": [
                {
                    "type": "html.button",
                }
            ],
            "icon": "resources/images/html-table.png",
            "iconBase64": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAXhJREFUeNrEUz1LA0EQnTvzO/wPYsBOrQW109ImpLPIL9DWKqQQRESEFGKjYmGwEyQggUTBRn+BIhFFTXK53Z1xZi53ulcpKdxjmXnD7Lv39iMgIhhnhDDmKKTJavXyz1KOKvNBRkCIsFWe09wxFbI1iTEy5ppB0shB69v1K18BOdTYvHvUZm1k0oi7rUwhIIkAs8VJQESfwMQxVGoXv5Le7jxAwF/yZ2aVubRxRjKYmWJrqXZyQ/3I0HtvSG8fA8Xd1z49v/ToqftJi5va/30KJhqOyGQ/WL6xCcZkCkakrMcOopyFKGKvCGLNslFrDMTGqX8hECz7AKN7YwZDnwC5uXp47XndPW17uN64zXK0zidwzsH6yozKNKxg57gFpeUi11EtHZx3YG1hKiNoNO9zx8iMcjRigWQFYuJfVAMp/jmcRf8qG90sUAWoEWUZpG8FcwRICQ7ShunSniYToiIMIb3XguXELdcKnEtM6639chD8+2v8EmAA9/wqJKl9P7kAAAAASUVORK5CYII=",
            "hidden": true,
            "resizable": "none",
            "allowedParent": "html.tr",
            "allowedChild": "ANY",
            "refreshParentOnPropChange": "html.table",
            "helper": "./html/table/CellHelper"
        },


--
You received this message because you are subscribed to the Google Groups "Maqetta Developers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to maqetta-devs...@googlegroups.com.
To post to this group, send email to maqett...@googlegroups.com.
Visit this group at http://groups.google.com/group/maqetta-devs.
For more options, visit https://groups.google.com/groups/opt_out.

Jon Ferraiolo

unread,
Oct 16, 2013, 9:57:59 AM10/16/13
to maqett...@googlegroups.com
Another approach requires changing Maqetta's source code. Right now, the widget definitions in widget.json includes allowedParent and allowedChild values to indicate that a particular widget (e.g., a Button) is only allowed to have certain parents and certain parents (e.g., TD) are only allowed to have particular children. The default settings that ship with Maqetta aren't comprehensive. It is sometimes possible for a user to drop a particular widget into a container which might cause problems.

If you want Maqetta to have additional smarts vs what is built in today, you'll need to beef up the logic in the main engine. Making those changes are likely to be somewhat of a challenge, but the place to start is to search the codebase for allowedParent and allowedChild, and try to understand what the code is doing. As I remember, the allowedParent/allowedChild logic is spread across ChooseParent.js, metadata.js, CreateTool.js and SelectTool.js, where ChooseParent.js is the most critical. ChooseParent.js decides which child is allowed in which parent while a widget drag operation is happening (e.g., dragging from the widget palette and dropping a new widget onto the canvas), and picks a different set of candidate parents depending on where the pointer is at any given moment.

Jon

dyapa srikanth

unread,
Oct 16, 2013, 10:00:37 AM10/16/13
to maqett...@googlegroups.com
Thanks for your reply billreed63,

I don't want to hardcode it. Dynamically when user drag drop a button to tRow, I need to create tCell and add it as child of tRow & add button to child of tCell instead of tRow. So that i can wrap the button with tCell.

I did the changes in CreateTool.js

if(ppw.parent && ppw.parent.type == "dojox.test.tRow"){
           
this._data = {
                    children
:[{
                        name
:this._data.name,
                        children
:this._data.children,
                        type
:this._data.type,
                        properties
:this._data.properties
                   
}],
                    type
:"dojox.test.tCell",
                    name
:"tCell",
                    properties
:{
                        style
:"position:relative;height:100%;display:inline-block;white-space:nowrap;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;border:1px dotted red;"
                   
}
           
};
       
}

It solved my problem temporarly, but is it standard solution?

Regards,
Srikanth D.
Reply all
Reply to author
Forward
0 new messages