Thibault Duchateau
@tduchateau
http://dandelion.github.io
1 / 101
Quick introduction
Brief history
Dandelion-Core
Dandelion-Datatables
Some statistics
Future
Demo
2 / 101
Quick introduction
Free & Open Source Java framework
Focused on two aspects of Web development:
Assets management (js, css): organization in bundles, HTML
injection, soon asset minification and merging
Integration of powerful Javascript librairies thanks to a set of
components
Licensed under BSD 3-Clause
Hosted on Github
Current version: 0.10.0
3 / 101
Thanks to...
4 / 101
Quick introduction
Brief history
Dandelion-Core
Dandelion-Datatables
Some statistics
Future
Demo
5 / 101
Brief history
History
6 / 101
Quick introduction
Brief history
Dandelion-Core
Dandelion-Datatables
Some statistics
Future
Demo
7 / 101
Overview
8 / 101
Asset bundles
Declarative approach, via JSON (soon XML and JavaConfig)
{
"bundle":"jquery",
"assets":[
{
"name":"jquery",
"version":"1.11.1",
"type":"js",
"locations":{
"webapp":"/assets/js/jquery-1.11.1.js"
}
}
]
}
Several locations are allowed for each asset: webapp, classpath, CDN, JAR,
WebJar and API!
See the docs
9 / 101
Dependencies between bundles
You can declare one or more bundles as dependencies
{
"bundle":"select2",
"dependencies":["jquery"],
"assets":[
{
"name":"select2",
"version":"3.4.8",
"type":"js",
"locations":{
"webapp":"/assets/js/select2.js"
}
},{
"name":"select2",
"version":"3.4.8",
"type":"css",
"locations":{
"webapp":"/assets/css/select2.css"
}
}
]
}
10 / 101
Asset locators
Internal components used by Dandelion to fetch assets in
different ways
Used via the corresponding location key in the bundle declaration
See the docs
11 / 101
Project your-project
|__src
|__main
|__webapp
|__assets
|__js
|__app.js
Asset locators — webapp
12 / 101
Project
Bundle
{
"bundle":"my-bundle",
"assets":[{
"name":"my-application",
"version":"1.0.0",
"type":"js",
"locations":{
"webapp":"/assets/js/app.js"
}
}]
}
Asset locators — webapp
13 / 101
Project
Bundle
HTML
<scriptsrc="/[contextPath]/assets/js/app.js"></script>
Asset locators — webapp
14 / 101
Project your-project
|__src
|__main
|__resources
|__js
|__app.js
Asset locators — classpath
15 / 101
Project
Bundle
{
"bundle":"my-bundle",
"assets":[{
"name":"my-application",
"version":"1.0.0",
"type":"js",
"locations":{
"classpath":"js/app.js"
}
}]
}
Asset locators — classpath
16 / 101
Project
Bundle
HTML
<scriptsrc="/[contextPath]
/dandelion-assets
/[cacheKey]
/app.js"></script>
Asset locators — classpath
17 / 101
Bundle {
"bundle":"jquery",
"assets":[{
"name":"jquery",
"version":"1.11.0",
"type":"js",
"locations":{
"cdn":"//cdnjs.cloudflare.com/.../jquery.js"
}
}]
}
Asset locators — cdn
18 / 101
Bundle
HTML
<scriptsrc="//cdnjs.cloudflare.com/.../jquery.js"></script>
Asset locators — cdn
19 / 101
JAR datatables-core
|__src
|__main
|__resources
|__META-INF
|__resources
|__folder
|__js
|__app.js
Asset locators — jar
20 / 101
JAR
Bundle
{
"bundle":"my-bundle",
"assets":[{
"name":"my-app",
"version":"1.0.0",
"type":"js",
"locations":{
"jar":"folder/js/app.js"
}
}]
}
Asset locators — jar
21 / 101
JAR
Bundle
HTML
Inside a Servlet 2.0+ container:
<scriptsrc="/[contextPath]
/dandelion-assets
/[cacheKey]
/app.js"></script>
Inside a Servlet 3.0+ container:
<scriptsrc="/[contextPath]/folder/js/app.js"></script>
Dandelion automatically detects whether the
running server is using the Servlet 3.x API or lower
Asset locators — jar
22 / 101
New
dependency
<dependency>
<groupId>com.github.dandelion</groupId>
<artifactId>dandelion-webjars</artifactId>
<version>0.10.0</version>
</dependency>
This artifact brings a new dependency to the webjars-
locator project, which is internally used by the locator to
locate assets inside WebJars
Asset locators — webjar
23 / 101
New
dependency
WebJar
<dependency>
<groupId>org.webjars</groupId>
<artifactId>bootstrap</artifactId>
<version>3.2.0</version>
</dependency>
Asset locators — webjar
24 / 101
New
dependency
WebJar
Bundle
{
"bundle":"my-bundle",
"assets":[{
"name":"bootstrap",
"version":"3.2.0",
"type":"css",
"locations":{
"webjar":"bootstrap.css"
}
}]
}
Asset locators — webjar
25 / 101
New
dependency
WebJar
Bundle
HTML
Inside a Servlet 2.0+ container:
<linkrel="stylesheet"href="/[contextPath]
/dandelion-assets
/[cacheKey]
/bootstrap.css"/>
Inside a Servlet 3.0+ container:
<linkrel="stylesheet"href="/[contextPath]
/webjars
/bootstrap
/3.2.0
/css
/bootstrap.css"/>
Dandelion automatically detects whether the
running server is using the Servlet 3.x API or lower
Asset locators — webjar
26 / 101
Asset locators — delegate
Reads the content of an asset from a special parameter stored inside the
AssetRequestContext
This special parameter:
must be stored under the DelegateLocator.DELEGATED_CONTENT_PARAM
key
must be a class that implements DelegatedContentand where the
getContent()method must return the asset content to be injected ]
27 / 101
Bundle {
"bundle":"my-bundle",
"assets":[{
"name":"my-generated-asset",
"version":"1.0.0",
"type":"js",
"locations":{
"delegate":"app.js"
}
}]
}
Asset locators — delegate
28 / 101
Bundle
Generator
publicclassSomeJavascriptGenerator
implementsDelegatedContent{
@Override
publicStringgetContent(HttpServletRequestrequest){
return"alert('Hey!');";
}
}
Asset locators — delegate
29 / 101
Bundle
Generator
ARC
AssetRequestContext
.get(request)
.addParameter("my-generated-asset",
DelegateLocator.DELEGATED_CONTENT_PARAM,
newSomeJavascriptGenerator());
Asset locators — delegate
30 / 101
Bundle
Generator
ARC
HTML
<scriptsrc="/[contextPath]
/dandelion-assets
/[cacheKey]
/app.js"></script>
Where app.js:
alert('Hey!');
Asset locators — delegate
31 / 101
Bundle loaders
Scan for bundles in the classpath, in the following order:
VendorBundleLoader: intended to load vendor bundles (e.g. jquery.json)
ComponentBundleLoader: intended to load components bundles (e.g. ddl-
dt.json)
DandelionBundleLoader: intended to load user bundles (e.g. custom-
bundle.json)
See the docs
32 / 101
Bundle graph
On the application startup, Dandelion creates a Contextthat will be injected
into each request.
This Contextprovide several information:
all configuration options (coming from the properties files)
a bundle graph (DAG), built from all scanned bundles
Example:
src
|__main
|__resources
|__dandelion
|__jquery.json
|__select2.json
See the docs
33 / 101
Interacting with the bundle graph
1/4) Using the JSP taglib
<%@taglibprefix="dandelion"uri="http://github.com/dandelion"%>
<dandelion:bundleincludes="select2"/>
2/4) Using the Thymeleaf dialect
<!DOCTYPEhtml>
<htmlxmlns:th="http://www.thymeleaf.org"
xmlns:ddl="http://github.com/dandelion"
ddl:bundle-includes="select2">
...
</html>
See the docs
34 / 101
Interacting with the bundle graph
3/4) Using the fluent API
AssetRequestContext
.get((HttpServletRequest)request)
.addBundle("select2");
4/4) Using the configuration file ("permanent" bundles)
bundle.includes=select2
See the docs
35 / 101
Interacting with the bundle graph
Whatever the technology used, Dandelion automatically injects all
requested assets into the HTML code:
in the right order
in the configured position, by default CSS in <head>and JS just before
</body>
and (soon) applies the right HTTP headers, therefore optimizing browser
caching
<html>
<head>
<linkhref="/context/assets/css/select2.css"/>
</head>
<body>
...
<scriptsrc="/context/assets/js/jquery-1.11.1.js"></script>
<scriptsrc="/context/assets/js/select2.js"></script>
</body>
</html>
36 / 101
Asset processors
Intended to process assets, in different ways...
Built-in processors:
jsMinYui:JS minification based on Yahoo's YUI Compressor
cssMinYui:CSS minification based on Yahoo's YUI Compressor
cssMin:CSS minification based on a fork of YUI
jsMin:JS minification based on a fork of YUI
cssUrlRewriting:Image URLs rewriting in CSS
Soon:
cssLess: Convert Less resources to CSS
cssSass: Convert Sass resources to CSS
cssImport: Processes @import
coffeeScript: Convert CoffeeScript to JavaScript
...
See the docs
37 / 101
Development/production modes
Development mode
Built-in dev tools available
Server-side caching disabled
Browser caching disabled
Production mode
No bundle graph viewer, no bundle reloading
Minification enabled
Server-side caching enabled
(soon) Browser caching enabled
(soon) GZIP compression
(soon) Asset versioning
(soon) JMX monitoring
38 / 101
Devtools
Bundle graph
viewer
Dev tool allowing to visualize how Dandelion-Core
handles assets, in the current request
http://example.com/context/some/uri?showGraph
Available in development mode only
See the docs
39 / 101
Devtools
Bundle graph
viewer
Asset
reloading
During development, both server-side and client-side
caching are disabled.
Client-side, Dandelion-Core applies the following HTTP
headers:
Cache-Control = no-cache,no-store,must-
revalidate(HTTP 1.1)
Pragma = no-cache(HTTP 1.0)
Expires = 0(Proxies)
40 / 101
Devtools
Bundle graph
viewer
Asset
reloading
Bundle
reloading
During development, all changes made in asset bundles
can be reflected.
Just manually append a new reloadBundlesrequest
parameter to the current URL to perform a full bundle
reloading.
http://example.com/context/some/uri?reloadBundles
Available in development mode only
41 / 101
Properties dandelion.properties
dandelion.mode=production
Configuration options
42 / 101
Properties
Filter init
param
filter init param > dandelion.properties
<filter>
<filter-name>dandelion</filter-name>
<filter-class>...DandelionFilter</filter-class>
<init-param>
<param-name>dandelion.mode<param-name>
<param-value>production</param-value>
</init-param>
</filter>
Configuration options
43 / 101
Properties
Filter init
param
System
property
system property > filter init param >
dandelion.properties
-Ddandelion.mode=production
Configuration options
See the docs
44 / 101
Quick introduction
Brief history
Dandelion-Core
Dandelion-Datatables
Some statistics
Future
Demo
45 / 101
Introducing Dandelion-Datatables
First and most advanced component of the Dandelion framework
Facilitates the integration of DataTables, an awesome jQuery
plugin which will add advanced interaction controls to any HTML
table
Easy to use
Easy to extend
Inspired by the excellent DisplayTag library
46 / 101
Key features
JSP & Thymeleaf support
Typical features such as paging, filtering and sorting
DOM sources, AJAX sources and server-side processing
Responsive design
Export in multiple formats
Several themes available: Bootstrap 2, Bootstrap 3, jQueryUI
I18n
Integration with Spring/Spring MVC and other projects
47 / 101
What it looks like with JSP?
<%@taglibprefix="datatables"uri="http://github.com/dandelion/datatables"%>
<datatables:tableid="myTableId"data="${persons}">
<datatables:columntitle="Id"property="id"/>
<datatables:columntitle="LastName"property="lastName"/>
<datatables:columntitle="FirstName"property="firstName"/>
<datatables:columntitle="City"property="address.town.name"/>
<datatables:columntitle="Mail"property="mail"/>
</datatables:table>
id: HTML pass-through attribute
data: DOM source, collection of POJOs
title: sets the content of the column header
property: name of the object's attribute of the collection being iterated on
48 / 101
What it looks like with Thymeleaf?
<tableid="myTableId"dt:table="true">
<thead>
<tr>
<th>Id</th>
<th>Firstname</th>
<th>Lastname</th>
<th>City</th>
<th>Mail</th>
</tr>
</thead>
<tbody>
<trth:each="person:${persons}">
<tdth:text="${person.id}">1</td>
<tdth:text="${person.firstName}">John</td>
<tdth:text="${person.lastName}">Doe</td>
<tdth:text="${person?.address?.town?.name}">Nobodyknows!</td>
<tdth:text="${person.mail}">john@doe.com</td>
</tr>
</tbody>
</table>
dt:table: enables the Dandelion-Datatables dialect in the current table
49 / 101
HTML The HTML is generated:
either by Dandelion-Datatables (JSP)
or directly by Thymeleaf
<tableid="myTableId">
<thead>
<tr>
<th>Id</th>
<th>Firstname</th>
<th>Lastname</th>
<th>City</th>
<th>Mail</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Wing</td>
<td>Cunningham</td>
<td></td>
<td>ornare.libero@mail.edu</td>
</tr>
...
</tbody>
</table>
How it works?
50 / 101
HTML
JavaScript
As well as the JS code that initializes DataTables
varoTable_myTableId=$('#myTableId');
varoTable_myTableId_params={
"aoColumns":[
{"mData":"id","sDefaultContent":""},
{"mData":"lastName","sDefaultContent":""},
{"mData":"firstName","sDefaultContent":""},
{"mData":"address.town.name","sDefaultContent":""},
{"mData":"mail","sDefaultContent":""}
]
}
$(document).ready(function(){
oTable_myTableId.dataTable(oTable_myTableId_params);
});
How it works?
51 / 101
HTML
JavaScript
Required
assets
An AssetRequestContextis filled with the required assets,
either by the JSP taglib or by the Thymeleaf dialect...
AssetRequestContext
.get(request)
.addBundle("datatables")
.addBundle("ddl-dt")
...;
... so that they will be injected by Dandelion-Core into the
response
<linkhref="//cdn/jquery.dataTables.css"/>
...
<scriptsrc="//cdn/jquery.js"></script>
<scriptsrc="//cdn/jquery.dataTables.js"></script>
<scriptsrc="/[contextPath]
/dandelion-assets
/[SHA]
/dandelion-datatables-0.10.0.js"></script>
How it works?
52 / 101
Usage examples
53 / 101
HTML (DOM) sources
Read data directly from the DOM
Works well with small/medium data sources
54 / 101
Controller Example with a Spring MVC controller
@Controller
publicclassController{
@ModelAttribute("persons")
publicList<Person>populateTable(){
returnpersonService.findAll();
}
}
HTML sources — example
55 / 101
Controller
JSP
<datatables:tableid="myTableId"data="${persons}">
<datatables:columntitle="Id"property="id"/>
...
</datatables:table>
HTML sources — example
56 / 101
Controller
JSP
Thymeleaf
<tableid="myTableId"dt:table="true">
...
<tbody>
<trth:each="person:${persons}">
<tdth:text="${person.id}">1</td>
...
</tr>
</tbody>
<table>
HTML sources — example
57 / 101
AJAX sources
Read data from virtually any JSON data source that can be obtained by
AJAX
Client-side processing
Works well with small/medium data sources
58 / 101
Controller Example with a Spring MVC controller
@Controller
publicclassAjaxController{
@RequestMapping(value="/persons")
public@ResponseBodyList<Person>findAll(){
returnpersonService.findAll();
}
}
AJAX sources
59 / 101
Controller
JSP
<datatables:tableid="myTableId"url="/persons">
<datatables:columntitle="Id"property="id"/>
...
</datatables:table>
Dandelion-Datatables rewrites URLs by appending the
context path, if needed.
AJAX sources
60 / 101
Controller
JSP
Thymeleaf
<tableid="myTableId"dt:table="true"dt:url="@{/persons}">
...
<tbody>
<trth:each="person:${persons}">
<tdth:text="${person.id}">1</td>
...
</tr>
</tbody>
<table>
AJAX sources
61 / 101
AJAX sources + server-side processing
Read data from virtually any JSON data source that can be obtained by
AJAX
Server-side processing
Each draw of the table will result in a new AJAX request being made to
get the required data
Works well with small/medium/large data sources
62 / 101
AJAX sources + server-side processing
Dandelion-Datatables provides a convenient API
DatatablesCriterias
Stores all DataTables parameters (current page, entries to display,
sorted columns, ...)
@RequestMapping(value="/persons")
public@ResponseBodyDatatablesResponse<Person>
filter(HttpServletRequestrequest){
//MapsrequestparametertoaDatatablesCriteriasinstance
DatatablesCriteriascriterias=
DatatablesCriterias.getFromRequest(request);
...
63 / 101
AJAX sources + server-side processing
Dandelion-Datatables provides a convenient API
DataSet
All entries returned by the data access layer should be wrapped in this
class in order to build a DataTablesResponse
...
//Getfilteredandpageddata
DataSet<Person>persons=
personService.findPersons(criterias);
...
64 / 101
AJAX sources + server-side processing
Dandelion-Datatables provides a convenient API
DataTablesResponse
Contains a builder that helps to return the data in the format required
by DataTables
Must be converted into JSON
...
//BuildtheresponsethatwillbeconvertedtoJSON
returnDatatablesResponse.build(persons,criterias);
}
65 / 101
Controller Example with a Spring MVC AJAX controller
@RequestMapping(value="/persons")
public@ResponseBodyDatatablesResponse<Person>
filter(HttpServletRequestrequest){
//MapsrequestparametertoaDatatablesCriteriasinstance
DatatablesCriteriascriterias=
DatatablesCriterias.getFromRequest(request);
//Getfilteredandpageddata
DataSet<Person>persons=
personService.findPersons(criterias);
//BuildtheresponsethatwillbeconvertedtoJSON
returnDatatablesResponse.build(persons,criterias);
}
AJAX sources + server-side processing
66 / 101
Controller
JSP
<datatables:table...url="/persons"serverSide="true">
<datatables:columnproperty="id"/>
<datatables:columnproperty="firstName"/>
<datatables:columnproperty="lastName"/>
<datatables:columnproperty="address.town.name"/>
<datatables:columnproperty="mail"/>
</datatables:table>
AJAX sources + server-side processing
67 / 101
Controller
JSP
Thymeleaf
<table...dt:url="@{/persons}"dt:serverSide="true">
<thead>
<tr>
<thdt:property="id">Id</th>
<thdt:property="firstName">Firstname</th>
<thdt:property="lastName">Lastname</th>
<thdt:property="address.town.name">City</th>
<thdt:property="mail">Mail</th>
</tr>
</thead>
</table>
AJAX sources + server-side processing
68 / 101
JSP <datatables:table...pageable="false">
<datatables:column...sortable="false"/>
<datatables:column...filterable="true"/>
...
</datatables:table>
Paging, sorting, filtering
69 / 101
JSP
Thymeleaf
<table...dt:pageable="false">
<thead>
<thdt:sortable="false">Id</th>
<thdt:filterable="true">LastName</th>
...
</thead>
...
<table>
Paging, sorting, filtering
70 / 101
Export — what formats?
Text-basedformats: CSV, XML
Built-in support, no dependency or extra required.
71 / 101
Export — what formats?
Binary-basedformats: PDF, XLS, XLSX
Some extras already exist and provide:
an export class that is used by default if the corresponding export format
is enabled
the corresponding library in compile scope (e.g. Apache POI for the XLS
format)
Available extras:
PDF: datatables-export-itext
XLS: datatables-export-poi
XLSX: datatables-export-poi-ooxml
72 / 101
Export — 2 ways
Filter-based
Fast to set up
Always export full data source
Only compatible with DOM sources
Controller-based
Requires a bit more work to set up
WYSIWYE => What You See Is What You ... Export!
Compatible with DOM and AJAX sources
73 / 101
New
dependency
<dependency>
<groupId>com.github.dandelion</groupId>
<artifactId>datatables-export-itext</artifactId>
<version>0.10.0</version>
</dependency>
Export — filter-based
74 / 101
New
dependency
web.xml
<!--Dandelion-Datatablesfilterusedforbasicexport-->
<filter>
<filter-name>datatables</filter-name>
<filter-class>...DatatablesFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>datatables</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
Export — filter-based
75 / 101
New
dependency
web.xml
JSP
<datatables:table...export="pdf">
<datatables:columnproperty="id"/>
<datatables:columnproperty="firstName"/>
<datatables:columnproperty="lastName"/>
<datatables:columnproperty="address.town.name"/>
<datatables:columnproperty="mail"/>
</datatables:table>
Export — filter-based
76 / 101
New
dependency
web.xml
JSP
Thymeleaf
<tableid="myTable"dt:table="true"dt:export="pdf">
<thead>
<tr>
<th>Id</th>
<th>Firstname</th>
<th>Lastname</th>
<th>City</th>
<th>Mail</th>
</tr>
</thead>
<tbody>
<trth:each="person:${persons}">
<tdth:text="${person.id}">1</td>
<tdth:text="${person.firstName}">John</td>
<tdth:text="${person.lastName}">Doe</td>
<tdth:text="${person.address.town.name}">Nobodyknows!</td>
<tdth:text="${person.mail}">john@doe.com</td>
</tr>
</tbody>
</table>
Export — filter-based
77 / 101
New
dependency
<dependency>
<groupId>com.github.dandelion</groupId>
<artifactId>datatables-export-itext</artifactId>
<version>0.10.0</version>
</dependency>
Export — controller-based
78 / 101
New
dependency
JSP
<datatables:tableid="myTableId"url="/persons"export="pdf">
<datatables:columnproperty="id"/>
<datatables:columnproperty="firstName"/>
...
<datatables:exporttype="csv"url="/export.pdf"/>
</datatables:table>
Export — controller-based
79 / 101
New
dependency
JSP
Thymeleaf
<divdt:conf="myTableId">
<divdt:confType="export"
dt:type="pdf"
dt:url="@{/export.pdf}"></div>
</div>
<table...dt:url="@{/persons}"dt:export="pdf">
<thead>
<tr>
<thdt:property="id">Id</th>
<thdt:property="firstName">Firstname</th>
<thdt:property="lastName">Lastname</th>
<thdt:property="address.town.name">City</th>
<thdt:property="mail">Mail</th>
</tr>
</thead>
</table>
Export — controller-based
80 / 101
New
dependency
JSP
Thymeleaf
Controller
(1/4)
@RequestMapping(value="/export",produces="application/pdf")
publicvoidpdf(@DatatablesParamsDatatablesCriteriascriterias,
HttpServletRequestrequest,
HttpServletResponseresponse){
//Getdatatoexportusingtheprovidedcriteria
List<Person>persons=personService.findPersons(criterias);
...
Export — controller-based
81 / 101
New
dependency
JSP
Thymeleaf
Controller
(2/4)
...
//Buildtheexportconfiguration
ExportConfexportPdfConf=newExportConf.Builder("pdf")
.header(true)
.exportClass(newPdfExport())
.build();
...
Export — controller-based
82 / 101
New
dependency
JSP
Thymeleaf
Controller
(3/4)
...
//Buildthetabletoexportusingtheabovedata
//andtheexportconfiguration
HtmlTabletable=newHtmlTableBuilder<Person>()
.newBuilder("tableId",persons,request,exportPdfConf)
.column().fillWithProperty("id").title("Id")
.column().fillWithProperty("firstName").title("Firtname")
.column().fillWithProperty("lastName").title("Lastname")
.column().fillWithProperty("address.town.name").title("City")
.column().fillWithProperty("mail").title("Mail")
.column()
.fillWithProperty("birthDate","{0,date,dd-MM-yyyy}")
.title("BirthDate")
.build();
...
Export — controller-based
83 / 101
New
dependency
JSP
Thymeleaf
Controller
(4/4)
...
//Rendertheexportfileinthebrowser
ExportUtils.renderExport(table,exportPdfConf,response);
}
Export — controller-based
84 / 101
I18n: DataTables' information
datatables.properties: non-translatable properties
global.css.class=tabletable-stripedtable-borderedtable-condensed
global.extra.theme=bootstrap2
datatables_EN.properties: all EN translations
global.i18n.msg.processing=Processing...
global.i18n.msg.search=Search:
global.i18n.msg.info=Showing_START_to_END_of_TOTAL_entries
datatables_FR.properties: all FR translations
global.i18n.msg.processing=Traitementencours...
global.i18n.msg.search=Rechercher:
global.i18n.msg.info=Affichagedel'élément_START_à_END_sur_TOTAL_éléments
85 / 101
I18n: column headers
Based on LocaleResolverand MessageResolverinterfaces
Built-in implementations:
SpringLocaleResolver/ SpringMessageResolver
JstlLocaleResolver/ JstlMessageResolver
Struts1LocaleResolver/ Struts1MessageResolver
Struts2LocaleResolver/ Struts2MessageResolver
Possible to plug-in custom locale and message resolvers
86 / 101
Spring config <beanid="messageSource"class="...">
<propertyname="basename"value="classpath:messages"/>
</bean>
I18n: example with Spring
87 / 101
Spring config
Resource
bundles
Location:
src
|__main
|__resources
|__messages.properties
|__messages_FR.properties
messages.properties:
table.header.lastname=Lastname
table.header.firstname=Firstname
messages_FR.properties:
table.header.lastname=Nom
table.header.firstname=Prénom
I18n: example with Spring
88 / 101
Spring config
Resource
bundles
JSP
<datatables:tableid="myTableId"data="${persons}">
...
<datatables:columntitleKey="table.header.firstname".../>
<datatables:columntitleKey="table.header.lastname".../>
...
</datatables:table>
I18n: example with Spring
89 / 101
Spring config
Resource
bundles
JSP
Thymeleaf
<tableid="myTableId"dt:table="true">
<thead>
<tr>
...
<thth:text="#{table.header.firstname}">Firstname</th>
<thth:text="#{table.header.lastname}">Lastname</th>
...
</tr>
</thead>
...
</table>
I18n: example with Spring
90 / 101
Theming
Supported themes:
jQueryUI ThemeRoller
Bootstrap 2
Tablecloth
Responsive
Bootstrap 3
Responsive
91 / 101
JSP <datatables:table...theme="bootstrap3"cssClass="table">
<datatables:columnproperty="id"/>
<datatables:columnproperty="firstName"/>
<datatables:columnproperty="lastName"/>
<datatables:columnproperty="address.town.name"/>
<datatables:columnproperty="mail"/>
</datatables:table>
Theming
92 / 101
JSP
Thymeleaf
<table...dt:theme="bootstrap3"class="table">
<thead>
<tr>
<th>Id</th>
<th>Firstname</th>
<th>Lastname</th>
<th>Street</th>
<th>Mail</th>
</tr>
</thead>
<tbody>
<trth:each="person:${persons}">
<tdth:text="${person?.id}">1</td>
<tdth:text="${person?.firstName}">John</td>
<tdth:text="${person?.lastName}">Doe</td>
<tdth:text="${person?.address?.town?.name}">Nobodyknows!</td>
<tdth:text="${person?.mail}">john@doe.com</td>
</tr>
</tbody>
</table>
Theming
93 / 101
Quick introduction
Brief history
Dandelion-Core
Dandelion-Datatables
Some statistics
Future
Demo
94 / 101
Some statistics
35 releases (source: GitHub, all repos)
15 pull requests merged (source: GitHub, all repos)
9 contributors from 6 countries (source: GitHub, all repos)
1432 commits (source: Ohloh)
121,770 LOC (source: Ohloh)
98 GitHub stars (source: GitHub, all repos)
~80 followers on Twitter (source: Twitter)
~270 topics, ~10000 views in the forum (source: Nabble)
3200+ redeploys/restarts prevented, saving about 106h (source: JRebel)
95 / 101
Quick introduction
Brief history
Dandelion-Core
Dandelion-Datatables
Some statistics
Future
Demo
96 / 101
Dandelion-
Core
Full support for asset minification and merging
Improvements on asset bundles: externalization,
configuration via XML, JavaConfig
Add new processors for meta-frameworks
(CoffeeScript, Less, ...)
Add support for conditionnal assets (e.g. IE8+, IE9+)
Add support for CSS sprites
New AssetCacheimplementation based on Hazelcast
JBoss Forge plugin allowing to scaffold a project based
on Dandelion
Add support for RequireJS
Bower integration
Future
97 / 101
Dandelion-
Core
Dandelion-
Datatables
New extension for editable tables (Editor, jEditable, ...)
Add support for more DataTables' extensions
Add support for DataTables 1.10.0
New theme for Foundation
Add WebSocket support for continously-updating
tables (Atmosphere, Spring MVC 4)
Add support for Spring Data REST
Future
98 / 101
Dandelion-
Core
Dandelion-
Datatables
New
components!
Dandelion-GUA? (Google Universal Analytics)
Dandelion-Forms?
All ideas are welcome!
Future
99 / 101
Quick introduction
Brief history
Dandelion-Core
Dandelion-Datatables
Some statistics
Future
Demo
100 / 101
Demo
https://github.com/dandelion/dandelion-samples
101 / 101

More Related Content

PPTX
SpringBoot with MyBatis, Flyway, QueryDSL
PDF
Czym jest webpack i dlaczego chcesz go używać?
PDF
The new static resources framework
PDF
Grails resources
PPT
ODP
Single Page Applications in Drupal
PPTX
Capture, record, clip, embed and play, search: video from newbie to ninja
PDF
Java Configuration Deep Dive with Spring
SpringBoot with MyBatis, Flyway, QueryDSL
Czym jest webpack i dlaczego chcesz go używać?
The new static resources framework
Grails resources
Single Page Applications in Drupal
Capture, record, clip, embed and play, search: video from newbie to ninja
Java Configuration Deep Dive with Spring

What's hot (20)

KEY
Drupal as a web framework
PPTX
Sherlock Homepage - A detective story about running large web services (VISUG...
PDF
OSGi and Spring Data for simple (Web) Application Development - Christian Bar...
DOCX
SCasia 2018 MSFT hands on session for Azure Batch AI
KEY
Approaches to mobile site development
PDF
Vue routing tutorial getting started with vue router
PDF
Servlet sessions
PDF
Meetup Performance
PPTX
SQL Server 2014 Backup to Azure - SQL Saturday CR 2015
PDF
AspNetWhitePaper
PPTX
Varnish Cache and its usage in the real world!
PPTX
Provisioning in Microsoft Azure
PPTX
SharePoint 2010 Training Session 6
PPTX
Mojo – Simple REST Server
PDF
C fowler azure-dojo
PDF
Building Performance - ein Frontend-Build-Prozess für Java mit Maven
PDF
The Spring 4 Update - Josh Long
PPTX
Plugins on OnDemand with Remote Apps - Atlassian Summit 2012
PDF
Rest Security with JAX-RS
PDF
distributing over the web
Drupal as a web framework
Sherlock Homepage - A detective story about running large web services (VISUG...
OSGi and Spring Data for simple (Web) Application Development - Christian Bar...
SCasia 2018 MSFT hands on session for Azure Batch AI
Approaches to mobile site development
Vue routing tutorial getting started with vue router
Servlet sessions
Meetup Performance
SQL Server 2014 Backup to Azure - SQL Saturday CR 2015
AspNetWhitePaper
Varnish Cache and its usage in the real world!
Provisioning in Microsoft Azure
SharePoint 2010 Training Session 6
Mojo – Simple REST Server
C fowler azure-dojo
Building Performance - ein Frontend-Build-Prozess für Java mit Maven
The Spring 4 Update - Josh Long
Plugins on OnDemand with Remote Apps - Atlassian Summit 2012
Rest Security with JAX-RS
distributing over the web
Ad

Viewers also liked (20)

PPTX
A herb to know: dandelion
PPT
The dandelion model
DOCX
Natural diuretics
PPTX
Diuretic drugs
PPTX
Taraxacum officinale
PPT
Health Benefits of Dandelion
PPTX
Dandelion Book
PDF
Dandelion API and mobile payment: food for thoughts for H-ACK PAYMENT
PPTX
We learn about the herbs in all the subjects: How many words could we make?
PPTX
Taraxacum officinale- Diente de León
PPTX
Dandelions My Little Dandelion
PDF
Teori pragmantik
PPTX
Diuretics
PPTX
History of medical biotechnology
PPTX
Modern Medical Biotechnology
PPTX
Biotechnology products
PPTX
Genetic engineering
PPTX
Tissue engineering
PPTX
NATURAL RUBBER
A herb to know: dandelion
The dandelion model
Natural diuretics
Diuretic drugs
Taraxacum officinale
Health Benefits of Dandelion
Dandelion Book
Dandelion API and mobile payment: food for thoughts for H-ACK PAYMENT
We learn about the herbs in all the subjects: How many words could we make?
Taraxacum officinale- Diente de León
Dandelions My Little Dandelion
Teori pragmantik
Diuretics
History of medical biotechnology
Modern Medical Biotechnology
Biotechnology products
Genetic engineering
Tissue engineering
NATURAL RUBBER
Ad

Similar to Dandelion 0.10.0 (20)

PPTX
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tables
PDF
Resource Registries: Plone Conference 2014
PDF
X tag with web components - joe ssekono
PDF
Resource registries plone conf 2014
PDF
Ajax Performance Tuning and Best Practices
PPTX
Ex-8-hive.pptx
PDF
Nuxt.JS Introdruction
PPTX
A High-Performance Solution to Microservice UI Composition @ XConf Hamburg
PDF
Introduction of webpack 4
PPT
Build Your Own CMS with Apache Sling
PPTX
Presentation Tier optimizations
PDF
RESS – Responsive Webdesign and Server Side Components
PDF
RoR 101: Session 6
PDF
Node.js & Twitter Bootstrap Crash Course
PDF
TurboGears2 Pluggable Applications
PPTX
Front end performance optimization
PPTX
Cis 274 intro
ODP
Html5
PPTX
Html5 & less css
PPTX
Enough with the JavaScript already!
Web Design Course - Lecture 18 - Boostrap, Gatting started, grid system, tables
Resource Registries: Plone Conference 2014
X tag with web components - joe ssekono
Resource registries plone conf 2014
Ajax Performance Tuning and Best Practices
Ex-8-hive.pptx
Nuxt.JS Introdruction
A High-Performance Solution to Microservice UI Composition @ XConf Hamburg
Introduction of webpack 4
Build Your Own CMS with Apache Sling
Presentation Tier optimizations
RESS – Responsive Webdesign and Server Side Components
RoR 101: Session 6
Node.js & Twitter Bootstrap Crash Course
TurboGears2 Pluggable Applications
Front end performance optimization
Cis 274 intro
Html5
Html5 & less css
Enough with the JavaScript already!

Recently uploaded (20)

PPTX
Trending Python Topics for Data Visualization in 2025
PDF
Multiverse AI Review 2025: Access All TOP AI Model-Versions!
PPTX
CNN LeNet5 Architecture: Neural Networks
DOCX
How to Use SharePoint as an ISO-Compliant Document Management System
PDF
DNT Brochure 2025 – ISV Solutions @ D365
PDF
AI/ML Infra Meetup | LLM Agents and Implementation Challenges
PPTX
WiFi Honeypot Detecscfddssdffsedfseztor.pptx
PPTX
Full-Stack Developer Courses That Actually Land You Jobs
PDF
Type Class Derivation in Scala 3 - Jose Luis Pintado Barbero
PDF
DuckDuckGo Private Browser Premium APK for Android Crack Latest 2025
PDF
How Tridens DevSecOps Ensures Compliance, Security, and Agility
PDF
BoxLang Dynamic AWS Lambda - Japan Edition
PPTX
Airline CRS | Airline CRS Systems | CRS System
PDF
Workplace Software and Skills - OpenStax
PPTX
most interesting chapter in the world ppt
PPTX
4Seller: The All-in-One Multi-Channel E-Commerce Management Platform for Glob...
PDF
AI Guide for Business Growth - Arna Softech
PDF
Microsoft Office 365 Crack Download Free
PDF
Practical Indispensable Project Management Tips for Delivering Successful Exp...
PDF
AI/ML Infra Meetup | Beyond S3's Basics: Architecting for AI-Native Data Access
Trending Python Topics for Data Visualization in 2025
Multiverse AI Review 2025: Access All TOP AI Model-Versions!
CNN LeNet5 Architecture: Neural Networks
How to Use SharePoint as an ISO-Compliant Document Management System
DNT Brochure 2025 – ISV Solutions @ D365
AI/ML Infra Meetup | LLM Agents and Implementation Challenges
WiFi Honeypot Detecscfddssdffsedfseztor.pptx
Full-Stack Developer Courses That Actually Land You Jobs
Type Class Derivation in Scala 3 - Jose Luis Pintado Barbero
DuckDuckGo Private Browser Premium APK for Android Crack Latest 2025
How Tridens DevSecOps Ensures Compliance, Security, and Agility
BoxLang Dynamic AWS Lambda - Japan Edition
Airline CRS | Airline CRS Systems | CRS System
Workplace Software and Skills - OpenStax
most interesting chapter in the world ppt
4Seller: The All-in-One Multi-Channel E-Commerce Management Platform for Glob...
AI Guide for Business Growth - Arna Softech
Microsoft Office 365 Crack Download Free
Practical Indispensable Project Management Tips for Delivering Successful Exp...
AI/ML Infra Meetup | Beyond S3's Basics: Architecting for AI-Native Data Access

Dandelion 0.10.0