Skip to content

Commit 5ba0a1b

Browse files
authored
Merge pull request #67 from abap2UI5/claude/add-popup-popover-submenu-nLzgW
Refactor popups documentation into separate pages
2 parents c796612 + 5bd8a19 commit 5ba0a1b

4 files changed

Lines changed: 107 additions & 94 deletions

File tree

docs/.vitepress/config.mjs

Lines changed: 36 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -62,9 +62,9 @@ export default defineConfig({
6262
{ text: "Introduction", link: "/get_started/about" },
6363
{ text: "Cookbook", link: "/development/general" },
6464
{ text: "Configuration", link: "/configuration/setup" },
65-
{ text: "Advanced Topics", link: "/advanced/downporting" },
66-
{ text: "Technical Insights", link: "/technical/concept" },
67-
{ text: "Resources", link: "/resources/addons" },
65+
{ text: "Advanced Topic", link: "/advanced/downporting" },
66+
{ text: "Technical Insight", link: "/technical/concept" },
67+
{ text: "Resource", link: "/resources/addons" },
6868
],
6969
},
7070
{
@@ -91,7 +91,7 @@ export default defineConfig({
9191
{
9292
text: "1.141.0",
9393
items: [
94-
{ text: "Releases", link: "/resources/changelog" },
94+
{ text: "Release", link: "/resources/changelog" },
9595
{ text: "Support", link: "/resources/support" },
9696
{ text: "Contribution", link: "/resources/contribution" },
9797
{ text: "Sponsor", link: "/resources/sponsor" },
@@ -107,8 +107,8 @@ export default defineConfig({
107107
{ text: "Introduction", link: "/get_started/about" },
108108
{ text: "Quickstart", link: "/get_started/quickstart" },
109109
{ text: "Hello World", link: "/get_started/hello_world" },
110-
{ text: "Sample Apps", link: "/get_started/samples" },
111-
{ text: "Use Cases", link: "/get_started/use_cases" },
110+
{ text: "Sample App", link: "/get_started/samples" },
111+
{ text: "Use Case", link: "/get_started/use_cases" },
112112
{ text: `What's Next?`, link: "/get_started/next" },
113113
],
114114
},
@@ -132,12 +132,12 @@ export default defineConfig({
132132
collapsed: true,
133133
items: [
134134
{ text: "Binding", link: "/development/model/binding" },
135-
{ text: "Tables, Trees", link: "/development/model/tables" },
135+
{ text: "Table, Tree", link: "/development/model/tables" },
136136
{ text: "Device Model", link: "/development/model/device" },
137137
{ text: "OData", link: "/development/model/odata" },
138138
],
139139
},
140-
{ text: "Events", link: "/development/events" },
140+
{ text: "Event", link: "/development/events" },
141141
{
142142
text: "Navigation",
143143
link: "/development/navigation/navigation",
@@ -152,19 +152,28 @@ export default defineConfig({
152152
],
153153
},
154154
{
155-
text: "Messages, Errors",
155+
text: "Message, Error",
156156
collapsed: true,
157157
items: [
158-
{ text: "Messages", link: "/development/messages/messages" },
159-
{ text: "Errors", link: "/development/messages/errors" },
158+
{ text: "Message", link: "/development/messages/messages" },
159+
{ text: "Error", link: "/development/messages/errors" },
160160
{ text: "Logging", link: "/development/messages/logging" },
161161
{ text: "CL_DEMO_OUTPUT", link: "/development/specific/demo_output" },
162162
],
163163
},
164164
{ text: "Translation, i18n", link: "/development/translation" },
165-
{ text: "Popups, Popovers", link: "/development/popups" },
166165
{
167-
text: "Browser Features",
166+
text: "Popup, Popover",
167+
link: "/development/popups/popup",
168+
collapsed: true,
169+
items: [
170+
{ text: "Popup", link: "/development/popups/popup" },
171+
{ text: "Popover", link: "/development/popups/popover" },
172+
{ text: "Built-In", link: "/development/popups/built_in" },
173+
],
174+
},
175+
{
176+
text: "Browser Feature",
168177
collapsed: true,
169178
items: [
170179
{
@@ -173,7 +182,7 @@ export default defineConfig({
173182
},
174183
{ text: "Camera", link: "/development/specific/camera" },
175184
{
176-
text: "Geolocation, Maps",
185+
text: "Geolocation, Map",
177186
link: "/development/specific/geolocation",
178187
},
179188
{
@@ -198,10 +207,10 @@ export default defineConfig({
198207
],
199208
},
200209
{
201-
text: "Expert Topics",
210+
text: "Expert Topic",
202211
collapsed: true,
203212
items: [
204-
{ text: "Locks", link: "/development/specific/locks" },
213+
{ text: "Lock", link: "/development/specific/locks" },
205214
{ text: "Statefulness", link: "/development/specific/statefulness" },
206215
{ text: "Logout", link: "/configuration/logout" },
207216
],
@@ -218,7 +227,7 @@ export default defineConfig({
218227
{ text: "Security", link: "/configuration/security" },
219228
{ text: "Authorization", link: "/configuration/authorization" },
220229
{ text: "Performance", link: "/configuration/performance" },
221-
{ text: "UI5 Versions", link: "/configuration/ui5_versions" },
230+
{ text: "UI5 Version", link: "/configuration/ui5_versions" },
222231
{ text: "Productive Usage", link: "/configuration/productive_usage" },
223232
{ text: "Debugging", link: "/configuration/troubleshooting" },
224233
{ text: "Fiori Launchpad", link: "/configuration/launchpad" },
@@ -238,7 +247,7 @@ export default defineConfig({
238247
],
239248
},
240249
{
241-
text: "Advanced Topics",
250+
text: "Advanced Topic",
242251
link: "/advanced/downporting",
243252
collapsed: true,
244253
items: [
@@ -255,7 +264,7 @@ export default defineConfig({
255264
collapsed: true,
256265
items: [
257266
{
258-
text: "User Exits",
267+
text: "User Exit",
259268
link: "/advanced/extensibility/user_exits",
260269
},
261270
{ text: "Custom JS", link: "/advanced/extensibility/custom_js" },
@@ -272,20 +281,20 @@ export default defineConfig({
272281
items: [
273282
{ text: "Drag & Drop", link: "/development/specific/drag" },
274283
{
275-
text: "Smart Controls",
284+
text: "Smart Control",
276285
link: "/development/specific/smart_controls",
277286
},
278287
],
279288
},
280289
],
281290
},
282291
{
283-
text: "Technical Insights",
292+
text: "Technical Insight",
284293
link: "/technical/concept",
285294
collapsed: true,
286295
items: [
287296
{ text: "UI5 Over-the-Wire", link: "/technical/concept" },
288-
{ text: "ABAP Thinking, UI5 Results", link: "/technical/dx" },
297+
{ text: "ABAP Thinking, UI5 Result", link: "/technical/dx" },
289298
{ text: "Cloud Readiness", link: "/technical/cloud" },
290299
{ text: "Behind the Scenes", link: "/technical/how_it_all_works" },
291300
{
@@ -297,7 +306,7 @@ export default defineConfig({
297306
],
298307
},
299308
{
300-
text: "Tools",
309+
text: "Tool",
301310
collapsed: false,
302311
items: [
303312
{ text: "abapGit", link: "/technical/tools/abapgit" },
@@ -312,14 +321,14 @@ export default defineConfig({
312321
],
313322
},
314323
{
315-
text: "Resources",
324+
text: "Resource",
316325
link: "/resources/addons",
317326
collapsed: true,
318327
items: [
319-
{ text: "Add-ons", link: "/resources/addons" },
320-
{ text: "References", link: "/resources/references" },
328+
{ text: "Add-on", link: "/resources/addons" },
329+
{ text: "Reference", link: "/resources/references" },
321330
{ text: "Who Uses abap2UI5?", link: "/resources/who_uses" },
322-
{ text: "Releases", link: "/resources/changelog" },
331+
{ text: "Release", link: "/resources/changelog" },
323332
{ text: "License", link: "/resources/license" },
324333
{ text: "Support", link: "/resources/support" },
325334
{ text: "Contact", link: "/resources/contact" },
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
---
2+
outline: [2, 4]
3+
---
4+
# Built-In Popups
5+
6+
A few pre-built popup classes cover the most common cases:
7+
8+
- `Z2UI5_CL_POP_ERROR`
9+
- `Z2UI5_CL_POP_FILE_DL`
10+
- `Z2UI5_CL_POP_FILE_UL`
11+
- `Z2UI5_CL_POP_GET_RANGE`
12+
- `Z2UI5_CL_POP_GET_RANGE_M`
13+
- `Z2UI5_CL_POP_HTML`
14+
- `Z2UI5_CL_POP_INPUT_VAL`
15+
- `Z2UI5_CL_POP_ITAB_JSON_DL`
16+
- `Z2UI5_CL_POP_JS_LOADER`
17+
- `Z2UI5_CL_POP_MESSAGES`
18+
- `Z2UI5_CL_POP_PDF`
19+
- `Z2UI5_CL_POP_TABLE`
20+
- `Z2UI5_CL_POP_TEXTEDIT`
21+
- `Z2UI5_CL_POP_TO_CONFIRM`
22+
- `Z2UI5_CL_POP_TO_INFORM`
23+
- `Z2UI5_CL_POP_TO_SELECT`
24+
25+
Help expand this collection to cover more cases — contributions are welcome.

docs/development/popups/popover.md

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
---
2+
outline: [2, 4]
3+
---
4+
# Popover
5+
6+
To show a popover, call `client->popover_display` and pass the ID of the control the popover should attach to:
7+
```abap
8+
METHOD z2ui5_if_app~main.
9+
10+
IF client->check_on_init( ).
11+
DATA(view) = z2ui5_cl_xml_view=>factory(
12+
)->shell(
13+
)->page( `Popover Example`
14+
)->button(
15+
text = `display popover`
16+
press = client->_event( `POPOVER_OPEN` )
17+
id = `TEST` ).
18+
client->view_display( view->stringify( ) ).
19+
20+
ENDIF.
21+
22+
CASE client->get( )-event.
23+
24+
WHEN `POPOVER_OPEN`.
25+
DATA(popover) = z2ui5_cl_xml_view=>factory_popup(
26+
)->popover( placement = `Left`
27+
)->text( `this is a popover`
28+
)->button(
29+
id = `my_id`
30+
text = `close`
31+
press = client->_event( `POPOVER_CLOSE` ) ).
32+
client->popover_display(
33+
xml = popover->stringify( )
34+
by_id = `TEST` ).
35+
36+
WHEN `POPOVER_CLOSE`.
37+
client->popover_destroy( ).
38+
ENDCASE.
39+
40+
ENDMETHOD.
41+
```
Lines changed: 5 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,11 @@
11
---
22
outline: [2, 4]
33
---
4-
# Popups, Popovers
4+
# Popup
55

6-
UI5 offers popups and popovers that overlay specific parts of the view. This section walks through building them in abap2UI5.
6+
UI5 offers popups that overlay specific parts of the view. This section walks through building them in abap2UI5.
77

8-
### Popup
9-
10-
#### General
8+
## General
119

1210
To show a popup, call `client->popup_display` instead of `client->view_display`:
1311
```abap
@@ -21,7 +19,7 @@ To show a popup, call `client->popup_display` instead of `client->view_display`:
2119
ENDMETHOD.
2220
```
2321

24-
#### Flow Logic
22+
## Flow Logic
2523
A typical popup flow shows a normal view, opens a popup, and finally closes it. Structure it like this:
2624
```abap
2725
METHOD z2ui5_if_app~main.
@@ -55,7 +53,7 @@ A typical popup flow shows a normal view, opens a popup, and finally closes it.
5553
ENDMETHOD.
5654
```
5755

58-
#### Separated App
56+
## Separated App
5957
For a cleaner source layout, encapsulate popups in separate classes and call them via [navigation](/development/navigation/navigation).
6058

6159
An example with the confirmation popup:
@@ -83,63 +81,3 @@ An example with the confirmation popup:
8381
```
8482

8583
To handle multiple stacked popups, note that abap2UI5 shows only one popup at a time on the frontend. But you can keep a popup stack in your backend logic and re-display the previous popup as needed. See `Z2UI5_CL_DEMO_APP_161`.
86-
87-
### Popover
88-
To show a popover, call `client->popover_display` and pass the ID of the control the popover should attach to:
89-
```abap
90-
METHOD z2ui5_if_app~main.
91-
92-
IF client->check_on_init( ).
93-
DATA(view) = z2ui5_cl_xml_view=>factory(
94-
)->shell(
95-
)->page( `Popover Example`
96-
)->button(
97-
text = `display popover`
98-
press = client->_event( `POPOVER_OPEN` )
99-
id = `TEST` ).
100-
client->view_display( view->stringify( ) ).
101-
102-
ENDIF.
103-
104-
CASE client->get( )-event.
105-
106-
WHEN `POPOVER_OPEN`.
107-
DATA(popover) = z2ui5_cl_xml_view=>factory_popup(
108-
)->popover( placement = `Left`
109-
)->text( `this is a popover`
110-
)->button(
111-
id = `my_id`
112-
text = `close`
113-
press = client->_event( `POPOVER_CLOSE` ) ).
114-
client->popover_display(
115-
xml = popover->stringify( )
116-
by_id = `TEST` ).
117-
118-
WHEN `POPOVER_CLOSE`.
119-
client->popover_destroy( ).
120-
ENDCASE.
121-
122-
ENDMETHOD.
123-
```
124-
125-
### Built-in Popups
126-
A few pre-built popup classes cover the most common cases:
127-
128-
- `Z2UI5_CL_POP_ERROR`
129-
- `Z2UI5_CL_POP_FILE_DL`
130-
- `Z2UI5_CL_POP_FILE_UL`
131-
- `Z2UI5_CL_POP_GET_RANGE`
132-
- `Z2UI5_CL_POP_GET_RANGE_M`
133-
- `Z2UI5_CL_POP_HTML`
134-
- `Z2UI5_CL_POP_INPUT_VAL`
135-
- `Z2UI5_CL_POP_ITAB_JSON_DL`
136-
- `Z2UI5_CL_POP_JS_LOADER`
137-
- `Z2UI5_CL_POP_MESSAGES`
138-
- `Z2UI5_CL_POP_PDF`
139-
- `Z2UI5_CL_POP_TABLE`
140-
- `Z2UI5_CL_POP_TEXTEDIT`
141-
- `Z2UI5_CL_POP_TO_CONFIRM`
142-
- `Z2UI5_CL_POP_TO_INFORM`
143-
- `Z2UI5_CL_POP_TO_SELECT`
144-
145-
Help expand this collection to cover more cases — contributions are welcome.

0 commit comments

Comments
 (0)