23 March 2015 Author: Jean-Claude Dauphin jc.dauphin@gmail.com I. Web J-ISIS Architecture Web-JISIS Reference Manual Web-JISIS is a Rich Internet Application (RIA) whose goal is to develop a web top application that has the responsiveness, and look and feel of J-ISIS. Web-JISIS uses a Three-Tier Architecture Tier 1: At the client side, Web 2.0 technologies are responsible for the application's graphical user interface. AJAX is used to communicate between this tier and the application server in tier 2. Requests are sent with the URL using GET or POST data. Request and Result data are formatted using JSON, XML, or plaintext. Tier 2: the middle tier is also known as the application server, which provides the business processes logic and the data access. The server in the middle tier is a servlet container a Web server capable of running Java-based Web applications (Tomcat, Jetty, etc). The J-ISIS services (the business rules) are coded in this tier using Java and the client part of jisis-core.jar library. Requests are passed as messages to the database server and results are returned. Sockets are used to communicate between this tier with the client and the database server through TCP/IP. Tier 3: the J-ISIS database server provides the business data. The J-ISIS database server is listening for request on port 1111, requests and results are passed as messages through TCP/IP. These are some of the advantages of three-tier architecture: It is easier to modify or replace any tier without affecting the other tiers. Separating the application and database functionality means better load balancing. Adequate security policies can be enforced within the server tiers without hindering the clients. Tier 1 - Web-JISIS Client-Side is using Web 2.0 Technologies From a programming perspective, Web 2.0 is synonymous with AJAX (Asynchronous JavaScript and XML). The technologies that make up an AJAX interaction are the following: HTML/XHTML (Hypertext Markup Language): Used to present information to the user from within the web browser. 1
DOM (Document Object Model): The object structure of the HTML document in the web browser. By manipulating the DOM with JavaScript, the page rendered to the user can be modified dynamically without reloading the current page. CSS (Cascading Style Sheets): Used to format and style the HTML presented. By separating formatting from structure, the code can be modified consistently and maintained more easily. Similarly to the DOM, CSS for the current page can be modified via JavaScript to dynamically change the formatting without reloading the current page. JavaScript: A programming language that can be embedded within HTML documents. JavaScript code or functions can be executed inline (as the page is processed), in response to HTML events (by providing JavaScript in the value of HTML attributes), or triggered by browser events (for example, timers or user events). XML (extensible Markup Language): The format of the data returned by the server in response to the asynchronous call from the web browser. The XML response returned is processed by JavaScript in the web browser, causing changes in the HTML (by manipulating the DOM or CSS). JSON (JavaScript Object Notation): Similar to XML, JSON is a simple format that can be used to transfer data in both directions between the Web Browser client and the server. JSON data can be processed within the web browser using JavaScript. The advantage of JSON is that it can be very easily parsed by JavaScript; in fact, to convert a response of any size from the JSON transport format to JavaScript objects involves a single call of c a string). Using JavaScript to process XML is much more involved and requires at least one line of code to assign a value from the XML document to a JavaScript object. The JavaScript jquery Library is used to build interactivity to html pages. It automates common tasks and simplify complicated ones due to the library s foundation on standard HTML and CSS technologies. The Twitter Bootstrap Library for is used as a front end framework for developing responsive mobile web pages. It has a series of ready-made, great-looking user interface widgets and a comprehensive set of core interaction helpers designed to be implemented in a consistent and developer-friendly way. The jquery Select2 plugin is used for AutoComplete Searching and jqgrid plugin is used for CRUD (Create, Read, Update and Delete). Web-JISIS middle tier is using Strut 2 Framework Servlet technology and JavaServer Pages (JSP) are the main technologies for developing Java web applications. When introduced by Sun Microsystems in 1996, Servlet technology was considered superior to the reigning Common Gateway Interface (CGI) because servlets stay in memory after responding to the first requests. Subsequent requests for the same servlet do not require re-instantiation of the servlet's class, thus enabling better response time. 2
The recommended architecture for Java web applications today is called Model 2. Model 2 is another name for the Model-View-Controller (MVC) design pattern.. An application implementing the MVC pattern consists of three modules: model, view, and controller. The view takes care of the display of the application (JSP). The model (Action) encapsulates the application data and business logic. The controller (Servlet/Filter) receives user input and commands the model and/or the view to change accordingly. Struts 2 is a framework for developing Model 2 applications. It makes development more rapid because it solves many common problems in web application development by providing these features: page navigation management user input validation Consistent layout Extensibility Internationalization and localization Support for AJAX Because Struts 2 is a Model 2 framework, when using Struts 2 you should stick to the following unwritten rules: No Java code in JSPs, all business logic should reside in Java classes called action classes. Use the Expression Language (OGNL) to access model objects from JSPs. Little or no writing of custom tags (because they are relatively hard to code). 3
II. Web-JISIS Installation Web-JISIS is distributed as a Web application archive file (WAR) A WAR file is basically a Web application directory that is packaged up using the jar or zip command. It is a common and convenient way for developers to package and deploy applications. Web-JISIS3.war Deployment is the term used for the process of installing a web application (either a 3rd party WAR or your own custom web application) into the Tomcat/Jetty application server. Tomcat and Jetty deployments are trivial and requires copying the WAR file into the $TOMCAT_HOME/webapps or $JETTY_HOME/webapps directory and restarting the container. Before you perform the installation ensure you have the following information: Know where the directory location of your Tomcat/Jetty install is. [It will now be referred to as: $TOMCAT_HOME for Tomcat or $ JETTY_HOME for Jetty] WAR file install The following steps need to be followed in order to successfully install the application as a.war file. Whatever the war file name is, this will become the name of the top directory once unzipped and run as an application. I.e. Web-JISIS3.war would be run in a browser as http://serverlocation:port/web-jisis3 1. Stop tomcat or Jetty. 2. Go to the following directory: $TOMCAT_HOME/webapps/ or $JETTY_HOME/webapps 3. Copy the file Web-JISIS3.war to this directory 4. Start Tomcat or Jetty When Tomcat or Jetty finds such a file, it unpacks it, thereby creating an expanded Web application, and deploys it. 4
III. Starting Web-JISIS First, you need to start J-ISIS on the server machine as it will be the J-ISIS Database server. Launch J-ISIS from the script or exe file depending on your server machine operating system. Then you can minimize J-ISIS, but you need to keep it running. Then enter http://localhost:8084/web-jisis3 in your browser and you should see: The port 8084 is defined by default in the Tomcat configuration file WARNING: You should have an Internet connection up and running as some DTD s and configuration files are accessed through Internet. 5
IV. Starting Web-JISIS from a remote machine You need to point the browser to the Tomcat server machine, for example at home I have a wifi network with one machine running Tomcat on port 8084 with IP address 192.168.0.13 and on which Web-JISIS3.war is deployed http://192.168.0.13:8084/web-jisis3/ Enter «Admin» and «Admin» 6
A) Database Selection The list of J-ISIS databases available on the server machine is displayed. Select the CDS database as it will be the example database. 7
8
After database selection, the database list is re-displayed, with the name of the selected database: You can now «Browse», «Search» or «Edit» by clicking the menu bar items. You can also select another database if needed. 9
B) Browse Clicking on Browse should display the first database record in RAW format as follow: 10
The toolbar allows to: Display a specific record Display the first record Display the next record Display the previous record Display the last record Select another PFT for displaying the records You can enter a MFN in the text field and hit the "Enter" key to jump to a specific record 11
Retrieving a particular record 12
Changing the display PFT 13
14
C) Search Web-JISIS offers two Search methods: Guided Search and Google Like Search. J-ISIS and Web-JISIS use an autocomplete user interface for searching. In search engines, autocomplete user interface features provide users with suggested queries or results as they type their query in the search box. This is also commonly called autosuggest or incremental search. The challenge remains to search large indices in under a few milliseconds so that the user sees results pop up as he types them. This is no simple feat with a large search index or database as the target of the search application. J-ISIS starts providing suggestions as soon as one character is typed while Web-JISIS needs 2 characters before providing suggestions. 1) Guided Search Clicking on the 1st query field will pop up a list panel as follow: 15
After typing 'v': and 'o' 16
There is only one term in the index that begins with 'vo'. Please note that J-ISIS and Web-J-ISIS suggest only terms that are in the index; and the search is done on the indexed terms. Thus the quality of the index is very important. No we click on the proposed suggestion to bring it back to the query field. And we click on the 'Search' button to make the search query. 17
18
3 records were found and are displayed 19
If we add a new search criteria like 'Bangladesh" in the 2nd query field: We get only one record because we are doing a 'AND' (Match All of the following) between the query fields. 20
Let's do a 'OR' (Match Any of the following) now with the same terms 21
We get now 17 records that match the query: 22
Please note that we the results are sorted by relevance, i.e. most relevant first. Web-JISIS displays 10 records per page and uses paging for displaying results when the number of results exceeds 10. 23
24
2) Google Like Search Google Like Search always uses 'OR' boolean operator to connect the search query terms. It also uses term autosuggestions when the user types characters. If no suggestions are proposed when you enter characters. It means that there are no records indexed that contain this term. 25
26
You can remove terms from the search query by clicking on the left cross of the term. The query search box will expand as you select more terms. Clicking on the search button will retrieved 17 records that contain 'volker, adriaan' OR 'bangladesh' or both. 27
28
Entering Diacritics in the query 29
30
31
D) CRUD (Edit->Data Entry) The toolbar allows to: Display a specific record 32
Display the first record Display the next record Display the previous record Display the last record Display an empty record for data entry Delete the current record Save the new or updated record Add an occurrence of the selected field Delete the occurrence of the selected field Select another Worksheet for displaying the data entry fields 33
Empty Record 34
Create 35
36
New Occurrence for new author 37
Add the second author: 38
Save the new record 39
After saving the new record is displayed with the MFN assigned 40
Updating Existing database records can be updated once a specific record is displayed. For example entering MFN 10 and clicking on go will display record with MFN 10. Field data or field occurrence data can be modified after clicking on the data cell. 41
42
Go To Previous Record 43
Go to the First record 44
Go to the Last Record 45
Add Occurrence The field last occurrence must be selected by clicking on its label 46
47
We enter some data and press 'Enter' (or click on the label) to validate data 48
Delete Occurrence 49
Delete Record 50
51
52
53
Change The Database Changing the database to AMJ_LOAN 54
And changing the PFT to Loans 55
Annex I Installing Tomcat on Windows For Windows systems, Tomcat is available as a Windows-style graphical installer that is available directly from the Apache Software Foundation s Tomcat downloads page. The Windows graphical installer does a lot of setup and operating system integration for you as well, and is recommended. Download apache-tomcat-6.0.29.exe (or later, use the latest available stable version), from the release page at: http://tomcat.apache.org/download-60.cgi. When you download and run this installer program, it will first verify that it can find a JDK and JRE, and then prompt you with a license agreement. This license is the Apache Software License, which allows you to do pretty much anything with the software as long as you give credit where it s due. Accept the license as shown below: Next, the installer will allow you to select which Tomcat components to install. At the top of the installer window, there is a handy drop-down list from which you can select a different typical packaged set of components (see Figure 1-2). To hand select which components to install choose Custom in the drop-down list, and you may select and deselect any component or subcomponent. 56
If you want to have Tomcat started automatically and be able to control it from the Services Control Panel, check the box to install the Service software. Then, specify where to install Tomcat. The default is in C:\Program Files\Apache Software Foundation\Tomcat 6.0. Change it if you want, as shown below: 57
Next, the installer will prompt you for the HTTP/1.1 connector port this is Tomcat s web server port. By default it is set to port 8080, but on Windows feel free to change it to 80 if you want Tomcat to be your first contact web server (Tomcat does a wonderful job in that role). The installer also asks for the administrator login username and password to set for Tomcat. Set the password to something that will not be easily guessed, but don t forget what it is! That will be your username and password to log into Tomcat s Manager webapp. The installer then allows you to choose a Java runtime for Tomcat from the runtimes you have installed at that time. We suggest Java 1.6.x or higher for this. Once you have configured it with a Java runtime, the Install button becomes clickable. Click it and the installer will begin installing Tomcat. Once the installation completes normally, you should see the message Completingthe Apache Tomcat Setup Wizard at the end, as shown below: From the installer, you can select to start Tomcat and click Finish. Then, in your web browser, type in the URL to your Tomcat, such as http://localhost:8080, and you should see the Tomcat start page as shown in next figure: 58
Starting and stopping on Windows On Microsoft Windows, Tomcat can be started and stopped either as a windows service or by right-clicking with ton the icon located in the taskbar at screen bottom Clicking on Configure would popup the following dialog: 59
You can stop Tomcat Windows Service by clicking on Stop and restart it by clicking on Start 60
How to support UTF-8 URIEncoding with Tomcat By default, Tomcat uses ISO-8859-1 character encoding when decoding URLs received from a browser. This can cause problems when Web-JISIS's encoding is UTF-8, and you are using international characters with diacritics in the search query. To configure the URL encoding in Tomcat: 1. Edit conf/server.xml and find the line where the Coyote HTTP Connector is defined. It will look something like this, possibly with more parameters: 2. <Connector port="8084"/> 3. Add a URIEncoding="UTF-8"property to the connector: 4. <Connector port="8084" URIEncoding="UTF-8"/> 5. Restart Tomcat If you are using mod_jk You should apply the same URIEncoding parameter as above to the AJP connector if you are using mod_jk, and add the following option to your Apache mod_jk configuration: <Connector port="8009" protocol="ajp/1.3" URIEncoding="UTF-8"/> JkOptions +ForwardURICompatUnparsed Tomcat Problems java.util.logging.errormanager: 4 java.io.filenotfoundexception: C:\Program Files\apache-tomcat-7.0.27\logs\catalina.2012-05-14.log (Access is denied) Make sure that the SYSTEM user has full access to the Tomcat folder, so that when Tomcat runs, it can freely create folders and files within its own directory. Windows 7 - Programs installed in the Program folder needs to have Administrator role to be executed and for creating sub-folders. The solution is to install Tomcat in a folder under the C: 61
Annex II Disabling Data Entry in Web-JISIS 1. Edit the main.jsp file located in the C:\apache-tomcat-8.0.5\webapps\Web- JISIS3\decorators folder 62
2. Locate the line with href="<s:url action='dodataentry'/>" and change the line from: <li><a href="<s:url action='dodataentry'/>" title="edit > Data Entry">Data Entry</a></li> To: <li><a href="#" title="edit > Data Entry">Data Entry</a></li> 3. Save the file 4. Shutdown and restart Tomcat 5. Test Web-JISIS Note: You can also change the Web-JISIS title or add an image in the main.jsp file if you wish 63
Deploying a Web-JISIS3.WAR in Jetty 1 Downloading You can download Jetty from http://download.eclipse.org/jetty/. The current stable version is 9. The compressed file is platform independent. So if you use Mac, Linux or Windows, that is ok, it will run on any operating system. 2 Installing Simply uncompress the file to a directory. You should have something like this: 3 Copy the Web-JISIS3.war file in the $JETTY_HOME/webapps 4 Running Jetty a) Open a terminal. b) Go to the Jetty installation directory. c) Enter the following command: java -jar start.jar 64
Start Web-JISIS 65
66