 |
|
 |
 |
|
|
 Carla Mott's BlogApril 2008 ArchivesjMaki at JavaOnePosted by carlavmott on April 29, 2008 at 12:47 AM | Permalink | Comments (1)Community One day and JavaOne are just around the corner. Community One day is a free event so we hope you will come out and learn about jMaki, GlassFish and NetBeans. Come to Moscone Center on Monday May 5 for many interesting sessions. Greg and I will be speaking along with some folks from the community.
JavaOne runs Tuesday May 6 - May 9 also at Moscone Center. There's lots of ways to learn about jMaki this year. There are sessions and Hands on labs to help you learn more. Also look for jMaki in the general session on Tuesday.
Loading data into jMaki widgetsPosted by carlavmott on April 16, 2008 at 05:22 PM | Permalink | Comments (0)I've gotten a few questions about how to get datainto jMaki widgets. This blogs describes the different ways in jMaki to load data into widgets. Let's look at the JSP tag for including a jMaki accordionMenu widget in your web application. <a:widget name="jmaki.accordionMenu"
value="{menu : [
{label: 'Links',
menu: [
{ label : 'Sun.com',
href : 'http://www.sun.com'},
{ label : 'jMaki.com',
href : 'http://www.jmaki.com'}
]
},
{label: 'Actions',
menu: [
{ label : 'Select',
action :{topic: '/foo/select',
message: { targetId : 'bar'}}
},
{ label :'Set Content',
action :{topic: '/foo/setContent',
message: { value : 'test.jsp'}}
}
]}
]
}" />
jMaki uses the attributes value and service to pass data to the widgets wrappers. The value attribute is used when the data is located in the page itself and therefore static. We use this feature in the code snippet that is dropped into a page when using an IDE so we don't have to provide a server side component just to get the widget to render correctly. The code snipet allows users to start with a working example which can be easily modified to learn more about the widget and the data model for that widget. In the tag above the value attribute is set equal to the JSON representation of the data described in the data models for that widget. The data model pages describe the format for the different widgets in jMaki. All the code snipets provided for the IDE follow the data models for the supported platforms, Java, PHP and Ruby. The value attribute can also be passed a client side value expression. I described how to use the value expression in my last blog, How to load blog feeds into jMaki widgets. Basically, the data is loaded into a local JavaScript variable which is assigned to the value attribute using the "@" character. Often you will want to load data that is not statically located in the page and in jMaki this is done through the service attribute. The next example shows how to get data from a server side component in your application. The tag above now becomes: <a:widget name="jmaki.accordionMenu"
service="data.jsp" />
As a quick example I will put the data I want to load into the file data.jsp as follows: {menu : [
{label: 'Links',
menu: [
{ label : 'Sun.com',
href : 'http://www.sun.com'},
{ label : 'jMaki.com',
href : 'http://www.jmaki.com'}
]
},
{label: 'Actions',
menu: [
{ label : 'Select',
action :{topic: '/foo/select',
message: { targetId : 'bar'}}
},
{ label :'Set Content',
action :{topic: '/foo/setContent',
message: { value : 'test.jsp'}}
}
]}
]
}
What really is happening here is when data.jsp is processed non-JSP commands are echoed out as they appear in the file. As a result the data I need is returned in JSON format which is what the widget is expecting. This is just an easy way to see how to use the service attribute without having to write a server side component. In reality, you will have to collect the data, format in JSON and print it out. The jMaki 1.1 release contains Java helper classes to create JSON object literals. You can also take a look at Jennifer's blog. The main point is that getting data from a server side component is done using the service attribute. In PHP the same thing can be done as follows: <?php addWidget( array("name" => "jmaki.accordionMenu",
"service" => "data.php"
));
?>
The data is in a file called data.php (notice it looks just like data.jsp).
{menu : [
{label: 'Links',
menu: [
{ label : 'Sun.com',
href : 'http://www.sun.com'},
{ label : 'jMaki.com',
href : 'http://www.jmaki.com'}
]
},
{label: 'Actions',
menu: [
{ label : 'Select',
action :{topic: '/foo/select',
message: { targetId : 'bar'}}
},
{ label :'Set Content',
action :{topic: '/foo/setContent',
message: { value : 'test.php'}}
}
]}
]
}
The jMaki runtime passes the attributes from the tag to the widget constructors. In the case of the service attribute, the widgets make a jmaki.doAjax call to retrieve the data when the widget is initialized. To update the data once the widget has been initialized, you can write a handler which makes additional jmaki.doAjax calls and sends that data to the widget. See my blog on How to implement data pagination in jMaki tables for an example. jMaki also provides an XMLHttpProxy so you can safely and easily access RESTful Web Services outside the application domain. To access a service through the proxy you use the service attribute too. In this case the tag looks like:
<a:widget name="jmaki.accordionMenu"
service="/xhp?id=rss" />
By design you will need to use a token key to identify the service to access. The token key is specified in a file called xhp.json in the resources directory. An entry in the xhp.json file looks like: {"id": "rss",
"url":"http://weblogs.java.net/blog/ludo/index.rdf",
"xslStyleSheet": "rss.xsl"
}
The id is "rss" and this entry specifies the name of the style sheet to apply to the returned data by the proxy. In this example, the data is coming back as XML so we want to convert it to JSON. The current style sheet recognizes RSS 1, RSS2, ATOM 1 and ATOM 2 and converts the XML data to JSON. The style sheet is called rss.xsl and is called by the proxy server before the data is handed to the widget.
See Arun's blog jMaki - Accessing External Services for more details on how to access external services using jMaki.
| |
 java.net RSS Feeds
|
