From 70e019e70ff782c10f409a98a8972faf4b1fcd20 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 17 Jul 2026 16:56:54 +0000
Subject: [PATCH] Add sample for image_editor_popup_close frontend action
 (01/02)

Add a self-contained demo (z2ui5_cl_demo_app_383) in the "framework -
action" package that showcases the IMAGE_EDITOR_POPUP_CLOSE frontend
action directly, without the z2ui5_cl_pop_image_editor helper class.

The Save button binds client->_event_client( cs_event-image_editor_popup_close ),
which reads the edited image from the ImageEditor control on the client
(getImagePngDataURL), closes the popup and returns the PNG data URL to
the server as the SAVE event argument.

Regenerate the src/01 overview catalog for the new tile.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01HbhPYiga7hfH54P1U4Y4ou
---
 src/01/02/z2ui5_cl_demo_app_383.clas.abap | 114 ++++++++++++++++++++++
 src/01/02/z2ui5_cl_demo_app_383.clas.xml  |  16 +++
 src/01/z2ui5_cl_sample_app_001.clas.abap  |   1 +
 3 files changed, 131 insertions(+)
 create mode 100644 src/01/02/z2ui5_cl_demo_app_383.clas.abap
 create mode 100644 src/01/02/z2ui5_cl_demo_app_383.clas.xml

diff --git a/src/01/02/z2ui5_cl_demo_app_383.clas.abap b/src/01/02/z2ui5_cl_demo_app_383.clas.abap
new file mode 100644
index 00000000..e8bd3805
--- /dev/null
+++ b/src/01/02/z2ui5_cl_demo_app_383.clas.abap
@@ -0,0 +1,114 @@
+CLASS z2ui5_cl_demo_app_383 DEFINITION PUBLIC.
+
+  PUBLIC SECTION.
+    INTERFACES z2ui5_if_app.
+
+    DATA image TYPE string.
+
+  PROTECTED SECTION.
+    DATA client TYPE REF TO z2ui5_if_client.
+
+    METHODS view_display.
+    METHODS popup_display.
+    METHODS on_event.
+
+  PRIVATE SECTION.
+ENDCLASS.
+
+
+
+CLASS z2ui5_cl_demo_app_383 IMPLEMENTATION.
+
+
+  METHOD z2ui5_if_app~main.
+
+    me->client = client.
+
+    IF client->check_on_init( ).
+
+      image = `https://raw.githubusercontent.com/abap2UI5/abap2UI5/main/docs/images/logo.png`.
+      view_display( ).
+
+    ELSEIF client->check_on_event( ).
+      on_event( ).
+    ENDIF.
+
+  ENDMETHOD.
+
+
+  METHOD view_display.
+
+    DATA(view) = z2ui5_cl_xml_view=>factory( ).
+
+    view->shell(
+        )->page(
+            title          = `abap2UI5 - Frontend Action - Image Editor Popup Close`
+            navbuttonpress = client->_event_nav_app_leave( )
+            shownavbutton  = client->check_app_prev_stack( )
+            )->vbox( `sapUiSmallMargin`
+                )->image(
+                    src   = client->_bind( image )
+                    width = `20rem`
+                )->button(
+                    text  = `Edit Image...`
+                    icon  = `sap-icon://edit`
+                    press = client->_event( `EDIT` ) ).
+
+    client->view_display( view->stringify( ) ).
+
+  ENDMETHOD.
+
+
+  METHOD popup_display.
+
+    DATA(popup) = z2ui5_cl_xml_view=>factory_popup(
+        )->dialog(
+            title               = `Edit Image`
+            icon                = `sap-icon://edit`
+            contentheight       = `80%`
+            contentwidth        = `80%`
+            verticalscrolling   = abap_false
+            horizontalscrolling = abap_false ).
+
+    popup->image_editor_container(
+        )->image_editor(
+            id  = `imageEditor`
+            src = image ).
+
+    popup->buttons(
+        )->button(
+            text  = `Cancel`
+            type  = `Reject`
+            press = client->_event( `CANCEL` )
+        )->button(
+            text  = `Save`
+            type  = `Emphasized`
+            press = client->_event_client( client->cs_event-image_editor_popup_close ) ).
+
+    client->popup_display( popup->stringify( ) ).
+
+  ENDMETHOD.
+
+
+  METHOD on_event.
+
+    CASE client->get( )-event.
+
+      WHEN `EDIT`.
+        popup_display( ).
+
+      WHEN `SAVE`.
+
+        image = client->get_event_arg( 1 ).
+        client->popup_destroy( ).
+        client->view_model_update( ).
+        client->message_toast_display( `Image saved` ).
+
+      WHEN `CANCEL`.
+        client->popup_destroy( ).
+
+    ENDCASE.
+
+  ENDMETHOD.
+
+ENDCLASS.
diff --git a/src/01/02/z2ui5_cl_demo_app_383.clas.xml b/src/01/02/z2ui5_cl_demo_app_383.clas.xml
new file mode 100644
index 00000000..d13b3c31
--- /dev/null
+++ b/src/01/02/z2ui5_cl_demo_app_383.clas.xml
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<abapGit version="v1.0.0" serializer="LCL_OBJECT_CLAS" serializer_version="v1.0.0">
+ <asx:abap xmlns:asx="http://www.sap.com/abapxml" version="1.0">
+  <asx:values>
+   <VSEOCLASS>
+    <CLSNAME>Z2UI5_CL_DEMO_APP_383</CLSNAME>
+    <LANGU>E</LANGU>
+    <DESCRIPT>Image Editor - Edit in Popup and return PNG</DESCRIPT>
+    <STATE>1</STATE>
+    <CLSCCINCL>X</CLSCCINCL>
+    <FIXPT>X</FIXPT>
+    <UNICODE>X</UNICODE>
+   </VSEOCLASS>
+  </asx:values>
+ </asx:abap>
+</abapGit>
diff --git a/src/01/z2ui5_cl_sample_app_001.clas.abap b/src/01/z2ui5_cl_sample_app_001.clas.abap
index 3aca772d..dc8646a9 100644
--- a/src/01/z2ui5_cl_sample_app_001.clas.abap
+++ b/src/01/z2ui5_cl_sample_app_001.clas.abap
@@ -243,6 +243,7 @@ CLASS z2ui5_cl_sample_app_001 IMPLEMENTATION.
       ( group = `framework - action` header = `Browsre` sub = `Title` app = `z2ui5_cl_demo_app_125` )
       ( group = `framework - action` header = `Focus I` sub = `Set Focus in Textfield` app = `z2ui5_cl_demo_app_133` )
       ( group = `framework - action` header = `Focus II` sub = `Jump with the focus` app = `z2ui5_cl_demo_app_189` )
+      ( group = `framework - action` header = `Image Editor` sub = `Edit in Popup and return PNG` app = `z2ui5_cl_demo_app_383` )
       ( group = `framework - action` header = `Input` sub = `Clipboard` app = `z2ui5_cl_demo_app_325` )
       ( group = `framework - action` header = `Input` sub = `Hide/show Soft Keyboard` app = `z2ui5_cl_demo_app_352` )
       ( group = `framework - action` header = `Scroll I` sub = `Scroll to position` app = `z2ui5_cl_demo_app_362` )