Embedding itmill inside existing apps

it seems that toolkit generates all the pages for the apps. Would it be posssible to embed apps into existing application as components so that they are shown inside web page controlled by other tools?

Sure… Just cut and paste the generated code (just few lines) and include that as well as the libraries into your application.

One example of that is the OpenAjax Hub compatibility test we did:

http://toolkit.itmill.com/openajax/

I need to understand this too, how exactly embedding is done? We have quite complex site constructed of jsp pages and wisth to integrate good Ajax framework into existing site without tweaking existing implementation too much. Is this the “generated code” you refer to? (taken from http://toolkit.itmill.com/demo/hello):


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><head>
<title>Hello window</title>
<NOSCRIPT><META http-equiv="refresh" content="0; url=?WA_NOSCRIPT=1" /></NOSCRIPT>
<link rel="stylesheet" href="/demo/hello/RES/base/css/base-ajax.css" type="text/css" />
<link rel="stylesheet" href="/demo/hello/RES/base/css/calendar-default.css" type="text/css" />
<script src="/demo/hello/RES/base/script/ajax-client.js" type="text/javascript"></script>
<script src="/demo/hello/RES/base/script/base-ajax-components.js" type="text/javascript"></script>
<script src="/demo/hello/RES/base/ext/jscalendar/calendar.js" type="text/javascript"></script>
<script src="/demo/hello/RES/base/ext/jscalendar/lang/calendar-en.js" type="text/javascript"></script>
<script src="/demo/hello/RES/base/ext/jscalendar/calendar-setup.js" type="text/javascript"></script>

<script src="/demo/hello/RES/base/ext/firebug/firebug.js" type="text/javascript"></script>
</head><body class="itmtk">
<div id="ajax-wait">Loading...</div>
<div id="ajax-window"></div>
<script language="JavaScript">
itmill.tmp = new itmill.Client(document.getElementById('ajax-window'),"http://toolkit.itmill.com/demo/hello/UIDL/","/demo/hello/RES/base/client/",document.getElementById('ajax-wait'));
 (new itmill.themes.Base("/demo/hello/RES/base/")).registerTo(itmill.tmp);
itmill.tmp.start();
delete itmill.tmp;
</script>
</body></html>

How can I tell to your framework which jsp page user currently is? For example on main page I need login screen, on customer list screen I want to use your table components and so on.

If I understood correctly we have to embed above “generated code” to each jsp page where we wish to display your application components?

Thanks in advance, seems that you have interesting product…

Basically, IT Mill toolkit is initialized as follows:

  • Load js libraries ja css in head
  • Create client-object (that communicates with server). Target div is given for client so that it knows where to render the application.
  • Initialize a theme
  • Start the client.

Exactly… You must place css and js loading, window-div, loading-div and startup-code on your page.

I would recommend to move larger parts of the application to toolkit than just few components. In any case, you can either create one toolkit-application for each different use-case or signal one application to move from state to state.

Because both the Toolkit application and JSP-page share the same HttpSession, you can communicate easily between JSP and Toolkit application on serverside. For example in JSP, find the toolkit application from session and call any of its server-side methods directly to change the state.

The application (your main class that extend Application) is stored in HttpSession. You can get list of all active applications (in the session) as LinkedList applications = (LinkedList) session.getAttribute(“itmill-toolkit-apps”);

Exactly. When designing your application, please remember that while jsp-pages are mostly stateles, toolkit applications hold a state. This way placing application on JSP is like opening an “window” on the page that is looking to the running application.