register EventListener via EventHandlerRegistration (and unregister on @PreDestroy)

Author: treblereel

ui/templates/api/src/main/java/io/crysknife/ui/templates/client/EventHandlerHolder.java

@@ -0,0 +1,60 @@
+/*
+ * Copyright © 2023 Treblereel
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing permissions and limitations under
+ * the License.
+ */
+
+package io.crysknife.ui.templates.client;
+
+import elemental2.dom.EventListener;
+import elemental2.dom.HTMLElement;
+
+import java.util.Objects;
+
+public class EventHandlerHolder {
+
+
+  final String eventType;
+  final HTMLElement element;
+  final EventListener eventListener;
+
+  public EventHandlerHolder(String eventType, HTMLElement element, EventListener eventListener) {
+    this.eventType = eventType;
+    this.element = element;
+    this.eventListener = eventListener;
+  }
+
+  public EventHandlerHolder attach() {
+    element.addEventListener(eventType, eventListener);
+    return this;
+  }
+
+  public EventHandlerHolder remove() {
+    element.removeEventListener(eventType, eventListener);
+    return this;
+  }
+
+  @Override
+  public int hashCode() {
+    return Objects.hash(eventType, element, eventListener);
+  }
+
+  @Override
+  public boolean equals(Object o) {
+    if (this == o)
+      return true;
+    if (o == null || getClass() != o.getClass())
+      return false;
+    EventHandlerHolder that = (EventHandlerHolder) o;
+    return Objects.equals(eventType, that.eventType) && Objects.equals(element, that.element)
+        && Objects.equals(eventListener, that.eventListener);
+  }
+}

ui/templates/api/src/main/java/io/crysknife/ui/templates/client/EventHandlerRegistration.java

@@ -0,0 +1,43 @@
+/*
+ * Copyright © 2023 Treblereel
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing permissions and limitations under
+ * the License.
+ */
+
+package io.crysknife.ui.templates.client;
+
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+public class EventHandlerRegistration {
+
+  private final Map<Object, List<EventHandlerHolder>> handlers = new HashMap<>();
+
+  public void add(Object instance, EventHandlerHolder handler) {
+    handlers.computeIfAbsent(instance, k -> new ArrayList<>()).add(handler.attach());
+  }
+
+  public void remove(Object key, EventHandlerHolder handler) {
+    handlers.get(key).remove(handler.remove());
+  }
+
+  public void clear(Object instance) {
+    List<EventHandlerHolder> handlers = this.handlers.get(instance);
+    for (EventHandlerHolder eventHandlerHolder : handlers) {
+      eventHandlerHolder.remove();
+    }
+    handlers.clear();
+    this.handlers.remove(instance);
+  }
+
+}

ui/templates/generator/src/main/java/io/crysknife/ui/templates/generator/TemplateGenerator.java

@@ -29,10 +29,12 @@
 import com.google.auto.common.MoreTypes;
 import com.google.common.base.Splitter;
 import com.google.common.base.Strings;
+import com.google.common.base.Supplier;
 import com.google.common.escape.Escaper;
 import com.google.common.escape.Escapers;
 import com.inet.lib.less.Less;
 import elemental2.dom.DomGlobal;
+import elemental2.dom.EventListener;
 import elemental2.dom.HTMLElement;
 import freemarker.template.Configuration;
 import freemarker.template.Template;
@@ -50,6 +52,8 @@
 import io.crysknife.generator.context.IOCContext;
 import io.crysknife.generator.helpers.MethodCallGenerator;
 import io.crysknife.logger.TreeLogger;
+import io.crysknife.ui.templates.client.EventHandlerHolder;
+import io.crysknife.ui.templates.client.EventHandlerRegistration;
 import io.crysknife.ui.templates.client.StyleInjector;
 import io.crysknife.ui.templates.client.TemplateUtil;
 import io.crysknife.ui.templates.client.annotation.DataField;
@@ -252,13 +256,17 @@ private void code(ClassMetaInfo builder, BeanDefinition beanDefinition,
 
     processDataFields(templateContext, templateDefinition);
     processEventHandlers(beanDefinition, templateContext, templateDefinition);
+    processOnDestroy(builder);
   }
 
   private void addImports(ClassMetaInfo builder) {
     builder.addImport(DomGlobal.class);
     builder.addImport(Js.class);
     builder.addImport(Reflect.class);
     builder.addImport(TemplateUtil.class);
+    builder.addImport(EventListener.class);
+    builder.addImport(EventHandlerHolder.class);
+    builder.addImport(EventHandlerRegistration.class);
   }
 
   private void setInnerHTML(TemplateContext templateContext,
@@ -347,6 +355,10 @@ private void processEventHandlers(BeanDefinition beanDefinition, TemplateContext
     }
   }
 
+  private void processOnDestroy(ClassMetaInfo builder) {
+    builder.addToOnDestroy((Supplier<String>) () -> "eventHandlerRegistration.clear(instance);");
+  }
+
   private void setStylesheet(ClassMetaInfo builder, TemplateContext templateContext,
       TemplateDefinition templateDefinition) {
     if (templateContext.getStylesheet() != null) {

ui/templates/generator/src/main/resources/templates/ui.ftlh

@@ -4,11 +4,11 @@ private interface HTMLElementAccessor {
     elemental2.dom.HTMLElement getElement();
 }
 </#if>
+private final EventHandlerRegistration eventHandlerRegistration = new EventHandlerRegistration();
 
-
-private void setAndInitTemplate() {
+    private void setAndInitTemplate() {
 <#if css??>
-            StyleInjector.fromString("${css?no_esc}").inject();
+        StyleInjector.fromString("${css?no_esc}").inject();
 </#if>
 <#if initRootElement>
     elemental2.core.Reflect.set(instance, "__root_element__", elemental2.dom.DomGlobal.document.createElement("div"));
@@ -44,9 +44,9 @@ private void setAndInitTemplate() {
 
 <#list events as event>
     <#list event.eventTypes as type>
-            ((elemental2.dom.HTMLElement) Js.asPropertyMap(instance).get(Reflect.objectProperty("${event.mangleName}", instance))).addEventListener("${type}", (e) -> {
+            eventHandlerRegistration.add(instance, new EventHandlerHolder("${type}", ((elemental2.dom.HTMLElement) Js.asPropertyMap(instance).get(Reflect.objectProperty("${event.mangleName}", instance))), (e) -> {
                 ${event.call?no_esc}
-            });
+            }));
     </#list>
 </#list>
     }