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 2019/08/23 18:45:45 UTC
[myfaces-tobago] branch master updated (ea586b8 -> 5754742)
This is an automated email from the ASF dual-hosted git repository.
lofwyr pushed a change to branch master
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git.
from ea586b8 Don't use document.getElementById etc. (shadow DOM)
new b7ef002 tobago-in: custom elements
new 5754742 tobago-panel, tobago-split-layout: custom elements
The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
Summary of changes:
.../internal/renderkit/renderer/InRenderer.java | 4 ++
.../renderer/LabelLayoutRendererBase.java | 8 ++-
.../internal/renderkit/renderer/PanelRenderer.java | 7 +--
.../renderkit/renderer/SplitLayoutRenderer.java | 40 +++----------
.../myfaces/tobago/renderkit/css/TobagoClass.java | 3 -
.../tobago/renderkit/html/CustomAttributes.java | 3 +-
.../tobago/renderkit/html/HtmlElements.java | 3 +
tobago-core/src/main/resources/scss/_tobago.scss | 12 +++-
.../src/main/npm/ts/tobago-panel.ts | 7 +++
.../src/main/npm/ts/tobago-split-layout.ts | 67 +++++++++++++---------
10 files changed, 82 insertions(+), 72 deletions(-)
[myfaces-tobago] 02/02: tobago-panel,
tobago-split-layout: custom elements
Posted by lo...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
lofwyr pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git
commit 57547425098582777a295cd6d43f8f5f94fd8f39
Author: Udo Schnurpfeil <lo...@apache.org>
AuthorDate: Fri Aug 23 20:45:30 2019 +0200
tobago-panel, tobago-split-layout: custom elements
issue: TOBAGO-1633: TS refactoring
---
.../internal/renderkit/renderer/PanelRenderer.java | 7 +--
.../renderkit/renderer/SplitLayoutRenderer.java | 40 +++----------
.../myfaces/tobago/renderkit/css/TobagoClass.java | 3 -
.../tobago/renderkit/html/CustomAttributes.java | 3 +-
.../tobago/renderkit/html/HtmlElements.java | 2 +
tobago-core/src/main/resources/scss/_tobago.scss | 12 +++-
.../src/main/npm/ts/tobago-panel.ts | 7 +++
.../src/main/npm/ts/tobago-split-layout.ts | 67 +++++++++++++---------
8 files changed, 71 insertions(+), 70 deletions(-)
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/PanelRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/PanelRenderer.java
index 9a7fa75..f4ad0d5 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/PanelRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/PanelRenderer.java
@@ -49,14 +49,13 @@ public class PanelRenderer extends PanelRendererBase {
final Markup markup = panel.getMarkup();
final AbstractUIReload reload = ComponentUtils.getReloadFacet(panel);
- writer.startElement(HtmlElements.DIV);
+ writer.startElement(HtmlElements.TOBAGO_PANEL);
writer.writeIdAttribute(clientId);
writer.writeAttribute(DataAttributes.MARKUP, JsonUtils.encode(markup), false);
writer.writeClassAttribute(
- TobagoClass.PANEL,
- TobagoClass.PANEL.createMarkup(markup),
collapsed ? TobagoClass.COLLAPSED : null,
+ TobagoClass.PANEL.createMarkup(markup),
panel.getCustomClass(),
markup != null && markup.contains(Markup.SPREAD) ? TobagoClass.SPREAD : null);
@@ -80,6 +79,6 @@ public class PanelRenderer extends PanelRendererBase {
@Override
public void encodeEnd(final FacesContext facesContext, final UIComponent component) throws IOException {
final TobagoResponseWriter writer = getResponseWriter(facesContext);
- writer.endElement(HtmlElements.DIV);
+ writer.endElement(HtmlElements.TOBAGO_PANEL);
}
}
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SplitLayoutRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SplitLayoutRenderer.java
index 5087862..684a7bc 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SplitLayoutRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SplitLayoutRenderer.java
@@ -23,9 +23,11 @@ import org.apache.myfaces.tobago.apt.annotation.Preliminary;
import org.apache.myfaces.tobago.context.Markup;
import org.apache.myfaces.tobago.internal.component.AbstractUISplitLayout;
import org.apache.myfaces.tobago.internal.util.JsonUtils;
+import org.apache.myfaces.tobago.layout.Orientation;
import org.apache.myfaces.tobago.renderkit.RendererBase;
import org.apache.myfaces.tobago.renderkit.css.BootstrapClass;
import org.apache.myfaces.tobago.renderkit.css.TobagoClass;
+import org.apache.myfaces.tobago.renderkit.html.CustomAttributes;
import org.apache.myfaces.tobago.renderkit.html.DataAttributes;
import org.apache.myfaces.tobago.renderkit.html.HtmlAttributes;
import org.apache.myfaces.tobago.renderkit.html.HtmlElements;
@@ -39,7 +41,6 @@ import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import java.io.IOException;
import java.lang.invoke.MethodHandles;
-import java.util.List;
/**
* <p>
@@ -73,54 +74,29 @@ public class SplitLayoutRenderer extends RendererBase {
final TobagoResponseWriter writer = getResponseWriter(facesContext);
final Markup markup = splitLayout.getMarkup();
- writer.startElement(HtmlElements.DIV);
+ writer.startElement(HtmlElements.TOBAGO_SPLIT_LAYOUT);
writer.writeIdAttribute(splitLayout.getClientId(facesContext));
writer.writeAttribute(DataAttributes.MARKUP, JsonUtils.encode(splitLayout.getMarkup()), false);
writer.writeClassAttribute(
- TobagoClass.SPLIT_LAYOUT,
BootstrapClass.D_FLEX,
splitLayout.isHorizontal() ? BootstrapClass.FLEX_ROW : BootstrapClass.FLEX_COLUMN,
markup != null && markup.contains(Markup.SPREAD) ? TobagoClass.SPREAD : null);
+ writer.writeAttribute(CustomAttributes.ORIENTATION,
+ splitLayout.isHorizontal() ? Orientation.HORIZONTAL : Orientation.VERTICAL, false);
}
@Override
public void encodeEnd(final FacesContext facesContext, final UIComponent component) throws IOException {
- final TobagoResponseWriter writer = getResponseWriter(facesContext);
- writer.endElement(HtmlElements.DIV);
- }
-
- @Override
- public boolean getRendersChildren() {
- return true;
- }
- @Override
- public void encodeChildren(final FacesContext facesContext, final UIComponent component) throws IOException {
- final TobagoResponseWriter writer = getResponseWriter(facesContext);
final AbstractUISplitLayout splitLayout = (AbstractUISplitLayout) component;
- final List<UIComponent> components = ComponentUtils.findLayoutChildren(splitLayout);
-
- boolean somethingWasRendered = false;
- for (final UIComponent current : components) {
- if (current.isRendered()) {
- if (somethingWasRendered) {
- // render splitter
- writer.startElement(HtmlElements.DIV);
- writer.writeClassAttribute(
- splitLayout.isHorizontal() ? TobagoClass.SPLIT_LAYOUT__HORIZONTAL : TobagoClass.SPLIT_LAYOUT__VERTICAL);
- writer.endElement(HtmlElements.DIV);
- }
- // render component
- current.encodeAll(facesContext);
-
- somethingWasRendered = true;
- }
- }
+ final TobagoResponseWriter writer = getResponseWriter(facesContext);
writer.startElement(HtmlElements.INPUT);
writer.writeNameAttribute(splitLayout.getClientId(facesContext) + SUFFIX_SIZES);
writer.writeAttribute(HtmlAttributes.TYPE, HtmlInputTypes.HIDDEN);
// writer.writeAttribute(HtmlAttributes.VALUE, sizes);
writer.endElement(HtmlElements.INPUT);
+
+ writer.endElement(HtmlElements.TOBAGO_SPLIT_LAYOUT);
}
}
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/TobagoClass.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/TobagoClass.java
index 0419b9f..f07f3e6 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/TobagoClass.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/css/TobagoClass.java
@@ -200,9 +200,6 @@ public enum TobagoClass implements CssItem {
SHEET__PAGING_INPUT("tobago-sheet-pagingInput"),
SHEET__PAGING_OUTPUT("tobago-sheet-pagingOutput"),
SHEET__ROW("tobago-sheet-row"),
- SPLIT_LAYOUT("tobago-splitLayout"),
- SPLIT_LAYOUT__HORIZONTAL("tobago-splitLayout-horizontal"),
- SPLIT_LAYOUT__VERTICAL("tobago-splitLayout-vertical"),
STARS("tobago-stars"),
STARS__CONTAINER("tobago-stars-container"),
STARS__FOCUS_BOX("tobago-stars-focusBox"),
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/CustomAttributes.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/CustomAttributes.java
index abb5266..2955d36 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/CustomAttributes.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/CustomAttributes.java
@@ -27,7 +27,8 @@ public enum CustomAttributes implements MarkupLanguageAttributes {
UPDATE("update"),
TOTAL_COUNT("total-count"),
LOCAL_MENU("local-menu"),
- DATA("data");
+ DATA("data"),
+ ORIENTATION("orientation");
private final String value;
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java
index 3ec4203..7c05b17 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java
@@ -134,6 +134,8 @@ public enum HtmlElements {
WBR("wbr", Qualifier.VOID),
TOBAGO_IN("tobago-in"),
+ TOBAGO_PANEL("tobago-panel"),
+ TOBAGO_SPLIT_LAYOUT("tobago-split-layout"),
TOBAGO_STARS("tobago-stars"),
TOBAGO_SUGGEST("tobago-suggest");
diff --git a/tobago-core/src/main/resources/scss/_tobago.scss b/tobago-core/src/main/resources/scss/_tobago.scss
index cf909d9..d517229 100644
--- a/tobago-core/src/main/resources/scss/_tobago.scss
+++ b/tobago-core/src/main/resources/scss/_tobago.scss
@@ -200,7 +200,7 @@ button.tobago-button {
.tobago-collapsed.tobago-box .card-body,
.tobago-collapsed.tobago-section .tobago-section-content,
-.tobago-collapsed.tobago-panel {
+tobago-panel.tobago-collapsed {
display: none;
}
@@ -725,7 +725,7 @@ span.tobago-out:empty:before {
.tobago-spread {
height: 100%;
- &.tobago-panel {
+ &tobago-panel {
overflow-x: hidden;
overflow-y: auto;
}
@@ -733,6 +733,14 @@ span.tobago-out:empty:before {
/* panel ------------------------------------------------------------- */
+// todo: remove
+.tobago-panel {
+}
+
+tobago-panel {
+ display: block;
+}
+
/* popup ------------------------------------------------------------- */
.tobago-popup {
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-panel.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-panel.ts
index ae6f28c..91620db 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-panel.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-panel.ts
@@ -14,3 +14,10 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
+
+class Panel extends HTMLElement {
+}
+
+document.addEventListener("DOMContentLoaded", function (event) {
+ window.customElements.define('tobago-panel', Panel);
+});
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts
index 93bcef2..a18e9b0 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts
@@ -15,61 +15,71 @@
* limitations under the License.
*/
-import {Listener, Phase} from "./tobago-listener";
import {DomUtils} from "./tobago-utils";
-class SplitLayout {
+class SplitLayout extends HTMLElement {
- private readonly element: HTMLDivElement;
- private readonly horizontal: boolean;
private offset: number;
- static init = function (element: HTMLElement): void {
- for (const splitLayout of DomUtils.selfOrElementsByClassName(element, "tobago-splitLayout")) {
- new SplitLayout(splitLayout as HTMLDivElement);
- }
- };
-
- constructor(element: HTMLDivElement) {
- this.element = element;
+ constructor() {
+ super();
- let splitters = this.element.getElementsByClassName("tobago-splitLayout-horizontal");
- for (let i = 0; i < splitters.length; i++) {
- splitters.item(i).addEventListener("mousedown", this.start.bind(this));
- this.horizontal = true;
+ let first = true;
+ let justAdded = false;
+ for (let child of this.children) {
+ if (justAdded) { // skip, because the just added had enlarges the list of children
+ justAdded = false;
+ continue;
+ }
+ if (child.matches("input[type=hidden]")) {
+ continue;
+ }
+ if (first) { // the first needs no splitter handle
+ first = false;
+ continue;
+ }
+ const splitter = document.createElement("div");
+ splitter.classList.add(
+ this.orientation === "horizontal" ? "tobago-splitLayout-horizontal" : "tobago-splitLayout-vertical"
+ );
+ justAdded = true;
+ splitter.addEventListener("mousedown", this.start.bind(this));
+ child.parentElement.insertBefore(splitter, child);
}
+ }
- splitters = this.element.getElementsByClassName("tobago-splitLayout-vertical");
- for (let i = 0; i < splitters.length; i++) {
- splitters.item(i).addEventListener("mousedown", this.start.bind(this));
- this.horizontal = false;
- }
+ get orientation(): string {
+ return this.getAttribute("orientation");
+ }
+
+ set orientation(orientation: string) {
+ this.setAttribute("orientation", orientation);
}
start(event: MouseEvent) {
event.preventDefault();
const splitter = event.target as HTMLElement;
const previous = DomUtils.previousElementSibling(splitter);
- this.offset = this.horizontal ? event.pageX - previous.offsetWidth : event.pageY - previous.offsetHeight;
+ this.offset = this.orientation === "horizontal" ? event.pageX - previous.offsetWidth : event.pageY - previous.offsetHeight;
const mousedown = SplitLayoutMousedown.save(event, splitter);
document.addEventListener("mousemove", this.move.bind(this));
document.addEventListener("mouseup", this.stop.bind(this));
const previousArea = mousedown.previous;
- if (this.horizontal) {
+ if (this.orientation === "horizontal") {
previousArea.style.width = String(previousArea.offsetWidth + "px");
} else {
previousArea.style.height = String(previousArea.offsetHeight + "px");
}
previousArea.style.flexGrow = "inherit";
previousArea.style.flexBasis = "auto";
- console.debug("initial width/height = '%s'", (this.horizontal ? previousArea.style.width : previousArea.style.height));
- };
+ console.debug("initial width/height = '%s'", (this.orientation === "horizontal" ? previousArea.style.width : previousArea.style.height));
+ }
move(event: MouseEvent): void {
event.preventDefault();
const data = SplitLayoutMousedown.load();
const previousArea = data.previous;
- if (this.horizontal) {
+ if (this.orientation === "horizontal") {
previousArea.style.width = String(event.pageX - this.offset) + "px";
} else {
previousArea.style.height = String(event.pageY - this.offset) + "px";
@@ -143,5 +153,6 @@ class SplitLayoutMousedown {
}
-Listener.register(SplitLayout.init, Phase.DOCUMENT_READY);
-Listener.register(SplitLayout.init, Phase.AFTER_UPDATE);
+document.addEventListener("DOMContentLoaded", function (event) {
+ window.customElements.define('tobago-split-layout', SplitLayout);
+});
[myfaces-tobago] 01/02: tobago-in: custom elements
Posted by lo...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
lofwyr pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git
commit b7ef002d1fc533676a4187e14b905a5b55655b35
Author: Udo Schnurpfeil <lo...@apache.org>
AuthorDate: Fri Aug 23 15:18:31 2019 +0200
tobago-in: custom elements
issue: TOBAGO-1633: TS refactoring
---
.../myfaces/tobago/internal/renderkit/renderer/InRenderer.java | 4 ++++
.../internal/renderkit/renderer/LabelLayoutRendererBase.java | 8 ++++++--
.../org/apache/myfaces/tobago/renderkit/html/HtmlElements.java | 1 +
3 files changed, 11 insertions(+), 2 deletions(-)
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/InRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/InRenderer.java
index f0653e7..58b9c53 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/InRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/InRenderer.java
@@ -55,6 +55,10 @@ public class InRenderer extends MessageLayoutRendererBase {
private static final Logger LOG = LoggerFactory.getLogger(MethodHandles.lookup().lookupClass());
+ public HtmlElements getComponentTag() {
+ return HtmlElements.TOBAGO_IN;
+ }
+
@Override
protected void encodeBeginField(final FacesContext facesContext, final UIComponent component)
throws IOException {
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/LabelLayoutRendererBase.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/LabelLayoutRendererBase.java
index 15d9178..f570e83 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/LabelLayoutRendererBase.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/LabelLayoutRendererBase.java
@@ -48,6 +48,10 @@ import java.util.List;
*/
public abstract class LabelLayoutRendererBase extends DecodingInputRendererBase {
+ public HtmlElements getComponentTag() {
+ return HtmlElements.DIV;
+ }
+
@Override
public void encodeBegin(final FacesContext facesContext, final UIComponent component) throws IOException {
@@ -125,7 +129,7 @@ public abstract class LabelLayoutRendererBase extends DecodingInputRendererBase
flex = false;
}
- writer.startElement(HtmlElements.DIV);
+ writer.startElement(getComponentTag());
if (labelLayout == LabelLayout.gridLeft || labelLayout == LabelLayout.gridRight
|| labelLayout == LabelLayout.gridTop || labelLayout == LabelLayout.gridBottom) {
writer.writeIdAttribute(clientId + ComponentUtils.SUB_SEPARATOR + "label");
@@ -196,7 +200,7 @@ public abstract class LabelLayoutRendererBase extends DecodingInputRendererBase
// nothing to do
}
- writer.endElement(HtmlElements.DIV);
+ writer.endElement(getComponentTag());
}
protected void encodeLabel(final FacesContext facesContext, final UIComponent component,
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java
index fae900c..3ec4203 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/renderkit/html/HtmlElements.java
@@ -133,6 +133,7 @@ public enum HtmlElements {
VIDEO("video"),
WBR("wbr", Qualifier.VOID),
+ TOBAGO_IN("tobago-in"),
TOBAGO_STARS("tobago-stars"),
TOBAGO_SUGGEST("tobago-suggest");