Skip to Content

Changes for page Expand

Last modified by Frank Fock on 2025/04/04 21:18
From version 3.1
edited by Frank Fock
on 2025/01/26 23:11
Change comment: Install extension [com.xwiki.pro:xwiki-pro-macros-ui/1.25.5]
To version 1.1
edited by Frank Fock
on 2024/02/07 18:16
Change comment: Install extension [com.xwiki.pro:xwiki-pro-macros/1.14.3]

Summary

Details

Page properties
Parent
... ... @@ -1,1 +1,1 @@
1 -WebHome
1 +Confluence.Macros
Content
... ... @@ -3,13 +3,11 @@
3 3  = Parameters =
4 4  
5 5  |=Parameter|=Description|=Required|=Default
6 -|**title**|Text displayed on the collaspse toggle|No|(empty)
7 -|**expanded**|If selected the expand will be opened automatically when loading the page.|No|False
6 +|**title**|Text displayed on the collaspse toggle|No|Click here to expand...
8 8  
9 -Note: if no title is provided, the title of the first panel or the first header appearing in the content will be used. if there is no such header or panel title, "Click here to expand…" will be used.
10 10  
11 11  = Example Usage =
12 12  
13 -{{expand expanded="false"}}
11 +{{expand}}
14 14  Hello 👀
15 15  {{/expand}}
XWiki.StyleSheetExtension[0]
Code
... ... @@ -1,41 +1,38 @@
1 -.confluence-expand-macro .glyphicon {
2 - margin-right: 0.5rem;
3 - transform: rotate(0deg);
4 - transition: transform 0.3s;
5 -}
1 +.confluence-expand-macro {
6 6  
7 -.confluence-expand-macro[open] > summary .glyphicon {
8 - transform: rotate(90deg);
9 -}
3 + .panel-heading {
4 + padding: 0;
5 + .panel-title {
6 + font-size: 1em;
10 10  
11 -.confluence-expand-macro .panel-title{
12 - padding: @panel-heading-padding;
13 - display: block;
14 -}
8 + a {
9 + display: block;
10 + padding: @panel-heading-padding;
15 15  
16 -.confluence-expand-macro .panel-body {
17 - transition: linear 0.3s;
18 -}
12 + p {
13 + display: inline;
14 + }
19 19  
20 -.confluence-expand-macro summary {
21 - font-size: 1em;
22 -}
16 + .glyphicon {
17 + margin-right: 0.5rem;
18 + transform: rotate(0deg);
19 + transition: transform 0.1s;
20 + }
21 + &[aria-expanded="true"] .glyphicon {
22 + transform: rotate(90deg);
23 + }
24 + }
25 + }
26 + }
23 23  
24 -.confluence-expand-macro summary:hover {
25 - cursor: pointer;
26 - text-decoration: underline;
27 -}
28 + .panel-collapse {
29 + .panel-body {
30 + display: block;
31 + &::before { content: none; }
32 + &::after { content: none; }
28 28  
29 -.confluence-expand-macro.panel > .panel-body, .confluence-expand-macro > summary {
30 - background: unset;
31 - border: none;
34 + & > *:first-child { margin-top: 0; }
35 + & > *:last-child { margin-bottom: 0; }
36 + }
37 + }
32 32  }
33 -
34 -.confluence-expand-macro.panel.panel-default .panel-body ul {
35 - list-style-type: revert;
36 - padding-left: revert;
37 -}
38 -
39 -.confluence-expand-macro.panel {
40 - background: unset;
41 -}
XWiki.WikiMacroClass[0]
Macro code
... ... @@ -1,39 +1,53 @@
1 1  {{velocity output="false"}}
2 2  #macro (executeMacro)
3 - #set ($discard = $xwiki.ssx.use('Confluence.Macros.Expand'))
4 - #set ($opened = $xcontext.action == 'edit' || $xcontext.action == 'export' || $wikimacro.parameters.expanded)
5 - {{html clean="false" wiki="true"}}
6 - <details class="confluence-expand-macro panel panel-default" #if ($opened)open#end>
7 - <summary>
8 - <span class="panel-title">
9 - <span class="glyphicon glyphicon-menu-right" aria-hidden="true"></span>
10 - #set ($title = $wikimacro.parameters.title)
11 - #if ("$!title" == "")
12 - #set ($title = $services.promacroexpand.getAutoTitle($wikimacro.content, $xwiki.currentContentSyntaxId))
13 - #if ("$!title" == "")
14 - #set ($title = $services.localization.render("rendering.macro.expand.defaultexpandtitle"))
15 - #end
16 - #end
17 - $services.rendering.escape($escapetool.xml($title), $xwiki.currentContentSyntaxId)
18 - </span>
19 - </summary>
20 - <div class="panel-body">
3 + $xwiki.ssx.use('Confluence.Macros.Expand')
4 + #if (!$expandMacroColllapseId)
5 + #set ($expandMacroColllapseId = 0)
6 + #else
7 + #set ($expandMacroColllapseId = $expandMacroColllapseId + 1)
8 + #end
9 + #set ($opened = $xcontext.action == 'edit')
10 + #set ($accordionId = "accordion-$escapetool.xml($expandMacroColllapseId)")
11 + #set ($toggleId = "toggle-$expandMacroColllapseId")
12 + #set ($expandId = "collapse-$expandMacroColllapseId")
21 21  
22 - {{wikimacrocontent /}}
23 -
14 + {{html clean="false" wiki="true"}}
15 + <div class="panel-group confluence-expand-macro" id="${accordionId}" role="tablist">
16 + <div class="panel panel-default">
17 + <div class="panel-heading" role="tab" id="${toggleId}">
18 + <h4 class="panel-title">
19 + <a
20 + role="button"
21 + data-toggle="collapse"
22 + data-parent="#${accordionId}"
23 + href="#${expandId}"
24 + #if($opened)aria-expanded="true"#end
25 + aria-controls="${expandId}"
26 + ><span class="glyphicon glyphicon-menu-right" aria-hidden="true"></span>{{wikimacroparameter name="title" /}}</a>
27 + </h4>
28 + </div>
29 + <div id="${expandId}" class="panel-collapse collapse #if($opened)in#end" role="tabpanel" aria-labelledby="${toggleId}">
30 + <div class="panel-body">
31 + {{wikimacrocontent /}}
32 + </div>
33 + </div>
24 24   </div>
25 - </details>
35 + </div>
26 26   {{/html}}
27 27  #end
28 28  {{/velocity}}
29 29  
40 +{{include reference="Licenses.Code.VelocityMacros"/}}
41 +
30 30  {{velocity}}
31 31  ## We need to check if there is a valid license because the macro is registered even if the user doesn't have view right
32 32  ## on the macro definition page. See XWIKI-14828: Rendering macros defined in wiki pages are available to users that
33 33  ## don't have view right on those pages.
34 -#if ($services.promacrolicensing.hasLicensureForEntity($xcontext.macro.doc.documentReference))
46 +#if ($services.licensing.licensor.hasLicensureForEntity($xcontext.macro.doc.documentReference))
35 35   #executeMacro
36 36  #else
37 - {{missingLicenseMessage extensionName="proMacros.extension.name"/}}
49 + {{error}}
50 + #getMissingLicenseMessage('proMacros.extension.name')
51 + {{/error}}
38 38  #end
39 39  {{/velocity}}
Macro description
... ... @@ -1,5 +1,5 @@
1 -Add the Expand macro to your page to provide content in an expandable / collapsible section.
1 +Add the Expand macro to your page to provide content in an expandable / collapsible section. 
2 2  
3 -This is one of Confluence's most popular macros. It's great for: visually reducing the amount of information on a page, breaking process information down into clickable steps, hiding background or obsolete information, while still keeping it on the page for future reference.
3 +This is one of Confluence's most popular macros. It's great for: visually reducing the amount of information on a page, breaking process information down into clickable steps, hiding background or obsolete information, while still keeping it on the page for future reference.
4 4  
5 -The macro is collapsed by default, people need to click each one to expand it. There's no way to expand all macros on a page at once, however all Expand macros are automatically expanded when you print or export the page to PDF.
5 +The macro is collapsed by default, people need to click each one to expand it. There's no way to expand all macros on a page at once, however all Expand macros are automatically expanded when you print or export the page to PDF.
XWiki.WikiMacroParameterClass[0]
Parameter default value
... ... @@ -1,0 +1,1 @@
1 +Click here to expand...
XWiki.WikiMacroParameterClass[1]
Parameter default value
... ... @@ -1,1 +1,0 @@
1 -0
Parameter mandatory
... ... @@ -1,1 +1,0 @@
1 -No
Parameter name
... ... @@ -1,1 +1,0 @@
1 -expanded
Parameter type
... ... @@ -1,1 +1,0 @@
1 -java.lang.Boolean