| author : | Nolwenn Rannou <rannou@codelutin.com> |
|---|---|
| revision : | 2773 |
| date : | 2009-09-09 12:05:20 +0200 (mer., 09 sept. 2009) |
The application web interface has been created with Tapestry framework from Apache foundation. Tapestry is a development framework for Web J2EE applications wich architecture is based on components.
It features numerous pros :
The data package contains the UI architecture's model elements.
The UIO (User Interface Objects) are similar to business DTO for UI. The UIO attributes are private and have getters and setters, because Tapestry framework manipulates the objects via those UIO. The UI manipulate directly the DTOs but there are two UIOs that inherits from ChoiceDTO : DataChoiceUIO and ImageChoiceUIO. They are useful when creating date or picture poll choices.
The link class represents an hypertext link : it has a name attribute, which is the string representing the link, and an address attribute, which is the address where the link points.
The EvenOdd classallows to attribute a class to a table lines or to a list elements, to display them changing their color on line over two.
The Border component is a component present on all the pages of the application : it is the menu, the address bar and the footer. It takes in parameter a Link Array, that will create the address bar, and a page type (Creation, Index, Vote or VoteCounting) that determines the logo and the page colors.
This component is a connexion form that is displayed when the user tries to reach a page where he needs to be logged in.
The FeedBack component manages the user messages displaying (messages for the user). Those messages have a look and feel different depending on their meaning. For exemple an error message will be more aggressive than an information message. This component allows to display those types of message when rendering the page. It is possible to display several messages of different type at the same time. They will be displayed only once and then deleted. This component behave quite the smae way than the Tapestry Error component that displays form validation error messages.
To customise the messages appearance, you need to define the classes fb-error and fb-info in the CSS file. In the template, you need to place the component tag :
<t:feedback t:id="feedback"/>
In the classes, after the component declaration, it is possible to add messages :
@Component(id = "feedback") private FeedBack feedback;
feedback.addInfo("info message");
feedback.addError("error message");
The image component goal is to display a picture dynamically, such as picture uploaded on the server from a form. On the face of it we do not know the picture's file name, so we cannot use asset to display it the follpowing way:
<img src="${asset:context:img}/image.png" />
The component creates an image HTML element associating it with a ImageStreamResponse flux :
<t:image src="/img/image.png" />
The Chart component displays a pie chart. To do so, it uses the JFreeChart library and convert the results ina picture easily displayable on a web page :
<t:chart width="210" height="190" values="choice" title="title" type="1"/>
The values parameter correspond to a list of strings representing the labels and their respective values (example : {"val1", "20", "val2", "10"}). The type parameter is the diagram representation type (1:PIE, 2:PIE3D, 3:RING).
The pages are at the same time view and controller for the architecture. However each page is represented by 3 files :
defines the actions associated to the components and uses the BusinessServices class from the services package to call the business services. - a .properties files (or several for internationalization) that contains the messages displayed on the page.
The poll creation page allows to create a poll by filling in :
When choices are pictures, the files are sent to the server but the directory they are saved in needs to be configured. If the poll creation is successful on the database, a confirmation page is displayed and gives the user two links : one to vote (that he can send to other voters), and the other for poll modification or ending.
The fields that can be modificated are the following ones :
This page take as argument the poll ToPIA id hashed with md5 concatened with the hashed poll creator ToPIA id. This is also on this page that he will be able to close the poll to count the votes.
This page allows a user to vote to a poll. He has to fill in his name and vote for one or more choices. This page allows to add comments to the poll. This page take into argument the poll ToPIA id hashed with md5.
The votes on pictures needs to allow pictures uploading on the server. The Tapestry Upload component allows to do that easily by placing it into a form and by saving the file submitted (UploadedFile) in a servers'directory. Moreover it is possible to limit the size of the files in the AppModule class (contibuteApplicationDefaults() method):
configuration.add(UploadSymbols.FILESIZE_MAX, "500000"); configuration.add(UploadSymbols.REQUESTSIZE_MAX, "5000000");
The thumbnail corresponding to the image is created once and for all when it is submitted so that the server is not on his kees because he change the image dimensions each time someone displays the page (image a page with 10 2Mb images). But it is not so easy to display those images after because of Tapestry's behavior. An Image component have then be created to fulfill this need.
A result page use the Chart component to display a poll's results. They are restored via the ServiceResult service.
If the user who creates a poll is registered and logged in, the created poll is linked to his account in the database. So he will be able to consult the list of the polls he created. This can allow him to get back the different URLs if he lost them.
Voters lists ~~~~~~~~~~~~~~~~~
The voters lists can be created by hand filling in the info for each voter, but it is also possible to import a list of voters from a CSV file. The reading of the CSV files is done by the use of the JAVA OpenCSV library that allows to define a mapping strategy to convert directly the fields into objects.
The logged in user can manage voters lists. When he will create a restricted poll, he will be able to use its predefined voters lists instead of manually type in the voters list for the poll.
Tapestry is delivered with numerous services that are a part of the framework, but it is also possible to define its own services. In the AppModule class, that contains the small amount of configuration needed by Tapestry to work, we can link its services by completing the bind(ServiceBinder binder) method:
binder.bind(ServicePoll.class, ServicePollImpl.class);
Once Tapestry knows the interface and the service implementation, we can inject it in the application's pages and use it as usual:
@Inject private ServicePoll servicePoll;
