itsnat--自定义控件入门和友好的url

As I see that itsnat referred this post as their tutorial, so I post a copy that in english, you can view it at  itsnat -- Custom components and friendly URLs .

 

itsnat 是个很有意思的java web框架,实现了“浏览器就是服务器”(The Browser Is The Server TBITS),在服务器端模仿了一个一般概念的W3C Java 浏览器,客户端动作通过AJAX发送到服务器端,并且转换为W3C Java DOM动作,在DOM服务器端改变结果自动发送到客户端,用JavaScript 更新客户端DOM。

要自定义一个组件,需要如下步骤:

1:监听模板

Java代码

String html = "E:/projects/ItsNat/wb/test/WebRoot/apps/pto/frontpage.html"; 
       ItsNatDocumentTemplate docTemplate = getItsNatHttpServlet().registerItsNatDocumentTemplate("pto","text/html", html); 
docTemplate.addItsNatServletRequestListener(new ItsNatServletRequestListener(){ 

            public void processRequest(ItsNatServletRequest request, ItsNatServletResponse response) 
            { 
                ItsNatComponentManager manager = request.getItsNatDocument().getItsNatComponentManager(); 
                manager.createItsNatComponentById("dialog"); 
//遇到id=dialog则创建组件 


                String [] ss = request.getUserValueNames(); 
                for (int i = 0 ; i < ss.length ; i++) 
                { 
                    System.out.println("gdfdf:"+ss[i]);    
                }                                
            }            
       }); 

2: 注册组件模板:

Java代码

       html = "E:/projects/ItsNat/wb/test/WebRoot/apps/pto/dialog.html"; 
       getItsNatHttpServlet().registerItsNatDocFragmentTemplate("dialog", "text/html" ,html); 
       docTemplate.setAutoBuildComponents(false); 


3:监听创建组建事件,返回自定义的组件:

Java代码

            docTemplate.addCreateItsNatComponentListener(new CreateItsNatComponentListener(){ 

            public ItsNatComponent after(ItsNatComponent comp) 
            { 
                // TODO Auto-generated method stub 
                return null; 
            } 

            public ItsNatComponent before(Node node, String compType, NameValue[] artifacts, 
                                            ItsNatComponentManager compMgr) 
            { 
                if (node.getNodeType() != Node.ELEMENT_NODE) 
                    return null; 

                Element elem = (Element)node; 

                String id = elem.getAttribute("id"); 
                if ("wcsa:dialog".equalsIgnoreCase(id)) 
                { 
                     
                    return new Dialog(elem,compMgr); 
//创建自定义组件dialog 
                } 
                 
//                if ((compType != null) && compType.equals("dialog")) 
//                    return new Dialog(node,compMgr); 
                
                return null; 
            } 
                       
       }); 

4 :dialog模板:

Html代码

<div id="dr"> 
    dfdfdf 
    <button id="db" >dd</button> 
</div> 

5 :dialog组件类:
Java代码
>package test; import java.beans.PropertyChangeListener; import java.beans.VetoableChangeListener; import org.itsnat.comp.ItsNatComponent; import org.itsnat.comp.ItsNatComponentManager; import org.itsnat.comp.ItsNatComponentUI; import org.itsnat.core.ItsNatDocFragmentTemplate; import org.itsnat.core.ItsNatDocument; import org.itsnat.core.ItsNatServlet; import org.itsnat.core.event.CustomParamTransport; import org.itsnat.core.event.ItsNatEvent; import org.itsnat.core.event.ParamTransport; import org.w3c.dom.Document; import org.w3c.dom.DocumentFragment; import org.w3c.dom.Element; import org.w3c.dom.Node; import org.w3c.dom.events.Event; import org.w3c.dom.events.EventListener; import org.w3c.dom.events.EventTarget; public class Dialog implements ItsNatComponent { protected ItsNatComponentManager compMgr; private DocumentFragment frag; private Element root; private Element parent; public Dialog(Element parent,ItsNatComponentManager compMgr) { this.parent = parent; this.compMgr = compMgr; ItsNatDocument itsNatDoc = compMgr.getItsNatDocument(); Document doc = itsNatDoc.getDocument(); ItsNatServlet servlet = itsNatDoc.getItsNatDocumentTemplate().getItsNatServlet(); ItsNatDocFragmentTemplate docFragTemplate = servlet.getItsNatDocFragmentTemplate("dialog"); frag = docFragTemplate.loadDocumentFragment(itsNatDoc); parent.appendChild(frag); root = doc.getElementById("dr"); itsNatDoc.addEventListener((EventTarget)root, "click", new EventListener(){ 添加了dom点击事件 public void handleEvent(Event evt) { ItsNatEvent e = ((ItsNatEvent)evt); Object ss = (String)e.getExtraParam("1");//获得参数 // System.out.println(pp.getScriptCode()); System.out.println("---" + ss); } } , false,new CustomParamTransport("1","
quot;hello

 

 

实现友好的url :

目前itsnat通过请求中的参数itsnat_doc_name

来确定模板,

要实现友好的url,需要注册一个全局监听器来设置request的itsnat_doc_name

键值并重新处理请求来指定模板:

Java代码

       ItsNatServletContext itsNatCtx = itsNatConfig.getItsNatServletContext(); 
       itsNatCtx.setMaxOpenDocumentsBySession(5); // To limit the memory of bots identified as legitimate browsers and abusive users 

       itsNatServlet.addItsNatServletRequestListener(new GlobalItsNatServletRequestListener()); 


Java代码

package test; 


import javax.servlet.ServletRequest; 

import org.itsnat.core.ItsNatDocument; 
import org.itsnat.core.ItsNatServlet; 
import org.itsnat.core.ItsNatServletRequest; 
import org.itsnat.core.ItsNatServletResponse; 
import org.itsnat.core.event.ItsNatServletRequestListener; 

public class GlobalItsNatServletRequestListener implements ItsNatServletRequestListener 
{ 

    public void processRequest(ItsNatServletRequest itsNatServletRequest, ItsNatServletResponse itsNatServletResponse) 
    { 
        ItsNatDocument itsNatDoc = itsNatServletRequest.getItsNatDocument(); 
        ServletRequest request = itsNatServletRequest.getServletRequest(); 
        ItsNatServlet servlet = itsNatServletResponse.getItsNatServlet(); 
        
        if (itsNatDoc != null) 
        { 

        } 
        else 
        {            
            String p = request.getParameter("p"); 
            request.setAttribute("itsnat_doc_name", 

p);
servlet.processRequest(request, itsNatServletResponse.getServletResponse());
}
}

}

上面的例子使用参数p来决定请求属于哪个template键


Total views.

© 2013 - 2018. All rights reserved.

Powered by Hydejack v6.6.1