Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Objects (3 modified, 2 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -1,7 +1,3 @@ 1 -{{apimacro title="APIMacro"}} 2 -Code 3 - 4 -Code 5 - 6 -Code 1 +{{apimacro}} 2 + 7 7 {{/apimacro}}
- XWiki.JavaScriptExtension[0]
-
- Code
-
... ... @@ -3,19 +3,24 @@ 3 3 var header = $(this), 4 4 content = header.next('.showhidecontent'), 5 5 effect = header.attr('data-show-effect'), 6 - duration = parseInt(header.attr('data-show-duration')) || 300; 6 + duration = parseInt(header.attr('data-show-duration')) || 300, 7 + iconEl = header.find('.showhide-icon'); 7 7 9 + // Sicherheitsprüfung für Effekt 8 8 if ($.inArray(effect, ['toggle', 'fadeToggle', 'slideToggle']) === -1) { 9 9 effect = 'toggle'; 10 10 } 11 11 14 + // Sichtbarkeitsstatus 12 12 var isVisible = content.is(':visible'); 13 13 var newState = !isVisible; 14 14 15 - // Toggle 'open'-Klasse für Rotation 16 - header.toggleClass('open', newState); 18 + // Nachricht + Pfeil setzen 19 + var message = newState ? header.attr('data-hide-message') : header.attr('data-show-message'); 20 + var icon = newState ? '▼ ' : '► '; 21 + iconEl.html(icon + message); 17 17 18 - // Ein-/Ausblendendes Inhalts23 + // Inhalt ein-/ausblenden 19 19 content.stop()[effect](duration); 20 20 } 21 21 - Name
-
... ... @@ -1,1 +1,1 @@ 1 -APIMacro 1 +APIMacro Script
- XWiki.StyleSheetExtension[0]
-
- Code
-
... ... @@ -2,43 +2,53 @@ 2 2 border: 1px solid #ccc; 3 3 background-color: #f7f7f7; 4 4 border-radius: 4px 4px 0 0; 5 - padding: 10px 12px; 6 - margin: 30px 0 0; 7 - cursor: pointer; 8 - user-select: none; 5 + padding: 8px 12px; 6 + margin-bottom: 0; 9 9 } 10 10 11 -.showhidecontent { 12 - border: 1px solid #ccc; 13 - border-top: none; 14 - border-radius: 0 0 4px 4px; 15 - padding: 10px; 16 - background-color: #fff; 17 -} 18 - 19 19 .showhide-header-flex { 20 20 display: flex; 21 21 justify-content: space-between; 22 22 align-items: center; 13 + padding: 6px 0px; 14 + font-weight: bold; 23 23 } 24 24 25 25 .showhide-title { 26 26 flex: 1; 27 27 text-align: left; 28 - font-weight: bold; 29 29 } 30 30 31 -.showhide-arrow { 32 - display: inline-block; 33 - transition: transform 0.3s ease; 34 - transform: rotate(0deg); 35 - font-size: 16px; 36 - color: #0645ad; 22 +.showhidebutton a { 23 + text-decoration: none; 24 + cursor: pointer; 25 + font-weight: normal; 37 37 } 38 38 39 -/* Wenn Container 'open' ist → Pfeil dreht sich */ 40 -.showhide-header.open .showhide-arrow { 41 - transform: rotate(90deg); 28 +.showhidecontent { 29 + border: 1px solid #ccc; 30 + border-top: none; 31 + border-radius: 0 0 4px 4px; 32 + padding: 10px; 33 + background-color: #fff; 42 42 } 43 43 36 +.showhide-header:hover { 37 + background-color: #f0f0f0; 38 + cursor: default; 39 +} 44 44 41 +.showhidebutton a:hover { 42 + text-decoration: underline; 43 +} 44 + 45 +.showhide-icon { 46 + color: #0645ad; /* typisches Link-Blau */ 47 + text-decoration: underline; 48 + cursor: pointer; 49 +} 50 + 51 +.showhide-header:hover .showhide-icon { 52 + text-decoration: underline; 53 + color: #0b0080; /* dunkler beim Hover */ 54 +}
- XWiki.WikiMacroClass[0]
-
- Macro code
-
... ... @@ -1,11 +1,9 @@ 1 1 {{velocity}} 2 -#set($discard = $xwiki.jsx.use("Macros. APIMacro"))2 +#set($discard = $xwiki.jsx.use("Macros.ShowHideMacro")) 3 3 #set($mparams = $wikimacro.parameters) 4 4 #if(!$mparams) 5 5 #set($mparams = $xcontext.macro.params) 6 6 #end 7 - 8 -## Parameter vorbereiten 9 9 #if($mparams.id) 10 10 #set($id = $util.convertToAlphaNumeric($mparams.id)) 11 11 #end ... ... @@ -20,33 +20,26 @@ 20 20 #end 21 21 #set($effectduration = $mathtool.mul(1000,$mparams.effectduration)) 22 22 #set($title = $escapetool.xml($mparams.title)) 23 - 24 - ## Wrapper starten21 +(% #if($divstyle && $divstyle!="") style="${divstyle}" #end %) 22 +((( 25 25 {{html clean=false}} 26 -<div class="showhide-wrapper" #if($divstyle && $divstyle!="") style="$divstyle" #end> 27 - <div class="showhide-header" 28 - #if($id && $id!="") id="showhideheader${id}" #end 29 - data-show-duration="$effectduration" 30 - data-show-effect="$effect"> 31 - <div class="showhide-header-flex"> 32 - <div class="showhide-title"> 33 - $title 34 - </div> 35 - <div class="showhide-arrow">▶</div> ## Unicode ▶ 36 - </div> 24 +<div class="showhide-header" 25 + #if($id && $id!="") id="showhideheader${id}" #end 26 + data-show-duration="$effectduration" 27 + data-show-effect="$effect" 28 + data-show-message="$showmessage" 29 + data-hide-message="$hidemessage"> 30 + <div class="showhide-header-flex"> 31 + <div class="showhide-title">$title</div> 32 + <div class="showhide-icon">►</div> 37 37 </div> 34 +</div> 38 38 {{/html}} 39 - 40 -## Inhaltsteil 41 -(% class="showhidecontent" 42 - #if($id && $id!="") id="showhidecontent${id}" #end 43 - #if($xcontext.action != 'edit') style="display: none;" #end 44 -%) 45 -{{html clean=false}} 46 -{{code language="text"}} 36 +(% class="showhidecontent" #if($id && $id!="")id="showhidecontent${id}" #end#if($xcontext.action != 'edit') style="display: none;"#end %) 37 +((( 38 +((( 47 47 {{wikimacrocontent /}} 48 - {{/code}}49 - </div> <!-- .showhide-wrapper schließen -->50 - {{/html}}40 +))) 41 +))) 42 +))) 51 51 {{/velocity}} 52 - - Macro description
-
... ... @@ -1,1 +1,1 @@ 1 - Makrofür PublicAPI-Commands1 +Show/hide content with animations.
- XWiki.WikiMacroParameterClass[3]
-
- Parameter default value
-
... ... @@ -1,0 +1,1 @@ 1 +slide - Parameter description
-
... ... @@ -1,0 +1,1 @@ 1 +Scriptaculous Effect - Parameter mandatory
-
... ... @@ -1,0 +1,1 @@ 1 +No - Parameter name
-
... ... @@ -1,0 +1,1 @@ 1 +effect
- XWiki.WikiMacroParameterClass[5]
-
- Parameter default value
-
... ... @@ -1,0 +1,1 @@ 1 +0 - Parameter description
-
... ... @@ -1,0 +1,1 @@ 1 +Effect duration - Parameter mandatory
-
... ... @@ -1,0 +1,1 @@ 1 +No - Parameter name
-
... ... @@ -1,0 +1,1 @@ 1 +effectduration