@@ -118,7 +118,7 @@ The web layer is usually composed of two parts:
118
118
* The Web front-end which is also made up of two parts:
119
119
* The server-side to answer the request coming from the client-side and which is built atop of
120
120
the Silverpeas MVC framework;
121
- * The client-side which provides the user with web UI to interact with the application and
121
+ * The client-side to provide the user with web UI to interact with the application and
122
122
which is made up of JSP pages, Javascript files, and CSS and pictures resources.
123
123
124
124
### The REST-based web services
@@ -141,18 +141,20 @@ tests like forbidden access, non-existing resource access, and so on.
141
141
142
142
The front-end in Silverpeas is made up of two sublayers:
143
143
144
- * the Web pages with which the user interact with the application and running within a web browser;
145
- * the MVC framework listening for HTTP requests coming from the web pages to trigger the
146
- asked functions of the application
144
+ * The Web pages with which the user interact with the application and running within a web browser;
145
+ * The MVC framework listening for HTTP requests coming from the web pages to trigger the
146
+ asked functions of the application and to redirect the user to the next web pages or on an
147
+ updated part of the web page.
147
148
148
149
#### The Web pages
149
150
150
151
Web pages generation is based on the following approach:
151
152
152
153
* Silverpeas provides a canvas along with a look&feel for the applications web UI;
153
- * The HTML page is generated with an initial content from the business data on the server-side;
154
+ * The HTML page is generated with possibly an initial content from the business data on the
155
+ server-side;
154
156
* The dynamic of the HTML pages is driven by Javascript on the client-side and the content is
155
- updated by AJAX.
157
+ updated and possibly loaded by AJAX.
156
158
157
159
Silverpeas still uses the old JSP and JSTL technologies to generate the HTML pages because they
158
160
are the mode efficient and flexible way for this purpose in the Java world. The counterpart of
@@ -166,31 +168,52 @@ and Javascript codes, and CSS/Javascript inclusion, satisfying by the way the co
166
168
Silverpeas, several sets of custom JSTL are provided (` silverfunction ` , ` viewgenerator ` , ...)
167
169
along with the default JSTL.
168
170
171
+ The web pages generated for a given application are rendered within the layout of the Silverpeas
172
+ main web page. According to the interaction of the user with some parts of the main web page,
173
+ one or several parts within the layout can be updated (by requesting the corresponding web
174
+ controllers (see later)).
175
+
169
176
The dynamic of Web pages is motorized by both plain Javascript, JQuery and VueJS. (Because
170
177
previously the dynamic was driven by AngularJS, there is again some codes in Silverpeas using
171
178
this old and deprecated Javascript framework.) Silverpeas provides a custom Javascript framework
172
179
built atop of both plain Javascript, JQuery and VueJS in order to make the writing of UI
173
180
interactions easier without having to worry about a lot of details peculiar to Silverpeas. The goal
174
- of the framework with VueJS code in the applications is to give them a more web component-oriented
175
- approach.
181
+ of the framework with VueJS code in the applications is to give them a more web
182
+ component-oriented and asynchronous approach. Therefore, a knowledge of the Silverpeas framework
183
+ is required to profit of all of its capabilities.
184
+
185
+ In this project, the application is a single-page one, generated from the ` home.jsp ` JSP. The
186
+ whole UI rendering and interaction in this web page is performed by a custom view plugin,
187
+ ` todolist_plugin ` , that is defined and registered by the ` TodolistJavascriptPluginRegistering ` Java
188
+ code, and that is declared in the single page of the application. This plugin defines the
189
+ VueJS web component * todolist* dedicated to manage in the client side the todos of a todolist.
190
+ It is made up of the following parts, all of them defined in the * todolist/jsp/javascript/vuejs*
191
+ directory in the web root folder:
192
+
193
+ * ` silverpeas-todolist-template.jsp ` in which are defined the different view components of the
194
+ web component * todolist* ;
195
+ * ` silverpeas-todolist.css ` in which are defined the look of the different view components and
196
+ their inner parts;
197
+ * ` silverpeas-todolist.js ` in which is defined the behavior (and hence the user interaction) of
198
+ the web component * todolist* .
176
199
177
200
#### The MVC framework
178
201
179
202
Since its inception, Silverpeas provides a custom MVC framework. The first one was developed at
180
203
the time Struts didn't yet existed. It was composed of two bricks:
181
204
182
- * The request router whose goal is to translate the incoming user request to a function to
183
- invoke on the controller;
184
- * The controller whose goal is to delegate the invoked function to one or more calls on
185
- the business layers of the application and of Silverpeas. The controller is user session
186
- life-scoped; this is why it is also named * session controller* .
205
+ * The request router whose goal is to translate the incoming user request to an application
206
+ function on the controller;
207
+ * The controller whose goal is to delegate the application function requested by the user from the
208
+ UI to one or more calls on the business layers of the application and of Silverpeas. The
209
+ controller is user session life-scoped; this is why it is also named * session controller* .
187
210
188
211
Currently, Silverpeas provides a second version of the MVC framework, based upon the first one,
189
212
but providing some facilities and with a more modern programming approach :
190
213
191
- * No need to write a request router, the generic one, ` WebComponentRequestRouter ` , is used and
192
- for this requires to be declared, with the web controller with which it is mapped, within the
193
- ` web.xml ` web descriptor of the application;
214
+ * No need to write a request router: the generic one, ` WebComponentRequestRouter ` , is used and
215
+ for this it requires to be declared as serving the root URL of the application, with the
216
+ web controller with which it has to be mapped, in the ` web.xml ` web descriptor of the application;
194
217
* The web component request context which provides useful methods (like, for example, getting the
195
218
highest roles the user play in the application instance) and access to the HTTP request and
196
219
response. The request context is always passed as the single parameter to the session
@@ -207,8 +230,7 @@ but providing some facilities and with a more modern programming approach :
207
230
invoke before or after a controller's function or the next navigation step in the current
208
231
request processing flow.
209
232
210
-
211
-
212
-
213
-
233
+ In this tutorial, the web controller, ` TodoListWebController ` is only used to redirect to the home
234
+ page ` home.jsp ` of the application. All the interaction and the todolist rendering is performed by
235
+ specific VueJS components in an asynchronous way.
214
236
0 commit comments