You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by hn...@apache.org on 2020/04/20 21:05:33 UTC
[myfaces-tobago] 01/03: update toggle,
checkbox and radio buttons to Bootstrap 4.2
This is an automated email from the ASF dual-hosted git repository.
hnoeth pushed a commit to branch tobago-4.x
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git
commit 58a66b21dc9ac2c8436c15fadc1e9a89c16f8535
Author: Jasmin Kroeger <ja...@irian.eu>
AuthorDate: Thu Apr 16 09:47:14 2020 +0200
update toggle, checkbox and radio buttons to Bootstrap 4.2
* add Bootstrap classes
* remove * from toggles and checkboxes on required fields. The * is only on the label.
* add for attribute for labels
* order of input and label changed
* remove fontawesome icon
* change form-check to custom-control
Issue: TOBAGO-1969
(cherry picked from commit d124c25e4928d02e713b0d3dced9d1b66ca17df0)
---
.../renderer/SelectBooleanCheckboxRenderer.java | 35 ++++++++++++----------
.../renderer/SelectBooleanToggleRenderer.java | 9 ++++++
.../renderer/SelectManyCheckboxRenderer.java | 20 ++++++-------
.../renderkit/renderer/SelectOneRadioRenderer.java | 21 +++++++------
.../tobago/renderkit/css/BootstrapClass.java | 10 +++++++
tobago-core/src/main/resources/scss/_tobago.scss | 4 +++
6 files changed, 63 insertions(+), 36 deletions(-)
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanCheckboxRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanCheckboxRenderer.java
index 6d60940..7e60834 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanCheckboxRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanCheckboxRenderer.java
@@ -101,16 +101,10 @@ public class SelectBooleanCheckboxRenderer extends MessageLayoutRendererBase {
writer.writeAttribute(HtmlAttributes.TITLE, title, true);
}
- writer.startElement(HtmlElements.LABEL);
+ writer.startElement(HtmlElements.INPUT);
writer.writeClassAttribute(
- BootstrapClass.FORM_CHECK_LABEL,
+ BootstrapClass.CUSTOM_CONTROL_INPUT,
getCssItems(facesContext, select));
- if (!disabled && label.getAccessKey() != null) {
- writer.writeAttribute(HtmlAttributes.ACCESSKEY, Character.toString(label.getAccessKey()), false);
- AccessKeyLogger.addAccessKey(facesContext, label.getAccessKey(), clientId);
- }
-
- writer.startElement(HtmlElements.INPUT);
writer.writeAttribute(HtmlAttributes.TYPE, HtmlInputTypes.CHECKBOX);
writer.writeAttribute(HtmlAttributes.VALUE, "true", false);
writer.writeNameAttribute(clientId);
@@ -124,13 +118,23 @@ public class SelectBooleanCheckboxRenderer extends MessageLayoutRendererBase {
writer.writeCommandMapAttribute(JsonUtils.encode(RenderUtils.getBehaviorCommands(facesContext, select)));
writer.endElement(HtmlElements.INPUT);
- writer.startElement(HtmlElements.I);
- writer.writeClassAttribute(TobagoClass.INPUT_PSEUDO);
- writer.endElement(HtmlElements.I);
-
- if (itemLabel != null) {
+ writer.startElement(HtmlElements.LABEL);
+ writer.writeClassAttribute(
+ BootstrapClass.CUSTOM_CONTROL_LABEL,
+ getCssItems(facesContext, select));
+ if (!disabled && label.getAccessKey() != null) {
+ writer.writeAttribute(HtmlAttributes.ACCESSKEY, Character.toString(label.getAccessKey()), false);
+ AccessKeyLogger.addAccessKey(facesContext, label.getAccessKey(), clientId);
+ }
+ writer.writeAttribute(HtmlAttributes.FOR, fieldId, false);
+ if (itemLabel != null && select.getLabel() == null && select.getAccessKey() != null) {
+ if (itemLabel.contains(Character.toString(select.getAccessKey()))) {
+ HtmlRendererUtils.writeLabelWithAccessKey(writer, label);
+ }
+ } else if (itemLabel != null) {
writer.writeText(itemLabel);
}
+ writer.endElement(HtmlElements.LABEL);
}
protected TobagoClass getTobagoClass() {
@@ -140,12 +144,13 @@ public class SelectBooleanCheckboxRenderer extends MessageLayoutRendererBase {
@Override
protected void encodeEndField(final FacesContext facesContext, final UIComponent component) throws IOException {
final TobagoResponseWriter writer = getResponseWriter(facesContext);
- writer.endElement(HtmlElements.LABEL);
+ final AbstractUISelectBoolean select = (AbstractUISelectBoolean) component;
+
writer.endElement(HtmlElements.DIV);
}
protected CssItem[] getOuterCssItems(final FacesContext facesContext, final AbstractUISelectBoolean select) {
- return new CssItem[]{BootstrapClass.FORM_CHECK};
+ return new CssItem[]{BootstrapClass.CUSTOM_CONTROL, BootstrapClass.CUSTOM_CHECKBOX};
}
protected CssItem[] getCssItems(final FacesContext facesContext, final AbstractUISelectBoolean select) {
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanToggleRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanToggleRenderer.java
index 4ee5497..0d20e57 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanToggleRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectBooleanToggleRenderer.java
@@ -19,11 +19,20 @@
package org.apache.myfaces.tobago.internal.renderkit.renderer;
+import org.apache.myfaces.tobago.internal.component.AbstractUISelectBoolean;
+import org.apache.myfaces.tobago.renderkit.css.BootstrapClass;
+import org.apache.myfaces.tobago.renderkit.css.CssItem;
import org.apache.myfaces.tobago.renderkit.css.TobagoClass;
+import javax.faces.context.FacesContext;
+
public class SelectBooleanToggleRenderer extends SelectBooleanCheckboxRenderer {
protected TobagoClass getTobagoClass() {
return TobagoClass.SELECT_BOOLEAN_TOGGLE;
}
+
+ protected CssItem[] getOuterCssItems(final FacesContext facesContext, final AbstractUISelectBoolean select) {
+ return new CssItem[]{BootstrapClass.CUSTOM_CONTROL, BootstrapClass.CUSTOM_SWITCH};
+ }
}
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyCheckboxRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyCheckboxRenderer.java
index c7c4dde..346e47c 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyCheckboxRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyCheckboxRenderer.java
@@ -87,16 +87,14 @@ public class SelectManyCheckboxRenderer extends SelectManyRendererBase {
if (renderOuterItem()) {
writer.startElement(HtmlElements.DIV);
writer.writeClassAttribute(
- BootstrapClass.FORM_CHECK,
- inline ? BootstrapClass.FORM_CHECK_INLINE : null,
+ BootstrapClass.CUSTOM_CONTROL,
+ BootstrapClass.CUSTOM_CHECKBOX,
+ inline ? BootstrapClass.CUSTOM_CONTROL_INLINE : null,
itemDisabled ? BootstrapClass.DISABLED : null);
}
- writer.startElement(HtmlElements.LABEL);
- writer.writeClassAttribute(
- BootstrapClass.FORM_CHECK_LABEL,
- getCssItems(facesContext, select));
+
writer.startElement(HtmlElements.INPUT);
- writer.writeClassAttribute(BootstrapClass.FORM_CHECK_INPUT);
+ writer.writeClassAttribute(BootstrapClass.CUSTOM_CONTROL_INPUT);
writer.writeAttribute(HtmlAttributes.TYPE, HtmlInputTypes.CHECKBOX);
final String formattedValue = ComponentUtils.getFormattedValue(facesContext, select, item.getValue());
final boolean checked;
@@ -120,9 +118,11 @@ public class SelectManyCheckboxRenderer extends SelectManyRendererBase {
writer.writeCommandMapAttribute(JsonUtils.encode(RenderUtils.getBehaviorCommands(facesContext, select)));
writer.endElement(HtmlElements.INPUT);
- writer.startElement(HtmlElements.I);
- writer.writeClassAttribute(TobagoClass.INPUT_PSEUDO);
- writer.endElement(HtmlElements.I);
+ writer.startElement(HtmlElements.LABEL);
+ writer.writeClassAttribute(
+ BootstrapClass.CUSTOM_CONTROL_LABEL,
+ getCssItems(facesContext, select));
+ writer.writeAttribute(HtmlAttributes.FOR, itemId, false);
if (item instanceof org.apache.myfaces.tobago.model.SelectItem) {
final org.apache.myfaces.tobago.model.SelectItem tobagoItem =
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectOneRadioRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectOneRadioRenderer.java
index ed7ebd3..1515d40 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectOneRadioRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectOneRadioRenderer.java
@@ -89,16 +89,14 @@ public class SelectOneRadioRenderer extends SelectOneRendererBase {
if (renderOuterItem()) {
writer.startElement(HtmlElements.DIV);
writer.writeClassAttribute(
- BootstrapClass.FORM_CHECK,
- inline ? BootstrapClass.FORM_CHECK_INLINE : null,
+ BootstrapClass.CUSTOM_CONTROL,
+ BootstrapClass.CUSTOM_RADIO,
+ inline ? BootstrapClass.CUSTOM_CONTROL_INLINE : null,
itemDisabled ? BootstrapClass.DISABLED : null);
}
- writer.startElement(HtmlElements.LABEL);
- writer.writeClassAttribute(
- BootstrapClass.FORM_CHECK_LABEL,
- getCssItems(facesContext, select));
+
writer.startElement(HtmlElements.INPUT);
- writer.writeClassAttribute(BootstrapClass.FORM_CHECK_INPUT);
+ writer.writeClassAttribute(BootstrapClass.CUSTOM_CONTROL_INPUT);
writer.writeAttribute(HtmlAttributes.TYPE, HtmlInputTypes.RADIO);
final String formattedValue = ComponentUtils.getFormattedValue(facesContext, select, item.getValue());
final boolean checked;
@@ -122,10 +120,11 @@ public class SelectOneRadioRenderer extends SelectOneRendererBase {
writer.writeCommandMapAttribute(JsonUtils.encode(RenderUtils.getBehaviorCommands(facesContext, select)));
writer.endElement(HtmlElements.INPUT);
- writer.startElement(HtmlElements.I);
- writer.writeClassAttribute(TobagoClass.INPUT_PSEUDO);
- writer.endElement(HtmlElements.I);
-
+ writer.startElement(HtmlElements.LABEL);
+ writer.writeClassAttribute(
+ BootstrapClass.CUSTOM_CONTROL_LABEL,
+ getCssItems(facesContext, select));
+ writer.writeAttribute(HtmlAttributes.FOR, itemId, false);
if (item instanceof org.apache.myfaces.tobago.model.SelectItem) {
final org.apache.myfaces.tobago.model.SelectItem tobagoItem =
(org.apache.myfaces.tobago.model.SelectItem) item;
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/BootstrapClass.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/BootstrapClass.java
index 632eb84..c887ac2 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/BootstrapClass.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/BootstrapClass.java
@@ -245,7 +245,17 @@ public enum BootstrapClass implements CssItem {
COL_XS_12("col-12"),
CONTAINER("container"),
CONTAINER_FLUID("container-fluid"),
+ CUSTOM_CHECKBOX("custom-checkbox"),
+ CUSTOM_CONTROL("custom-control"),
+ CUSTOM_CONTROL_LABEL("custom-control-label"),
+ CUSTOM_CONTROL_INLINE("custom-control-inline"),
+ CUSTOM_CONTROL_INPUT("custom-control-input"),
+ CUSTOM_FILE("custom-file"),
+ CUSTOM_FILE_INPUT("custom-file-input"),
+ CUSTOM_FILE_LABEL("custom-file-label"),
+ CUSTOM_RADIO("custom-radio"),
CUSTOM_SELECT("custom-select"),
+ CUSTOM_SWITCH("custom-switch"),
D_FLEX("d-flex"),
D_INLINE("d-inline"),
D_NONE("d-none"),
diff --git a/tobago-core/src/main/resources/scss/_tobago.scss b/tobago-core/src/main/resources/scss/_tobago.scss
index 549cebb..1816d85 100644
--- a/tobago-core/src/main/resources/scss/_tobago.scss
+++ b/tobago-core/src/main/resources/scss/_tobago.scss
@@ -895,6 +895,10 @@ h1, h2, h3, h4, h5, h6 {
content: $zero-width-space;
}
}
+
+ label.custom-control-label:after {
+ content: "";
+ }
}
.tobago-selectBooleanToggle, .tobago-selectManyToggle {