Michael的博客

Main | Next page »

http://developers.sun.com.cn/blog/sunblade/date/20080623 星期一 六月 23, 2008

Is there really a Demo God?

I used to think this was a joke, but now I believe there must be one. Last week at Manila, I needed to do some demos for the JSF and AJAX session, which required Glassfish sever. Because my laptop is falling apart, I borrowed one and took it to Manila with my own laptop. I tested all the demos on both machines right before my session and everything worked fine. But...., when I got on the stage, it really caught me on surprise that the Glassfish failed to start, I tried the other laptop immediately, and guess what? Glassfish failed on the other laptop too! Glassfish failed on two machines at the same time? It is beyond the "Bad luck" could explain. And when I finally finish the session and got back to the speakers' room, and tried Glassfish on the borrowed laptop, it started with NO PROBLEM! And there is more, my own laptop can launch Glassfish with no problem as well now, but between now and then I did not touch it at all! Based on my unexplainable experience, I warn you that there is really a Demo God out there! Don't fool around with thy!

Posted at 12:03下午 六月 23, 2008 by Michael Li in 旅途见闻  |  Comments[0]

http://developers.sun.com.cn/blog/sunblade/date/20071204 星期二 十二月 04, 2007

NetBeans 6.0正式版发布

NetBeans 6.0正式发布了！正在下载ing...，囊括版（包含Java IDE，C/C++ IDE, Ruby IDE，UML，Mobility，SOA以及Apache Tomcat 6和Glassfish V2）总共才167.5M。

用过的IDE也有不少了，第一次这么期待正式版的发布。还记得两年前用的NetBeans 4.1, 真不敢相信NetBeans能在短短的两年间有如此翻天复地的变化！

Posted at 10:43上午 十二月 04, 2007 by Michael Li in Java  |  Comments[0]

http://developers.sun.com.cn/blog/sunblade/date/20071119 星期一 十一月 19, 2007

DWR演示脚本 （AJAX技术及架构演讲续4）

演讲幻灯片

 

DWR演示

DWR使客户端通过JavaScript调用Server端的Java对象。我脑海里闪过一个典型应用就是不再需要做两套HTML表单的验证（server端和JavaScript客户端）了，通过DWR，JavaScript可以直接调用Server端的java对象了！

 

演示准备

  1. 下载和安装NetBeans 6.0 Beta 2。NetBeans 6.0现在已进入Beta 2，很快汉化版就会随着正式版本推出。
  2. NetBeans6暂时还没有DWR的插件，我们得手动进行DWR的安装和配置。
  3. 下载dwr.jar
  4. 下载Ajax_DemoData.rar。这是一个NetBeans项目，用来给演示程序提供数据，这样就不用在演示的时候敲入数据了。这里面就包含了一个Java类：DemoDataProvider，调用DemoDataProvider.getDemoData(String prefix)方法会返回一个常用编程语言的列表。这里为了简单起见，数据都是手工录入的，在你的实际项目中数据可以来自数据库或者是web服务等动态的数据源。下载后按以下步骤安装：
        a.       解压rar文件到本地目录
          b.      在NetBeans里通过“File －> Open Project”打开这个项目。 

演示脚本

  1. 启动NetBeans。
  2. ” File” -> “New Project”。
  3. 在“New Project”对话框，左侧选“Web”，右侧选“Web Application”，然后“Next”。
  4. 在“New Web Application”对话框，“Project Name”＝DWRDemo，“Server“＝”GlassFish V2“然后“Finish”。
  5. 右键DWRDemo项目，选择“Properties”
  6. 在跳出的对话框里，加入必要的库文件。左边选择“Libraries”
    1. “Add Project”, 加入Ajax_Demo
    2. “Add JAR/Folder”,加入dwr.jar
  1. 在web.xml里加入dwr Servlet的定义。

<servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
        <init-param>
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>
    </servlet>
    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>

 

  1. 创建一个server.DataProvider.java类，内容如下：

package server;

public class DataProvider {
    public List getData(String prefix){
        return DemoDataProvider.getDemoData(prefix);
    }
}

 

  1. 在WEB-INF目录下创建dwr.xml, 文件内容如下. 客户端的JavaScript将通过Demo来调用服务器端的server.DataProvider Java对象。

<dwr>
  <allow>
    <create creator="new" javascript="Demo">
      <param name="class" value="server.DataProvider"/>
    </create>
  </allow>
</dwr>

 

  1. 用以下程序替换index.jsp. *.js文件由DWR的runtime生成。我们的server端java程序可通过Demo JavaScript对象来进行操作。蓝色程序就是AJAX Call的callback方法，dwr还提供了util方法可方便地操作HTML DOM

<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%> 

<html>
    <head>
        <title>DWR Demo</title>
        <script type='text/javascript' src='dwr/interface/Demo.js'></script>
        <script type='text/javascript' src='dwr/engine.js'></script>
        <script type='text/javascript' src='dwr/util.js'></script>
        <script language="javascript">
            function getDemoData() {
                var input = dwr.util.getValue("prefix");
                Demo.getData(input, function(data) {
                        dwr.util.setValue("result", data);
                });
            }
        </script>
    </head> 

    <body>
        <h2>DWR Demo</h2>
        <input id="prefix" type=text onkeyup='getDemoData()'/>
        <br>
        <span id="result"></span>
    </body>

</html>

 

  1. 好了，可运行程序了。

Posted at 07:07下午 十一月 19, 2007 by Michael Li in Web 2.0  |  Comments[0]

Google Web Toolkit演示脚本 （AJAX技术及架构演讲续3）

演讲幻灯片

 

Google Web Toolkit演示

 

演示准备

  1. 下载和安装NetBeans 6.0 Beta 2。NetBeans 6.0现在已进入Beta 2，很快汉化版就会随着正式版本推出。
  2. 安装GWT的NetBeans插件，此插件可通过“Tools”->”Plugins”来下载安装
  3. 下载安装Google Web Toolkit1.4.60。这是Google的包，不包含在NetBeans的插件里。在把Java程序转换成JavaScript程序时会用到这个包里的Java to JavaScript编译器。记住这个包的安装路径，创建GWT项目时需要这个信息。
  4. 下载Ajax_DemoData.rar。这是一个NetBeans项目，用来给演示程序提供数据，这样就不用在演示的时候敲入数据了。这里面就包含了一个Java类：DemoDataProvider，调用DemoDataProvider.getDemoData(String prefix)方法会返回一个常用编程语言的列表。这里为了简单起见，数据都是手工录入的，在你的实际项目中数据可以来自数据库或者是web服务等动态的数据源。下载后按以下步骤安装：
        a.       解压rar文件到本地目录
          b.      在NetBeans里通过“File －> Open Project”打开这个项目。

 

演示脚本

  1. 启动NetBeans。
  2. ” File” -> “New Project”。
  3. 在“New Project”对话框，左侧选“Web”，右侧选“Web Application”，然后“Next”。
  4. 在“New Web Application”对话框，“Project Name”＝GWTDemo，“Server“＝”GlassFish V2“然后“Next”。
  5. 在“Frameworks”对话框，选择“Google Web Toolkit”,填入“GWT Installation Folder”（Google包的安装目录），然后“Finish”.
  6. NetBeans自动生成项目并打开四个文件，关闭除了“MainEntryPoint.java”外的其它文件。
  7. 右键“GWTDemo”项目，选择“New ”->”Other…”
  8. 在跳出的对话框里选择“Google Web Toolkit”->”GWT RPC Service”, 然后点击“Next”。GWT是通过RPC来实现AJAX的异步通讯的。

 

  1. “Service Name”=GWTDataService, 去除选择“Create Usage Example Class”。点击“Finish”

 

  1. NetBeans在“client”包里生成“GWTDataService.java”和“GWTDataServiceAsyn.java”. 这是两个客户端的接口，所以放在client包里。具体实现是“server”包里的GWTDataServiceImpl.java.
  2. 在GWTDataService.java里添加如下的函数定义

public List getDemoData(String prefix);

 

  1. 在GWTDataServiceAsyn.java里添加函数定义。注意返回类型是void, 参数也多了个AsyncCallback。

public void getDemoData(String prefix, AsyncCallback callback);

 

  1. 在GWTDataServiceImpl.java加入getDemoData函数的具体实现

  public List getDemoData(String prefix) {
        return DemoDataProvider.getDemoData(prefix);
  }

 

  1. 回到MainEntryPoint.java,用下列程序替代整个onModuleLoad函数。这段程序配置了一个AsyncCallback对象并把它传给了GWTDataServiceAsync。具体API细节请参见GWT的文档。

    private FlowPanel contentPanel = new FlowPanel();   

 

    final AsyncCallback linksCallback = new AsyncCallback() {

        public void onSuccess(Object result) {

            List resultList = (List) result;

            String resultStr = resultList.toString();

            contentPanel.clear();

            contentPanel.add(new HTML(resultStr));

        }

        public void onFailure(Throwable caught) {

        }

    };  

 

    public GWTDataServiceAsync getService() {

        GWTDataServiceAsync service = (GWTDataServiceAsync) GWT.create(GWTDataService.class);

        ServiceDefTarget endPoint = (ServiceDefTarget) service;

        String serviceURL = GWT.getModuleBaseURL() + "gwtdataservice";

        endPoint.setServiceEntryPoint(serviceURL);

        return service;

    }  

 

    public void onModuleLoad() {

        HTML header = new HTML("<h1>Programming Languages:</h1>");

        final TextBox textBox = new TextBox();

        textBox.addKeyboardListener(new KeyboardListenerAdapter() {

            public void onKeyUp(Widget sender, char arg1, int arg2) {

                getService().getDemoData(textBox.getText(), linksCallback);

            }

        });

 

        RootPanel.get().add(header);

        RootPanel.get().add(textBox);

        contentPanel.setWidth("400px");

        RootPanel.get().add(contentPanel);

    }

 

  1. 好了，可运行程序了。

Posted at 06:17下午 十一月 19, 2007 by Michael Li in Web 2.0  |  Comments[0]

http://developers.sun.com.cn/blog/sunblade/date/20071115 星期四 十一月 15, 2007

Wicket演示脚本 （AJAX技术及架构演讲续2）

演讲幻灯片

 

Wicket演示

 

演示准备

  1. 下载和安装NetBeans 6.0 Beta 2。NetBeans 6.0现在已进入Beta 2，很快汉化版就会随着正式版本推出。
  2. 下载Wicket NetBeans Plugin，此插件支持Wicket1.3
  3. 下载Ajax_DemoData.rar。这是一个NetBeans项目，用来给演示程序提供数据，这样就不用在演示的时候敲入数据了。这里面就包含了一个Java类：DemoDataProvider，调用DemoDataProvider.getDemoData(String prefix)方法会返回一个常用编程语言的列表。这里为了简单起见，数据都是手工录入的，在你的实际项目中数据可以来自数据库或者是web服务等动态的数据源。下载后按以下步骤安装：
        a.       解压rar文件到本地目录
          b.      在NetBeans里通过“File －> Open Project”打开这个项目。

 

演示脚本

  1. 启动NetBeans。
  2. ” File” -> “New Project”。
  3. 在“New Project”对话框，左侧选“Web”，右侧选“Web Application”，然后“Next”。
  4. 在“New Web Application”对话框，“Project Name”＝WicketDemo，“Server“＝”GlassFish V2“然后“Next”。
  5. 在“Frameworks”对话框，选择“Wicket 1.3”,然后“Finish”.
  6. NetBeans自动生成项目并打开“index.jsp”,关闭“index.jsp”,Wicket项目的首页不是这一页。
  7. 打开”WicketDemo” -> “Source Packages”->”com.myapp.wicket”目录下的两个文件
    1. Home.html，这是页面的显示
    2. Home.java，这是页面背后相关的逻辑。Wicket的一个优点就是严格分隔显示和逻辑
  8. 在Home.html里的“<span wicket:id=’mainNavigation’/>”语句后加入下列HTML语句。如幻灯片里提到，wicket也是基于组件的框架，wicket就是通过“wicket:id=…”将一个普通的HTML tag变成Wicket组件的，每个wicket组件都需要相应的Java逻辑来支持，Java逻辑定义在和HTML文件相对印的Java源文件里，在我们的演示中就是Home.java了。

<form wicket:id="form">
      <input type="text" wicket:id="prefix"/>
       <span wicket:id="terms ">$%^&*</span>
</form>

 

  1. 在Home.java里的Home构造函数里加入以下程序。具体的Wicket API细节可古狗一下，搜索结果的第一条就是了（很火呀，考虑到wicket还有别的意思）

    public Home() {

        Form form = new Form("form");

        add(form);

        final AutoCompleteTextField field = new AutoCompleteTextField("prefix", new Model("")) {

            protected Iterator getChoices(String input) {

                List<String> result = DemoDataProvider.getDemoData(input);

                return result.iterator();

            }

        };

        form.add(field);

        final Label label = new Label("terms", field.getModel());

        label.setOutputMarkupId(true);

        form.add(label);

        field.add(new AjaxFormSubmitBehavior(form, "onchange") {

            protected void onSubmit(AjaxRequestTarget target) {

                target.addComponent(label);

            }

        });

    }

 

  1.   NetBeans会报错，是因为需要导入类。在程序编辑框里点右键，选择“Fix Imports”，然后选择需要的类，注意需要做两次“Fix Imports”. 按下图选择，要注意的是“Label”，不知为什么是灰的。

 

  1.  好了，可运行程序了，简单吧？

Posted at 07:42下午 十一月 15, 2007 by Michael Li in Web 2.0  |  Comments[0]

DynaFaces演示脚本 （AJAX技术及架构演讲续1）

离上海Sun技术日都快三个礼拜了，答应把演示材料陆续贴出的，可期间连续出差，一直没动。现刚从日本回来，总算有时间能开始兑现我的诺言了。好，废话少说，埋头干活。

演讲幻灯片

DynaFaces演示

演示准备工作

1.         下载和安装NetBeans 6.0 Beta 2。NetBeans 6.0现在已进入Beta 2，很快汉化版就会随着正式版本推出。

  1. 下载dynamicfaces02.complib。这是DynaFace的组件面板，有了它你可以把DynaFaces的组件以托拽的方式加入到你程序中去。下载后按以下步骤安装
        a.       启动NetBeans Beta 2
        b.      Tools -> Component Libraries
        c.       在对话框的左面，点击“Import…”找到已下载到本地的dynamicfaces02.complib文件，然后点击“OK”即可。
  2. 下载Ajax_DemoData.rar。这是一个NetBeans项目，用来给演示程序提供数据，这样就不用在演示的时候敲入数据了。这里面就包含了一个Java类：DemoDataProvider，调用DemoDataProvider.getDemoData(String prefix)方法会返回一个常用编程语言的列表。这里为了简单起见，数据都是手工录入的，在你的实际项目中数据可以来自数据库或者是web服务等动态的数据源。下载后按以下步骤安装：
        a.       解压rar文件到本地目录
          b.      在NetBeans里通过“File －> Open Project”打开这个项目。

演示脚本

1.      启动NetBeans。“

2.      File” -> “New Project”。

3.      在“New Project”对话框，左侧选“Web”，右侧选“Web Application”，然后“Next”。

4.      在“New Web Application”对话框，“Project Name”＝DyanFacesDemo，“Server“＝”GlassFish V2“然后“Next”。

5.      在“Frameworks”对话框，选择“Visual Web JavaServer Faces”,然后“Finish”。

6.      把Ajax_DemoData项目加到DynaFacesDemo的库中去，因为会用到它的类。

a.       右键“DynaFacesDemo”项目，在跳出窗口选择“Properties”

b.      在“Project Properties”窗口。左面选择“Libraries”；右面点击“Add Project...”，找到 Ajax_DemoData所在目录，点击“Add Project JAR File”。

c.       点击“Ok”关闭“Project Properties”对话框。

7.      在项目中加入DynaFaces面板组件。加入面板组件后就可以以托拽的方式使用DynaFaces的组件了。

a.       展开“DynaFacesDemo”项目

b.      右键“Component Libraries”目录，选择“Add Component Library...”

c.       在“Add Component Library”对话框，选择“Dynamic Faces Components(0.2)”,点击“Add Component Library”.

d.      注意“Dynamic Faces”出现在屏幕右侧的组件面板的上方。打开它，可看到“Ajax Transaction”和“Ajax Zone”两个组件。

8.      从右面组件面板里拖入下列组件,如图所示

a.       Basic  -> Label，并把显示文字改成”Programming Languages“

b.      Basic -> TextField

c.       Layout -> Layout Panel，调整框的大小

d.      ”Dynamic Faces“ -> “Ajax Transaction”，至页面空白处，这是个不显示的组件。

9.      切换到Java显示，找到prerender()方法，加入以下程序

    @Override
    public void prerender() {
        fillContent();
    }

 

 

 

10.  NetBeans这时会报错，因为fillContent（）没有定义。按下列程序加入fillContent()的定义

private void fillContent() {
        if(null != getLayoutPanel1().getChildren()){
            getLayoutPanel1().getChildren().clear();
        }
        String prefix = (String)getTextField1().getText();
        String content = DemoDataProvider.getDemoData(prefix).toString();
        Label label = new Label();
        label.setText(content);
        this.getLayoutPanel1().getChildren().add(label);
}

11.  接下来要通过DynaFaces加入AJAX的后台交互

a.       回到页面的”Design“窗口，选中”textField1“，在textField1的属性窗口内找到”onKeyUp“（在javaScript分类里），加入以下javaScript程序

DynaFaces.Tx.fire("ajaxTransaction1", "textField1")

b.      右键”textField1“，选择”Configure Ajax Transaction…“。在跳出窗口里将”Send Input“的值改为”Yes“，并”OK“。

c.       右键”layoutPanel1“，选择”Configure Ajax Transaction…“。在跳出窗口里将”Re-Render“的值改为”Yes“，并”OK“。

12.  编程完毕，右键项目选择”Run“ ，NetBeans会编辑项目并部署到Glassfish服务器上，然后打开浏览器窗口显示运用，如下图

 

Posted at 06:49下午 十一月 15, 2007 by Michael Li in Web 2.0  |  Comments[1]


Valid HTML! Valid CSS!

This is a personal weblog, I do not speak for my employer.