You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@wicket.apache.org by ad...@apache.org on 2015/03/29 17:36:25 UTC

svn commit: r1669927 - in /wicket/common/site/trunk/_site/guide/guide: grails-app/conf/ src/docs/guide/ src/docs/guide/resources/

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...