You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by lo...@apache.org on 2016/03/16 21:42:29 UTC
svn commit: r1735293 - in
/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main:
java/org/apache/myfaces/tobago/example/demo/
webapp/content/20-component/010-input/10-in/
webapp/content/20-component/010-input/30-textarea/ we...
Author: lofwyr
Date: Wed Mar 16 20:42:29 2016
New Revision: 1735293
URL: http://svn.apache.org/viewvc?rev=1735293&view=rev
Log:
TOBAGO-1544: Revise Demo Application for Tobago 3.0
[developed by hnoeth]
Added:
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/OutController.java
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/TextareaController.java
Modified:
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/10-in/in.xhtml
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/30-textarea/textarea.xhtml
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/40-date/date.xhtml
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/10-out/out.xhtml
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/20-label/label.xhtml
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/40-image/image.xhtml
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/60-object/object.xhtml
myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/tobago-resource/html/standard/standard/property/overview.properties.xml
Added: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/OutController.java
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/OutController.java?rev=1735293&view=auto
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/OutController.java (added)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/OutController.java Wed Mar 16 20:42:29 2016
@@ -0,0 +1,14 @@
+package org.apache.myfaces.tobago.example.demo;
+
+import javax.inject.Named;
+import java.io.Serializable;
+
+@Named
+public class OutController implements Serializable {
+
+ public String getHtml() {
+ return "Text in <span style='color:#FF0000'>red</span>, "
+ + "<span style='color:#00FF00'>green</span> and <span style='color:#0000FF'>blue</span>.";
+ }
+
+}
Added: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/TextareaController.java
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/TextareaController.java?rev=1735293&view=auto
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/TextareaController.java (added)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/java/org/apache/myfaces/tobago/example/demo/TextareaController.java Wed Mar 16 20:42:29 2016
@@ -0,0 +1,37 @@
+package org.apache.myfaces.tobago.example.demo;
+
+import javax.enterprise.context.SessionScoped;
+import javax.inject.Named;
+import java.io.Serializable;
+
+@SessionScoped
+@Named
+public class TextareaController implements Serializable {
+
+ private String longText;
+
+ public TextareaController() {
+ longText = "The goal of Apache Tobago⢠is to provide the community with a well designed set of user interface components based on JSF and run"
+ + " on MyFaces.\n\n"
+ + "Tobago is more than just a tag library. The following statements characterize Tobago and make it different from other"
+ + " frameworks:\n"
+ + "- The focus of Tobago is to create business applications without the need for HTML design. The development of Tobago pages follows"
+ + " more the development of conventional user interfaces than the creation of web pages.\n"
+ + "- The UI components are abstracted from HTML and any layout information that does not belong to the general page structure. The"
+ + " final output format is determined by the client/user-agent.\n"
+ + "- A theming mechanism makes it easy to change the look and feel and to provide special implementations for certain browsers. A"
+ + " fallback solution ensures that as much code is reused for new themes as possible.\n"
+ + "- A layout manager is used to arrange the components automatically. This means, no manual laying out with HTML tables or other"
+ + " constructs is needed.\n"
+ + "\n"
+ + "The development of Tobago started in 2002.";
+ }
+
+ public String getLongText() {
+ return longText;
+ }
+
+ public void setLongText(String longText) {
+ this.longText = longText;
+ }
+}
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/10-in/in.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/10-in/in.xhtml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/10-in/in.xhtml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/10-in/in.xhtml Wed Mar 16 20:42:29 2016
@@ -20,31 +20,34 @@
<ui:composition template="/main.xhtml"
xmlns:tc="http://myfaces.apache.org/tobago/component"
xmlns:ui="http://java.sun.com/jsf/facelets">
- <ui:param name="title" value="#{overviewBundle.in} <tc:in>"/>
- <p>The <code class="language-markup"><tc:in/></code> tag create a classic inputfield.</p>
- <p>A documentation of all possible attributes can be found here (https://myfaces.apache.org/tobago/doc/2.0.9/tld/tc/in.html). TODO: link to tobago3</p>
- <tc:section label="Basics">
- <p>In the most cases, a label should be placed in front of every inputfield. For this use the attribute <code>label</code>.</p>
- <pre><code class="language-markup"><tc:in label="Input" value="Some Text"/></code></pre>
- <tc:in id="i1" label="Input" value="Some Text"/>
- <tc:in id="i2" label="Read Only" readonly="true" value="Some Text"/>
- <tc:in id="i3" label="Disabled" disabled="true" value="Some Text"/>
- <tc:in id="i4" value="Input without a label"/>
- </tc:section>
- <tc:section label="Focus">
- <p>The following inputfield should be selected after reloading the page. Use the <code>focus</code> attribute.</p>
- <pre><code class="language-markup"><tc:in label="Input (focus)" focus="true" value="Some Text"/></code></pre>
- <tc:in id="i5" label="Input (focus)" focus="true" value="Some Text"/>
- </tc:section>
- <tc:section label="Password">
- <p>To create an inputfield for passwords, set the <code>password</code> attribute to 'true'. It will hide the text as shown in the following example.</p>
- <pre><code id="c3" class="language-markup"><tc:in label="Password" password="true" value="password"/></code></pre>
- <tc:in id="i6" label="Password" password="true" value="password"/>
- </tc:section>
- <tc:section label="Placeholder">
- <p>Another way to tell the user the meaning of a field is the <code>placeholder</code> attribute.</p>
- <p>The text of the placeholder will only be shown, if the value is an empty string.</p>
- <pre><code class="language-markup"><tc:in label="Placeholder" placeholder="Grey Text"/></code></pre>
- <tc:in id="i7" label="Placeholder" placeholder="Short description of the field." value=""/>
- </tc:section>
+ <ui:param name="title" value="#{overviewBundle.in} <tc:in>"/>
+ <p>The <code class="language-markup"><tc:in/></code> tag create a classic inputfield.</p>
+ <p>A documentation of all possible attributes can be found here (https://myfaces.apache.org/tobago/doc/2.0.9/tld/tc/in.html). TODO: link to tobago3</p>
+ <tc:section label="Basics">
+ <p>In the most cases, a label should be placed in front of every inputfield. For this use the attribute
+ <code>label</code>.</p>
+ <pre><code class="language-markup"><tc:in label="Input" value="Some Text"/></code></pre>
+ <tc:in id="i1" label="Input" value="Some Text"/>
+ <tc:in id="i2" label="Read Only" readonly="true" value="Some Text"/>
+ <tc:in id="i3" label="Disabled" disabled="true" value="Some Text"/>
+ <tc:in id="i4" value="Input without a label"/>
+ </tc:section>
+ <tc:section label="Focus">
+ <p>The following inputfield should be selected after reloading the page. Use the <code>focus</code> attribute.</p>
+ <pre><code class="language-markup"><tc:in label="Input (focus)" focus="true" value="Some Text"/></code></pre>
+ <tc:in id="i5" label="Input (focus)" focus="true" value="Some Text"/>
+ </tc:section>
+ <tc:section label="Password">
+ <p>To create an inputfield for passwords, set the
+ <code>password</code> attribute to 'true'. It will hide the text as shown in the following example.</p>
+ <pre><code id="c3"
+ class="language-markup"><tc:in label="Password" password="true" value="password"/></code></pre>
+ <tc:in id="i6" label="Password" password="true" value="password"/>
+ </tc:section>
+ <tc:section label="Placeholder">
+ <p>Another way to tell the user the meaning of a field is the <code>placeholder</code> attribute.</p>
+ <p>The text of the placeholder will only be shown, if the value is an empty string.</p>
+ <pre><code class="language-markup"><tc:in label="Placeholder" placeholder="Grey Text"/></code></pre>
+ <tc:in id="i7" label="Placeholder" placeholder="Short description of the field." value=""/>
+ </tc:section>
</ui:composition>
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/30-textarea/textarea.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/30-textarea/textarea.xhtml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/30-textarea/textarea.xhtml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/30-textarea/textarea.xhtml Wed Mar 16 20:42:29 2016
@@ -20,39 +20,32 @@
<ui:composition template="/main.xhtml"
xmlns:tc="http://myfaces.apache.org/tobago/component"
xmlns:ui="http://java.sun.com/jsf/facelets">
- <ui:param name="title" value="#{overviewBundle.textarea} <tc:textarea>"/>
- <p>The <code class="language-markup"><tc:textarea/></code> tag, creates a textfield with one or more rows.
- The textarea becomes scrollable, if the containing text could not displayed in the current size.</p>
- <p>A documentation of all possible attributes can be found here (https://myfaces.apache.org/tobago/doc/2.0.9/tld/tc/textarea.html). TODO: link to tobago3</p>
- <tc:section label="Basics">
- <p>The textarea should always have a label attached. For this, use the <code>label</code> attribute.</p>
- <p>Unlike the inputfield TODO:linkToIn there is no placeholder attribute to describe the meaning of a textarea, when no label is set.</p>
- <pre><code class="language-markup"><tc:textarea label="Text Area" value="Some text, some text, ..."/></code></pre>
- <tc:textarea id="t1" label="Text Area"
- value="Some text, some text, some text, some text, some text, some text, some text, some text, some text, some text, ..."/>
- <tc:textarea id="t2" label="Read Only" readonly="true"
- value="Some text, some text, some text, some text, some text, some text, some text, some text, some text, some text, ..."/>
- <tc:textarea id="t3" label="Disabled" disabled="true"
- value="Some text, some text, some text, some text, some text, some text, some text, some text, some text, some text, ..."/>
- <tc:textarea id="t4"
- value="Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, ..."/>
- </tc:section>
- <tc:section label="Focus">
- <p>The following textarea should be selected after reloading this page. Use the <code>focus</code> attribute.</p>
- <pre><code class="language-markup"><tc:textarea label="Text Area (focus)" focus="true" value="Some Text"/></code></pre>
- <tc:textarea id="t5" label="Text Area (focus)" focus="true" value="Some Text"/>
- </tc:section>
- <tc:section label="Rows">
- <p>With the <code>rows</code> attribute, the initial size of the textbox can be set. A value less than 1 has no effect.</p>
- <p>The following example show textareas with a predefined rows from 1 to 4.</p>
- <pre><code class="language-markup"><tc:textarea label="Text Area (focus)" rows="1" value="Some Text"/></code></pre>
- <tc:textarea id="t6" label="Text Area (1 row)" rows="1"
- value="Text Area with one row. Text Area with one row. Text Area with one row. Text Area with one row."/>
- <tc:textarea id="t7" label="Text Area (2 rows)" rows="2"
- value="Text Area with two rows. Text Area with two rows. Text Area with two rows. Text Area with two rows. Text Area with two rows."/>
- <tc:textarea id="t8" label="Text Area (3 rows)" rows="3"
- value="Text Area with three rows. Text Area with three rows. Text Area with three rows. Text Area with three rows. "/>
- <tc:textarea id="t9" label="Text Area (4 rows)" rows="4"
- value="Text Area with four rows. Text Area with four rows. Text Area with four rows. Text Area with four rows."/>
- </tc:section>
+ <ui:param name="title" value="#{overviewBundle.textarea} <tc:textarea>"/>
+ <p>The <code class="language-markup"><tc:textarea/></code> tag, creates a textfield with one or more rows.
+ The textarea becomes scrollable, if the containing text could not displayed in the current size.</p>
+ <p>A documentation of all possible attributes can be found here (https://myfaces.apache.org/tobago/doc/2.0.9/tld/tc/textarea.html). TODO: link to tobago3</p>
+ <tc:section label="Basics">
+ <p>The textarea should always have a label attached. For this, use the <code>label</code> attribute.</p>
+ <p>Unlike the inputfield TODO:linkToIn there is no placeholder attribute to describe the meaning of a textarea, when no label is set.</p>
+ <pre><code class="language-markup"><tc:textarea label="Text Area" value="Some text, some text, ..."/></code></pre>
+ <tc:textarea id="t1" label="Text Area"
+ value="Some text, some text, some text, some text, some text, some text, some text, some text, some text, some text, ..."/>
+ <tc:textarea id="t2" label="Read Only" readonly="true"
+ value="Some text, some text, some text, some text, some text, some text, some text, some text, some text, some text, ..."/>
+ <tc:textarea id="t3" label="Disabled" disabled="true"
+ value="Some text, some text, some text, some text, some text, some text, some text, some text, some text, some text, ..."/>
+ <tc:textarea id="t4"
+ value="Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, Text Area without a label, ..."/>
+ </tc:section>
+ <tc:section label="Focus">
+ <p>The following textarea should be selected after reloading this page. Use the <code>focus</code> attribute.</p>
+ <pre><code class="language-markup"><tc:textarea label="Text Area (focus)" focus="true" value="Some Text"/></code></pre>
+ <tc:textarea id="t5" label="Text Area (focus)" focus="true" value="Some Text"/>
+ </tc:section>
+ <tc:section label="Rows">
+ <p>With the <code>rows</code> attribute, the initial size of the textbox can be set. A value less than 1 has no effect.</p>
+ <p>The following example show a textarea with five rows.</p>
+ <pre><code class="language-markup"><tc:textarea label="Text Area" rows="5" value="\#{textareaController.longText}"/></code></pre>
+ <tc:textarea id="t6" label="Text Area" rows="5" value="#{textareaController.longText}"/>
+ </tc:section>
</ui:composition>
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/40-date/date.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/40-date/date.xhtml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/40-date/date.xhtml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/010-input/40-date/date.xhtml Wed Mar 16 20:42:29 2016
@@ -21,129 +21,141 @@
xmlns:tc="http://myfaces.apache.org/tobago/component"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core">
- <ui:param name="title" value="#{overviewBundle.date} <tc:date>"/>
- <p>The <code class="language-markup"><tc:date/></code> tag create an inputfield with a button to open a calendar to edit the date.
- The date can also be edited in the textfield.</p>
- <p>A documentation of all possible attributes can be found here (https://myfaces.apache.org/tobago/doc/2.0.9/tld/tc/date.html). TODO: link to tobago3</p>
- <tc:section label="Basics">
- <p>In general, a date should always have a label. To get a label use the <code>label</code> attribute.</p>
- <p>It is recommended to use a pattern. For that, use <code><f:convertDateTime></code>.</p>
- <p>The <code>value</code> must be a Date(link to https://docs.oracle.com/javase/8/docs/api/java/util/Date.html) or a string with a matching pattern.</p>
+ <ui:param name="title" value="#{overviewBundle.date} <tc:date>"/>
+ <p>The <code class="language-markup"><tc:date/></code> tag create an inputfield with a button to open a calendar to edit the date.
+ The date can also be edited in the textfield.</p>
+ <p>A documentation of all possible attributes can be found here (https://myfaces.apache.org/tobago/doc/2.0.9/tld/tc/date.html). TODO: link to tobago3</p>
+ <tc:section label="Basics">
+ <p>In general, a date should always have a label. To get a label use the <code>label</code> attribute.</p>
+ <p>It is recommended to use a pattern. For that, use <code><f:convertDateTime></code>.</p>
+ <p>The
+ <code>value</code> must be a Date(link to https://docs.oracle.com/javase/8/docs/api/java/util/Date.html) or a string with a matching pattern.
+ </p>
<pre><code class="language-markup"><tc:date label="Date" value="18.03.2016">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
</tc:date></code></pre>
- <tc:date id="d1" label="Date" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:date>
- <tc:date id="d2" label="Read Only" readonly="true" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:date>
- <tc:date id="d3" label="Disabled" disabled="true" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:date>
- <tc:date id="d4" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:date>
- </tc:section>
- <tc:section label="Focus">
- <p>The following date should be selected after reloading the page. This can be done with the attribute <code>focus</code>.</p>
+ <tc:date id="d1" label="Date" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:date>
+ <tc:date id="d2" label="Read Only" readonly="true" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:date>
+ <tc:date id="d3" label="Disabled" disabled="true" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:date>
+ <tc:date id="d4" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:date>
+ </tc:section>
+ <tc:section label="Focus">
+ <p>The following date should be selected after reloading the page. This can be done with the attribute <code>focus</code>.</p>
<pre><code class="language-markup"><tc:date label="Date (focus)" focus="true">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:date></code></pre>
- <tc:date id="d5" label="Date (focus)" focus="true">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:date>
- </tc:section>
- <tc:section label="Outputfields">
- <p>A date can also be displayed in other components.</p>
- <tc:section label="Input">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+</tc:date></code></pre>
+ <tc:date id="d5" label="Date (focus)" focus="true">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:date>
+ </tc:section>
+ <tc:section label="Outputfields">
+ <p>A date can also be displayed in other components.</p>
+ <tc:section label="Input">
<pre><code class="language-markup"><tc:in label="Date in Textfield" value="\#{dateController.today}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
</tc:in></code></pre>
- <tc:in label="Date in Textfield" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:in>
- </tc:section>
- <tc:section label="Text Area">
+ <tc:in id="i1" label="Date in Textfield" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:in>
+ </tc:section>
+ <tc:section label="Text Area">
<pre><code class="language-markup"><tc:textarea label="Date in Text Area" value="\#{dateController.today}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
</tc:textarea></code></pre>
- <tc:textarea id="t1" label="Date in Text Area" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:textarea>
- </tc:section>
- <tc:section label="Output">
+ <tc:textarea id="t1" label="Date in Text Area" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:textarea>
+ </tc:section>
+ <tc:section label="Output">
<pre><code class="language-markup"><tc:out label="Date in Output" value="\#{dateController.today}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
</tc:out></code></pre>
- <tc:out id="o2" label="Date in Output" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:out>
- </tc:section>
- <tc:section label="Label">
+ <tc:out id="o1" label="Date in Output" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:out>
+ </tc:section>
+ <tc:section label="Label">
<pre><code class="language-markup"><tc:label value="\#{dateController.today}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
</tc:label></code></pre>
- <tc:label id="l1" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- </tc:label>
- </tc:section>
- </tc:section>
- <tc:section label="Pattern And Button">
- <p>Here are some examples for different pattern. The format is used from java.text.SimpleDateFormat. TODO:setlink</p>
- <p>Also the type of the button changed with the <code>type</code> attribute.</p>
- <tc:section label="Month">
+ <tc:label id="l1" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ </tc:label>
+ </tc:section>
+ </tc:section>
+ <tc:section label="Pattern And Button">
+ <p>Here are some examples for different pattern. The format is used from java.text.SimpleDateFormat. TODO:setlink</p>
+ <p>Also the type of the button changed with the <code>type</code> attribute.</p>
+ <tc:section label="Month">
<pre><code class="language-markup"><tc:date label="Month" value="\#{dateController.today}">
- <f:convertDateTime pattern="MM/yyyy" type="date"/>
+ <f:convertDateTime pattern="MM/yyyy" type="date"/>
</tc:date></code></pre>
- <tc:date label="Month" value="#{dateController.once}">
- <f:convertDateTime pattern="MM/yyyy" type="date"/>
- </tc:date>
- </tc:section>
- <tc:section label="Minutes">
+ <tc:date id="d6" label="Month" value="#{dateController.once}">
+ <f:convertDateTime pattern="MM/yyyy" type="date"/>
+ </tc:date>
+ </tc:section>
+ <tc:section label="Minutes">
<pre><code class="language-markup"><tc:date label="Time" value="\#{dateController.today}">
- <f:convertDateTime pattern="HH:mm" type="time"/>
+ <f:convertDateTime pattern="HH:mm" type="time"/>
</tc:date></code></pre>
- <tc:date label="Time" value="#{dateController.once}">
- <f:convertDateTime pattern="HH:mm" type="time"/>
- </tc:date>
- </tc:section>
- <tc:section label="Seconds">
+ <tc:date id="d7" label="Time" value="#{dateController.once}">
+ <f:convertDateTime pattern="HH:mm" type="time"/>
+ </tc:date>
+ </tc:section>
+ <tc:section label="Seconds">
<pre><code class="language-markup"><tc:date label="Time" value="\#{dateController.today}">
- <f:convertDateTime pattern="HH:mm:ss" type="time"/>
+ <f:convertDateTime pattern="HH:mm:ss" type="time"/>
</tc:date></code></pre>
- <tc:date label="Time" value="#{dateController.once}">
- <f:convertDateTime pattern="HH:mm:ss" type="time"/>
- </tc:date>
- </tc:section>
- <tc:section label="Month with minutes">
+ <tc:date id="d8" label="Time" value="#{dateController.once}">
+ <f:convertDateTime pattern="HH:mm:ss" type="time"/>
+ </tc:date>
+ </tc:section>
+ <tc:section label="Month with minutes">
<pre><code class="language-markup"><tc:date label="Date and time" value="\#{dateController.today}">
- <f:convertDateTime pattern="dd.MM. - HH:mm" type="both"/>
+ <f:convertDateTime pattern="dd.MM. - HH:mm" type="both"/>
</tc:date></code></pre>
- <tc:date label="Date and time" value="#{dateController.once}">
- <f:convertDateTime pattern="dd.MM. - HH:mm" type="both"/>
- </tc:date>
- </tc:section>
- </tc:section>
- <tc:section label="Styles">
- <tc:date id="dateshortstyle" label="Short style" value="#{dateController.once}">
- <f:convertDateTime dateStyle="short" timeStyle="short" type="both"/>
- </tc:date>
- <tc:date id="datemediumstyle" label="Medium Style" value="#{dateController.once}">
- <f:convertDateTime dateStyle="medium" timeStyle="medium" type="both"/>
- </tc:date>
- <tc:date id="datelongstyle" label="Long Style" value="#{dateController.once}">
- <f:convertDateTime dateStyle="long" timeStyle="long" type="both"/>
- </tc:date>
- <tc:date id="datefullstyle" label="Full Style" value="#{dateController.once}">
- <f:convertDateTime dateStyle="full" timeStyle="full" type="both"/>
- </tc:date>
- </tc:section>
- <tc:section label="Ajax">
- <tc:date label="On Change" value="#{dateController.onchange}">
- <f:convertDateTime pattern="dd.MM.yyyy"/>
- <f:ajax render="o"/>
- </tc:date>
- <tc:out id="o" value="#{dateController.onchange}" label="On Server"/>
- </tc:section>
+ <tc:date id="d9" label="Date and time" value="#{dateController.once}">
+ <f:convertDateTime pattern="dd.MM. - HH:mm" type="both"/>
+ </tc:date>
+ </tc:section>
+ </tc:section>
+ <tc:section label="Styles">
+ <p>Styles can be set with the attributes <code>dateStyle</code> and <code>timeStyle</code>.
+ Possible values are 'short', 'medium', 'long' and 'full'.</p>
+ <tc:date id="d10" label="Short style" value="#{dateController.once}">
+ <f:convertDateTime dateStyle="short" timeStyle="short" type="both"/>
+ </tc:date>
+ <tc:date id="d11" label="Medium Style" value="#{dateController.once}">
+ <f:convertDateTime dateStyle="medium" timeStyle="medium" type="both"/>
+ </tc:date>
+ <tc:date id="d12" label="Long Style" value="#{dateController.once}">
+ <f:convertDateTime dateStyle="long" timeStyle="long" type="both"/>
+ </tc:date>
+ <tc:date id="d13" label="Full Style" value="#{dateController.once}">
+ <f:convertDateTime dateStyle="full" timeStyle="full" type="both"/>
+ </tc:date>
+ </tc:section>
+ <tc:section label="Ajax">
+ <p>The outputfield in this example, display the given date.
+ With <code class="language-markup"><f:ajax/></code>, the outputfield will be rerendered, after the date changed.
+ The date can be changed by button or by entering a valid date in the textfield. If the date is not valid, it won't be adopted.</p>
+ <pre><code class="language-markup"><tc:date label="On Change" value="\#{dateController.onchange}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ <f:ajax render="outputfield"/>
+</tc:date>
+<tc:out id="outputfield" label="On Server" value="\#{dateController.onchange}"/></code></pre>
+ <tc:date id="d14" label="On Change" value="#{dateController.onchange}">
+ <f:convertDateTime pattern="dd.MM.yyyy"/>
+ <f:ajax render="outputfield"/>
+ </tc:date>
+ <tc:out id="outputfield" label="On Server" value="#{dateController.onchange}"/>
+ </tc:section>
</ui:composition>
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/10-out/out.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/10-out/out.xhtml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/10-out/out.xhtml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/10-out/out.xhtml Wed Mar 16 20:42:29 2016
@@ -20,9 +20,37 @@
<ui:composition template="/main.xhtml"
xmlns:tc="http://myfaces.apache.org/tobago/component"
xmlns:ui="http://java.sun.com/jsf/facelets">
- <ui:param name="title" value="#{overviewBundle.out}"/>
- <tc:out id="o1" markup="strong" label="Output" value="Some Text"/>
- <tc:out id="o2" label="Read Only" readonly="true" value="Some Text"/>
- <tc:out id="o3" label="Disabled" disabled="true" value="Some Text"/>
- <tc:out id="o4" value="Output without a label"/>
+ <ui:param name="title" value="#{overviewBundle.out} <tc:out>"/>
+ <p>The <code class="language-markup"><tc:out></code> display an outputtext combined with a label.</p>
+ <p>TODO: attribute-link</p>
+ <tc:section label="Basics">
+ <p>To put a label in front of a outputtext, use the <code>label</code> attribute.</p>
+ <pre><code class="language-markup"><tc:out label="Output" value="Some Text"/></code></pre>
+ <tc:out id="o1" label="Output" value="Some Text"/>
+ <tc:out id="o2" value="Output without a label"/>
+ </tc:section>
+ <tc:section label="Escape">
+ <p>If the given string to the outputfield is HTML/XML code, it will be escaped by default.
+ But you can turn it off with the <code>escape</code> attribute.</p>
+ <tc:section label="Escape on (default)">
+ <pre><code
+ class="language-markup"><tc:out label="Escape on (default)" escape="true" value="\#{outController.html}"/></code></pre>
+ <tc:out id="o3" label="Escape on (default)" escape="true" value="#{outController.html}"/>
+ </tc:section>
+ <tc:section label="Escape off">
+ <p>Although the HTML code is not escaped, you can see, that the text is not colored.
+ This is, because the code is sanitzed (see next section).</p>
+ <pre><code class="language-markup"><tc:out label="Escape off" escape="false" value="\#{outController.html}"/></code></pre>
+ <tc:out id="o4" label="Escape off" escape="false" value="#{outController.html}"/>
+ </tc:section>
+ </tc:section>
+ <tc:section label="Sanitize">
+ <p>Sanitize remove HTML/XML-Tags from a given string, if not escaped. It can be configured in the tobago-config.xml.
+ If you want to write your own sanitizer, you have to implement <code>org.apache.myfaces.tobago.sanitizer.Sanitizer</code>.</p>
+ <p>Sanitzing can be deactivated for a component using the <code>sanitize</code> attribute.
+ But be careful, because of XSS vulnerability.</p>
+ <pre><code
+ class="language-markup"><tc:out label="Sanitize off" escape="false" sanitize="never" value="\#{outController.html}"/></code></pre>
+ <tc:out id="o5" label="Sanitize off" escape="false" sanitize="never" value="#{outController.html}"/>
+ </tc:section>
</ui:composition>
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/20-label/label.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/20-label/label.xhtml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/20-label/label.xhtml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/20-label/label.xhtml Wed Mar 16 20:42:29 2016
@@ -20,7 +20,38 @@
<ui:composition template="/main.xhtml"
xmlns:tc="http://myfaces.apache.org/tobago/component"
xmlns:ui="http://java.sun.com/jsf/facelets">
- <ui:param name="title" value="#{overviewBundle.label}"/>
- <tc:label id="l1" value="Some Text"/>
- <tc:label id="l2" disabled="true" value="Some diabled text."/>
+ <ui:param name="title" value="#{overviewBundle.label} <tc:label>"/>
+ <p>With <code class="language-markup"><tc:label></code>, a single label can be created.
+ Some components already have a <code>label</code> attribute to combine it with a label, which should be used in general.</p>
+ <p>TODO:link to attribute</p>
+ <tc:section label="Basics">
+ <pre><code class="language-markup"><tc:label value="Single Label"/></code></pre>
+ <tc:label id="l1" value="Single Label"/>
+ </tc:section>
+
+ <tc:section label="Input field">
+ <pre><code class="language-markup"><tc:flexLayout columns="*;200px">
+ <tc:in placeholder="Inputfield"/>
+ <tc:label id="l2" value="Label after inputfield"/>
+</tc:flexLayout></code></pre>
+ <tc:flexLayout columns="*;200px">
+ <tc:in id="i1" placeholder="Inputfield"/>
+ <tc:label id="l2" value="Label after inputfield"/>
+ </tc:flexLayout>
+ </tc:section>
+
+ <tc:section label="Input fields with automatic label">
+ See <tc:link label="Labeled Layout" link="../../../30-concept/16-layout/00/labeled-layout.xhtml"/>
+ </tc:section>
+
+ <tc:section label="Progress Bar">
+ <pre><code class="language-markup"><tc:flowLayout>
+ <tc:label value="Progress:"/>
+ <tc:progress value="0.4" max="1"/>
+</tc:flowLayout></code></pre>
+ <tc:flowLayout>
+ <tc:label id="l4" value="Progress:"/>
+ <tc:progress value="0.4" max="1"/>
+ </tc:flowLayout>
+ </tc:section>
</ui:composition>
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/40-image/image.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/40-image/image.xhtml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/40-image/image.xhtml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/40-image/image.xhtml Wed Mar 16 20:42:29 2016
@@ -20,10 +20,20 @@
<ui:composition template="/main.xhtml"
xmlns:tc="http://myfaces.apache.org/tobago/component"
xmlns:ui="http://java.sun.com/jsf/facelets">
-
- <ui:param name="title" value="#{overviewBundle.image}"/>
- <tc:image value="image/tobago_head.png"/>
- <tc:image value="image/tobago_head.png">
- <tc:style width="75px" height="42px"/>
+ <ui:param name="title" value="#{overviewBundle.image} <tc:image>"/>
+ <p>Create an image with <code class="language-markup"><tc:image/></code></p>
+ <p>link to attribute-doku</p>
+ <tc:section label="Basics">
+ <pre><code class="language-markup"><tc:image disabled="true" value="image/tobago_head.png"/></code></pre>
+ <tc:image id="i1" disabled="true" value="image/tobago_head.png"/>
+ </tc:section>
+ <tc:section label="Set width">
+ <p>To set the size of an image, <code><tc:style/></code> can be used.</p>
+ <pre><code class="language-markup"><tc:image value="image/tobago_head.png">
+ <tc:style width="20%"/>
+</tc:image></code></pre>
+ <tc:image id="i2" value="image/tobago_head.png">
+ <tc:style width="20%"/>
</tc:image>
+ </tc:section>
</ui:composition>
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/60-object/object.xhtml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/60-object/object.xhtml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/60-object/object.xhtml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/content/20-component/020-output/60-object/object.xhtml Wed Mar 16 20:42:29 2016
@@ -21,33 +21,36 @@
xmlns:tc="http://myfaces.apache.org/tobago/component"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core">
- <ui:param name="title" value="#{overviewBundle.object}"/>
- <tc:script file="content/20-component/020-output/60-object/object.js"/>
- <tc:out id="o1" value="External objects can be included, when CSP is activated. You may add a frame-src policy to the 'tobago-config.xml'."/>
+ <ui:param name="title" value="#{overviewBundle.object}"/>
+ <tc:script file="content/20-component/020-output/60-object/object.js"/>
+ <tc:out id="o1"
+ value="External objects can be included, when CSP is activated. You may add a frame-src policy to the 'tobago-config.xml'."/>
+ <p>
<tc:object id="tobagomap" src="https://www.google.com/maps/@11.249123,-60.687103,31489m/data=!3m1!1e3?hl=de"/>
+ </p>
+ <p>
<tc:object src="http://www.apache.org/"/>
+ </p>
- <tc:panel>
- <f:facet name="layout">
- <tc:gridLayout rows="35px;auto;*"/>
- </f:facet>
-
- <tc:out id="o11" value="External objects can be included, when CSP is activated. You may add a frame-src policy to the 'tobago-config.xml'."/>
-
- <tc:toolBar iconSize="off">
- <tc:toolBarCommand label="Show Tobago" omit="true">
- <tc:dataAttribute name="maps-position" value="11.249123,-60.687103"/>
- <tc:dataAttribute name="maps-zoom" value="12"/>
- <tc:dataAttribute name="maps-target" value="page:map"/>
- </tc:toolBarCommand>
- <tc:toolBarCommand label="Show World" omit="true">
- <tc:dataAttribute name="maps-target" value="page:map"/>
- </tc:toolBarCommand>
- </tc:toolBar>
- <tc:object id="map"/>
+ <tc:out id="o11"
+ value="External objects can be included, when CSP is activated. You may add a frame-src policy to the 'tobago-config.xml'."/>
+
+ <tc:toolBar iconSize="off">
+ <tc:toolBarCommand label="Show Tobago" omit="true">
+ <tc:dataAttribute name="maps-position" value="11.249123,-60.687103"/>
+ <tc:dataAttribute name="maps-zoom" value="12"/>
+ <tc:dataAttribute name="maps-target" value="page:map"/>
+ </tc:toolBarCommand>
+ <tc:toolBarCommand label="Show World" omit="true">
+ <tc:dataAttribute name="maps-target" value="page:map"/>
+ </tc:toolBarCommand>
+ </tc:toolBar>
+
+ <p>
+ <tc:object id="map"/>
+ </p>
- </tc:panel>
</ui:composition>
Modified: myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/tobago-resource/html/standard/standard/property/overview.properties.xml
URL: http://svn.apache.org/viewvc/myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/tobago-resource/html/standard/standard/property/overview.properties.xml?rev=1735293&r1=1735292&r2=1735293&view=diff
==============================================================================
--- myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/tobago-resource/html/standard/standard/property/overview.properties.xml (original)
+++ myfaces/tobago/branches/tobago-3.0.x/tobago-example/tobago-example-demo/src/main/webapp/tobago-resource/html/standard/standard/property/overview.properties.xml Wed Mar 16 20:42:29 2016
@@ -44,7 +44,7 @@
<entry key="date">Date</entry>
<entry key="output">Output Fields</entry>
<entry key="out">Output</entry>
- <entry key="Label">Label</entry>
+ <entry key="label">Label</entry>
<entry key="image">Image</entry>
<entry key="progress">Progress Bar</entry>
<entry key="object">External Object (iframe)</entry>