Difference between revisions of "Template:Segmented control"

From Co-Optitude Wiki
Jump to navigation Jump to search
Line 4: Line 4:
 
{{SegmentedControl
 
{{SegmentedControl
 
   |Title;Wiki page name
 
   |Title;Wiki page name
   |Image.png;Title;Wiki page name
+
   |[Image.png]Title;Wiki page name
   |Selected title;
+
   |Selected title
 
   |etc}}
 
   |etc}}
 
</pre>
 
</pre>
Line 12: Line 12:
 
{{#vardefine:segmentCount|0}}{{#vardefine:i|1}}{{#while:|{{#if:{{{{{#var:i}}|}}}|true}}|<nowiki/>{{#vardefine:segmentCount|{{#expr:{{#var:segmentCount}}+1}}}}{{#vardefine:i|{{#expr:{{#var:i}}+1}}}}}}
 
{{#vardefine:segmentCount|0}}{{#vardefine:i|1}}{{#while:|{{#if:{{{{{#var:i}}|}}}|true}}|<nowiki/>{{#vardefine:segmentCount|{{#expr:{{#var:segmentCount}}+1}}}}{{#vardefine:i|{{#expr:{{#var:i}}+1}}}}}}
 
* Segment count: {{#var:segmentCount}}
 
* Segment count: {{#var:segmentCount}}
{{#vardefine:i|1}}{{#while:
+
<div class="rsToggleContainer">
|{{#if:{{{{{#var:i}}|}}}|true}}
+
{{#vardefine:i|1}}{{#while:|{{#ifexpr:{{#var:i}}<={{#var:segmentCount}}|true}}
 
| <nowiki />
 
| <nowiki />
* {{{{{#var:i}}|}}}
+
{{#vardefine:orderClass|rsSegmentMiddle}}
{{#vardefine:i|{{#expr:{{#var:i}}+1}} }} }}
+
{{#ifexpr:{{#var:i}}=1|{{#vardefine:orderClass|rsSegmentFirst}}}}
 +
{{#ifexpr:{{#var:i}}={{#var:segmentCount}}|{{#vardefine:orderClass|rsSegmentLast}}}}
 +
{{#vardefine:segment|{{{{{#var:i}}|}}} }}
 +
{{#vardefine:imageAndTitle|{{#explode:{{#var:segment}}|;|0}}}}
 +
{{#vardefine:segmentLink|{{#explode:{{#var:segment}}|;|1}}}}
 +
* {{#var:imageAndTitle}} = {{#var:segmentLink}}
  
<div class="rsToggleContainer">
+
<div class="rsSegment rsSegmentFirst rsSegmentSelected">
<div class="rsSegment rsSegmentFirst rsSegmentSelected">
+
<div class="rsSegmentFill">
<div class="rsSegmentFill">
+
<span class="rsSegmentTitle">{{#var:imageAndTitle}}</span>
<span class="rsSegmentTitle">Tabular</span>
+
</div>
</div>
+
</div>
</div><div class="rsSegment rsSegmentMiddle">
+
{{#vardefine:i|{{#expr:{{#var:i}}+1}} }}
<a href="#"><div class="rsSegmentFill">
+
}}
<span class="rsSegmentTitle">Another</span>
 
</div></a>
 
</div><div class="rsSegment rsSegmentLast">
 
<a href="#"><div class="rsSegmentFill">
 
<span class="rsSegmentTitle">Thumbnails</span>
 
</div></a>
 
</div>
 
 
</div>
 
</div>
 
</includeonly>
 
</includeonly>

Revision as of 17:56, 28 March 2020

Usage example:

{{SegmentedControl
  |Title;Wiki page name
  |[Image.png]Title;Wiki page name
  |Selected title
  |etc}}