Zum Inhalt springen

Wiki-Quellcode von Theme Sheet

Zuletzt geändert von Daniel Herrmann am 2025/11/08 02:46
Verstecke letzte Bearbeiter
admin 1.1 1 {{velocity}}
2 ############################
3 ## JS, CSS AND TRANSLATIONS TO USE
4 ############################
5 #set($discard = $xwiki.jsx.use('FlamingoThemesCode.ThemeSheet'))
6 #set($discard = $xwiki.ssx.use('FlamingoThemesCode.ThemeSheet'))
7 ############################
8 ## GLOBALS
9 ############################
10 #set($obj = $doc.getObject('FlamingoThemesCode.ThemeClass'))
11 #set($isEdit = ($xcontext.action == 'edit'))
12 ############################
13 ## VARIABLES TO CUSTOMIZE
14 ############################
15 #set($variables = {
16 "logos": {
Daniel Herrmann 2.1 17 "logo": "image",
18 "logo-description": "text"
admin 1.1 19 },
20 "base-colors": {
21 "text-color": "color",
22 "body-bg": "color",
23 "xwiki-page-content-bg" : "color",
24 "link-color": "color",
25 "brand-primary": "color",
26 "brand-success": "color",
27 "brand-info": "color",
28 "brand-warning": "color",
29 "brand-danger": "color",
30 "headings-color": "color",
31 "component-active-color" : "color",
32 "component-active-bg" : "color"
33 },
34 "typography" : {
35 "font-family-base": "font",
36 "font-family-sans-serif": "font",
37 "font-family-serif": "font",
38 "font-family-monospace": "font",
39 "font-size-base" : "size"
40 },
41 "tables" : {
42 "table-bg": "color",
43 "table-bg-hover": "color",
44 "table-border-color": "color"
45 },
46 "buttons": {
47 "btn-font-weight" : "fontWeight",
48 "btn-default-color" : "color",
49 "btn-default-bg" : "color",
50 "btn-primary-color" : "color",
51 "btn-primary-bg" : "color",
52 "btn-success-color" : "color",
53 "btn-success-bg" : "color",
54 "btn-info-color" : "color",
55 "btn-info-bg" : "color",
56 "btn-warning-color" : "color",
57 "btn-warning-bg" : "color",
58 "btn-danger-color" : "color",
59 "btn-danger-bg" : "color",
60 "btn-default-border" : "color"
61 },
62 "navbar": {
63 "navbar-default-color" : "color",
64 "navbar-default-bg" : "color",
65 "navbar-default-link-color" : "color",
66 "navbar-default-link-hover-color" : "color",
67 "navbar-default-link-hover-bg" : "color",
68 "navbar-default-link-active-color": "color",
69 "navbar-default-link-active-bg": "color",
70 "navbar-height" : "size"
71 },
72 "dropdowns" : {
73 "dropdown-bg" : "color",
74 "dropdown-border" : "color",
75 "dropdown-link-color" : "color",
76 "dropdown-link-hover-color" : "color",
77 "dropdown-link-hover-bg" : "color",
78 "dropdown-divider-bg" : "color"
79 },
80 "forms": {
81 "input-bg" : "color",
82 "input-border" : "color",
83 "input-color" : "color",
84 "input-border-focus" : "color",
85 "input-color-placeholder" : "color",
86 "legend-color" : "color",
87 "legend-border-color": "color"
88 },
89 "panels": {
90 "panel-bg" : "color",
91 "panel-header-text" : "color"
92 },
93 "breadcrumb": {
94 "breadcrumb-bg": "color",
95 "breadcrumb-color": "color",
96 "breadcrumb-link-color": "color",
97 "breadcrumb-separator": "escapedText"
98 },
99 "advanced": {
100 "lessCode": "textarea"
101 }
102 })
103 ############################
104 ## DISPLAY VARIABLES PANEL
105 ############################
106 #macro(displayVariablesPanel)
107 <div class="col-xs-12 col-md-5">
108 <div class="panel panel-primary" id="panel-theme-variables">
109 <div class="panel-heading">$services.localization.render("platform.flamingo.themes.title.variables")</div>
110 <div class="panel-body">
111 #displayVariablesTabs()
112 #displayVariablesPanes()
113 </div>
114 </div>
115 </div>
116 #end
117 ############################
118 ## DISPLAY VARIABLES TABS
119 ############################
120 #macro(displayVariablesTabs)
121 <ul class="nav nav-pills nav-stacked col-xs-4">
122 #foreach($category in $variables.keySet())
123 <li#if($foreach.count==1) class="active"#end><a href="#cat-${category}" data-toggle="tab">$services.localization.render("platform.flamingo.themes.category.${category}")</a></li>
124 #end
125 </ul>
126 #end
127 ############################
128 ## FIELD TEXTAREA
129 ############################
130 #macro(fieldTextarea $varName $obj)
131 #if($varName == 'lessCode')
132 <div class="alert alert-info">$services.localization.render("platform.flamingo.themes.lessCode.description")</div>
133 #end
134 <textarea id="var-$varName" name="FlamingoThemesCode.ThemeClass_0_$varName" class="form-control" rows="6">
135 $!escapetool.xml($!doc.getValue($varName, $obj))
136 </textarea>
137 #end
138 ############################
139 ## FIELD IMAGE
140 ############################
141 #macro(fieldImage $varName $obj)
142 <div id="var-$varName" class="type-image">
143 {{/html}}
144
145 {{attachmentSelector classname="FlamingoThemesCode.ThemeClass" property="$varName" savemode="form" displayImage="true" width="120" filter="png,jpg,gif,svg" defaultValue=""/}}
146
147 {{html clean="false"}}
148 </div>
149 #end
150 ############################
151 ## FIELD TEXT
152 ############################
153 #macro(fieldText $varName $obj)
154 <div class="input-group">
155 <input type="text" class="form-control type-text" id="var-$varName" name="FlamingoThemesCode.ThemeClass_0_$varName" value="$!escapetool.xml($!doc.getValue($varName, $obj))">
156 </div>
157 #end
158 ############################
159 ## FIELD SIZE
160 ############################
161 #macro(fieldSize $varName $obj)
162 <div class="input-group">
163 <input type="text" class="form-control type-size" id="var-$varName" name="FlamingoThemesCode.ThemeClass_0_$varName" value="$!escapetool.xml($!doc.getValue($varName, $obj))">
164 </div>
165 #end
166 ############################
167 ## FIELD COLOR
168 ############################
169 #macro(fieldColor $varName $obj)
170 #set ($colorPickerParams = {
171 'id': "var-$varName",
172 'name': "FlamingoThemesCode.ThemeClass_0_$varName",
173 'value': $doc.getValue($varName, $obj)
174 })
175 #colorPicker($colorPickerParams)
176 #end
177 ############################
178 ## FIELD FONT WEIGHT
179 ############################
180 #macro(fieldFontWeight $varName $obj)
181 <select name="FlamingoThemesCode.ThemeClass_0_$varName" id="var-$varName" class="type-fontweight">
182 #set ($value = $doc.getValue($varName, $obj))
183 #set ($options = ['normal', 'bold', 'bolder', 'lighter'])
184 #foreach ($option in $options)
185 <option value="$option" #if("$!value" == $option)selected="selected"#end>$option</option>
186 #end
187 </select>
188 #end
189 ############################
190 ## DISPLAY VARIABLES PANES
191 ############################
192 #macro(displayVariablesPanes)
193 <div class="tab-content col-xs-8" id="bt-variables">
194 #foreach($category in $variables.keySet())
195 <div class="tab-pane fade #if($foreach.count==1)in active#end" id="cat-$category">
196 <h2>$services.localization.render("platform.flamingo.themes.category.${category}")</h2>
197 #set($catVar = $variables.get($category))
198 #foreach($var in $catVar.keySet())
199 #set($varName = $var)
200 #set($varType = $catVar.get($varName))
Daniel Herrmann 2.1 201 #set($hintKey = "${obj.xWikiClass.name}_${varName}_hint")
202 #set($hint = $services.localization.render($hintKey))
203 #if($hint == $hintKey)
204 #set($hint = $NULL)
205 #end
admin 1.1 206 <div class="form-group">
207 <label for="var-$varName" class="col-xs-12">@$varName</label>
Daniel Herrmann 2.1 208 #if ($hint)
209 <span class="col-xs-12 xHint">$escapetool.xml($hint)</span>
210 #end
admin 1.1 211 <div class="col-xs-12">
212 #if($varType == 'image')
213 #fieldImage($varName, $obj)
214 #elseif($varType == 'textarea')
215 #fieldTextarea($varName, $obj)
216 #elseif($varType == 'size')
217 #fieldSize($varName, $obj)
218 #elseif($varType == 'color')
219 #fieldColor($varName, $obj)
220 #elseif($varType == 'fontWeight')
221 #fieldFontWeight($varName, $obj)
222 #else
223 #fieldText($varName, $obj)
224 #end
225 </div>
226 </div>
227 #end
228 </div>
229 #end
230 </div>
231 #end
232 ############################
233 ## DISPLAY VARIABLES PANEL
234 ############################
235 #macro(displayPreviewPanel)
236 <div class="col-xs-12 #if($isEdit)col-md-7#end">
237 <div class="panel panel-primary">
238 <div class="panel-heading">$services.localization.render("platform.flamingo.themes.title.preview")</div>
239 <div class="panel-body">
240 #if ($isEdit)
241 <p>
242 <input type="checkbox" id="autosync" checked="checked"/>
243 <label for="autosync">$services.localization.render("platform.flamingo.themes.autorefresh")</label>
244 </p>
245 #end
246 <p class="alert alert-info">
247 ## We disable the refresh button initially until the JavaScript code that handles the refresh is ready.
248 <input type="button" id="refresh" class="btn btn-primary" disabled="disabled"
249 value="$services.localization.render('platform.flamingo.themes.refresh')" />
250 $services.localization.render('platform.flamingo.themes.refreshwarning')
251 </p>
252 <div id="preview-curtain">
253 <h2>$escapetool.xml($services.localization.render('platform.flamingo.themes.loading'))</h2>
254 </div>
255 </div>
256 </div>
257 </div>
258 #end
259 ############################
260 ## DISPLAY HIDDEN VARIABLES
261 ############################
262 #macro(displayHiddenVariables)
263 <div id="bt-variables" class="hidden">
264 #foreach($category in $variables.keySet())
265 #set($catVar = $variables.get($category))
266 #foreach($var in $catVar.keySet())
267 #set($varName = $var)
268 #set($varType = $catVar.get($varName))
269 #if ($varType == 'textarea')
270 <textarea id="var-$varName" name="FlamingoThemesCode.ThemeClass_0_$varName" class="type-${varType}">
271 $!escapetool.xml($doc.getValue($varName, $obj))
272 </textarea>
273 #else
274 <input type="hidden" id="var-$varName" name="FlamingoThemesCode.ThemeClass_0_$varName" value="$!escapetool.xml($doc.getValue($varName, $obj))" class="type-${varType}"/>
275 #end
276 #end
277 #end
278 </div>
279 #end
280 ############################
281 ## MAIN
282 ############################
283 {{html clean="false"}}
284 <div class="row">
285 #if($isEdit)
286 #displayVariablesPanel()
287 #else
288 #displayHiddenVariables()
289 #end
290 #displayPreviewPanel()
291 ## Special data for computing URLs
292 <span class="hidden" id="attachmentsURL" data-value="$xwiki.getAttachmentURL($doc.fullName, '__tochange__')"></span>
293 </div>
294 {{/html}}
295 {{/velocity}}
296