The NWS Tutorial

Importing the NWS Javascript files

Quick access:
The usual technique
The NWS technical importing technique within an HTML page
The NWS technical importing within a NWS Web page
More explanations

The usual technique

Since the beginning, Javascript allows you to link a script file to an HTML page. To do this you must use the tag <script>. Two ways can be used: the oldest one uses an attribute language and the new one uses the attribute type. Whatever the way you choose, the W3C recommends the use of these opportunities within the <head> ... </head>. Here is an example of use.

 
01 <html>
02     <head>
03         <title>Sample HTML page</title>
04         <script language="javascript" src="file1.js"></script>
05         <script type="text/javascript" src="file2.js"></script>
06     </head>
07     <body>
08         <!-- suite -->
09     </body>
10 </html>

File "InclusionJS.html"

WARNING: closing the tag <script> is mandatory. The use of the compact form (opening and closing tag ) is not working.

The problem with this technique is that if a single file is included at least twice to a same HTML page then its content will be well injected (and thus run) several times during the processing of this page. This can lead any errors in the best case, or worse, not trigger any error but impact on the consistency of the calculated results.

The NWS technical importing technique within an HTML page

The NWS framework proposes another importing technique of Javascript files. This technique has the advantage of checking if yes or not, the considered file is already imported into the page. If so the new imports of this file will be ignored. Warning to one thing: the needed script to this import mechanism is itself stored in a Javascript file named: corelib/services/web/javascript/Core.js. This file must have to be imported in a traditional manner (using the tag <script>).

This file defined the function importPackage: it enables the import of the script files. But as it can be used at different levels (in the index of your Web project), it uses a global variable indicating the basis of the URL from that the Web application is accessible. This variable is called __APPLICATION_PATH__>. As shown in the example below, you don't have to remember to set it. The HTML page below shows an example of use.

 
01 <html>
02     <head>
03         <title>Sample HTML page</title>
04         <script language="javascript">
05         <!--
06             var __APPLICATION_PATH__ = "http://localhost/demo/";
07         //-->
08         </script>
09         <script language="javascript" src="/corelib/services/web/javascript/Core.js"></script>
10         <script language="javascript">
11         <!--
12             importPackage( "corelib/services/web/javascript/jwt/MenuBar.js" );
13             importPackage( "corelib/services/web/javascript/jwt/Menu.js" );
14             importPackage( "corelib/services/web/javascript/jwt/MenuItem.js" );
15         //-->
16         </script>
17     </head>
18     <body>
19         <!-- suite -->
20     </body>
21 </html>

File "InclusionNWS.html"

Note that for a better integration with the server part, coded in Java, the names of directories and the naming conventions used by NWS script files are mapped to the concepts of classes and packages of Java. Indeed, the documentation pages of type Javascript are integrated into the javadoc of the framework.

WARNING: the Javascript files of the NWS Framwork are initially stored in the jar (Java ARchive) of the NWS framework (WEB-INF/lib/WebFramework.jar). At the first request for a Web page, the servlet corelib.services.web.server.ControllerServlet is responsible to unpack the Javascript files (the JWT library - Javascript Widget Toolkit). From there, they will be available on the filesystem.

The NWS technical importing within a NWS Web page

If you use the framework NWS in its entirety (server part and client part), things become even simpler. Indeed, and in this alternative, the statement of the global variable __APPLICATION_PATH__ and the loading of the file corelib/services/web/javascript/Core.js are self-generated through the tag <web:Html>. Suddenly the webpage below achieves the same Javascript files uploads that the HTML page seen in the previous section.

 
01 <?xml version="1.0" encoding="ISO-8859-1" ?>
02 <web:Html xmlns:web="corelib.services.web.components"
03           xmlns:demo="corelib.services.web.samples.virtualcaddy.webcomponents"
04           codeBehind="corelib.services.web.server.WebPage">
05     <head>
06         <title>Sample HTML page</title>
07         <script language="javascript">
08         <!--
09             importPackage( "corelib/services/web/javascript/jwt/MenuBar.js" );
10             importPackage( "corelib/services/web/javascript/jwt/Menu.js" );
11             importPackage( "corelib/services/web/javascript/jwt/MenuItem.js" );
12         //-->
13         </script>
14     </head>
15     <body>
16         <!-- suite -->
17     </body>
18 </web:Html>

File "Inclusion.wp"

It should be noted that in the model of NWS Web page, a web page automatically tries to load a file of JavaScript code with the same name (the page folder/Essai.wp seeks to load the file folder/Essai.js). Accordingly, here is another way of doing this.

 
01 <?xml version="1.0" encoding="ISO-8859-1" ?>
02 <web:Html xmlns:web="corelib.services.web.components"
03           xmlns:demo="corelib.services.web.samples.virtualcaddy.webcomponents"
04           codeBehind="corelib.services.web.server.WebPage">
05     <head>
06         <title>Sample HTML page</title>
07     </head>
08     <body>
09         <!-- suite -->
10     </body>
11 </web:Html>

File "Inclusion.wp"

 
01 importPackage( "corelib/services/web/javascript/jwt/MenuBar.js" );
02 importPackage( "corelib/services/web/javascript/jwt/Menu.js" );
03 importPackage( "corelib/services/web/javascript/jwt/MenuItem.js" );
04 
05 // Suite

File "Inclusion.js"

More explanations

For information, the function importPackage does not realize the injection of a tag <script src="..."></script> to load the new script file. Indeed this technique is asynchronous (we go out of the function importPackage even before the file is completely loaded). In this place, we use a technique derived from AJAX to download the file (the download has been configured as synchronous). Once the file is downloaded, its global content is injected into the web page. For example, you can use the content of this script file immediately after importation.

 
    // createAjaxObject is defined in "corelib/services/web/javascript/core.js" script file
    var ajaxObject = createAjaxObject();
    ajaxObject.open( "GET", __APPLICATION_PATH__ + packageName, false /*  synchronous download */ );
    ajaxObject.send( null );	
    window.document.write( "<script language='javascript'><!--\n" );
    window.document.write( ajaxObject.responseText + "\n" );
    window.document.write( "//--></script>\n" );

Extract of code from the file "corelib/services/web/javascript/core.js"

CAUTION : NWS is proposed to you in BETA version to allow evaluation of this framework. Infini Software is released from any responsibility for the use of framework NWS. In addition, Infini Software can in no way be liable for the use of information contained in these tutorials.