diff --git a/README.md b/README.md index d98d92bd..3e84ffdf 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,7 @@ # abap2UI5 - Development of UI5 Apps in pure ABAP. Follow this project on [twitter](https://twitter.com/OblomovDev) to keep up to date! -## Project Features +#### Features * easy to use – implement just one interface for a standalone UI5 application * pure ABAP – development using 100% ABAP (no JavaScript, DDL, EML or Customizing) * low system footprint – based on a plain http handler (no BSP, OData, CDS, BOPF, FE or RAP) @@ -10,7 +9,15 @@ Development of UI5 Apps in pure ABAP. Follow this project on [twitter](https://t * high system compatibility – runs on all available ABAP stacks (from NW 7.02 to ABAP 2302) * easy installation – abapGit project, no additional app deployment needed -### Information +#### Compatibility +Works with all available ABAP releases and language versions: +* BTP ABAP Environment (ABAP for Cloud) +* S/4 Public Cloud ABAP Environment (ABAP for Cloud) +* S/4 Private Cloud or On-Premise (ABAP for Cloud, Standard ABAP) +* R/3 NetWeaver AS ABAP 7.50 or higher (Standard ABAP) +* R/3 NetWeaver AS ABAP 7.02 to 7.42 - use the [low syntax branch](https://github.com/oblomov-dev/ABAP2UI5/tree/main_v702) + +#### Information ##### SCN Blog Series - Introduction to abap2UI5 1. Introduction: Developing UI5 Apps in pure ABAP [(Blog SCN - 22.02.2023)](https://blogs.sap.com/2023/02/22/abap2ui5-development-of-ui5-apps-in-pure-abap-1-3/)
2. Displaying Selection Screens & Tables [(Blog SCN - 23.02.2023)](https://blogs.sap.com/2023/02/22/abap2ui5-output-of-lists-and-tables-toolbar-and-editable-2-3/)
@@ -27,18 +34,11 @@ Development of UI5 Apps in pure ABAP. Follow this project on [twitter](https://t * Featured in the SAP Developer News [(youtube - 26.01.2023)](https://www.youtube.com/watch?v=6BDK55xYttM) * Development of UI5 Selection Screens in pure ABAP (former version) [(Blog SCN - 22.01.2023)](https://blogs.sap.com/2023/01/22/abap2ui5-project-development-of-ui5-selection-screens-in-pure-abap-no-app-deployment-or-javascript-needed/) -### Demo +#### Demo ![gif_git](https://user-images.githubusercontent.com/102328295/227471575-617dad73-5c3a-4ed2-be31-fe537ca0c080.gif) -## Installation -Works with all available ABAP releases and language versions: -* BTP ABAP Environment (ABAP for Cloud) -* S/4 Public Cloud ABAP Environment (ABAP for Cloud) -* S/4 Private Cloud or On-Premise (ABAP for Cloud, Standard ABAP) -* R/3 NetWeaver AS ABAP 7.50 or higher (Standard ABAP) -* R/3 NetWeaver AS ABAP 7.02 to 7.42 - use the low syntax [branch](https://github.com/oblomov-dev/ABAP2UI5/tree/main_v702) - -Install with [abapGit](https://abapgit.org), create a new HTTP service and call abap2UI5. More information can be found [here.](https://blogs.sap.com/2023/04/14/abap2ui5-6-7-installation-configuration-debugging/) +#### Installation +Install with [abapGit](https://abapgit.org), create a new HTTP service and call abap2UI5. For more information, check out the documentation [here.](https://blogs.sap.com/2023/04/14/abap2ui5-6-7-installation-configuration-debugging/) ##### ABAP for Cloud: ```abap @@ -82,7 +82,7 @@ METHOD if_http_extension~handle_request. ENDMETHOD. ``` -## FAQ +#### FAQ * read these [instructions](https://blogs.sap.com/2023/02/22/abap2ui5-development-of-ui5-apps-in-pure-abap-1-3/) when you develop your first app
* running into problems with your app? or want to configure the theme, bootstrapping, language and title? see [configuration & debugging](https://blogs.sap.com/2023/04/14/abap2ui5-6-7-installation-configuration-debugging/) * as always - your comments, questions, wishes and bugs are welcome, please create an [issue](https://github.com/oblomov-dev/ABAP2UI5/issues) diff --git a/src/00/z2ui5_cl_app_demo_12.clas.abap b/src/00/z2ui5_cl_app_demo_12.clas.abap index 27d36492..179de63e 100644 --- a/src/00/z2ui5_cl_app_demo_12.clas.abap +++ b/src/00/z2ui5_cl_app_demo_12.clas.abap @@ -31,15 +31,13 @@ CLASS Z2UI5_CL_APP_DEMO_12 IMPLEMENTATION. WHEN 'BUTTON_POPUP_01'. mv_popup_view = 'POPUP_DECIDE'. - "" mv_main_view = ''. + mv_main_view = ''. WHEN 'POPUP_DECIDE_CONTINUE'. - " mv_popup_view = ''. mv_main_view = 'MAIN'. client->popup_message_toast( 'continue pressed' ). WHEN 'POPUP_DECIDE_CANCEL'. - " mv_popup_view = ''. mv_main_view = 'MAIN'. client->popup_message_toast( 'cancel pressed' ). diff --git a/src/00/z2ui5_cl_app_demo_33.clas.abap b/src/00/z2ui5_cl_app_demo_33.clas.abap index 8871d7e0..20d1d043 100644 --- a/src/00/z2ui5_cl_app_demo_33.clas.abap +++ b/src/00/z2ui5_cl_app_demo_33.clas.abap @@ -3,14 +3,15 @@ CLASS z2ui5_cl_app_demo_33 DEFINITION PUBLIC. PUBLIC SECTION. INTERFACES z2ui5_if_app. - data mv_type type string. + DATA mv_type TYPE string. + PROTECTED SECTION. PRIVATE SECTION. ENDCLASS. -CLASS Z2UI5_CL_APP_DEMO_33 IMPLEMENTATION. +CLASS z2ui5_cl_app_demo_33 IMPLEMENTATION. METHOD z2ui5_if_app~controller. @@ -19,20 +20,26 @@ CLASS Z2UI5_CL_APP_DEMO_33 IMPLEMENTATION. WHEN 'BACK'. client->nav_app_leave( client->get_app( client->get( )-id_prev_app_stack ) ). - when others. - mv_type = client->get( )-event. + WHEN 'BUTTON_MESSAGE_BOX'. + client->popup_message_box( 'Action of illustrated message' ). + + WHEN OTHERS. + mv_type = client->get( )-event. ENDCASE. - DATA(page) = Z2UI5_CL_XML_VIEW=>factory( )->shell( + DATA(page) = z2ui5_cl_xml_view=>factory( )->shell( )->page( title = 'abap2UI5 - Illustrated Messages' navbuttonpress = client->_event( 'BACK' ) shownavbutton = abap_true )->header_content( + )->link( + text = 'Demo' target = '_blank' + href = `https://twitter.com/OblomovDev/status/1647175810917318657` )->link( text = 'Source_Code' target = '_blank' - href = Z2UI5_CL_XML_VIEW=>hlp_get_source_code_url( app = me get = client->get( ) ) + href = z2ui5_cl_xml_view=>hlp_get_source_code_url( app = me get = client->get( ) ) )->get_parent( ). page->link( text = 'Documentation' target = '_blank' href = `https://openui5.hana.ondemand.com/api/sap.m.IllustratedMessageType#properties` ). page->button( text = 'NoActivities' press = client->_event( 'sapIllus-NoActivities' ) ). diff --git a/src/00/z2ui5_cl_app_demo_38.clas.abap b/src/00/z2ui5_cl_app_demo_38.clas.abap index a43d9eb4..32c51746 100644 --- a/src/00/z2ui5_cl_app_demo_38.clas.abap +++ b/src/00/z2ui5_cl_app_demo_38.clas.abap @@ -69,6 +69,9 @@ CLASS z2ui5_cl_app_demo_38 IMPLEMENTATION. navbuttonpress = client->_event( 'BACK' ) shownavbutton = abap_true )->header_content( + )->link( + text = 'Demo' target = '_blank' + href = `https://twitter.com/OblomovDev/status/1647246029828268032` )->link( text = 'Source_Code' target = '_blank' href = z2ui5_cl_xml_view=>hlp_get_source_code_url( app = me get = client->get( ) ) diff --git a/src/z2ui5_cl_http_handler.clas.abap b/src/z2ui5_cl_http_handler.clas.abap index 3a54fdb3..ad1ed435 100644 --- a/src/z2ui5_cl_http_handler.clas.abap +++ b/src/z2ui5_cl_http_handler.clas.abap @@ -165,7 +165,8 @@ CLASS z2ui5_cl_http_handler IMPLEMENTATION. ` if (sap.z2ui5.oResponse.oTimer){ ` && |\n| && ` var oEvent = { 'EVENT' : 'BUTTON_CHECK', 'METHOD' : 'UPDATE' };` && |\n| && ` oEvent.EVENT = sap.z2ui5.oResponse.oTimer.eventFinished;` && |\n| && - ` setTimeout( sap.z2ui5.oView.getController().onEvent, sap.z2ui5.oResponse.oTimer.intervalMs, oEvent );` && |\n| && + ` sap.z2ui5.checkTimerActive = true;` && |\n| && + ` setTimeout( ( ) => { if ( sap.z2ui5.checkTimerActive ) { sap.z2ui5.oView.getController().onEvent( oEvent ); } }, sap.z2ui5.oResponse.oTimer.intervalMs, oEvent );` && |\n| && ` }` && |\n| && ` sap.ui.core.BusyIndicator.hide();` && |\n| && ` },` && |\n| && @@ -207,7 +208,7 @@ CLASS z2ui5_cl_http_handler IMPLEMENTATION. ` this.oBody.oEvent = oEvent;` && |\n| && ` this.oBody.oEvent.vData = vData;` && |\n| && |\n| && - ` if (this.oBody.oSystem.CHECK_DEBUG_ACTIVE) {` && |\n| && + ` if (sap.z2ui5.checkLogActive) {` && |\n| && ` console.log('Request Object:');` && |\n| && ` console.log(this.oBody);` && |\n| && ` }` && |\n| && @@ -221,6 +222,7 @@ CLASS z2ui5_cl_http_handler IMPLEMENTATION. |\n| && ` Roundtrip: function () {` && |\n| && |\n| && + ` sap.z2ui5.checkTimerActive = false;` && |\n| && ` if (sap.z2ui5.oView){ sap.z2ui5.oView.destroy( ); }` && |\n| && ` var xhr = new XMLHttpRequest();` && |\n| && ` if ( sap.startApp ) { var app = sap.startApp; }else` && |\n| && @@ -237,7 +239,7 @@ CLASS z2ui5_cl_http_handler IMPLEMENTATION. ` }` && |\n| && ` sap.z2ui5.oResponse = JSON.parse(that.target.response);` && |\n| && |\n| && - ` if (sap.z2ui5.oResponse.oSystem.CHECK_DEBUG_ACTIVE) {` && |\n| && + ` if (sap.z2ui5.checkLogActive) {` && |\n| && ` console.log('Response Object:');` && |\n| && ` console.log(sap.z2ui5.oResponse);` && |\n| && ` if (sap.z2ui5.oResponse.vView) {` && |\n| && @@ -280,7 +282,8 @@ CLASS z2ui5_cl_http_handler IMPLEMENTATION. ` },` && |\n| && ` });` && |\n| && |\n| && - ` if (!sap.z2ui5) {sap.z2ui5 = {}; };` && |\n| && + ` if (!sap.z2ui5) { sap.z2ui5 = {}; };` && |\n| && + ` sap.z2ui5.checkLogActive = ` && _=>get_json_boolean( check_logging ) && `;` && |\n| && ` var xml = '';` && |\n| && ` if (xml == '') { xml = '<mvc:View controllerName="z2ui5_controller" xmlns:mvc="sap.ui.core.mvc" />' };` && |\n| && |\n| &&