Merge branch 'master' of https://github.com/TheCoder4eu/BootsFacesWeb

src/main/java/net/bootsfaces/demo/BarcodeBean.java

@@ -31,8 +31,8 @@
 public class BarcodeBean implements Serializable {
 	private static final long serialVersionUID = -6810958868318611791L;
 	private String code39 = "1234567890128";
-	private String protocol = "http://";
-	private String url = "angularfaces.net";
+	private String protocol = "https://";
+	private String url = "pdfviewer.net";
 	private String url2 = "http://www.bootsfaces.net";
 	private String emptyText="";
 	private String nonEmptyText="Hello World";

src/main/webapp/bootstrap/Slider2.xhtml

@@ -67,7 +67,39 @@
     </h:form>
     <h2><a id="options_and_examples">Options and Examples</a></h2>
     <h4>Horizontal sliders width</h4>
-    <p>You can use the <code>span</code> attribute to control the width, in terms of Bootstrap's grid columns:</p>
+    <p>By default, the slider is 210 pixels wide. You can use the <code>span</code> attribute to control the width, in terms of Bootstrap's grid columns,
+    if you override this setting with a CSS rule:</p>
+    <b:panel look="info">
+      <f:facet name="heading"><b>EXAMPLE - <span class="glyphicon glyphicon-time"></span> Time slider</b></f:facet>
+
+	    <style>
+	        .slider.slider-horizontal{width:97%}
+	    </style>
+	    <b:row>
+	      <b:column>
+	        <b:slider2 mode="basic" label="Full width(12 columns default):" />
+	      </b:column>
+	    </b:row>
+	    <b:row>
+	      <b:column>
+	        <b:slider2 mode="basic" span="6" label="Slider (span=6):" />
+	      </b:column>
+	    </b:row>
+	    <b:row>
+	      <b:column>
+	        <b:slider2 mode="basic" span="4" label="Slider (span=4):" />
+	      </b:column>
+	    </b:row>
+       <f:facet name="footer">
+     <strong>Markup:</strong><br/>
+
+     <script type="syntaxhighlighter" class="brush: xml; toolbar: false;first-line: 0">
+     <![CDATA[
+    <style>
+        .slider.slider-horizontal {
+           width: 97%;
+        }
+    </style>
     <b:row>
       <b:column>
         <b:slider2 mode="basic" label="Full width(12 columns default):" />
@@ -83,9 +115,13 @@
         <b:slider2 mode="basic" span="4" label="Slider (span=4):" />
       </b:column>
     </b:row>
-    <p>If you omit the <code>span</code> attribute, the component will take the full width of the parent container.</p>
+
+          ]]></script>
+        </f:facet>
+      </b:panel>
+
     <br/>
-    <p>You can use more than one slider to get input for complex values, like the Time:</p>
+    <p>You can use more than one slider to get input for complex values, like the time:</p>
     <h:form id="fslider">
       <b:panel look="info">
       <f:facet name="heading"><b>EXAMPLE - <span class="glyphicon glyphicon-time"></span> Time slider</b></f:facet>

src/main/webapp/forms/ColorPickerAttributes.xhtml

@@ -45,7 +45,7 @@
             <tr>
                 <td>autocomplete</td>
                 <td>(none)</td>
-                <td>Controls browser autocomplete behavior.</td>
+                <td>Controls browser autocomplete behavior. Legal values: 'off', 'false', 'true', and 'on'.</td>
             </tr>
             <tr>
                 <td>binding</td>

src/main/webapp/forms/DateTimePicker.xhtml

@@ -370,7 +370,7 @@
 
     <h2><a id="reference_section">Reference section</a></h2>
     <ui:include src="DateTimePickerAttributes.xhtml" />
-    <b:panel look="info">
+    <b:panel look="info" rendered="false">
       <f:facet name="heading">
         <b>Skinning</b>
       </f:facet>

src/main/webapp/forms/InputSecretAttributes.xhtml

@@ -45,7 +45,7 @@
             <tr>
                 <td>autocomplete</td>
                 <td>(none)</td>
-                <td>Controls browser autocomplete behavior.</td>
+                <td>Controls browser autocomplete behavior. Legal values: 'off', 'false', 'true', and 'on'.</td>
             </tr>
             <tr>
                 <td>binding</td>

src/main/webapp/forms/InputTextAttributes.xhtml

@@ -45,7 +45,7 @@
             <tr>
                 <td>autocomplete</td>
                 <td>(none)</td>
-                <td>Controls browser autocomplete behavior.</td>
+                <td>Controls browser autocomplete behavior. Legal values: 'off', 'false', 'true', and 'on'.</td>
             </tr>
             <tr>
                 <td>binding</td>

src/main/webapp/forms/InputTextareaAttributes.xhtml

@@ -45,7 +45,7 @@
             <tr>
                 <td>autocomplete</td>
                 <td>(none)</td>
-                <td>Controls browser autocomplete behavior.</td>
+                <td>Controls browser autocomplete behavior. Legal values: 'off', 'false', 'true', and 'on'.</td>
             </tr>
             <tr>
                 <td>binding</td>

src/main/webapp/forms/RadioButton.xhtml

@@ -44,6 +44,7 @@
               <b:radiobutton value="#{radiobuttonBean.javaVersion}" itemLabel="Java 9" itemValue="9" disabled="true"/>
               <b:radiobutton value="#{radiobuttonBean.javaVersion}" itemLabel="Java 10" itemValue="10" disabled="true"/>
               <b:radiobutton value="#{radiobuttonBean.javaVersion}" itemLabel="Java 11(LTS)" itemValue="11" />
+              <b:radiobutton value="#{radiobuttonBean.javaVersion}" itemLabel="Java 14" itemValue="14" />
             </b:panelGrid>
             <b:commandButton value="submit your choice" action="#{radiobuttonBean.submit}" look="primary" update="@form" />
             <b:messages />
@@ -62,6 +63,7 @@
                   <b:radiobutton value="&num;{radiobuttonBean.javaVersion}" itemLabel="Java 9" itemValue="9" disabled="true"/>
                   <b:radiobutton value="&num;{radiobuttonBean.javaVersion}" itemLabel="Java 10" itemValue="10" disabled="true"/>
                   <b:radiobutton value="&num;{radiobuttonBean.javaVersion}" itemLabel="Java 11(LTS)" itemValue="11" />
+                  <b:radiobutton value="&num;{radiobuttonBean.javaVersion}" itemLabel="Java 14" itemValue="14" />
                 </b:panelGrid>
                 <b:commandButton value="submit your choice" action="&num;{radiobuttonBean.submit}" look="primary" update="@form" />
                 <b:messages />
@@ -250,7 +252,7 @@
         <h2><a id="reference_section">Reference section</a></h2>
         <ui:include src="RadiobuttonAttributes.xhtml" />
         <b:panel look="info">
-          <f:facet name="heading">
+          <f:facet name="heading" rendered="false">
             <b>Skinning</b>
           </f:facet>
           <ul>

src/main/webapp/forms/TouchSpin.xhtml

@@ -123,7 +123,7 @@
 
     <h2><a id="reference_section">Reference section</a></h2>
     <ui:include src="TouchSpinAttributes.xhtml" />
-    <b:panel look="info">
+    <b:panel look="info" rendered="false">
       <f:facet name="heading">
         <b>Skinning</b>
       </f:facet>

src/main/webapp/forms/blockUI.xhtml

@@ -27,7 +27,7 @@
     also implements a new AJAX API that's a little simpler to use. Among
     other things, this includes a fairly opinionated BlockUI component.
     Our theory is you want to activate BlockUI with every AJAX request,
-    so you only have to configure it. Other than other frameworks
+    so you only have to configure it. Unlike other frameworks
     BootsFaces doesn't require you to activate BlockUI on every AJAX
     requests individually.</p>
     <p>Most likely you've already suffered from mysterious errors
@@ -72,7 +72,7 @@
     triggered by a BootsFaces component activates the waitcursor and
     prevents the user from doing further input until the request has been
     completed. This way, you get a fairly good protection against
-    accidential double-clicks.</p>
+    accidental double-clicks.</p>
     <p>If you don't want to activate BlockUI generally, you can
     control it via an EL expression. Note that this expression is read
     when the page is rendered, and it's only read on non-AJAX requests.</p>
@@ -128,7 +128,7 @@
             $.blockUI.defaults.css.borderRadius = '10px';
             $.blockUI.defaults.overlayCSS.opacity = 0.5;
             $.blockUI.defaults.message = '<div style="padding-top:1em"><b:spinner name="circle-o-notch" size="2x" /> Please hold the line </div>';
-    		</script>
+    	&lt;/script>
         <b:commandButton value="Wait 5 seconds without BlockUI"
                          onclick="ajax:blockUIBean.waitFiveSeconds()" look="danger">
           <f:param name="blockui.disabled" value="true" />
@@ -143,9 +143,9 @@
 
     <h2><a id="ajax">AJAX, mouse events and BlockUI</a></h2>
     <p>
-    If blockUI is active, every AJAX request triggers a
-    <code>mouseOutEvent</code>
-    . When the AJAX request has been processed and the BlockUI overlay
+    If blockUI is active, every AJAX request triggers
+    <code>mouseOutEvent</code> on the client. 
+    When the AJAX request has been processed and the BlockUI overlay
     pane is hidden, a
     <code>mouseOverEvent</code>
     is triggered. Keep this in mind if you need to use the mouse events.
@@ -212,16 +212,16 @@
     <code>$.blockUI.defaults</code>
     to configure BootsFaces BlockUI, as decribed <a target="#"
     href="http://malsup.com/jquery/block/#options">here.</a> For
-    instance, these lines deactivate the gray-out-effect, and show the
+    instance, the code snippet below deactivates the gray-out-effect replaces it with the
     waitcursor of BootsFaces.
     </p>
     <b:panel>
       <script type="syntaxhighlighter"
-      class="brush: javascript; toolbar: false;gutter: false; first-line: 1">
+      class="brush: html toolbar: false;gutter: false; first-line: 1">
       <![CDATA[
-      &lt;script>
-      $.blockUI.defaults.overlayCSS.opacity = 0;
-      $.blockUI.defaults.message='<h1><img src="javax.faces.resource/images/waitcursor.gif.jsf?ln=bsf" /></h1>';
+      <script>
+        $.blockUI.defaults.overlayCSS.opacity = 0;
+        $.blockUI.defaults.message='<h1><img src="javax.faces.resource/images/waitcursor.gif.jsf?ln=bsf" /></h1>';
       &lt;/script>
       ]]>
       </script>
@@ -240,7 +240,7 @@
     BootsFaces doesn't trigger BlockUI on PrimeFaces components. You'll
     have to use the
     <code>&lt;p:blockUI /&gt;</code>
-    component of PrimeFaces.
+    component of PrimeFaces if you're using both frameworks in the same project.
     </p>
 
     <script type="text/javascript">

src/main/webapp/forms/commandLink.xhtml

@@ -26,7 +26,7 @@
           <div>Simple link</div>
           <b:commandLink style-class="some-class" onclick="alert('clicked'); return false;" value="Click this command link to show an alert box." />
           <div>Command link</div>
-          <b:commandLink style-class="some-class" action="#{commandLinkBean.testAction}" value="Click this command link to show an alert box." ajax="true" update="@form"/>
+          <b:commandLink style-class="some-class" action="#{commandLinkBean.testAction}" value="Click this command link to show a message." ajax="true" update="@form"/>
           <div>Command link with action</div>
           <b:link style-class="some-class" look="success" onclick="alert('clicked!'); return false;" value="Click this link to show an alert box." />
           <div>Link shown as button</div>
@@ -46,7 +46,7 @@
               <div>Simple link</div>
               <b:commandLink style-class="some-class" onclick="alert('clicked'); return false;" value="Click this command link to show an alert box." />
               <div>Command link</div>
-              <b:link style-class="some-class" look="success" onclick="alert('clicked!'); return false;" value="Click this link to show an alert box." />
+              <b:link style-class="some-class" look="success" onclick="alert('clicked!'); return false;" value="Click this link to show a message." />
               <div>Link shown as button</div>
               <b:commandLink style-class="some-class" look="default" onclick="alert('clicked'); return false;" value="Click this command link to show an alert box." />
               <div>Command link shown as button</div>

src/main/webapp/forms/searchExpressions.xhtml

@@ -145,7 +145,7 @@
           <p:outputLabel for="@next" value="Enter a number between 1 and 10:"/>
           <b:inputText value="#{imageGallery.oneToTen}" onkeyup="ajax:imageGallery.validateNumber()" update="@previous @next"
                        id="oneToTenId" render-label="false"/>
-          <b:message for="@previous"/>
+          <b:message for="@previous" show-summary="false"/>
           Also enter other numbers or texts to see the error messages.
         </b:panelGrid>
       </h:form>
@@ -160,7 +160,7 @@
                 <p:outputLabel for="@next" value="Enter a number between 1 and 10"/>
                 <b:inputText value="#{imageGallery.oneToTen}" onkeyup="ajax:imageGallery.validateNumber()" update="@previous @next"
                              id="oneToTenId"/>
-                <b:message for="@previous"/>
+                <b:message for="@previous" show-summary="false"/>
               </b:panelGrid>
               ]]></script>
             </b:panel>
@@ -210,10 +210,10 @@
       <h:form id="oneToTenFormId2">
         <b:panelGrid colSpans="2,2,2,6">
           <b:selectBooleanCheckbox value="#{imageGallery.showNumber}" onclick="ajax:imageGallery.validateNumber()"
-                                   update="@after" caption="Show number"/>
+                                   update="@after" caption="Show number" immediate="true"/>
           <p:outputLabel for="@next" value="Enter a number between 1 and 10" styleClass="#{imageGallery.showNumber?'':'hidden'}"/>
           <b:inputText value="#{imageGallery.oneToTen}" onkeyup="ajax:imageGallery.validateNumber()" update="@previous @next"
-                       id="oneToTenId" styleClass="#{imageGallery.showNumber?'':'hidden'}"/>
+                       id="oneToTenId" styleClass="#{imageGallery.showNumber?'':'hidden'}" render-label="false" />
           <b:message for="@previous" styleClass="#{imageGallery.showNumber?'':'hidden'}"/>
         </b:panelGrid>
       </h:form>
@@ -224,10 +224,10 @@
           <script type="syntaxhighlighter" class="brush: xml; toolbar: false;gutter: false; first-line: 1">
           <![CDATA[
           <b:selectBooleanCheckbox value="#{imageGallery.showNumber}" onclick="ajax:imageGallery.validateNumber()"
-                                   update="@after" caption="Show number"/>
+                                   update="@after" caption="Show number" immediate="true" />
           <p:outputLabel for="@next" value="Enter a number between 1 and 10" styleClass="#{imageGallery.showNumber?'':'hidden'}"/>
           <b:inputText value="#{imageGallery.oneToTen}" onkeyup="ajax:imageGallery.validateNumber()" update="@previous @next"
-                       id="oneToTenId" styleClass="#{imageGallery.showNumber?'':'hidden'}"/>
+                       id="oneToTenId" styleClass="#{imageGallery.showNumber?'':'hidden'}" render-label="false" />
           <b:message for="@previous" styleClass="#{imageGallery.showNumber?'':'hidden'}"/>
           ]]></script>
         </b:panel>

src/main/webapp/forms/switch.xhtml

@@ -32,7 +32,7 @@
     <b:panel title="Live preview" look="info" collapsible="false">
       <b:form>
         <b:panelGrid columns="4">
-          <b:switch value="#{settingsBean.sbox1}" label="sswitch 1" offColor="success" onColor="info"
+          <b:switch value="#{settingsBean.sbox1}" label="switch 1" offColor="success" onColor="info"
           			onchange="ajax:settingsBean.action()" update="@none"
                     converter="StringToBooleanConverter">
                     <!-- 

src/main/webapp/integration/PrimeFaces.xhtml

@@ -204,7 +204,7 @@
           </p:calendar>
 
           <p:outputLabel for="german" value="German:" />
-          <p:calendar id="german" value="#{calendarView.date5}" locale="de" navigator="true" pattern="yyyy-MMM-dd" />
+          <p:calendar id="german" value="#{calendarView.date5}" locale="de" navigator="true" pattern="dd. MMMM yyyy" />
 
           <p:outputLabel for="restricted" value="Restricted:" />
           <p:calendar id="restricted" value="#{calendarView.date6}" mindate="4/1/14" maxdate="7/1/14" />
@@ -222,7 +222,7 @@
           <p:calendar id="datetime" value="#{calendarView.date10}" pattern="MM/dd/yyyy HH:mm:ss" />
 
           <p:outputLabel for="time" value="Time:" />
-          <p:calendar id="time" value="#{calendarView.date11}" pattern="HH:mm a" timeOnly="true"  />
+          <p:calendar id="time" value="#{calendarView.date11}" pattern="HH:mm" timeOnly="true"  />
         </b:panelGrid>
         <p:commandButton value="Submit" update="msgs" actionListener="#{calendarView.click}" icon="ui-icon-check" />
 
@@ -250,7 +250,7 @@
 
             <h:outputText value="German:" />
             <h:outputText value="#{calendarView.date5}">
-              <f:convertDateTime pattern="MM/dd/yyyy" />
+              <f:convertDateTime pattern="dd.MM.yyyy" />
             </h:outputText>
 
             <h:outputText value="Restricted:" />
@@ -309,7 +309,7 @@
             </p:calendar>
 
             <p:outputLabel for="german" value="German:" />
-            <p:calendar id="german" value="&num;{calendarView.date5}" locale="de" navigator="true" pattern="yyyy-MMM-dd" />
+            <p:calendar id="german" value="&num;{calendarView.date5}" locale="de" navigator="true" pattern="dd. MMMM yyyy" />
 
             <p:outputLabel for="restricted" value="Restricted:" />
             <p:calendar id="restricted" value=" #{calendarView.date6}" mindate="4/1/14" maxdate="7/1/14" />
@@ -327,7 +327,7 @@
             <p:calendar id="datetime" value="&num;{calendarView.date10}" pattern="MM/dd/yyyy HH:mm:ss" />
 
             <p:outputLabel for="time" value="Time:" />
-            <p:calendar id="time" value=" #{calendarView.date11}" pattern="HH:mm a" timeOnly="true"  />
+            <p:calendar id="time" value=" #{calendarView.date11}" pattern="HH:mm" timeOnly="true"  />
           </b:panelGrid>
 
           <p:commandButton value="Submit" update="msgs" actionListener="&num;{calendarView.click}" icon="ui-icon-check" />
@@ -359,7 +359,7 @@
 
               <h:outputText value="German:" />
               <h:outputText value="&num;{calendarView.date5}">
-                <f:convertDateTime pattern="MM/dd/yyyy" />
+                <f:convertDateTime pattern="dd.MM.yyyy" />
               </h:outputText>
 
               <h:outputText value="Restricted:" />
@@ -403,5 +403,34 @@
     SyntaxHighlighter.all();
     </script>
     <br/><br/><br/><br/>
+
+    <script type="text/javascript">    
+    PrimeFaces.locales ['de'] = {
+        closeText: 'Schließen',
+        prevText: 'Zurück',
+        nextText: 'Weiter',
+        monthNames: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember' ],
+        monthNamesShort: ['Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez' ],
+        dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'],
+        dayNamesShort: ['Son', 'Mon', 'Die', 'Mit', 'Don', 'Fre', 'Sam'],
+        dayNamesMin: ['S', 'M', 'D', 'M ', 'D', 'F ', 'S'],
+        weekHeader: 'Woche',
+        firstDay: 1,
+        isRTL: false,
+        showMonthAfterYear: false,
+        yearSuffix:'',
+        timeOnlyTitle: 'Nur Zeit',
+        timeText: 'Zeit',
+        hourText: 'Stunde',
+        minuteText: 'Minute',
+        secondText: 'Sekunde',
+        currentText: 'Aktuelles Datum',
+        ampm: false,
+        month: 'Monat',
+        week: 'Woche',
+        day: 'Tag',
+        allDayText: 'Ganzer Tag'
+    };
+    </script>
   </ui:define>
 </ui:composition>

src/main/webapp/jquery-ui/slider2.xhtml

@@ -9,7 +9,7 @@
   <ui:define name="content">
     <h1>Fancy sliders</h1>
     <h3>Options and Examples</h3>
-    <p>You can use more than one slider to get input for complex values, like the Time:</p>
+    <p>You can use more than one slider to get input for complex values, like the time:</p>
     <h:form prependId="false" addLabels="false">
       <b:tabView>
         <b:tab title="EXAMPLE - Time slider" id="time">

src/main/webapp/layout/AccordionAttributes.xhtml

@@ -82,6 +82,11 @@
                 <td> -1 </td>
                 <td>Alternative spelling to col-md. Integer value to specify how many columns to span on medium screens (≥992 pixels wide). The number may optionally be followed by "column" or "columns". Alternative legal values: half, one-third, two-thirds, one-fourth, three-fourths.</td>
             </tr>
+            <tr>
+                <td>multiple</td>
+                <td>false</td>
+                <td>Setting this flag enables opening panels without closing other panels.</td>
+            </tr>
             <tr>
                 <td>offset</td>
                 <td>(none)</td>