Author: adelbene
Date: Sun Mar 29 15:36:25 2015
New Revision: 1669927
URL: http://svn.apache.org/r1669927
Log:
Added documentation for new HTML 5 components
Added:
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_15.gdoc
Modified:
wicket/common/site/trunk/_site/guide/guide/grails-app/conf/Config.groovy
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_14.gdoc
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_3.gdoc
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_4.gdoc
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/toc.yml
Modified:
wicket/common/site/trunk/_site/guide/guide/grails-app/conf/Config.groovy
URL:
http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/grails-app/conf/Config.groovy?rev=1669927&r1=1669926&r2=1669927&view=diff
==============================================================================
--- wicket/common/site/trunk/_site/guide/guide/grails-app/conf/Config.groovy
(original)
+++ wicket/common/site/trunk/_site/guide/guide/grails-app/conf/Config.groovy
Sun Mar 29 15:36:25 2015
@@ -94,7 +94,7 @@ log4j = {
grails.doc.title = "Apache Wicket User Guide"
grails.doc.subtitle = "Free Online Guide for Apache Wicket framework"
-grails.doc.authors = "Andrea Del Bene, Martin Grigorov, Carsten Hufe,
Christian Kroemer, Daniel Bartl, Paul BorÈ"
+grails.doc.authors = "Andrea Del Bene, Martin Grigorov, Carsten Hufe,
Christian Kroemer, Daniel Bartl, Paul BorÈ, Tobias Soloschenko"
grails.doc.images = new File("src/docs/img")
grails.doc.css = new File("src/docs/css")
grails.doc.logo = """<a href="/" target="_blank"><img height="80px"
src="http://wicket.apache.org/guide/img/apache-wicket.png"/></a>"""
Modified:
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_14.gdoc
URL:
http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_14.gdoc?rev=1669927&r1=1669926&r2=1669927&view=diff
==============================================================================
---
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_14.gdoc
(original)
+++
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_14.gdoc
Sun Mar 29 15:36:25 2015
@@ -1,5 +1,69 @@
-In this chapter we have learnt how to manage resources with the built-in
mechanism provided by Wicket. With this mechanism we handle resources from Java
code and Wicket will automatically take care of generating a valid URL for
them. We have also seen how resources can be bundled as package resources with
a component that depends on them to make it self-contained.
-Then, in the second part of the chapter, we have built a custom resource and
we have learnt how to mount it to an arbitrary URL and how to make it globally
available as shared resource.
-Finally, in the last part of the paragraph we took a peek at the mechanism
provided by the framework to customize the locations where the resource-lookup
algorithm searches for resources.
+Introduced in Wicket 6.20.0 / Wicket 7.0.0 there is a default way to be used
in which the output of all CssHeaderItems / JavaScriptHeaderItems is modified
before they are cached and delivered to the client. You can add a so called
Compressor by receiving the resource settings and invoke
#setJavaScriptCompressor(...) / #setJavaScriptCompressor(...). If you want to
add several Compressors use @org.apache.wicket.resource.CompositeCssCompressor@
or @org.apache.wicket.resource.CompositeJavaScriptCompressor@
+
+*Java Code:*
+{code}
+...
+Â Â Â public class WicketApplication extends WebApplication
+Â Â Â {
+Â Â Â Â Â Â @Override
+Â Â Â Â Â Â public Class<? extends WebPage> getHomePage()
+Â Â Â Â Â Â {
+Â Â Â Â Â Â Â Â Â return HomePage.class;
+Â Â Â Â Â Â }
+Â Â Â
+Â Â Â Â Â Â @Override
+Â Â Â Â Â Â public void init()
+Â Â Â Â Â Â {
+Â Â Â Â Â Â Â Â Â super.init();
+Â Â Â Â Â Â Â Â Â getResourceSettings().setCssCompressor(new
CssUrlReplacer());
+Â Â Â Â Â Â }
+Â Â Â }
+...
+{code}
+
+In the previous example you see that a
@org.apache.wicket.resource.CssUrlReplacer@ is added which does not compress
the content, but replaces all urls in CSS files and applies a Wicket
representation for them by automatically wrapping them into
PackageResourceReferences. Here is an example where you can see what Wicket
does with the url representation.
+
+HomePage (in package my/company/):
+*Java Code:*
+{code}
+...
+response.render(CssReferenceHeaderItem.forReference(new
PackageResourceReference(HomePage.class, "res/css/mycss.css")));
+...
+{code}
+
+mycss.css (in package my/company/res/css/):
+*CSS:*
+{code}
+...
+body{
+Â Â Â background-image:url('../images/some.png');
+}
+...
+{code}
+
+some.png (in package my/company/res/images/):
+<blob>
+
+Output of mycss.css:
+*CSS:*
+{code}
+...
+body{
+Â Â Â background-image:url('../images/some-ver-1425904170000.png');
+}
+...
+{code}
+
+If you add a url which looks like this
background-image:url('../images/some.png?embedBase64'); Wicket is going to
embed the complete image as base64 string with its corresponding mime type into
the css file. It looks like the following code block demonstrates.
+
+Output of mycss.css:
+*CSS:*
+{code}
+...
+body{
+Â Â Â background-image: url(data:image/png;base64,R0lGODlh1wATAX....);
+}
+...
+{code}
Added:
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_15.gdoc
URL:
http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_15.gdoc?rev=1669927&view=auto
==============================================================================
---
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_15.gdoc
(added)
+++
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_15.gdoc
Sun Mar 29 15:36:25 2015
@@ -0,0 +1,7 @@
+
+
+In this chapter we have learnt how to manage resources with the built-in
mechanism provided by Wicket. With this mechanism we handle resources from Java
code and Wicket will automatically take care of generating a valid URL for
them. We have also seen how resources can be bundled as package resources with
a component that depends on them to make it self-contained.
+
+Then, in the second part of the chapter, we have built a custom resource and
we have learnt how to mount it to an arbitrary URL and how to make it globally
available as shared resource.
+
+Finally, in the last part of the paragraph we took a peek at the mechanism
provided by the framework to customize the locations where the resource-lookup
algorithm searches for resources.
\ No newline at end of file
Modified:
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_3.gdoc
URL:
http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_3.gdoc?rev=1669927&r1=1669926&r2=1669927&view=diff
==============================================================================
---
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_3.gdoc
(original)
+++
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_3.gdoc
Sun Mar 29 15:36:25 2015
@@ -65,6 +65,83 @@ Package resources can be localized follo
In the example illustrated in the picture above, if we try to retrieve package
resource calendar.jpg when the current locale is set to French, the actual file
returned will be calendar_fr.jpg.
{note}
+h3. Responsive images - multiple resource references use in one component
+
+Since Wicket 7.0.0 the build-in component
@org.apache.wicket.markup.html.image.Image@ allows you to add several
ResourceReferences via varargs and to provide sizes for each image so that the
browser is able to pick the best image source.
+
+*HTML:*
+{code:html}
+...
+ Package resource image: <img wicket:id="packageResPicture"/>
+...
+{code}
+
+*Java Code:*
+{code}
+...
+ Image image = new Image("packageResPicture",
+ new PackageResourceReference(getClass(),"small.jpg"),
+ new PackageResourceReference(getClass(), "large.jpg"),
+ new PackageResourceReference(getClass(), "medium.jpg"),
+ new PackageResourceReference(getClass(), "small.jpg"));
+ image.setXValues("1024w", "640w", "320w");
+ image.setSizes("(min-width: 36em) 33.3vw", "100vw");
+
+ this.add(image);
+...
+{code}
+
+The component @org.apache.wicket.markup.html.image.Picture@ is used to provide
a fallback image @org.apache.wicket.markup.html.image.Image@ and several source
components @org.apache.wicket.markup.html.image.Source@ which gives a developer
the control as to when and if those images are presented to the user.
+
+*HTML:*
+{code:html}
+...
+ <picture wicket:id="picture">
+ <source wicket:id="big" />
+ <source wicket:id="small" />
+ <img wicket:id="fallback" />
+ </picture>
+...
+{code}
+
+*Java Code:*
+{code}
+...
+ Picture picture = new Picture("picture");
+
+ Source big = new Source("big", new
PackageResourceReference(getClass(), "big.jpg"), new
PackageResourceReference(getClass(), "big-hd.jpg");
+ big.setXValues("1x","2x");
+ big.setMedia("(min-width: 40em)");
+ picture.add(big);
+
+ Source small = new Source("small", new
PackageResourceReference(getClass(), "small.jpg"), new
PackageResourceReference(getClass(), "small-hd.jpg");
+ small.setXValues("1x","2x");
+ picture.add(small);
+
+ Image image = new Image("fallback", new
PackageResourceReference(getClass(), "fallback.jpg"));
+ picture.add(image);
+
+ this.add(picture);
+...
+{code}
+
+h3. Media tags - resource references with content range support
+
+Since Wicket 7.0.0 the PackageResource and the PackageResourceReference
support "Range" HTTP header for the request and "Content-Range" /
"Accept-Range" HTTP headers for the response, which are used for videos / audio
tags. The "Range" header allows the client to only request a specific byte
range of the resource. The server provides the "Content-Range" and tells the
client which bytes are going to be send.
+
+*HTML:*
+{code:html}
+...
+ <video wicket:id="video" />
+...
+{code}
+
+*Java Code:*
+{code}
+...
+ Video video = new Video("video", new
PackageResourceReference(getClass(),"video.mp4"));
+...
+{code}
h3. Using package resources with tag <wicket:link>
Modified:
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_4.gdoc
URL:
http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_4.gdoc?rev=1669927&r1=1669926&r2=1669927&view=diff
==============================================================================
---
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_4.gdoc
(original)
+++
wicket/common/site/trunk/_site/guide/guide/src/docs/guide/resources/resources_4.gdoc
Sun Mar 29 15:36:25 2015
@@ -12,6 +12,7 @@ Header entries are instances of abstract
* *PriorityHeaderItem:* it wraps another header item and ensures that it will
have the priority over the other items during rendering phase.
* *StringHeaderItem:* with this class we can add an arbitrary text to the
header section. Factory method is @forString(CharSequence string)@.
* *MetaDataHeaderItem:* starting from version 6.17.0, Wicket provides this
class to handle meta informations such as <meta> tags or [canonical link
element|http://en.wikipedia.org/wiki/Canonical_link_element]. The available
factory methods are @forLinkTag@ and @forMetaTag@ which can be used to create
respectively a <link> tag or a <meta> one. We can add tag attribute to an
existing instance of @MetaDataHeaderItem@ with method @addTagAttribute(String
attributeName, Object attributeValue)@. See JavaDoc for further details on this
class.
+* *HtmlImportHeaderItem:* introduced in Wicket 6.19.0, provides a HTML5
functionality to include other wicket pages (other html files) into the current
generated. Factory methods provided by this class are @forImportLinkTag@ which
takes the page class or the url of the page / html to be included.
In the following example our custom component loads a CSS file as a package
resource (placed in the same package) and it adds it to header section.
Modified: wicket/common/site/trunk/_site/guide/guide/src/docs/guide/toc.yml
URL:
http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/src/docs/guide/toc.yml?rev=1669927&r1=1669926&r2=1669927&view=diff
==============================================================================
--- wicket/common/site/trunk/_site/guide/guide/src/docs/guide/toc.yml (original)
+++ wicket/common/site/trunk/_site/guide/guide/src/docs/guide/toc.yml Sun Mar
29 15:36:25 2015
@@ -122,7 +122,8 @@ resources:
resources_11: Mounting resources
resources_12: Shared resources
resources_13: Customizing resource loading
- resources_14: Summary
+ resources_14: CssHeaderItem and JavaScriptHeaderItem compression
+ resources_15: Summary
jsintegration:
title: An example of integration with JavaScript
jsintegration_1: What we want to do...
![http://wicket.apache.org/guide/img/apache-wicket.png"/](http://wicket.apache.org/guide/img/apache-wicket.png"/){kind=link}