commons_bulma.html
1 <#-- WARNING : be careful to white-space and lines break in FreeMarker macros.
2 # This macro template can be used to output white-space-sensitive formats (like RSS files).
3 # See http://dev.lutece.paris.fr/jira/browse/LUTECE-765
4 -->
5 <#-- Do not remove this comment -->
6 <#-- Information about this commons file -->
7 <#macro commonsFile>commons_bulma.html</#macro>
8 <#macro commonsName>Commons Bulma 0.7.2</#macro>
9 <#macro commonsDescription>Freemarker Commons macros powered by Bulma CSS Framework v0.7.2</#macro>
10 <#macro coreAdminCSSLinks>
11 <link href="css/admin/style/bulma/lutecebulma.css" rel="stylesheet">
12 <link href="css/admin/style/bulma/bulma-badge.min.css" rel="stylesheet">
13 <link href="css/admin/style/bulma/bulma-switch.min.css" rel="stylesheet">
14 <link href="css/admin/style/bulma/bulma-tooltip.min.css" rel="stylesheet">
15 <link href="css/admin/style/bulma/bulma-accordion.min.css" rel="stylesheet">
16 <link href="css/admin/style/bulma/bulma-timeline.min.css" rel="stylesheet">
17 <link href="css/admin/jquery-ui.min.css" rel="stylesheet">
18 <link href="css/admin/jquery-ui.structure.min.css" rel="stylesheet">
19 <link href="css/admin/jquery-ui.theme.min.css" rel="stylesheet">
20 <link href="css/admin/tabler-icons.min.css" rel="stylesheet"> <!-- Tabler Icons -->
21 <link href="css/admin/bootstrap-icons.css" rel="stylesheet" <!-- Bootstrap Icons -->
22 <link href="js/admin/lib/toastr/toastr.min.css" rel="stylesheet">
23 <link href="js/admin/lib/polipop/css/polipop.core.min.css" rel="stylesheet">
24 <link href="js/admin/lib/polipop/css/polipop.core.min.css" rel="stylesheet">
25 <link href="css/admin/style/tabler/bootstrap-colorpicker.min.css" rel="stylesheet"><!-- BS colorpicker -->
26 <link href="css/admin/style/bulma/all.min.css" rel="stylesheet"> <!-- Font-Awesome 5.8.1 -->
27 <link href="css/admin/style/bulma/portal_admin.css" rel="stylesheet" >
28 <link href="css/admin/portal_admin_site.css" rel="stylesheet"><!-- Site override admin CSS -Empty by default- -->
29 </#macro>
30 <#macro coreAdminJSLinks>
31 <script src="js/admin/jquery/jquery-ui.min.js"></script>
32 <script src="js/admin/lib/polipop/polipop.min.js"></script>
33 <script src="js/admin/lib/toastr/toastr.min.js"></script>
34 <script src="js/admin/style/bulma/bulma-accordion.min.js"></script>
35 <script src="js/admin/style/bulma/bootstrap-colorpicker.js"></script>
36 <script src="js/util/progress-manager.js"></script>
37 <script src="js/admin/style/bulma/admin.js"></script>
38 </#macro>
39 <#assign propagateAddons = false>
40 <#global gClassActive='is-active' />
41 <#macro sort jsp_url attribute id="" >
42 <#if jsp_url?contains("?")>
43 <#assign sort_url = jsp_url + "&sorted_attribute_name=" + attribute + "&asc_sort=" />
44 <#else>
45 <#assign sort_url = jsp_url + "?sorted_attribute_name=" + attribute + "&asc_sort=" />
46 </#if>
47 <div class="field is-grouped is-pulled-right" role="group" aria-label="sortButton">
48 <a class="button is-default is-small" id="sort${id!}_${attribute!}" href="${sort_url}true#sort${id!}_${attribute!}" title="#i18n{portal.util.sort.asc}" >
49 <span class="icon"><i class="fa fa-chevron-up"></i></span>
50 </a>
51 <a class="button is-default is-small" href="${sort_url}false#sort${id!}_${attribute!}" title="#i18n{portal.util.sort.desc}">
52 <span class="icon"><i class="fa fa-chevron-down"></i></span>
53 </a>
54 </div>
55 </#macro>
56 <#macro paginationAdmin paginator combo=0 form=1 nb_items_per_page=nb_items_per_page showcount=1 showall=0>
57 <nav class="pagination is-right" role="navigation" aria-label="pagination">
58 <#if form == 1 ><form method="post" action="" style="order:2"><#else><div style="position: relative; left: -9999999px">/</div></#if>
59 <@paginationItemCount paginator=paginator combo=combo nb_items_per_page=nb_items_per_page showcount=showcount showall=showall/>
60 <#if form == 1 ></form></#if>
61 <#if (paginator.pagesCount > 1) >
62 <@paginationPageLinks paginator=paginator />
63 <#else>
64 <#if form == 1 ><div style="position: relative; left: -9999999px">/</div></#if>
65 </#if>
66 </nav>
67 </#macro>
68 <#macro pagination paginator >
69 <#assign nbLinkPagesToDisplay = 10 />
70 <#assign offsetPrev = nbLinkPagesToDisplay / 2 />
71 <#assign offsetNext = nbLinkPagesToDisplay / 2 />
72 <#if ( paginator.pageCurrent <= nbLinkPagesToDisplay - offsetPrev )>
73 <#assign offsetPrev = paginator.pageCurrent - 1 />
74 <#assign offsetNext = nbLinkPagesToDisplay - offsetPrev />
75 <#elseif ( paginator.pageCurrent + offsetNext > paginator.pagesCount )>
76 <#assign offsetNext = paginator.pagesCount - paginator.pageCurrent />
77 <#assign offsetPrev = nbLinkPagesToDisplay - offsetNext />
78 </#if>
79 <#if ( paginator.pagesCount > 1 )>
80 <#if ( paginator.pageCurrent - offsetPrev > 1 )>
81 <a href="${paginator.firstPageLink?xhtml}">
82 <span class="icon"><i class="fa fa-angle-double-left"></i></span> #i18n{portal.util.labelFirst}
83 </a>
84 </#if>
85 <#if ( paginator.pageCurrent > 1 )>
86 <a href="${paginator.previousPageLink?xhtml}">
87 <span class="icon"><i class="fa fa-angle-left"></i></span> #i18n{portal.util.labelPrevious}
88 </a>
89 <#else>
90
91 </#if>
92 <#if ( paginator.pageCurrent - offsetPrev > 1 )>
93 <strong>...</strong>
94 </#if>
95 <#list paginator.pagesLinks as link>
96 <#if link.index == paginator.pageCurrent>
97 <strong>${link.name}</strong>
98 <#else>
99 <a href="${link.url?xhtml}">${link.name}</a>
100 </#if>
101 </#list>
102 <#if ( paginator.pageCurrent + offsetNext < paginator.pagesCount )>
103 <strong>...</strong>
104 </#if>
105 <#if ( paginator.pageCurrent < paginator.pagesCount )>
106 <a href="${paginator.nextPageLink?xhtml}">
107 <span class="icon"><i class="fa fa-angle-right"></i></span> #i18n{portal.util.labelNext}
108 </a>
109 <#if ( paginator.pageCurrent + offsetNext < paginator.pagesCount )>
110 <a href="${paginator.lastPageLink?xhtml}">
111 <span class="icon"><i class="fa fa-angle-double-right"></i></span> #i18n{portal.util.labelLast}
112 </a>
113 </#if>
114 <#else>
115
116 </#if>
117 </#if>
118 </#macro>
119 <#macro paginationPageLinks paginator >
120 <#assign nbLinkPagesToDisplay = 10 />
121 <#assign offsetPrev = nbLinkPagesToDisplay / 2 />
122 <#assign offsetNext = nbLinkPagesToDisplay / 2 />
123 <#if ( paginator.pageCurrent <= nbLinkPagesToDisplay - offsetPrev )>
124 <#assign offsetPrev = paginator.pageCurrent - 1 />
125 <#assign offsetNext = nbLinkPagesToDisplay - offsetPrev />
126 <#elseif ( paginator.pageCurrent + offsetNext > paginator.pagesCount )>
127 <#assign offsetNext = paginator.pagesCount - paginator.pageCurrent />
128 <#assign offsetPrev = nbLinkPagesToDisplay - offsetNext />
129 </#if>
130 <ul class="pagination-list">
131 <#if ( paginator.pageCurrent - offsetPrev > 1 )>
132 <li>
133 <a href="${paginator.firstPageLink?xhtml}">
134 ${paginator.labelFirst}
135 </a>
136 </li>
137 </#if>
138 <#if (paginator.pageCurrent > 1) >
139 <li class="previous">
140 <a href="${paginator.previousPageLink?xhtml}">
141 ${paginator.labelPrevious}
142 </a>
143 </li>
144 <#else>
145 <li class="disabled">
146 <a href="${paginator.firstPageLink?xhtml}">${paginator.labelPrevious}</a>
147 </li>
148 </#if>
149 <#if ( paginator.pageCurrent - offsetPrev > 1 )>
150 <li>
151 <a href="${(paginator.pagesLinks?first).url?xhtml}"><strong>...</strong></a>
152 </li>
153 </#if>
154 <#list paginator.pagesLinks as pageLink>
155 <#if ( pageLink.index == paginator.pageCurrent )>
156 <li class="active">
157 <@link href='${pageLink.url?xhtml}'>${pageLink.name}</@link>
158 </li>
159 <#else>
160 <li>
161 <@link href='${pageLink.url?xhtml}'>${pageLink.name}</@link>
162 </li>
163 </#if>
164 </#list>
165 <#if ( paginator.pageCurrent + offsetNext < paginator.pagesCount )>
166 <li>
167 <a href="${(paginator.pagesLinks?last).url?xhtml}"><strong>...</strong></a>
168 </li>
169 </#if>
170 <#if (paginator.pageCurrent < paginator.pagesCount) >
171 <li class="next">
172 <a href="${paginator.nextPageLink?xhtml}">
173 ${paginator.labelNext}
174 </a>
175 </li>
176 <#if ( paginator.pageCurrent + offsetNext < paginator.pagesCount )>
177 <li class="next">
178 <a href="${paginator.lastPageLink?xhtml}">
179 ${paginator.labelLast}
180 </a>
181 </li>
182 </#if>
183 <#else>
184 <li class="disabled">
185 <a href="${paginator.lastPageLink?xhtml}">${paginator.labelNext}</a>
186 </li>
187 </#if>
188 </ul>
189 </#macro>
190 <#macro paginationCombo paginator nb_items_per_page=nb_items_per_page showall=0>
191 <div class="column is-flex-grow-2">
192 <label class="is-sr-only" for="${paginator.itemsPerPageParameterName}">${paginator.labelItemCountPerPage}</label>
193 <div class="field has-addons">
194 <div class="control is-expanded">
195 <div class="select is-small is-fullwidth">
196 <select data-max-item="${paginator.itemsCount}" name="${paginator.itemsPerPageParameterName}" id="${paginator.itemsPerPageParameterName}" title="${paginator.labelItemCountPerPage}">
197 <#list [ "10" , "20" , "50" , "100" ] as nb>
198 <#if nb_items_per_page = nb >
199 <option selected="selected" value="${nb}">${nb}</option>
200 <#else>
201 <option value="${nb}">${nb}</option>
202 </#if>
203 </#list>
204 <#if showall ==1>
205 <#if paginator.itemsCount > 100 >
206 <option <#if nb_items_per_page?number = paginator.itemsCount?number >selected="selected"</#if> value="${paginator.itemsCount}" class="${nb_items_per_page}">#i18n{portal.util.labelAll}</option>
207 </#if>
208 </#if>
209 </select>
210 </div>
211 </div>
212 <div class="control">
213 <button class="button is-default is-small" type="submit" title="#i18n{portal.util.labelRefresh}">
214 #i18n{portal.util.labelRefresh}
215 </button>
216 </div>
217 </div>
218 </div>
219 </#macro>
220 <#macro paginationItemCount paginator combo=0 nb_items_per_page=nb_items_per_page showcount=1 showall=0>
221 <div class="columns">
222 <#-- Display combo -->
223 <#if combo == 1 >
224 <@paginationCombo paginator=paginator nb_items_per_page=nb_items_per_page showall=showall />
225 </#if>
226 <#-- Display item count -->
227 <#if showcount == 1 >
228 <div class="column is-narrow">
229 <#if (paginator.labelItemCount)?? && paginator.labelItemCount?has_content>${paginator.labelItemCount} : </#if> ${paginator.itemsCount}
230 </div>
231 </div>
232 </#if>
233 </#macro>
234 <#-- NAVIGATION -->
235 <#macro item_navigation item_navigator id='item-navigator' align='' hideButtonTitle=[] buttonColor='seacondary card-header-icon' buttonSize='sm'>
236 <#local class = alignmentSettings(align) />
237 <nav id="${id}" class="level ${class}">
238 <div class="level-right">
239 <#if (item_navigator.currentItemId > 0)>
240 <@aButton href='${item_navigator.previousPageLink?xhtml}' title='#i18n{portal.util.labelPrevious}' buttonIcon='arrow-left' color='${buttonColor}' hideTitle=hideButtonTitle size='${buttonSize}' />
241 </#if>
242 <#if (item_navigator.currentItemId < item_navigator.listItemSize - 1) >
243 <@aButton href='${item_navigator.nextPageLink?xhtml}' title='#i18n{portal.util.labelNext}' buttonIcon='arrow-right' color='${buttonColor}' hideTitle=hideButtonTitle size='${buttonSize}' />
244 </#if>
245 </div>
246 </nav>
247 </#macro>
248 <#macro actionButtons button1Name='' button2Name='' i18nValue1Key='portal.admin.message.buttonValidate' i18nValue2Key='portal.admin.message.buttonCancel' url1='' url2='' icon1='save' icon2='times' offset=3 >
249 <@formGroup>
250 <#if url1 != ''>
251 <@aButton href='${url1}' class='button is-primary' buttonIcon=icon1 title='#i18n{${i18nValue1Key}}' />
252 <#else>
253 <@button type='submit' name=button1Name buttonIcon=icon1 title='#i18n{${i18nValue1Key}}' />
254 </#if>
255 <#if url2 != ''>
256 <@aButton href=url2 class='button is-default' buttonIcon=icon2 title='#i18n{${i18nValue2Key}}' />
257 <#else>
258 <#if button2Name != ''>
259 <@button type='submit' name=button2Name class='button is-default' buttonIcon=icon2 title='#i18n{${i18nValue2Key}}' />
260 </#if>
261 </#if>
262 </@formGroup>
263 </#macro>
264 <#macro messages errors=[] infos=[] warnings=[] errors_class="alert alert-danger" infos_class="alert alert-info" warnings_class="alert alert-warning">
265 <#if errors??>
266 <#if errors?size > 0 >
267 <div class="notification is-danger" id="messages_errors_div">
268 <button class="delete"></button>
269 <#list errors as error >
270 <span class="icon"><i class="fa fa-exclamation-circle"></i></span> ${error.message} <br>
271 </#list>
272 </div>
273 </#if>
274 </#if>
275 <#if infos??>
276 <#if infos?size > 0 >
277 <div class="notification is-info" id="messages_infos_div" >
278 <button class="delete"></button>
279 <#list infos as info >
280 <span class="icon"><i class="fa fa-info-circle"></i></span> ${info.message} <br>
281 </#list>
282 </div>
283 </#if>
284 </#if>
285 <#if warnings??>
286 <#if warnings?size > 0 >
287 <div class="${warnings_class}" id="messages_warnings_div" >
288 <a class="delete" data-dismiss="alert" href="#">x</a>
289 <#list warnings as warning >
290 <span class="icon"><i class="fa fa-info-circle"></i></span> ${warning.message} <br>
291 </#list>
292 </div>
293 </#if>
294 </#if>
295 </#macro>
296 <#---------------------------NEW MACROS------------------------------>
297 <#-- TABLE -->
298 <#-- class: -->
299 <#macro table id='' class='is-fullwidth' responsive=true condensed=true hover=true striped=false headBody=true bordered=false collapsed=false caption='' params='' deprecated...>
300 <@deprecatedWarning args=deprecated />
301 <#local class = class />
302 <#if condensed> <#local class += ' is-narrow' /> </#if>
303 <#if hover> <#local class += ' is-hoverable' /> </#if>
304 <#if striped> <#local class += ' is-striped' /> </#if>
305 <#if bordered> <#local class += ' is-bordered' /> </#if>
306 <#if collapsed> <#local class += ' collapse' /> </#if>
307 <#if responsive><div class="table-container"></#if>
308 <table class="table ${class?trim}" <#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
309 <#if caption!=''><caption>${caption}</caption></#if>
310 <#if headBody><thead></#if>
311 <#nested>
312 <#if headBody></tbody></#if>
313 </table>
314 <#if responsive></div></#if>
315 </#macro>
316 <#macro tableHead id='' class='' params=''>
317 <thead<#if id!=''> id="${id}"</#if><#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if>>
318 <#nested>
319 </thead>
320 </#macro>
321 <#macro tableBody id='' class='' params=''>
322 <tbody<#if id!=''> id="${id}"</#if><#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if>>
323 <#nested>
324 </tbody>
325 </#macro>
326 <#macro tableFoot id='' class='' params=''>
327 <tfoot <#if id!=''> id="${id}"</#if><#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if>>
328 <#nested>
329 </tfoot>
330 </#macro>
331 <#macro tableHeadBodySeparator id='' class='' params=''>
332 </thead>
333 <tbody<#if id!=''> id="${id}"</#if><#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if>>
334 </#macro>
335 <#-- MACRO TR -->
336 <#macro tr id='' class='' hide=[] params=''>
337 <#local class += ' ' + displaySettings(hide,'is-inline') + ' ' + alignmentSettings(align) />
338 <tr<#if id!=''> id="${id}"</#if><#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if>>
339 <#nested>
340 </tr>
341 </#macro>
342 <#-- MACRO TH -->
343 <#-- valign: baseline|top|middle|bottom|bottom|text-top -->
344 <#macro th id='' title='' scope='' class='' align='' valign='' hide=[] cols=0 xs=0 sm=0 md=0 lg=0 xl=0 colspan=0 rowspan=0 flex=false params=''>
345 <#local class += ' ' + displaySettings(hide,'is-inline') + ' ' + alignmentSettings(align) />
346 <#if valign!=''><#local class += ' align-' + valign /></#if>
347 <th<#if id!=''> id="${id}"</#if><#if class?trim!=''> class="${class?trim}"</#if><#if title!=''> title="${title}"</#if><#if scope!=''> scope="${scope}"</#if><#if colspan gt 0> colspan="${colspan}"</#if><#if rowspan gt 0> rowspan="${rowspan}"</#if><#if params!=''> ${params}</#if>>
348 <#nested>
349 </th>
350 </#macro>
351 <#-- MACRO TD -->
352 <#macro td id='' class='' hide=[] align='' valign='' xs=0 sm=0 md=0 lg=0 xl=0 colspan=0 rowspan=0 flex=false params='' deprecated...>
353 <@deprecatedWarning args=deprecated />
354 <#local class += ' ' + displaySettings(hide,'is-inline') + ' ' + alignmentSettings(align) />
355 <#if valign!=''><#local class += ' align-' + valign /></#if>
356 <td class="<#if class?trim != ''>${class?trim}</#if>"<#if id!=''> id="${id}"</#if><#if colspan gt 0> colspan="${colspan}"</#if><#if rowspan gt 0> rowspan="${rowspan}"</#if><#if params!=''> ${params}</#if>>
357 <#if flex><div style="display:flex;"></#if>
358 <#nested>
359 <#if flex></div></#if>
360 </td>
361 </#macro>
362 <#-- ICONS -->
363 <#-- Icons from FontAwesome 5.8.1 -->
364 <#macro icon prefix='fa-' style='fa-lg' class='' title='' id='' params=''>
365 <#if style='docker' || style = 'github' || style='gitlab' || style='java' || style='jira' || style='jenkins' || style = 'twitter' >
366 <#local prefix = 'fab ' + prefix />
367 <#else>
368 <#local prefix = 'fas ' + prefix />
369 </#if>
370 <#switch style>
371 <#case 'arrows'>
372 <#local iconStyle = 'arrows-alt' />
373 <#break>
374 <#case 'arrows-h'>
375 <#local iconStyle = 'arrows-alt-h' />
376 <#break>
377 <#case 'arrows-v'>
378 <#local iconStyle = 'arrows-alt-v' />
379 <#break>
380 <#case 'clock-o'>
381 <#local iconStyle = 'clock' />
382 <#break>
383 <#case 'close'>
384 <#local iconStyle = 'times' />
385 <#break>
386 <#case 'external-link'>
387 <#local iconStyle = 'external-link-alt' />
388 <#break>
389 <#case 'file-pdf-o'>
390 <#local iconStyle = 'file-pdf' />
391 <#break>
392 <#case 'pencil'>
393 <#local iconStyle = 'edit' />
394 <#break>
395 <#case 'refresh'>
396 <#local iconStyle = 'sync' />
397 <#break>
398 <#default>
399 <#local iconStyle = style />
400 </#switch>
401 <i class="${prefix}${iconStyle} fa-fw<#if class!=''> ${class}</#if>" aria-hidden="true"<#if title!=''> title='${title}'</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>></i>
402 </#macro>
403 <#-- ICONSTACK -->
404 <#-- iconStack -->
405 <#-- class: par défaut 2x peut être tout autre taille voir doc FontAwesome -->
406 <#-- nested: 2 macro @icon une class fa-stack-2x , autre avec class fa-stack-1x dans l'ordre -->
407 <#macro iconStack class='fa-2x' id='' params=''>
408 <span class="fa-stack ${class}"<#if id!=''> ${id}</#if><#if params!=''> ${params}</#if>>
409 <#nested>
410 </span>
411 </#macro>
412 <#-- FORM -->
413 <#-- type: inline/horizontal/form -->
414 <#-- enctype: multipart/form-data | text/plain -->
415 <#macro tform type='' class='' align='' hide=[] action='' method='post' name='' id='' role='' collapsed=false enctype='' params='' deprecated...>
416 <@deprecatedWarning args=deprecated />
417 <#local class = class />
418 <#if align!=''><#local class += ' ' + alignmentSettings(align) /></#if>
419 <#if hide??><#local class += ' ' + displaySettings(hide,'block') /></#if>
420 <#if collapsed><#local class += ' collapse' /></#if>
421 <#switch type>
422 <#case 'horizontal'>
423 <#local class += ' is-horizontal'>
424 <#break>
425 <#case 'inline'>
426 <#local class += 'is-flex is-justify-content-flex-start is-align-items-center card-header-icon'>
427 <#break>
428 <#default>
429 <#local class += ''>
430 </#switch>
431 <form class="<#if class!=''>${class?trim}</#if>"<#if id!=''> id="${id}"</#if><#if action!=''> action="${action}"</#if><#if method!=''> method="${method}"</#if><#if name!=''> name="${name}"</#if><#if role!=''> role="${role}"</#if><#if method='post' && enctype!=''> enctype='${enctype}'</#if><#if params!=''> ${params}</#if>>
432 <#nested>
433 </form>
434 </#macro>
435 <#-- FORM ELEMENT STRUCTURE -->
436 <#-- formStyle values: empty/inline/horizontal/navbar-form/navbar-left... Default is horizontal -->
437 <#-- class: is-success/is-danger/is-warning... -->
438 <#-- groupStyle: is-success/is-danger/is-warning... -->
439 <#macro formGroup formStyle='' class='' groupStyle='' rows=1 labelKey='' labelFor='' labelId='' labelClass='' helpKey='' id='' mandatory=false hideLabel=[] collapsed=false params='' deprecated...>
440 <@deprecatedWarning args=deprecated />
441 <#if groupStyle='addons'><#assign propagateAddons = true></#if>
442 <#switch formStyle>
443 <#case 'horizontal'>
444 <#local class += ' is-horizontal'>
445 <#break>
446 <#default>
447 <#local class += ''>
448 </#switch>
449 <#local labelDisplayClass = displaySettings(hideLabel,'') />
450 <#if collapsed><#local class += ' collapse' /></#if>
451 <div class="field<#if class?trim!=''> ${class?trim}</#if><#if groupStyle!=''> has-${groupStyle}</#if>">
452 <#if groupStyle!='addons'><label class="label<#if labelDisplayClass!=''> ${labelDisplayClass}</#if><#if labelClass!=''> ${labelClass}</#if>">${labelKey} <#if mandatory=true>*</#if></label></#if>
453 <#if formStyle='horizontal'>
454 <div class="field-body">
455 <div class="field is-narrow">
456 </#if>
457 <#assign propagateMandatory = mandatory>
458 <#nested>
459 <#assign propagateMandatory = false>
460 <#if formStyle='horizontal'>
461 </div>
462 </div>
463 </#if>
464 <#if helpKey !=''><p class="help pb-2">${helpKey}</p></#if>
465 </div>
466 </#macro>
467 <#macro formField class=''>
468 <div class="control ${class}">
469 <#nested>
470 </div>
471 </#macro>
472 <#macro formLabel class='' labelFor='' labelId='' labelKey='' hideLabel=[] mandatory=true deprecated...>
473 <@deprecatedWarning args=deprecated />
474 <#local class += ' ' + displaySettings(hideLabel,'') />
475 <label class="<#if class !=''>${class?trim}</#if>" for="${labelFor}" <#if labelId!=''> id="${labelId}"</#if><#if mandatory=true>ariaLabel="${labelKey} [#i18n{portal.users.modify_attribute.labelMandatory}]"</#if>>
476 <#if labelKey !=''>${labelKey}<#else><#nested></#if>
477 </label>
478 </#macro>
479 <#macro formHelp style='inline' class='' labelFor=''>
480 <#if style='inline'>
481 <p class="help<#if class!=''> ${class}</#if>" <#if labelFor!=''>id="${labelFor}_help"</#if>><#nested></p>
482 <#else>
483 <span class="help has-tooltip-bottom has-tooltip-multiline" data-bs-toggle="tooltip" data-bs-placement="bottom" data-tooltip="<#nested>">?</span>
484 </#if>
485 </#macro>
486 <#-- ------------------------------------------------------------------------------------------------------------------------------------------ -->
487 <#-- INPUTS & TEXTAREA -->
488 <#-- ------------------------------------------------------------------------------------------------------------------------------------------ -->
489 <#-- name : Mandatory : Name for field -->
490 <#-- type : text/textarea/password/email/file/number/range/color/hidden/tel. Default : text -->
491 <#-- value: '' -->
492 <#-- class: '' -->
493 <#-- id: '' -->
494 <#-- title: '' -->
495 <#-- size: '' -->
496 <#-- inputSize: 0 -->
497 <#-- maxlength: 0 -->
498 <#-- placeHolder: '' -->
499 <#-- rows: 4 Textarea specific -->
500 <#-- cols: 40 Textarea specific -->
501 <#-- pattern: '' [A-F][0-9]{5} -->
502 <#-- tabIndex: '' -->
503 <#-- disabled: false -->
504 <#-- readonly: false -->
505 <#-- min: 0 -->
506 <#-- max: 0 -->
507 <#-- min: 0 -->
508 <#-- params: '' -->
509 <#-- mandatory: false -->
510 <#-- language: for input type DATE and datepickers -->
511 <#-- defaultDate: Format must be "yyyy-MM-dd hh:mm" -->
512 <#-- minDate: Format must be "yyyy-MM-dd hh:mm" -->
513 <#-- maxDate: Format must be "yyyy-MM-dd hh:mm" -->
514 <#-- defaultHour: Format must be "hh" -->
515 <#-- defaultMinute: Format must be "mm" -->
516 <#-- minTime : Format must be "hh:mm" -->
517 <#-- maxTime : Format must be "hh:mm" -->
518 <#-- format='' : Format for DB -->
519 <#-- showFormat='' Format for User -->
520 <#-- dateRangeEndId='' Id for date range date end -->
521 <#-- dateParams : [] https://flatpickr.js.org/options/ for options list | Example : dateParams=[{'inline': 'true'},{'hourIncrement': '4'}] -->
522 <#-- showFileUrl=false -->
523 <#-- fileURL='' -->
524 <#-- fileName='' -->
525 <#-- datalist='' To comma separated list of values Example : datalist='titi,tata' -->
526 <#-- ------------------------------------------------------------------------------------------------------------------------------------------ -->
527 <#macro input name id='' type='text' value='' class='' size='' inputSize=0 maxlength=0 placeHolder='' rows=4 cols=40 richtext=false tabIndex='' disabled=false readonly=false pattern='' title='' min=0 max=0 params='' mandatory=false language=.locale minDate='' maxDate='' defaultDate='' minTime='' maxTime='' defaultTime='' time_24hr=true format='' showFormat='' dateRangeEndId='' dateParams=[] showFileUrl=false fileURL='' fileName='' datalist=''>
528 <#if propagateMandatory?? && propagateMandatory ><#local mandatory = true /></#if>
529 <#switch size>
530 <#case 'xs'>
531 <#assign selectSize='small'>
532 <#break>
533 <#case 'sm'>
534 <#assign selectSize='small'>
535 <#break>
536 <#case 'md'>
537 <#assign selectSize='medium'>
538 <#break>
539 <#case 'lg'>
540 <#assign selectSize='large'>
541 <#break>
542 <#default>
543 <#assign selectSize='normal'>
544 </#switch>
545 <#if type='textarea'>
546 <textarea name="${name}" class="textarea<#if selectSize!=''> is-${selectSize}</#if><#if class!=''> ${class}</#if><#if richtext> richtext</#if>" rows="${rows}" cols="${cols}"<#if tabIndex!=''> tabindex="${tabIndex}"</#if><#if placeHolder!=''> placeholder="${placeHolder}"</#if><#if title!=''> title="${title}"</#if><#if disabled> disabled</#if><#if readonly> readonly</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if><#if pattern!=''>pattern=${pattern}</#if><#if (mandatory && !richtext)> required</#if><#if labelFor?? && labelFor!='' && helpKey?? && helpKey!=''> aria-describedby="${labelFor}_help"</#if>><#if value!='' >${value}<#else><#nested></#if></textarea>
547 <#elseif type='text' || type='search' || type='password' || type='email' || type='number' || type='color' || type='range' || type='tel' || type='datalist'>
548 <#if propagateAddons><div class="control"></#if>
549 <input class="input<#if selectSize!=''> is-${selectSize}</#if><#if type='color'> input-color</#if><#if class!=''> ${class}</#if>" type="${type}" name="${name}" value="${value}"<#if tabIndex!=''> tabindex="${tabIndex}"</#if><#if placeHolder!=''> placeholder="${placeHolder}"</#if><#if title!=''> title="${title}"</#if><#if maxlength > 0> maxlength="${maxlength}"</#if><#if inputSize!=0> size="${inputSize}"</#if><#if disabled> disabled</#if><#if readonly> readonly</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if><#if pattern!=''>pattern=${pattern}</#if><#if min!=max> min="${min}"</#if><#if max!=0> max="${max}"</#if><#if mandatory> required </#if><#if labelFor?? && labelFor!='' && helpkey?? && helpKey!=''> aria-describedby="${labelFor}_help"</#if><#if type='datalist'> list="${name}_list"</#if>>
550 <#if propagateAddons></div></#if>
551 <#if type='datalist'>
552 <#if id !='' && datalist !='' >
553 <datalist id="${name}_list">
554 <#assign options = datalist?split(',')>
555 <#list options as opt>
556 <option value="${opt!}">
557 </#list>
558 </datalist>
559 <#else>
560 <!-- Missing id or params attribute for macro @input for type "datalist" -->
561 </#if>
562 </#if>
563 <#elseif type='file' >
564 <div class="file has-name is-right is-fullwidth<#if selectSize!=''> is-${selectSize}</#if>">
565 <label class="file-label">
566 <input class="file-input<#if selectSize!=''> is-${selectSize}</#if><#if class!=''> ${class}</#if>" type="file" name="${name}"value="${value}"<#if tabIndex!=''> tabindex="${tabIndex}"</#if><#if placeHolder!=''> placeholder="${placeHolder}"</#if><#if title!=''> title="${title}"</#if><#if maxlength > 0> maxlength="${maxlength}"</#if><#if inputSize!=0> size="${inputSize}"</#if><#if disabled> disabled</#if><#if readonly> readonly</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if><#if pattern!=''>pattern=${pattern}</#if><#if min!=max> min="${min}"</#if><#if max!=0> max="${max}"</#if><#if mandatory> required </#if><#if labelFor?? && labelFor!='' && helpkey?? && helpKey!=''> aria-describedby="${labelFor}_help"</#if>>
567 <span class="file-cta">
568 <span class="file-icon">
569 <i class="fas fa-upload"></i>
570 </span>
571 <span class="file-label">#i18n{portal.util.labelDownload}</span>
572 </span>
573 <span class="file-name"></span>
574 </label>
575 </div>
576 <input type="hidden" id=${id}Key name="${name}Key" value="${value}" />
577 <#if showFileUrl && fileURL?? && fileName??>
578 <@link href="${fileURL}">${fileName}</@link>
579 </#if>
580 <#elseif type='date' || type='datetime' || type='daterange' || type='datetimerange' || type='time'>
581 <input class="input<#if size!=''> input-${size}</#if><#if class!=''> ${class}</#if>" type="text" name="${name}" value="${value}"<#if tabIndex!=''> tabindex="${tabIndex}"</#if><#if placeHolder!=''> placeholder="${placeHolder}"</#if><#if title!=''> title="${title}"</#if><#if maxlength > 0> maxlength="${maxlength}"</#if><#if inputSize!=0> size="${inputSize}"</#if><#if disabled> disabled</#if><#if readonly> readonly</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if><#if pattern!=''>pattern=${pattern}</#if><#if min!=max> min="${min}"</#if><#if max!=0> max="${max}"</#if><#if mandatory> required </#if><#if labelFor?? && labelFor!='' && helpkey?? && helpKey!=''> aria-describedby="${labelFor}_help"</#if> />
582 <#if type='date'>
583 <@getDate idField='${id}' language=language format=format showFormat=showFormat minDate=minDate maxDate=maxDate defaultDate=defaultDate dateOptions=dateParams />
584 <#elseif type='datetime'>
585 <@getDateTime idField='${id}' language=language format=format showFormat=showFormat minDate=minDate maxDate=maxDate defaultDate=defaultDate minTime=minTime maxTime=maxTime dateOptions=dateParams />
586 <#elseif type='daterange'>
587 <#if dateRangeEndId != ''>
588 <@getDateRange idField='${id}' idEndField='${dateRangeEndId}' language=language format=format showFormat=showFormat minDate=minDate maxDate=maxDate defaultDate=defaultDate dateOptions=dateParams />
589 <#else>
590 <@alert class='danger'>${i18n("portal.util.datepicker.rangeEndId.mandatory")}</@alert>
591 </#if>
592 <#elseif type='datetimerange'>
593 <#if dateRangeEndId != ''>
594 <@getDateTimeRange idField='${id}' idEndField='${dateRangeEndId}' language=language format=format showFormat=showFormat minDate=minDate maxDate=maxDate defaultDate=defaultDate minTime=minTime maxTime=maxTime dateOptions=dateParams />
595 <#else>
596 <@alert class='danger'>${i18n("portal.util.datepicker.rangeEndId.mandatory")}</@alert>
597 </#if>
598 <#elseif type='time'>
599 <@getTime idField='${id}' language=language format='H:i' showFormat='H:i' minTime=minTime maxTime=maxTime time_24hr=time_24hr defaultDate=defaultDate dateOptions=dateParams />
600 </#if>
601 <#if id=''><@alert class='danger'>${i18n("portal.util.datepicker.id.mandatory")}</@alert></#if>
602 <#elseif type='hidden'>
603 <input type="hidden" name="${name}" <#if id!=''>id="${id}"</#if> value="${value}" />
604 <#else><@icon style='warning' />Type not supported
605 </#if>
606 </#macro>
607 <#-- STATIC TEXT -->
608 <#-- Bootstrap colors: muted/primary/success/info/warning/danger -->
609 <#-- AdminLTE colors: red/yellow/aqua/blue/black/light-blue/green/gray/navy/teal/olive/lime/orange/fuchsia/purple/maroon -->
610 <#macro staticText inForm=true color='' id='' params=''>
611 <p class="<#if inForm>control</#if><#if color!=''> text-${color}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
612 <#nested>
613 </p>
614 </#macro>
615 <#-- CHECKBOX -->
616 <#-- orientation: vertical/inline. Default is vertical -->
617 <#macro checkBox name id='' class='' labelKey='' labelFor='' orientation='vertical' value='' tabIndex='' title='' disabled=false readonly=false checked=false params='' mandatory=false deprecated...>
618 <@deprecatedWarning args=deprecated />
619 <#if id = ''><#local id = name /></#if>
620 <#if orientation!='switch'><label class="checkbox" for="${id}"<#if title!=''> title="${title}"</#if>><#else><div class="field"></#if>
621 <input type="checkbox" class="<#if orientation='switch'>switch is-small</#if><#if class!=''> ${class}</#if>"id="${id}" name="${name}"<#if value!=''> value="${value}"</#if><#if tabIndex!=''> tabindex="${tabIndex}"</#if><#if checked> checked</#if><#if disabled> disabled</#if><#if readonly> readonly</#if><#if params!=''> ${params}</#if><#if mandatory> required</#if> />
622 <label for="${id}"<#if title!=''> title="${title}"</#if>>
623 <#if labelKey!=''>${labelKey}<#else><#nested></#if>
624 </label>
625 <#if orientation='switch'></div></#if>
626 </#macro>
627 <#-- RADIO BUTTON -->
628 <#-- orientation: vertical/inline. Default is vertical -->
629 <#macro radioButton name id='' value='' labelKey='' labelFor='' orientation='inline' tabIndex='' title='' disabled=false readonly=false checked=false params='' mandatory=false >
630 <#if propagateMandatory?? && propagateMandatory ><#local mandatory = true /></#if>
631 <#if labelFor = '' && id != ''><#local labelFor = id /></#if>
632 <#if orientation='inline'><div class="radio"></#if>
633 <label class="<#if orientation!='vertical'>radio<#else></#if>" for="${labelFor}">
634 <input type="radio" id="${id}" name="${name}"<#if value!=''> value="${value}"</#if><#if tabIndex!=''> tabindex="${tabIndex}"</#if><#if checked> checked</#if><#if disabled> disabled</#if><#if readonly> readonly</#if><#if mandatory> required</#if><#if params!=''> ${params}</#if> />
635 <#if labelKey!=''>${labelKey}<#else><#nested></#if>
636 </label>
637 <#if orientation='inline'></div></#if>
638 </#macro>
639 <#--- MACRO SELECT (TO REPLACE "COMBO" MACROS) --->
640 <#macro select name items='' default_value='' id=name class='' size='sm' sort=false multiple=0 params='' title='' tabIndex=0 disabled=false maxLength=0 mandatory=false>
641 <#if propagateMandatory?? && propagateMandatory ><#local mandatory = true /></#if>
642 <#switch size>
643 <#case 'xs'>
644 <#assign selectSize='small'>
645 <#break>
646 <#case 'sm'>
647 <#assign selectSize='small'>
648 <#break>
649 <#case 'md'>
650 <#assign selectSize='medium'>
651 <#break>
652 <#case 'lg'>
653 <#assign selectSize='large'>
654 <#break>
655 <#default>
656 <#assign selectSize='normal'>
657 </#switch>
658 <#if params?contains('addons')><div class="control"></#if>
659 <span class="select<#if selectSize!=''> is-${selectSize}</#if><#if multiple!=0> is-multiple</#if><#if class!=''> ${class}</#if>">
660 <select id="${id}" name="${name}"<#if class!=''> class="${class}"</#if><#if multiple gt 0>multiple rows="${multiple}"</#if><#if (tabIndex > 0)> tabindex="${tabIndex}"</#if><#if params!=''> ${params}</#if><#if title!=''> ${title}</#if><#if mandatory> required</#if><#if disabled> disabled</#if>>
661 <#if items?has_content>
662 <#if sort=true>
663 <#list items?sort_by("name") as item>
664 <#if default_value="${item.code}">
665 <option selected="selected" value="${item.code}" <#if !item.name?has_content>label="${i18n("portal.util.labelEmpty")}"</#if>>${item.name}</option>
666 <#else>
667 <option value="${item.code}" <#if !item.name?has_content>label="${i18n("portal.util.labelEmpty")}"</#if>>${item.name}</option>
668 </#if>
669 </#list>
670 <#else>
671 <#if maxLength gt 0>
672 <#list items as item>
673 <#if maxLength < item.name?length >
674 <#assign item_new = "..." + "${item.name?substring(item.name?length-maxLength+3)}" >
675 <#else>
676 <#assign item_new = "${item.name}">
677 </#if>
678 <#if default_value="${item.code}">
679 <option selected="selected" value="${item.code}" >${item_new}</option>
680 <#else>
681 <option value="${item.code}" >${item_new}</option>
682 </#if>
683 </#list>
684 <#else>
685 <#list items as item>
686 <#if default_value="${item.code}">
687 <option selected="selected" value="${item.code}" <#if !item.name?has_content>label="${i18n("portal.util.labelEmpty")}"</#if>>${item.name}</option>
688 <#else>
689 <option value="${item.code}" <#if !item.name?has_content>label="${i18n("portal.util.labelEmpty")}"</#if>>${item.name}</option>
690 </#if>
691 </#list>
692 </#if>
693 </#if>
694 <#else>
695 <#nested>
696 </#if>
697 </select>
698 </span>
699 <#if params?contains('addons')></div></#if>
700 </#macro>
701 <#--- MACRO OPTIONS --->
702 <#--- items : list with label, value, selected values --->
703 <#macro options items selected='' id=false class='' params=''>
704 <#if items??>
705 <#list items as item>
706 <#local idItem><#if id>${item.code}_${item?index}<#else></#if></#local>
707 <#local selectedItem><#if selected !=''><#if item.code?string=selected>true<#else>false</#if><#else>${item.selected?c}</#if></#local>
708 <@option label=item.name value=item.code id=idItem class=class selected=selectedItem?boolean disabled=item.disabled params=params />
709 </#list>
710 </#if>
711 </#macro>
712 <#macro option label value id='' class='' selected=false disabled=false params=''>
713 <option<#if id!=''>id="${id}</#if><#if class!=''> class="${class}</#if> value="${value!}"<#if selected> selected</#if><#if disabled> disabled</#if><#if params!=''> ${params}</#if>>${label!} <#nested></option>
714 </#macro>
715 <#-- INPUT-GROUP -->
716 <#-- size: ignored -->
717 <#macro inputGroup size='' id='' class='control has-icons-left is-expanded' params=''>
718 <#local localClass><#if propagateAddons><#else>${class}</#if></#local>
719 <#if localClass!=''><div class="${localClass}"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>></#if>
720 <#nested>
721 <#if localClass!=''></div></#if>
722 </#macro>
723 <#macro inputGroupItem pos='is-left' type='btn' id='' params=''>
724 <#-- type: btn/text. default is btn -->
725 <#if type='btn'>
726 <div class="control<#if pos!=''> ${pos}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
727 <#nested>
728 </div>
729 <#else>
730 <span class="icon<#if pos!=''> ${pos}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
731 <#nested>
732 </span>
733 </#if>
734 </#macro>
735 <#-- DROPDOWN MENU -->
736 <#-- class: dropdown-menu-right -->
737 <#-- Expected content : <li><a>Your link here</a></li> -->
738 <#macro dropdownMenu class='' id='' params=' role="menu"'>
739 <div class="dropdown-menu ${class}"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
740 <div class="dropdown-content">
741 <#nested>
742 </div>
743 </div>
744 </#macro>
745 <#-- ROW -->
746 <#macro row class='is-mobile' id='' collapsed=false align='' params=''>
747 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
748 <#if align!=''><#local class+= ' ' + alignmentSettings(align) /></#if>
749 <div class="columns<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
750 <#nested>
751 </div>
752 </#macro>
753 <#-- COLUMNS -->
754 <#-- cols -->
755 <#macro columns tag='div' offset={} offsetXs=0 offsetSm=0 offsetMd=0 offsetLg=0 offsetXl=0 order={} pushXs=0 pushSm=0 pushMd=0 pushLg=0 pushXl=0 pullXs=0 pullSm=0 pullMd=0 pullLg=0 pullXl=0 xs=0 sm=0 md=0 lg=0 xl=0 id='' class='' collapsed=false align='' params=''>
756 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
757 <#if align!=''><#local class+= ' ' + alignmentSettings(align,'') /></#if>
758 <#if xs gt 0 || sm gt 0 || md gt 0 || lg gt 0 || xl gt 0>
759 <#local class += ' ' + responsiveDisplay('col',{'xs':xs, 'sm':sm, 'md':md, 'lg':lg, 'xl':xl}) />
760 </#if>
761 <#if offset?has_content>
762 <#local class += ' ' + responsiveDisplay('offset',offset) />
763 <#elseif offsetXs > 0 || offsetSm > 0 || offsetMd > 0 || offsetLg > 0 || offsetXl > 0>
764 <#local class += ' ' + responsiveDisplay('offset',{'xs':offsetXs, 'sm':offsetSm, 'md':offsetMd, 'lg':offsetLg, 'xl':offsetXl}) />
765 </#if>
766 <#if order?has_content>
767 <#if order?is_number>
768 <#local class += ' order-${order}' />
769 <#elseif order?is_hash>
770 <#local class += ' ' + responsiveDisplay('order',order) />
771 </#if>
772 </#if>
773 <${tag} class="column<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
774 <#nested>
775 </${tag}>
776 </#macro>
777 <#-- LISTS -->
778 <#macro ul id='' class='' align='' hide=[] collapsed=false params=''>
779 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
780 <#if align!=''><#local class+= ' ' + alignmentSettings(align) /></#if>
781 <ul<#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if><#if id!=''> ${id}</#if>>
782 <#nested>
783 </ul>
784 </#macro>
785 <#macro li id='' params='' class=''>
786 <li<#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if><#if id!=''> ${id}</#if>>
787 <#nested>
788 </li>
789 </#macro>
790 <#-- DIV -->
791 <#macro div id='' class='' hide=[] collapsed=false align='' params=''>
792 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
793 <#if align!=''><#local class+= ' ' + alignmentSettings(align) /></#if>
794 <#if hide??><#local class += ' ' + displaySettings(hide,'block') /></#if>
795 <div<#if class?trim!=''> class="${class?trim}"</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
796 <#nested>
797 </div>
798 </#macro>
799 <#-- PARAGRAPH -->
800 <#macro p id='' class='' hide=[] collapsed=false align='' params=''>
801 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
802 <#local class += ' ' + alignmentSettings(align) + ' ' + displaySettings(hide,'is-block') />
803 <p<#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if><#if id!=''> ${id}</#if>>
804 <#nested>
805 </p>
806 </#macro>
807 <#-- SPAN -->
808 <#macro span id='' class='' hide=[] collapsed=false align='' params=''>
809 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
810 <#local class += ' ' + alignmentSettings(align) + ' ' + displaySettings(hide,'is-inline') />
811 <span<#if class?trim!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if><#if id!=''> ${id}</#if>>
812 <#nested>
813 </span>
814 </#macro>
815 <#-- PRE -->
816 <#macro pre id='' class='' hide=[] collapsed=false align='' params=''>
817 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
818 <#local class += ' ' + alignmentSettings(align) + ' ' + displaySettings(hide,'is-block') />
819 <pre<#if class!=''> class="${class?trim}"</#if><#if params!=''> ${params}</#if><#if id!=''> ${id}</#if>>
820 <#nested>
821 </pre>
822 </#macro>
823 <#-- TABS -->
824 <#-- TAB -->
825 <#-- style: tabs/tabs nav-justified/pills/pills nav-stacked/pills nav-justified -->
826 <#macro tabs color='' style='tabs' class='' hide=[] collapsed=false id='' params=''>
827 <#if hide??><#local class += ' ' + displaySettings(hide,'block') /></#if>
828 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
829 <#assign propagateTabStyle = style />
830 <#if hide?? || collapsed><div class="${class?trim}"></#if>
831 <#nested>
832 <#if hide?? || collapsed></div></#if>
833 </#macro>
834 <#-- Tabs List -->
835 <#-- type is deprecated -->
836 <#macro tabList style='tabs' vertical=false id='' params='' color=''>
837 <#if propagateTabStyle?? && style='tabs'><#local style = propagateTabStyle /><#elseif vertical=true><#local style='menu-list' /><#else><#local style=style /></#if>
838 <#if style='tabs'><div class="tabs"></#if>
839 <ul<#if style!='tabs'> class="${style}${color}"</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
840 <#nested>
841 </ul>
842 <#if style='tabs'></div></#if>
843 </#macro>
844 <#-- Tabs -->
845 <#-- type: -->
846 <#macro tabLink class='' hide=[] id='' active=false href='' title='' tabLabel='' tabIcon='' tabClass='' params=''>
847 <li class="<#if active>is-active</#if><#if class?trim!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
848 <@link href='${href}' title='${title}'>
849 <#if tabIcon!=''><span class="icon is-small"><@icon style=tabIcon /></span></#if>
850 <#if tabLabel !=''>${tabLabel!}<#else>${title!}</#if> <#nested>
851 </@link>
852 </li>
853 </#macro>
854 <#-- TAB Content -->
855 <#macro tabContent id='' params=''>
856 <div class="tab-content">
857 <#nested>
858 </div>
859 </#macro>
860 <#-- Tab Panel -->
861 <#macro tabPanel id params='' active=false>
862 <div class="tab-pane fade<#if active> show active</#if>" role="tabpanel" id="${id}" aria-labelledby="${id}-tab"<#if params!=''> ${params}</#if>>
863 <div class="container-fluid box"><#nested></div>
864 </div>
865 </#macro>
866 <#-- ACCORDION -->
867 <#-- The accordionContainer is the container for accordionPanel, which itself is the container for accordionHeader and accordionBody -->
868 <#-- The childId argument in accordionPanel is meant to be used in the two sub-macros: accordionHeader and accordionBody -->
869 <#macro accordionContainer id='' params=''>
870 <#if id = '' >
871 <#if accordionContainerId?? == false><#assign accordionContainerId = 1 ><#else><#assign accordionContainerId = accordionContainerId + 1 ></#if>
872 <#local id = 'accCont_'+ accordionContainerId >
873 </#if>
874 <div class="accordions" id="${id}"<#if params!=''> ${params}</#if>>
875 <#assign parentId = id>
876 <#nested>
877 </div>
878 </#macro>
879 <#macro accordionPanel color='' collapsed=true childId='' id='' params=''>
880 <div class="accordion"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
881 <#if collapsed = true>
882 <#assign aClass = ''>
883 <#assign expanded = 'false'>
884 <#assign childClass = 'panel-collapse collapse'>
885 <#else>
886 <#assign aClass = 'is-active'>
887 <#assign expanded = 'true'>
888 <#assign childClass = 'panel-collapse collapse in'>
889 </#if>
890 <#assign childId = childId>
891 <#nested>
892 </div>
893 </#macro>
894 <#-- ACCORDION ELEMENT -->
895 <#-- The boxTools parameter is unused, kept for backwards compatibility -->
896 <#macro accordionHeader title='' parentId=parentId childId=childId boxTools=false id='' params='' headerIcon='' >
897 <div class="accordion-header toggle has-background-light"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
898 <h2 class="title has-text-primary"><#if headerIcon!=''><@icon style=headerIcon /></#if> ${title}</h2>
899 <#local nested><#nested></#local>
900 <#if nested?has_content>
901 <div class="is-pulled-right">${nested}</div>
902 </#if>
903 </div>
904 <#assign parentId=parentId />
905 </#macro>
906 <#macro accordionBody id=childId class=childClass expanded=expanded params=''>
907 <div id="${id}" class="accordion-body ${class}" aria-expanded="${expanded}"<#if params!=''> ${params}</#if>>
908 <@boxBody>
909 <#nested>
910 </@boxBody>
911 </div>
912 </#macro>
913 <#macro progressBar description='' id='' params=''>
914 <div class="progress"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
915 <div id="progressbar" class="progress-bar progress-bar-striped" role="progressbar">
916 <div id="complexity">0%</div>
917 </div>
918 </div>
919 <#if description!=''>
920 <span class="progress-description">${description}</span>
921 </#if>
922 </#macro>
923 <#-- Progress macro
924 token : the progress manager Feed Token
925 interval : refresh period in milli seconds (if the feed token is provided)
926 showReport : display the messages report (if the feed token is provided) -->
927 <#macro progress color='primary' id='' params='' value=0 min=0 max=100 text='' progressId='progressbar' token='' label='' showReport=false intervalTime=2000 >
928 <#if label!='' >
929 <div id="${progressId}-label" >${label}</div>
930 </#if>
931 <div class="progress"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
932 <progress id="${progressId}" max="${max}" value="${value}" class="progress is-${color}<#if token!=''> progressmanager</#if>" <#if token!=''>token="${token}" intervalTime=${intervalTime} showReport=${showReport?c}</#if> ><#if text=''>${value}%<#else>${text}</#if></progress>
933 </div>
934 <#if showReport >
935 <div id="${progressId}-report" class="progress-bar-report" lastline=0></div>
936 </#if>
937 </#macro>
938 <#-- TAG -->
939 <#-- color: default/primary/success/info/warning/danger/ -->
940 <#macro tag color='default' class='' size='' title='' tagIcon='' id='' params='' deprecated...>
941 <@deprecatedWarning args=deprecated />
942 <#switch size>
943 <#case 'xs'>
944 <#assign tagSize='is-small'>
945 <#break>
946 <#case 'sm'>
947 <#assign tagSize=''>
948 <#break>
949 <#case 'md'>
950 <#assign tagSize='is-medium'>
951 <#break>
952 <#case 'lg'>
953 <#assign tagSize='is-large'>
954 <#break>
955 <#default>
956 <#assign tagSize='is-normal'>
957 </#switch>
958 <span class="tag is-${color}<#if class!=''> ${class}</#if><#if tagSize!=''> ${tagSize}</#if>"<#if title!=''> title='${title}'</#if><#if id!=''>id='${id}'</#if><#if params!=''>${params}</#if>>
959 <#if tagIcon !=''>
960 <@icon style=tagIcon />
961 </#if>
962 <#nested>
963 </span>
964 </#macro>
965 <#-- NAVBAR -->
966 <#macro navBar tag='nav' class='' id='' params=''>
967 <${tag} class="navbar<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
968 <#nested>
969 </${tag}>
970 </#macro>
971 <#-- NAV -->
972 <#macro nav tag='nav' type='tab' class='' id='' params=''>
973 <${tag} class="nav nav-${type!}<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
974 <#nested>
975 </${tag}>
976 </#macro>
977 <#-- NAVITEM -->
978 <#macro navItem href='' name='' active=false title='' alt='' target='' tag='li' class='' id='' params=''>
979 <${tag} class="nav-link<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
980 <#if href !='' >
981 <@link class='nav-link' href=href name=name title=title alt=alt target=target active=active />
982 </#if>
983 <#nested>
984 </#${tag}>
985 </#macro>
986 <#-- BUTTON -->
987 <#-- bootstrap 3 : size: btn-xs/btn-sm/btn-lg -->
988 <#-- upcoming bootstrap 4 : size: btn-sm for small buttons/empty for medium buttons/btn-lg for large buttons -->
989 <#-- color: default[bootstrap4 : secondary]/primary/success/warning/danger/info -->
990 <#-- color (upcoming bootstrap 4): btn-outline-default/btn-outline-primary/btn-outline-success/btn-outline-warning/btn-outline-... -->
991 <#-- style: btn-block/btn-flat/close/navbar-toggle/collapsed... -->
992 <#-- type: button/submit/reset -->
993 <#-- params: data-toggle/data-target/data-dismiss... -->
994 <#-- buttonIcon: icon name ex: info/check/comment/envelope... -->
995 <#-- iconPosition: left/right -->
996 <#-- cancel: switch to true for a cancellation form button. Adds the "formnovalidate" attribute to the button, as well as the right class -->
997 <#-- formId: contains the form ID if the button is outside of the form -->
998 <#-- buttonTargetId: contains the target element ID -->
999 <#-- showTitle, showTitleXs, showTitleSm, showTitleMd, showTitleLg are deprecated in Lutece v7 -->
1000 <#macro button name='' id='' type='button' size='sm' color='primary' style='' class='' params='' value='' title='' tabIndex='' hideTitle=[] showTitle=true showTitleXs=true showTitleSm=true showTitleMd=true showTitleLg=true buttonIcon='' disabled=false iconPosition='left' dropdownMenu=false cancel=false formId='' buttonTargetId='' deprecated...>
1001 <@deprecatedWarning args=deprecated />
1002 <#if color = 'default' || color='btn-default' || color='btn-secondary' || color='secondary'><#local buttonColor = '' /><#else><#local buttonColor = color /></#if>
1003 <#-- Visibility of button title -->
1004 <#local displayTitleClass = displaySettings(hideTitle,'inline-flex') />
1005 <#-- Visibility of button title: backwards compatibility with Lutece v6, BS3 only -->
1006 <#local showTitleClass = '' />
1007 <#if showTitle = false><#local showTitleClass = 'is-sr-only' /></#if>
1008 <#if showTitleXs = false><#local showTitleClass = showTitleClass + ' is-hidden-mobile' /></#if>
1009 <#if showTitleSm = false><#local showTitleClass = showTitleClass + ' is-hidden-tablet-only' /></#if>
1010 <#if showTitleMd = false><#local showTitleClass = showTitleClass + ' is-hidden-desktop-only' /></#if>
1011 <#if showTitleLg = false><#local showTitleClass = showTitleClass + ' is-hidden-widescreen-only' /></#if>
1012 <#switch size>
1013 <#case 'xs'>
1014 <#local buttonSize='small'>
1015 <#break>
1016 <#case 'sm'>
1017 <#local buttonSize='small'>
1018 <#break>
1019 <#case 'md'>
1020 <#local buttonSize='medium'>
1021 <#break>
1022 <#case 'lg'>
1023 <#local buttonSize='large'>
1024 <#break>
1025 <#default>
1026 <#local buttonSize='normal'>
1027 </#switch>
1028 <#if style != ''>
1029 <#if style?contains('card-control')>
1030 <#if style?contains('collapse')>
1031 <#local widgetAction = 'collapse' />
1032 <script>
1033 $( function() {
1034 <#if buttonIcon = 'minus'>
1035 $("${buttonTargetId}").addClass("show");
1036 <#else>
1037 $("${buttonTargetId}").addClass("collapse");
1038 </#if>
1039 });
1040 </script>
1041 <#elseif style?contains('remove')>
1042 <#local widgetAction = 'remove' />
1043 <#local class += ' delete' />
1044 </#if>
1045 <#local btnStyle = style?replace('collapse|remove', '', 'r')?trim />
1046 <#elseif style?contains('modal')>
1047 <#local widgetAction = 'modal' />
1048 <#local btnStyle = style?replace('modal', '', 'r')?trim />
1049 <#else>
1050 <#local btnStyle = style />
1051 </#if>
1052 </#if>
1053 <#if dropdownMenu>
1054 <div class="dropdown">
1055 <div class="dropdown-trigger">
1056 </#if>
1057 <button class="<#if buttonSize!=''>is-${buttonSize}</#if><#if buttonColor!=''> is-${buttonColor}</#if><#if btnStyle?? && btnStyle!=''> ${btnStyle}<#else> button</#if><#if class!=''> ${class}</#if>"<#if dropdownMenu> aria-haspopup="true" aria-controls="${id}-content"</#if> type="${type}"<#if title!=''> title="${title}"</#if><#if name!=''> name="${name}"</#if><#if id!=''> id="${id}"</#if><#if value!=''> value="${value}"</#if><#if params!=''> ${params}</#if><#if disabled> disabled</#if><#if dropdownMenu> data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"</#if><#if widgetAction?? && widgetAction!=''><#if widgetAction = 'collapse' || widgetAction = 'modal'> data-toggle="${widgetAction}"<#elseif widgetAction = 'remove'> data-dismiss="alert"</#if></#if><#if buttonTargetId!=''> data-target="${buttonTargetId}"</#if><#if cancel> formnovalidate</#if><#if formId!=''> form="${formId}"</#if>>
1058 <#if buttonIcon!='' && iconPosition='left'><span class="icon"><@icon style=buttonIcon /></span></#if>
1059 <#local nestedContent><#nested /></#local>
1060 <#local nestedContent = nestedContent?trim />
1061 <#if nestedContent='' && displayTitleClass !='is-sr-only'><span<#if displayTitleClass!=''> class="${displayTitleClass}${showTitleClass}"</#if>>${title}</span></#if>
1062 <#if nestedContent!='' && !dropdownMenu><span<#if displayTitleClass!=''> class="${displayTitleClass}"</#if>><#nested></#if>
1063 <#if buttonIcon!='' && iconPosition='right'><span class="icon"><@icon style=buttonIcon /></span></#if>
1064 <#if dropdownMenu><@icon style='caret-down' /></#if>
1065 </button>
1066 <#if dropdownMenu>
1067 <div class="dropdown-menu" id="${id!}-content" role="menu">
1068 <div class="dropdown-content">
1069 <#nested>
1070 </div>
1071 </div>
1072 </div>
1073 </div>
1074 </#if>
1075 </#macro>
1076 <#-- A BUTTON (LINK STYLED AS A BUTTON) -->
1077 <#-- size: small/medium/large -->
1078 <#-- color: default/primary/success/warning/danger/info/bg-purple/bg-blue/bg-navy/bg-teal/bg-maroon/bg-black/bg-gray/bg-olive/bg-lime/bg-orange/bg-fuchsia -->
1079 <#-- style: disabled ignored : btn-block/btn-flat/btn-app-->
1080 <#-- icon: icon name ex: info/check/comment/envelope... -->
1081 <#macro aButton name='' id='' href='' target='' size='sm' color='primary' style='' align='' class='' params='' title='' tabIndex='' hideTitle=[] buttonIcon='' disabled=false iconPosition='left' dropdownMenu=false cancel=false deprecated...>
1082 <@deprecatedWarning args=deprecated />
1083 <#local displayTitleClass = displaySettings(hideTitle,'inline') />
1084 <#if color = 'default' || color = 'secondary'>
1085 <#assign buttonColor = '' />
1086 <#else>
1087 <#assign buttonColor = color />
1088 </#if>
1089 <#switch size>
1090 <#case ''>
1091 <#assign buttonSize='normal'>
1092 <#break>
1093 <#case 'xs'>
1094 <#assign buttonSize='small'>
1095 <#break>
1096 <#case 'sm'>
1097 <#assign buttonSize='small'>
1098 <#break>
1099 <#case 'md'>
1100 <#assign buttonSize='medium'>
1101 <#break>
1102 <#case 'lg'>
1103 <#assign buttonSize='large'>
1104 <#break>
1105 <#default>
1106 <#assign buttonSize='small'>
1107 </#switch>
1108 <#local class += alignmentSettings(align) />
1109 <#if dropdownMenu>
1110 <div class="dropdown">
1111 <div class="dropdown-trigger">
1112 </#if>
1113 <a class="<#if buttonSize!=''>is-${buttonSize}</#if><#if buttonColor!=''> is-${buttonColor}</#if><#if style!=''> ${style}<#else> button</#if><#if class!=''> ${class}</#if>"<#if name!=''> name="${name}"</#if><#if id!=''> id="${id}"</#if> href="${href}" title="${title}"<#if target!=''> target="${target}"</#if><#if params!=''> ${params}</#if><#if disabled> disabled</#if><#if dropdownMenu> data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"</#if>>
1114 <#if buttonIcon!='' && iconPosition='left'><span class="icon"><@icon style=buttonIcon /></span></#if>
1115 <#if displayTitleClass!='is-sr-only'><span class="${displayTitleClass}">${title}</span></#if>
1116 <#if buttonIcon!='' && iconPosition='right'><span class="icon"><@icon style=buttonIcon /></span></#if>
1117 <#if dropdownMenu> <@icon style='caret-down' /></#if>
1118 <#if !dropdownMenu>
1119 <#nested>
1120 </#if>
1121 </a>
1122 <#if dropdownMenu>
1123 </div>
1124 <div class="dropdown-menu"<#if id!=''> id="${id}-content" aria-labelledby="${id}-content"</#if> role="menu">
1125 <div class="dropdown-content">
1126 <#nested>
1127 </div>
1128 </div>
1129 </div>
1130 </#if>
1131 </#macro>
1132 <#-- BTN TOOLBAR -->
1133 <#macro btnToolbar id='' class='' align='' ariaLabel='' params=''>
1134 <#if align!=''><#local class += ' ' + alignmentSettings(align) /></#if>
1135 <div class="field is-grouped<#if class!=''> ${class?trim}</#if>" role="toolbar"<#if ariaLabel!=''> aria-label="${ariaLabel}"</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1136 <#nested>
1137 </div>
1138 </#macro>
1139 <#-- BTN GROUP -->
1140 <#-- size: sm/lg -->
1141 <#-- align: left/center/right -->
1142 <#macro btnGroup size='' align='' class='' id='' params='' ariaLabel='' hide=[] deprecated...>
1143 <@deprecatedWarning args=deprecated />
1144 <#local class += ' ' + displaySettings(hide,'inline-flex') />
1145 <#switch size>
1146 <#case 'sm'>
1147 <#local class += ' are-small'>
1148 <#break>
1149 <#case 'lg'>
1150 <#local class += ' are-large'>
1151 <#break>
1152 <#default>
1153 <#local class += ''>
1154 </#switch>
1155 <#switch align>
1156 <#case 'right'>
1157 <#local class += ' is-right'>
1158 <#break>
1159 <#case 'center'>
1160 <#local class += ' is-centered'>
1161 <#break>
1162 <#default>
1163 <#local class += ''>
1164 </#switch>
1165 <div class="field is-grouped<#if class?trim!=''> ${class?trim}</#if>" role="group"<#if ariaLabel!=''> aria-label="${ariaLabel}"</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1166 <#nested>
1167 </div>
1168 </#macro>
1169 <#-- Radio button/Checkbox as buttons (to use with btnGroup) -->
1170 <#-- type: radio/checkbox -->
1171 <#macro btnGroupRadioCheckbox type='checkbox' color='primary' size='' name='' id='' params='' ariaLabel='' labelFor='' labelKey='' labelParams='' tabIndex='' value='' checked=false>
1172 <label class="button is-${color}<#if size!=''> btn-${size}</#if>" for="${labelFor}"<#if labelParams!=''> ${labelParams}</#if>>
1173 <input type="${type}" name="${name}" id="${id}" autocomplete="off"<#if value!=''> value="${value}"</#if><#if params!=''> ${params}</#if><#if tabIndex!=''> tabindex="${tabIndex}"</#if><#if checked> checked</#if> /><#if labelKey!=''>${labelKey}</#if>
1174 </label>
1175 </#macro>
1176 <#-- Simple links a href, anchors -->
1177 <#macro link href='' class='' id='' name='' title='' alt='' target='' params=''>
1178 <a href="${href}"<#if class!=''> class="${class}"</#if><#if id!=''> id="${id}"</#if><#if name!=''> name="${name}"</#if><#if target!=''> target="${target}"</#if><#if title!=''> title="${title}"</#if><#if alt!=''> alt="${alt}"</#if><#if params!=''> ${params}</#if>>
1179 <#nested>
1180 </a>
1181 </#macro>
1182 <#-- MODAL -->
1183 <#-- bgColor: card / content -->
1184 <#macro modal id params='' bgColor='card' size=''>
1185 <div class="modal" role="dialog" id="${id}" data-toggle="modal"<#if params!=''> ${params}</#if>>
1186 <div class="modal-background"></div>
1187 <div class="modal-${bgColor}">
1188 <#nested>
1189 </div>
1190 </div>
1191 </#macro>
1192 <#macro modalHeader titleLevel='p' modalTitle='' id='' params=''>
1193 <div class="modal-card-head"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1194 <#nested>
1195 <${titleLevel} class="modal-card-title">${modalTitle}</${titleLevel}>
1196 <button type="button" class="delete" data-dismiss="modal" aria-label="Close">
1197 <span aria-hidden="true">×</span>
1198 </button>
1199 </div>
1200 </#macro>
1201 <#macro modalBody id='' params=''>
1202 <div class="modal-card-body"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1203 <#nested>
1204 </div>
1205 </#macro>
1206 <#macro modalFooter id='' params=''>
1207 <div class="modal-card-foot"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1208 <#nested>
1209 </div>
1210 </#macro>
1211 <#macro modalScript id params=''>
1212 <div class="modal-card-foot"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1213 <#nested>
1214 </div>
1215 </#macro>
1216 <#-- BREADCRUMBS -->
1217 <#macro breadcrumbs id='' class='' params=''>
1218 <nav class="breadcrumb<#if class!=''> ${class}"</#if>" aria-label="breadcrumbs">
1219 <ul<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1220 <#nested>
1221 </ul>
1222 </nav>
1223 </#macro>
1224 <#macro breadcrumbItem class='' id='' params=''>
1225 <li <#if class!=''>class="${class}"</#if><#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1226 <#nested>
1227 </li>
1228 </#macro>
1229 <#-- CALLOUT -->
1230 <#-- AdminLTE classes: info/warning/danger/success -->
1231 <#macro callOut color='' titleLevel='h3' title='' callOutIcon='' id='' params=''>
1232 <div class="notification<#if color!=''> is-${color}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1233 <#if title!=''><${titleLevel}><@icon style=callOutIcon /> ${title}</${titleLevel}></#if>
1234 <#nested>
1235 </div>
1236 </#macro>
1237 <#-- ALERT -->
1238 <#-- class: -->
1239 <#-- color: success/info/warning/danger -->
1240 <#macro alert class='' color='' titleLevel='h3' title='' iconTitle='' dismissible=false id='' params=''>
1241 <div class="notification is-flex is-align-items-center<#if class!=''> ${class}</#if><#if color!=''> is-${color}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1242 <#if dismissible><@button color='' size='' style='card-control remove'>×</@button></#if>
1243 <#if iconTitle!=''><@icon style=iconTitle class='mr-3' /></#if>
1244 <#if title!=''><${titleLevel}><span>${title}</span></${titleLevel}></#if>
1245 <#nested>
1246 </div>
1247 </#macro>
1248 <#---------------------------------------->
1249 <#-- AdminLTE Box -->
1250 <#-- color: default/primary/info/success/warning/danger -->
1251 <#-- style: solid (no top border) -->
1252 <#-- collapsed: true/false -->
1253 <#macro box color='' id='' style='' class='' title='' params='' collapsed=false>
1254 <div class="card<#if color!=''> has-${color}</#if><#if style!=''> box-${style}</#if><#if class!=''> ${class}</#if><#if collapsed> collapsed-box</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1255 <#if title=''>
1256 <#nested>
1257 <#else>
1258 <@boxHeader title=title params=params skipHeader=true />
1259 <@boxBody><#nested></@boxBody>
1260 </#if>
1261 </div>
1262 </#macro>
1263 <#-- The boxTools parameter is unused, kept for backwards compatibility -->
1264 <#macro boxHeader title='' i18nTitleKey='' hideTitle=[] showTitle=true id='' class='' params='' boxTools=false titleLevel='div' deprecated...>
1265 <@deprecatedWarning args=deprecated />
1266 <header class="card-header<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1267 <${titleLevel} class="card-header-title<#if showTitle=false> sr-only</#if>"><#if title!=''>${title}</#if><#if i18nTitleKey!=''>#i18n{${i18nTitleKey}}</#if></${titleLevel}>
1268 <#nested>
1269 </header>
1270 </#macro>
1271 <#macro boxBody class='' collapsed=false align='' id='' params=''>
1272 <#if collapsed><#local class += ' ' + 'collapse' /></#if>
1273 <#if align!=''><#local class += ' ' + alignmentSettings(align) /></#if>
1274 <div class="card-content<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1275 <#nested>
1276 </div>
1277 </#macro>
1278 <#macro boxFooter class='' align='' id='' params=''>
1279 <#if align!=''><#local class += ' ' + alignmentSettings(align) /></#if>
1280 <div class="card-footer<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1281 <#nested>
1282 </div>
1283 </#macro>
1284 <#---------------------------------------->
1285 <#-- INFO-BOX AdminTLE (widget) -->
1286 <#-- color: only for the left side showing the icon. -->
1287 <#-- bgColor: for the right side containing the text -->
1288 <#macro infoBox color='' boxText='' boxIcon='' boxNumber='0' unit='' bgColor='' progressBar='' progressDescription='' id='' params=''>
1289 <div class="box<#if bgColor!=''> ${bgColor}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1290 <article class="media">
1291 <div class="media-left">
1292 <figure class="image">
1293 <@icon style=boxIcon class='has-text-dark' />
1294 </figure>
1295 </div>
1296 <div class="media-content">
1297 <div class="content">
1298 <#if boxText !=''><p class="font-weight-bold">${boxText}</p></#if>
1299 <#if boxNumber !='0'><p>${boxNumber?trim} / ${progressBar?trim} <#if unit!=''> <small>${unit}</small></#if></p></#if>
1300 <#if bgColor!='' && progressBar!=''><progress class="progress is-primary" value="${(boxNumber?trim?number/progressBar?trim?number*100)?string.computer}" max="100"> ${boxNumber}% </progress></#if>
1301 <#if progressDescription!=''><p>${progressDescription}</p></#if>
1302 <#nested />
1303 </div>
1304 </div>
1305 </article>
1306 </div>
1307 </#macro>
1308 <#-- AdminLTE Small Box -->
1309 <#-- color: Bootstrap + AdminLTE colors -->
1310 <#-- unit: %,... -->
1311 <#macro smallBox color='' title='' text='' boxIcon='' titleLevel='h3' unit='' url='' urlText='' id='' params='' fontSize='1rem'>
1312 <div class="box<#if color!=''> has-background-${color}-dark</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1313 <article class="media">
1314 <div class="media-left">
1315 <figure class="image">
1316 <@icon style=boxIcon class='fa-3x has-text-dark' />
1317 </figure>
1318 </div>
1319 <div class="media-content">
1320 <div class="content">
1321 <h4><#if url!=''><a class="has-text-primary-light" href="${url}"></#if>${text}<#if url!=''></a></#if></h4>
1322 <${titleLevel} class="has-text-primary-light"" style="font-size:${fontSize};"><span>${title}</span><#if unit!=''> ${unit}</#if></${titleLevel}>
1323 </div>
1324 </div>
1325 </article>
1326 </div>
1327 </#macro>
1328 <#-- AdminLTE Error Page -->
1329 <#-- Error Type: 500,404... -->
1330 <#-- Color: primary/blue/navy/aqua/teal/green/orange/yellow/red/purple/maroon/gray/black... -->
1331 <#macro errorPage color='' errorType='' id='' params=''>
1332 <div class="error-page"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1333 <h2 class="headline text-${color}">${errorType}</h2>
1334 <div class="error-content">
1335 <h3>
1336 <@icon style='warning' class='text-${color}' />
1337 <#if errorType=='404'>
1338 #i18n{portal.util.error404.title}
1339 <#elseif errorType='500'>
1340 #i18n{portal.util.error500.title}
1341 <#else>...
1342 </#if>
1343 </h3>
1344 <p>
1345 <#if errorType=='404'>
1346 #i18n{portal.util.error404.text}
1347 <#elseif errorType='500'>
1348 #i18n{portal.util.error500.text}
1349 <#else>...
1350 </#if>
1351 </p>
1352 <@aButton href='' size='' color='bg-${color}' style=''>
1353 <@icon style='home' />
1354 #i18n{portal.util.labelBackHome}
1355 </@aButton>
1356 </div>
1357 </div>
1358 </#macro>
1359 <#-- CONTEXTUAL BACKGROUND P-->
1360 <#-- Bootstrap colors: primary/success/info/warning/danger -->
1361 <#-- AdminTLE colors: gray/gray-light/black/red/yellow/aqua/blue/light-blue/green/navy/teal/olive/lime/orange/fuchsia/purple/maroon -->
1362 <#macro coloredBg color='' type='p' id='' params=''>
1363 <${type} class="bg-${color}"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1364 <#nested>
1365 </${type}>
1366 </#macro>
1367 <#macro listGroup id='' class='' params=''>
1368 <div class="panel <#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1369 <p>PROUT</p>
1370 <#nested>
1371 </div>
1372 </#macro>
1373 <#macro listGroupItem id='' class='' params=''>
1374 <div class="panel-block<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1375 <#nested>
1376 </div>
1377 </#macro>
1378 <#macro unstyledList id='' params=''>
1379 <ul class="unstyled"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if>>
1380 <#assign liClass = "margin">
1381 <#nested>
1382 </ul>
1383 </#macro>
1384 <#-- DROPDOWN MENU LIST -->
1385 <#macro dropdownList id='' params=''>
1386 <div class="dropdown is-active">
1387 <div class="dropdown-trigger">
1388 <button class="button is-primary is-sm" aria-haspopup="true" aria-controls="dropdown-menu">
1389 <span>Dropdown button</span>
1390 <span class="icon is-small">
1391 <i class="fa fa-angle-down" aria-hidden="true"></i>
1392 </span>
1393 </button>
1394 </div>
1395 <div class="dropdown-menu" id="dropdown-menu" role="menu">
1396 <div class="dropdown-content">
1397 <#nested>
1398 </div>
1399 </div>
1400 </#macro>
1401 <#macro dropdownItem class='' href='' title='' target='' id='' params=''>
1402 <a href="${href}" class="dropdown-item<#if class!=''> ${class}</#if>" title="${title}"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if><#if target!=''> target="${target}"</#if>>${title}</a>
1403 </#macro>
1404 <#-- CARDS -->
1405 <#macro card header=false headerTitle='' headerIcon=false headerTitleIcon=''>
1406 <div class="panel panel-default">
1407 <#if header><div class="panel-heading"><#if headerIcon><@icon style='${headerTitleIcon}' /> </#if>${headerTitle}</div></#if>
1408 <div class="panel-body">
1409 <#nested>
1410 </div>
1411 </div>
1412 </#macro>
1413 <#-- FUNCTION: DISPLAY -->
1414 <#-- This function returns a "visible" or "hidden" class for any component -->
1415 <#-- breakpoints: "all" || "xs"/"sm"/"md"/"lg"/"xl" -->
1416 <#-- display: is-block/is-flex/is-inline/is-inline-block/is-inline-flex -->
1417 <#function displaySettings breakPoints=[] display=''>
1418 <#local breakPointsOrdered = [] />
1419 <#if breakPoints?seq_contains('all')>
1420 <#local breakPointsOrdered += ['all'] />
1421 </#if>
1422 <#if breakPoints?seq_contains('remove')>
1423 <#local breakPointsOrdered += ['remove'] />
1424 </#if>
1425 <#if breakPoints?seq_contains('xs')>
1426 <#local breakPointsOrdered += ['xs'] />
1427 </#if>
1428 <#if breakPoints?seq_contains('sm')>
1429 <#local breakPointsOrdered += ['sm'] />
1430 </#if>
1431 <#if breakPoints?seq_contains('md')>
1432 <#local breakPointsOrdered += ['md'] />
1433 </#if>
1434 <#if breakPoints?seq_contains('lg')>
1435 <#local breakPointsOrdered += ['lg'] />
1436 </#if>
1437 <#if breakPoints?seq_contains('xl')>
1438 <#local breakPointsOrdered += ['xl'] />
1439 </#if>
1440 <#local displayClass = '' />
1441 <#if breakPointsOrdered?? && breakPointsOrdered?size > 0>
1442 <#list breakPointsOrdered as breakPoint>
1443 <#if breakPoint = 'all'>
1444 <#local displayClass = 'is-sr-only' />
1445 <#elseif breakPoint = 'xs'>
1446 <#local displayClass = displayClass + ' is-hidden-mobile' />
1447 <#elseif breakPoint = 'sm'>
1448 <#local displayClass = displayClass + ' is-hidden-tablet-only' />
1449 <#elseif breakPoint = 'md'>
1450 <#local displayClass = displayClass + ' is-hidden-desktop-only' />
1451 <#elseif breakPoint = 'lg'>
1452 <#local displayClass = displayClass + ' is-hidden-widescreen-only' />
1453 <#elseif breakPoint = 'xl'>
1454 <#local displayClass = displayClass + ' is-hidden-fullhd' />
1455 <#elseif breakPoint = 'remove'>
1456 <#local displayClass = displayClass + ' remove' />
1457 <#else>
1458 <#local displayClass = displayClass + ' undefined_breakpoint' />
1459 </#if>
1460 </#list>
1461 </#if>
1462 <#return displayClass?trim>
1463 </#function>
1464 <#-- This function returns responsive classes or flex order classes -->
1465 <#-- type: col|offset|order -->
1466 <#function responsiveDisplay type='' breakpoints={}>
1467 <#local responsiveDisplayClass = '' />
1468 <#list breakpoints as breakpointkey,breakpointvalue>
1469 <#if breakpointvalue!=0>
1470 <#if type = 'col'>
1471 <#local responsiveDisplayClass += ' is-${breakpointvalue}' />
1472 <#elseif type = 'offset'>
1473 <#local responsiveDisplayClass += ' is-${type}-${breakpointvalue}' />
1474 </#if>
1475 </#if>
1476 </#list>
1477 <#return responsiveDisplayClass?trim>
1478 </#function>
1479 <#function alignmentSettings align='' style=''>
1480 <#local x = ''>
1481 <#if align !=''>
1482 <#if align = 'left'>
1483 <#local x = 'is-left is-justify-content-flex-start' />
1484 <#elseif align = 'right'>
1485 <#local x = 'is-right is-justify-content-flex-end' />
1486 <#elseif align = 'center'>
1487 <#local x = 'is-centered is-justify-content-flex-center' />
1488 </#if>
1489 </#if>
1490 <#return x>
1491 </#function>
1492 <#-- NEW MACRO LUTECE-2221 -->
1493 <#-- UI STRUCTURE ELEMENTS -->
1494 <#-- MACRO adminHeader -->
1495 <#macro adminHeader site_name=site_name>
1496 <script src="js/admin/jquery/jquery-3.5.1.min.js"></script>
1497 </head>
1498 <body class="has-navbar-fixed-top">
1499 <div class="wrapper">
1500 <header class="main-header" role="banner">
1501 <nav class="navbar is-fixed-top" role="navigation">
1502 <div class="navbar-brand">
1503 <a href="jsp/site/Portal.jsp" title="#i18n{portal.users.admin_header.title.viewSite} ${site_name}" target="_blank" class="navbar-item">
1504 <img src="#dskey{portal.site.site_property.logo_url}" class="logo" title="#i18n{portal.users.admin_header.title.viewSite} ${site_name}" alt="${site_name}"><b> <#if site_name?length > 18> ${site_name?substring(0,16)}... <#else> ${site_name}</#if></b>
1505 </a>
1506 <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
1507 <span aria-hidden="true"></span>
1508 <span aria-hidden="true"></span>
1509 <span aria-hidden="true"></span>
1510 </a>
1511 </div>
1512 <div class="navbar-menu" id="navbar-collapse">
1513 <div class="navbar-start">
1514 <#list feature_group_list as feature_group>
1515 <#if feature_group.features?size > 1>
1516 <div class="navbar-item has-dropdown is-hoverable">
1517 <a class="navbar-link" id="dLabel${feature_group.id}Header">
1518 ${feature_group.label}
1519 </a>
1520 <div class="navbar-dropdown" role="menu" aria-labelledby="dLabel${feature_group.id}Header">
1521 <#list feature_group.features as feature>
1522 <#if !feature.externalFeature>
1523 <a class="navbar-item" href="${feature.url}?plugin_name=${feature.pluginName}">${feature.name}</a>
1524 <#else>
1525 <a class="navbar-item" href="${feature.url}"><#if feature.iconUrl?has_content><i class="${feature.iconUrl}"></i></#if> ${feature.name}</a>
1526 </#if>
1527 </#list>
1528 </div>
1529 </div>
1530 <#else>
1531 <#list feature_group.features as feature>
1532 <#if !feature.externalFeature>
1533 <a class="navbar-item" href="${feature.url}?plugin_name=${feature.pluginName}">${feature.name}</a>
1534 <#else>
1535 <a class="navbar-item" href="${feature.url}"><#if feature.iconUrl?has_content><i class="${feature.iconUrl}"></i></#if>${feature.name}</a>
1536 </#if>
1537 </#list>
1538 </#if>
1539 </#list>
1540 </div>
1541 <div class="navbar-end user">
1542 <div class="navbar-item">
1543 <a class="button is-primary" href="${admin_url}" title="#i18n{portal.users.admin_header.homePage}">
1544 <i class="fa fa-home"></i>
1545 </a>
1546 </div>
1547 <#if user.userLevel == 0>
1548 <#assign hasIcon=false />
1549 <#if listLoggersInfo?has_content>
1550 <#list listLoggersInfo?filter( logInfo -> ( logInfo.level = 'DEBUG' || logInfo.level = 'TRACE' ) ) as logInfo>
1551 <#if logInfo?size gt 0>
1552 <#if hasIcon=false >
1553 <div class="navbar-item has-dropdown is-hoverable">
1554 <button class="button is-light mt-2" style="position:relative" >
1555 <i class="fa fa-bell"></i>
1556 <span class="badge is-danger">1</span>
1557 </button>
1558 <ul class="navbar-dropdown logger" role="menu" aria-label="Notifications" style="width: 20vw;padding: .5rem 1rem;">
1559 <li><span class="badge is-danger is-top-left">1</span><strong>#i18n{portal.util.log.warningLevel}</strong></li>
1560 <#assign hasIcon = true />
1561 </#if>
1562 <li><strong>${logInfo.name!} - ${logInfo.level!}</strong><span>${logInfo.path!}</span> </li>
1563 </#if>
1564 </#list>
1565 </#if>
1566 <#if hasIcon == true >
1567 </ul>
1568 </div>
1569 </#if>
1570 <div class="navbar-item">
1571 <a class="button is-danger" href="jsp/admin/AdminTechnicalMenu.jsp" title="#i18n{portal.admindashboard.view_dashboards.title}">
1572 <i class="fa fa-cog"></i>
1573 </a>
1574 </div>
1575 </#if>
1576 <div class="navbar-item has-dropdown is-hoverable">
1577 <a class="navbar-link">
1578 <#if adminAvatar>
1579 <img src="servlet/plugins/adminavatar/avatar?id_user=${user.userId}" id="admin-avatar" class="user-image" alt="User's avatar">
1580 <#else>
1581 <img src="#dskey{portal.site.site_property.avatar_default}" id="admin-avatar" class="user-image" alt="User's avatar">
1582 </#if>
1583 <span id="zone4" class="hidden-sm hidden-md" id="dLabelUserHeader"> ${dashboard_zone_4}<i class="caret"></i></span>
1584 </a>
1585 <#if userMenuItems?has_content>
1586 <ul class="navbar-dropdown" role="menu" aria-labelledby="dLabelUserHeader">
1587 <#list userMenuItems as item>
1588 ${item.content}
1589 </#list>
1590 </ul>
1591 </#if>
1592 </div>
1593 <#if admin_logout_url?has_content>
1594 <div class="navbar-item">
1595 <a class="button is-danger" href="${admin_logout_url}" title="#i18n{portal.users.admin_header.deconnectionLink}">
1596 <i class="fa fa-power-off fa-fw"></i>
1597 </a>
1598 </div>
1599 </#if>
1600 </div>
1601 </div>
1602 </nav>
1603 </header>
1604 <#if user.userLevel == 0>
1605 <script>
1606 document.addEventListener( 'DOMContentLoaded', () => {
1607 const loggers = document.querySelectorAll('.logger') ;
1608 if( loggers.length > 0 ){
1609 if( !sessionStorage.getItem('lutece-debug-modal') ){
1610 sessionStorage.setItem('lutece-debug-modal', false )
1611 }
1612 var modalContent = '<h3 class="has-text-danger has-text-weight-bold is-size-4">#i18n{portal.util.log.warningLevel}</h3><p class="mt-2"><strong class="has-text-danger">#i18n{portal.util.log.modalWarningMessage}</strong></p><p class="has-text-centered my-3"><button class="button is-small is-danger" data-toggle="collapse" data-target="#info-log" aria-expanded="false" aria-controls="info-log" type="button">#i18n{portal.util.log.modalLabelButton}</button></p><blockquote class="collapse" id="info-log">' + loggers[0].innerHTML + '</blockquote>';
1613 var adminModalBody = document.querySelector('#adminModal .modal-card-body')
1614 adminModalBody.insertAdjacentHTML( 'beforeEnd', modalContent);
1615 var adminModal = document.getElementById('adminModal');
1616 var adminModalLabel = document.getElementById('adminModalLabel');
1617 var adminModalHeader = document.querySelector('#adminModal .modal-card-head');
1618 var adminModalHeaderBtn = document.querySelector('#adminModal .modal-card-head button');
1619 adminModalLabel.insertAdjacentHTML( 'beforeEnd', 'Attention configuration non conforme !' );
1620 adminModalLabel.classList.add('has-text-white');
1621 adminModalHeader.classList.add('has-background-danger');
1622 ( document.querySelectorAll('#adminModal .modal-background,#adminModal .modal-close,#adminModal .modal-card-head .delete,#adminModal .modal-card-foot .button') || []).forEach(($close) => {
1623 const $target = $close.closest('.modal');
1624 $close.addEventListener( 'click', () => {
1625 $target.classList.remove('is-active');
1626 sessionStorage.setItem('lutece-debug-modal',true)
1627 });
1628 });
1629
1630 if( sessionStorage.getItem('lutece-debug-modal') === 'false' ){
1631 adminModal.classList.add('is-active');
1632 }
1633 }
1634 });
1635 </script>
1636 </#if>
1637 <!-- Wrapper -->
1638 <div id="admin-wrapper">
1639 <section class="content-wrapper">
1640 <!-- Close in footer -->
1641 </#macro>
1642 <#-- MACRO adminFooter -->
1643 <#macro adminFooter >
1644 <!-- end content section -->
1645 </section>
1646 <!-- end admin-wrapper -->
1647 </div>
1648 <!-- end wrapper -->
1649 </div>
1650 <!-- footer menu -->
1651 <footer class="footer">
1652 <div class="content has-text-centered">
1653 <p>
1654 <a href="https://lutece.paris.fr" target="lutece" title="#i18n{portal.site.portal_footer.labelPortal}">
1655 <img src="images/poweredby.png" alt="#i18n{portal.site.portal_footer.labelMadeBy}">
1656 <small>version ${version}</small>
1657 </a>
1658 </p>
1659 </div>
1660 </footer>
1661 <!-- AdminModal -->
1662 <div class="modal" id="adminModal">
1663 <div class="modal-background"></div>
1664 <div class="modal-card">
1665 <header class="modal-card-head">
1666 <p id="adminModalLabel" class="modal-card-title"></p>
1667 <button class="delete" aria-label="#i18n{portal.site.admin_page.buttonClosed}"></button>
1668 </header>
1669 <section class="modal-card-body"></section>
1670 <footer class="modal-card-foot">
1671 <button class="button" >#i18n{portal.site.admin_page.buttonClosed}</button>
1672 </footer>
1673 </div>
1674 </div>
1675 <!-- Included JS Files -->
1676 <!-- Le javascript
1677 ================================================== -->
1678 <!-- Placed at the end of the document so the pages load faster -->
1679 <@coreAdminJSLinks />
1680 ${javascript_files}
1681 <script>
1682 $( function() {
1683 // Check for click events on the navbar burger icon
1684 $(".navbar-burger").click(function() {
1685 // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
1686 $(".navbar-burger").toggleClass("is-active");
1687 $(".navbar-menu").toggleClass("is-active");
1688 });
1689 });
1690 </script>
1691 </#macro>
1692 <#-- MACRO adminHome -->
1693 <#macro adminHome >
1694 <@row>
1695 <@columns class='widget'>
1696 <section class="dashboard-widgets">
1697 <@row>
1698 <@columns sm=4 md=4 lg=4 class='widget lutece-dashboard'>
1699 <#if dashboard_zone_1?has_content>
1700 ${dashboard_zone_1}
1701 </#if>
1702 <div> </div>
1703 </@columns>
1704 <@columns sm=4 md=4 lg=4 class='widget lutece-dashboard'>
1705 <#if dashboard_zone_2?has_content>
1706 ${dashboard_zone_2}
1707 </#if>
1708 <div> </div>
1709 </@columns>
1710 <@columns sm=4 md=4 lg=4 class='widget lutece-dashboard'>
1711 <#if dashboard_zone_3?has_content>
1712 ${dashboard_zone_3}
1713 </#if>
1714 <div> </div>
1715 </@columns>
1716 </@row>
1717 </section>
1718 </@columns>
1719 </@row>
1720 </#macro>
1721 <#-- MACRO adminDashboardWidget -->
1722 <#macro adminDashboardWidget id title color='primary' url='' class='' bodyClass='table-responsive no-padding' params='' >
1723 <@box style='solid' color='${color}' id='${id}_dashboard_card'>
1724 <@boxHeader title='${title}'>
1725 <#if url!=''><@aButton color='' style='card-header-icon' href='${url!}' title='${title!}' size='sm' buttonIcon='cog' hideTitle=['all'] /></#if>
1726 <@button style='card-header-icon collapse' color='' buttonTargetId='#${id}_dashboard_card_body' buttonIcon='minus' size='sm' params=' data-toggle="collapse"' />
1727 <@button style='card-header-icon remove' color='' buttonTargetId='#${id}_dashboard_card' buttonIcon='times' size='sm' params=' data-dismiss="alert"' />
1728 </@boxHeader>
1729 <@boxBody class=bodyClass id='${id}_dashboard_card_body'>
1730 <#nested>
1731 </@boxBody>
1732 </@box>
1733 </#macro>
1734 <#-- adminContentHeader -->
1735 <#macro adminContentHeader >
1736 <section class="content-header">
1737 <nav class="breadcrumb" aria-label="breadcrumbs">
1738 <ul>
1739 <li id="feature-title">
1740 <#if feature_url?? && feature_title?? >
1741 <a href="${feature_url}" title="${feature_title!''}">${feature_title!''}</a>
1742 <#else>
1743 ${feature_title!''}
1744 </#if>
1745 </li>
1746 <#if page_title?? && page_title?has_content>
1747 <li class="is-active"><a href="#" aria-current="page">${page_title}</a></li>
1748 </#if>
1749 </ul>
1750 </nav>
1751
1752
1753
1754 <@adminHeaderDocumentationLink />
1755 </section>
1756 <section class="content-wrapper <#if feature_url?? && feature_url?ends_with('AdminSite.jsp')>no-padding</#if>">
1757 </#macro>
1758 <#-- adminLoginPage -->
1759 <#macro adminLoginPage title='' site_name='SITE_NAME' loginUrl='' token='' loginParams=''>
1760 <script src="js/admin/jquery/jquery-3.5.1.min.js"></script>
1761 </head>
1762 <body id="login">
1763 <section class="is-fullheight" id="login-page">
1764 <div class="block p-3">
1765 <figure class="image is-128x128 is-rounded">
1766 <img src="images/logo-header.png" title="LUTECE Back-Office" alt="LUTECE Back-Office">
1767 </figure>
1768 </div>
1769 <div class="container">
1770 <div class="columns is-centered mt-6">
1771 <div class="column is-one-third mt-6">
1772 <div class="box">
1773 <h3 class="title has-text-centered">${title}</h3>
1774 <p class="subtitle has-text-black has-text-centered">#i18n{portal.admin.admin_login.welcome} ${site_name}</p>
1775 <#nested>
1776 </div>
1777 </div>
1778 </div>
1779 </div>
1780 </section>
1781 <script>
1782 $(function() {
1783 var randomImages = [#dskey{portal.site.site_property.back_images}];
1784 var rndNum = Math.floor(Math.random()*(randomImages.length));
1785 var bgImg = 'url(' + randomImages[rndNum] + ')';
1786 $("#login-page").css('background-image', bgImg );
1787 });
1788 </script>
1789 </#macro>
1790 <#-- adminHeaderDocumentationLink -->
1791 <#macro adminHeaderDocumentationLink >
1792 <ol class="breadcrumb ${feature_group!?lower_case} is-pulled-right">
1793 <#if feature_documentation?has_content >
1794 <#if feature_documentation?exists>
1795 <div id="lutece-doc-link" class="has-background-light p-1">
1796 <a target="_blank" href="${feature_documentation}" title="#i18n{portal.features.documentation.help}">
1797 <i class="fa fa-life-ring" ></i> #i18n{portal.features.documentation.help}
1798 </a>
1799 </div>
1800 </#if>
1801 </#if>
1802 </ol>
1803 </#macro>
1804 <#macro adminSiteColumnOutline columnid=''>
1805 <div class="admin_column_outline">
1806 <span class="admin_column_id">${i18n("portal.site.columnId",columnid)}</span>
1807 <div>
1808 <#nested>
1809 </div>
1810 </div>
1811 </#macro>
1812 <#-- MACRO adminSiteToolbar -->
1813 <#macro adminSiteToolbar >
1814 <@btnToolbar>
1815 <@btnGroup>
1816 <@tform type='inline' action='jsp/admin/site/AdminSite.jsp' role='search'>
1817 <@input type='number' size='xs' name='page_id' id='page_id' title='${i18n("portal.site.admin_page.buttonSearchPage")}' placeHolder='22' params=' style="width:4rem;"' />
1818 <@button type='submit' color='primary' title='${i18n("portal.site.admin_page.buttonSearchPage")}' hideTitle=['all'] buttonIcon='search' />
1819 </@tform>
1820 </@btnGroup>
1821 <@btnGroup class='ms-1 ml-1'>
1822 <@aButton href='' id='display-full' title='#i18n{portal.site.admin_page.buttonLargeScreen}' buttonIcon='desktop' color='primary'hideTitle=['all'] />
1823 <@aButton href='' id='display-940' title='#i18n{portal.site.admin_page.buttonTablet}' buttonIcon='tablet' color='primary' hideTitle=['all'] />
1824 <@aButton href='' id='display-480' title='#i18n{portal.site.admin_page.buttonSmartphone}' buttonIcon='mobile' color='primary' hideTitle=['all'] />
1825 </@btnGroup>
1826 <#if page.id != 1>
1827 <@btnGroup class='ms-1 ml-1'>
1828 <@aButton href='jsp/admin/site/AdminSite.jsp?page_id=${page.parentPageId}' color='success' buttonIcon='arrow-up' title='#i18n{portal.site.admin_page.buttonUpToParentPage}' hideTitle=['all'] />
1829 <@aButton href='jsp/admin/site/RemovePage.jsp?page_id=${page.id}' color='danger btn-icon' buttonIcon='trash text-white' title='#i18n{portal.site.admin_page.buttonDeletePage}' hideTitle=['all'] />
1830 </@btnGroup>
1831 </#if>
1832 <@btnGroup class='ms-1 ml-1'>
1833 <#if portlet_types_list?has_content>
1834 <@aButton class='dropdown-toggle' id='portlet-type' dropdownMenu=true href='#' title='#i18n{portal.site.admin_page.labelPortletPage}' buttonIcon='th-large' hideTitle=['xs','sm','md']>
1835 <#list portlet_types_list?sort_by("name") as portlet_type>
1836 <@dropdownItem class='portlet-type-ref' href='jsp/admin/DoCreatePortlet.jsp?portlet_type_id=${portlet_type.id}&page_id=${page.id}' target='preview' title='${portlet_type.name}'>
1837 ${portlet_type.name}
1838 </@dropdownItem>
1839 </#list>
1840 </@aButton>
1841 </#if>
1842 <#if extendableResourceActionsHtml?? && extendableResourceActionsHtml?has_content>
1843 ${extendableResourceActionsHtml!}
1844 </#if>
1845 </@btnGroup>
1846 <@btnGroup class='ms-1 ml-1'>
1847 <@aButton href='jsp/admin/site/AdminSite.jsp?page_id=${page.id}&param_block=2' buttonIcon='wrench' title='#i18n{portal.site.admin_page.labelPageProperty}' hideTitle=['xs','sm','md'] />
1848 </@btnGroup>
1849 <@btnGroup class='ms-1 ml-1'>
1850 <@aButton href='jsp/admin/site/AdminSite.jsp?page_id=${page.id}&param_block=5' buttonIcon='plus' title='#i18n{portal.site.admin_page.labelChildPagePage}' hideTitle=['xs','sm','md'] />
1851 </@btnGroup>
1852 <@btnGroup class='ms-1 ml-1'>
1853 <@aButton href='jsp/admin/site/AdminMap.jsp?page_id=${page.id }' buttonIcon='sitemap' title='Page ${page.name} - Id ${page.id}' hideTitle=['all'] ><@span hide=['all']>#i18n{portal.site.admin_page.tabAdminMapSite}</@span></@aButton>
1854 </@btnGroup>
1855 <@btnGroup class='ms-1 ml-1'>
1856 <@aButton href='' id='fullscreen' title='#i18n{portal.site.admin_page.buttonFullscreen}' buttonIcon='arrows-alt' color='secondary' hideTitle=['all'] />
1857 </@btnGroup>
1858 </@btnToolbar>
1859 </#macro>
1860 <#-- adminMessagePage -->
1861 <#macro adminMessagePage title=''>
1862 <#assign color="info" />
1863 <#assign icontype="fa-info-circle" />
1864 <#if message.type == 2 >
1865 <#assign color="primary" />
1866 <#assign icontype="fa-question-circle" />
1867 <#elseif message.type == 3 >
1868 <#assign color="danger" />
1869 <#assign icontype="fa-exclamation-circle" />
1870 <#elseif message.type == 4 >
1871 <#assign color="danger" />
1872 <#assign icontype="fa-question-circle" />
1873 <#elseif message.type == 5 >
1874 <#assign color="danger" />
1875 <#assign icontype="fa-ban" />
1876 </#if>
1877 <script src="js/admin/jquery/jquery-3.5.1.min.js"></script>
1878 </head>
1879 <body>
1880 <section class="hero is-success is-fullheight" id="login-page">
1881 <div class="hero-body">
1882 <div class="container has-text-centered">
1883 <div class="column is-4 is-offset-4">
1884 <div class="box">
1885 <h3 class="title text-black">${title!"Info"}</h3>
1886 <#if text!=''><p class="message-body has-background-grey-lighter">${text}</p></#if>
1887 <#nested>
1888 </div>
1889 <p class="has-text-grey"></p>
1890 </div>
1891 </div>
1892 </div>
1893 </section>
1894 </#macro>
1895 <#-- HTML ELEMENTS -->
1896 <#macro img url='' alt='' title='' class='' id='' params=''>
1897 <img src="${url}" alt="<#if alt!=''>${alt!}<#else>${title!}</#if>" title="${title}" class="thumbnails thumb-list<#if class!=''> ${class}</#if>"<#if id!=''> id="${id}"</#if><#if params!=''> ${params}</#if> />
1898 </#macro>
1899 <#-- fieldSet -->
1900 <#macro fieldSet class='' fieldsetId='' fieldsetParams='' legend='' legendClass='' legendId='' legendIcon='' legendParams='' hideLegend=[] disabled=false>
1901 <fieldset class="box<#if class!=''> ${class}</#if>"<#if fieldsetId!=''> id="${fieldsetId}"</#if><#if fieldsetParams!=''> ${fieldsetParams}</#if><#if disabled> disabled</#if>>
1902 <#if legend!=''>
1903 <#local legendClass += ' ' + displaySettings(hideLegend,'block') />
1904 <legend class="label<#if legendClass!=''> ${legendClass?trim}</#if>" <#if legendId!=''> id="${legendId}"</#if><#if legendParams!=''> ${legendParams}</#if>><#if legendIcon!=''><@icon style=legendIcon /> </#if>${legend}</legend>
1905 </#if>
1906 <#nested>
1907 </fieldset>
1908 </#macro>
1909 <#-- Email Default Template -->
1910 <#macro emailTemplate title='Lutece' footer_link='https://lutece.paris.fr'>
1911 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
1912 <html xmlns="http://www.w3.org/1999/xhtml">
1913 <head>
1914 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
1915 <meta name="viewport" content="width=device-width"/>
1916 <style type="text/css">
1917 * { margin: 0; padding: 0; font-size: 100%; font-family: 'Avenir Next', "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; line-height: 1.65; }
1918 img { max-width: 100%; margin: 0 auto; display: block; }
1919 body, .body-wrap { width: 100% !important; height: 100%; background: #f8f8f8; }
1920 a { color: #007bff; text-decoration: none; }
1921 a:hover { text-decoration: underline; }
1922 .text-center { text-align: center; }
1923 .text-right { text-align: right; }
1924 .text-left { text-align: left; }
1925 .button { display: inline-block; color: white; background: #007bff; border: solid #007bff; border-width: 10px 20px 8px; font-weight: bold; border-radius: 4px; }
1926 .button:hover { text-decoration: none; }
1927 h1, h2, h3, h4, h5, h6 { margin-bottom: 20px; line-height: 1.25; }
1928 h1 { font-size: 32px; }
1929 h2 { font-size: 28px; }
1930 h3 { font-size: 24px; }
1931 h4 { font-size: 20px; }
1932 h5 { font-size: 16px; }
1933 p, ul, ol { font-size: 16px; font-weight: normal; margin-bottom: 20px; }
1934 .container { display: block !important; clear: both !important; margin: 0 auto !important; max-width: 580px !important; }
1935 .container table { width: 100% !important; border-collapse: collapse; }
1936 .container .masthead { padding: 80px 0; background: #007bff; color: white; }
1937 .container .masthead h1 { margin: 0 auto !important; max-width: 90%; text-transform: uppercase; }
1938 .container .content { background: white; padding: 30px 35px; }
1939 .container .content.footer { background: none; }
1940 .container .content.footer p { margin-bottom: 0; color: #888; text-align: center; font-size: 14px; }
1941 .container .content.footer a { color: #888; text-decoration: none; font-weight: bold; }
1942 .container .content.footer a:hover { text-decoration: underline; }
1943 </style>
1944 </head>
1945 <body>
1946 <table class="body-wrap">
1947 <tr>
1948 <td class="container">
1949 <!-- Message start -->
1950 <table>
1951 <tr>
1952 <td align="center" class="masthead">
1953 <h1>${title}</h1>
1954 </td>
1955 </tr>
1956 <tr>
1957 <td class="content">
1958 <#nested>
1959 </td>
1960 </tr>
1961 </table>
1962 </td>
1963 </tr>
1964 <tr>
1965 <td class="container">
1966 <!-- Message start -->
1967 <table>
1968 <tr>
1969 <td class="content footer" align="center">
1970 <p><a href="${footer_link}">Lutece</a></p>
1971 </td>
1972 </tr>
1973 </table>
1974 </td>
1975 </tr>
1976 </table>
1977 </body>
1978 </html>
1979 </#macro>
1980 <#macro adminLanguage languages lang action='jsp/admin/DoChangeLanguage.jsp' >
1981 <a class="navbar-link" href="javascript:return false;">
1982 <i class="fa fa-language"></i> <span>#i18n{portal.admin.admin_home.language}</span>
1983 </a>
1984 <@tform method='post' action=action>
1985 <input type="hidden" name="token" value="${token}">
1986 <#assign languageIcon=''>
1987 <#list languages as language>
1988 <#if lang==language.code>
1989 <#assign languageIcon='check'>
1990 </#if>
1991 <@button buttonIcon='${languageIcon} has-text-success' class='${language.code} is-fullwidth' type='submit' name='language' value='${language.code}' title='${language.name}'/>
1992 </#list>
1993 </@tform>
1994 </#macro>
1995 <#macro adminAccessibilityMode>
1996 <@tform method='post' action='jsp/admin/DoModifyAccessibilityMode.jsp' class=''>
1997 <input type="hidden" name="token" value="${token}">
1998 <#if user.accessibilityMode>
1999 <@button color='white' size='sm' type='submit' buttonIcon='eye' title='#i18n{portal.users.admin_header.labelDeactivateAccessibilityMode}'/>
2000 <#else>
2001 <@button color='white' size='sm' type='submit' buttonIcon='eye-slash' title='#i18n{portal.users.admin_header.labelActivateAccessibilityMode}'/>
2002 </#if>
2003 </@tform>
2004 </#macro>
2005 <#macro empty title='' subtitle='' iconName='mood-empty' img='' actionTitle='' actionBtn='primary' actionIcon='plus' actionUrl='#'>
2006 <div class="empty">
2007 <#if img=''>
2008 <div class="empty-icon">
2009 <@icon prefix='ti ti-' style='${iconName}' params='style="font-size:48px"' />
2010 </div>
2011 <#else>
2012 <div class="empty-img"><img src="${img}" height="128" alt=""></div>
2013 </#if>
2014 <p class="empty-title"><#if title=''>#i18n{portal.util.message.emptyTitle}<#else>${title}</#if></p>
2015 <#if subtitle !=''>
2016 <p class="empty-subtitle text-muted">
2017 ${subtitle}
2018 </p>
2019 <#else>
2020 <p class="empty-subtitle text-muted">
2021 #i18n{portal.util.message.emptySubTitle}
2022 </p>
2023 </#if>
2024 <#if actionTitle !=''>
2025 <div class="empty-action">
2026 <a href="${actionUrl}" class="btn btn-${actionBtn}">
2027 <#if actionIcon !=''><@icon prefix='ti ti-' style='${actionIcon}' /></#if> ${actionTitle}
2028 </a>
2029 </div>
2030 </#if>
2031 </div>
2032 </#macro>
2033 <#macro timeline class='' id='' params=''>
2034 <div class="timeline<#if class !=''> ${class}</#if>"<#if id !=''> id="${id}"</#if><#if params !=''> ${params}</#if>>
2035 <#nested>
2036 </div>
2037 </#macro>
2038 <#macro timelineLabel bg='primary' label='' class='' id='' params=''>
2039 <!-- no label -->
2040 </#macro>
2041 <#macro timelineItem iconFace='check' iconBg='bg-primary' time='' label='' footer='' class='' id='' params=''>
2042 <div class="timeline-item<#if class !=''> ${class}</#if>" <#if id !=''> id="${id}"</#if><#if params !=''> ${params}</#if>>
2043 <#assign timelineIcon>${iconFace} ${iconBg}</#assign>
2044 <div class="timeline-marker<#if iconFace !=''> is-icon</#if>"><#if iconFace !=''><@icon style=timelineIcon /></#if></div>
2045 <div class="timeline-content">
2046 <#if label !=''><p class="heading">${label}</p></#if>
2047 <#nested>
2048 </div>
2049 </div>
2050 </#macro>
2051 <#-- scroll to top button -->
2052 <#macro scrollTopBtn>
2053 <a href="#" id="scroll" style="display: none;"><span></span></a>
2054 <script>
2055 $( function(){
2056 $(window).scroll(function(){
2057 if ( $(this).scrollTop() > 100) {
2058 $('#scroll').fadeIn();
2059 } else {
2060 $('#scroll').fadeOut();
2061 }
2062 });
2063 $('#scroll').click(function(){
2064 $("html, body").animate({ scrollTop: 0 }, 600);
2065 return false;
2066 });
2067 });
2068 </script>
2069 </#macro>
2070 <#-- copyElementToClipboard a set of elements designed by a selector - param "selector" -->
2071 <#-- Params -->
2072 <#-- selector : Any CSS selector expression -->
2073 <#-- class : Default '' : List of class with double quote with comma separator -->
2074 <#-- Possible values : "no-hover" No icon on hover - .no-hover portal_admin.css -->
2075 <#-- Possible values : "copy-icon" Icon always shown - . see portal_admin.css -->
2076 <#-- Possible values : "copy-btn" Icon and Button styles - -->
2077 <#-- Ex for multiple classes : "class1","class2" -->
2078 <#-- showMsg : Default false : If true a message is show after copy -->
2079 <#-- msgDone : Default "Copied" : Success message -->
2080 <#-- msgError : Default "Error : not copied" : Error message -->
2081 <#-- Usage -->
2082 <#-- Basic : <@copyElementToClipboard selector='.copy-content' /> -->
2083 <#-- No message : <@copyElementToClipboard selector='.copy-content' showMsg=false /> -->
2084 <#-- No Hover : <@copyElementToClipboard selector='.copy-content' class='"no-hover"' /> -->
2085 <#-- With icon shown : <@copyElementToClipboard selector='.copy-content' class='"copy-icon"' /> -->
2086 <#macro copyElementToClipboard selector class='' showMsg=true msgDone='#i18n{portal.util.copy.done}' msgError='#i18n{portal.util.copy.error}'>
2087 <script>
2088 const elems = document.querySelectorAll('${selector!}');
2089 elems.forEach(elem => {
2090 <#if class !=''>elem.classList.add( ${class!} );</#if>
2091 elem.setAttribute('title', '#i18n{portal.util.labelCopy}');
2092 elem.addEventListener('click', () => {
2093 const selection = window.getSelection();
2094 const range = document.createRange();
2095 range.selectNodeContents(elem);
2096 selection.removeAllRanges();
2097 selection.addRange(range);
2098 try {
2099 document.execCommand('copy');
2100 selection.removeAllRanges();
2101 <#if showMsg>
2102 const original = elem.textContent;
2103 elem.textContent = '${msgDone}';
2104 elem.classList.add('msg-success');
2105 setTimeout(() => {
2106 elem.textContent = original;
2107 elem.classList.remove('msg-success');
2108 }, 1200);
2109 </#if>
2110 } catch(e) {
2111 <#if showMsg>
2112 const original = elem.textContent;
2113 elem.textContent = '${msgError}';
2114 elem.classList.add('msg-error');
2115 setTimeout(() => {
2116 elem.textContent = original;
2117 elem.classList.remove('msg-danger');
2118 }, 1200);
2119 </#if>
2120 }
2121 });
2122 });
2123 </script>
2124 </#macro>
2125 <#-- initToast -->
2126 <#-- Params -->
2127 <#-- layout='popups' -->
2128 <#-- position='top-right' -->
2129 <#-- closer=false -->
2130 <#-- sticky=false -->
2131 <#-- progressbar=true -->
2132 <#-- theme='default' -->
2133 <#-- duration=3000 -->
2134 <#-- pool=5 -->
2135 <#macro initToast layout='popups' position='top-right' closer=true sticky=false progressbar=true insert='before' theme='default' duration=3000 pool=5 >
2136 <script>
2137 $( function(){
2138 var lutecepolipop = new Polipop('lutecepop', {
2139 layout: '${layout}',
2140 position: '${position}',
2141 theme: '${theme}',
2142 life: ${duration?c},
2143 insert: '${insert}',
2144 closer: ${closer?c},
2145 closeText : '#i18n{portal.util.labelClose}',
2146 sticky: ${sticky?c},
2147 progressbar: ${progressbar?c},
2148 pool: ${pool},
2149 });
2150 <#-- Add addToast macro in your template -->
2151 <#nested>
2152 });
2153 </script>
2154 </#macro>
2155 <#-- addToast -->
2156 <#-- Params -->
2157 <#-- title : Default "Error : not copied" : Error message -->
2158 <#-- msg : Default "Copied" : Success message -->
2159 <#-- type : Default "default" ['info', 'danger', 'success' 'warning'] -->
2160 <#macro addToast title content type='default' >
2161 lutecepolipop.add({
2162 content: '${content}',
2163 title: '${title}',
2164 type: '${type}',
2165 });
2166 </#macro>
2167 <#-- selectIconFont -->
2168 <#-- Params -->
2169 <#-- id : Default "selectIcon" : Id for select -->
2170 <#-- class : Default '' : List of class for select -->
2171 <#-- name : Default "resource-icon" : Name for submit -->
2172 <#-- showListLabel : Default true : Show icons' label -->
2173 <#-- showListIcon : Default true : Show icons' icon -->
2174 <#-- searchShow : Default true : Show search field in select -->
2175 <#-- searchFocus : Default false : It true set focus in search fiedl -->
2176 <#-- searchHighlight : Default true : Highlight searched chars in list -->
2177 <#-- type : Default 'yaml' : Possible values : ['yaml','json'] -->
2178 <#-- prefix : Default 'fa' : ['fa','bi-', [ti ti-],...] Prefix for icon family -->
2179 <#-- iconsUrl : Default 'css/admin/font-awesome-icons.yml' : File url to retrieve icon name list -->
2180 <#-- resources : Default true : If true load slimselect js lib and css. -->
2181 <#-- Only needed once, so set to false if you user this macro more than once -->
2182 <#-- FontAwesome icons yaml dowloaded from https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/metadata/icons.yml -->
2183 <#macro selectIconFont id='selectIcon' class='' name='resource-icon' showListLabel=true showListIcon=true searchShow=true searchFocus=false searchHighlight=true type='yaml' prefix='fa-' iconsUrl='css/admin/font-awesome-icons.yml' resources=true defaultValue=''>
2184 <@select name='${name}' id='${id}' />
2185 <#if resources>
2186 <link rel="stylesheet" href="js/admin/lib/slimselect/slimselect.min.css">
2187 <script src="js/admin/lib/slimselect/slimselect.min.js"></script>
2188 <#if type='yaml'>
2189 <!-- js yaml parser -->
2190 <script src="js/admin/lib/slimselect/js-yaml.min.js"></script>
2191 </#if>
2192 </#if>
2193 <script>
2194 $.get('${iconsUrl}', function(data) {
2195 <#if type='yaml'>
2196 let parsedIcons = jsyaml.load(data)
2197 <#else>
2198 <#-- Json / Object -->
2199 let parsedIcons='';
2200 if( typeof data === 'object' ){
2201 parsedIcons = data;
2202 } else {
2203 parsedIcons = JSON.parse( data )
2204 }
2205 </#if>
2206 $.each( parsedIcons, function(index, icon){
2207 let i=0, prefix='${prefix}';
2208 let selected = '${defaultValue}' == index ? 'selected' : '';
2209 <#if type='yaml'>
2210 <#-- FontAwesome specific / Other lib add another test/treatment -->
2211 while( i < icon.styles.length ){
2212 switch ( icon.styles[i] ) {
2213 case 'regular':
2214 prefix = 'far'
2215 break;
2216 case 'solid':
2217 prefix = 'fas'
2218 break;
2219 case 'light':
2220 prefix = 'fal'
2221 break;
2222 case 'brands':
2223 prefix = 'fab'
2224 break;
2225 }
2226 $('#${id}').append('<option value="' + index + '"' + selected + '> <#if showListIcon><span class="' + prefix + ' fa-'+ index + ' mr-1" ' + selected + ' ></span> </#if>' <#if showListLabel>+ icon.label + ' [' + icon.styles[i] + ']'</#if>+ '</option>');
2227 i++;
2228 }
2229 <#else>
2230 <#-- Json / Object -->
2231 $('#${id}').append('<option value="' + index + '" ' + selected + ' > <#if showListIcon><span class="' + prefix + ' fa-'+ index + '"></span> </#if>' <#if showListLabel>+ index </#if>+ '</option>');
2232 </#if>
2233 });
2234 new SlimSelect({
2235 select: '#${id}',
2236 showSearch: ${searchShow?c},
2237 searchText: "#i18n{portal.util.labelNoItem}",
2238 searchPlaceholder: '#i18n{portal.util.labelSearch}',
2239 searchFocus: ${searchFocus?c}, // Whether or not to focus on the search input field
2240 searchHighlight: ${searchHighlight?c}
2241 })
2242 });
2243 </script>
2244 </#macro>
2245 <#-- Display wrong or deprecated macro arguments -->
2246 <#macro deprecatedWarning args=[] >
2247 <#if args?size != 0 ><!-- Warning : wrong or deprecated argument(s) : <#list args?keys as key >${key}, </#list> ... --></#if>
2248 </#macro>
2249 <#macro adminDashboardPanel title='' parentId='' childId='' icon='' color=''>
2250 <#assign parentId = parentId />
2251 <@accordionPanel color=color collapsed=true childId=childId>
2252 <@accordionHeader id=id title=title headerIcon=icon></@accordionHeader>
2253 <@accordionBody>
2254 <#nested>
2255 </@accordionBody>
2256 </@accordionPanel>
2257 </#macro>
2258 <#-- JStree Macro -->
2259 <#macro jsTreeInit id='tree' btntreeSearch='treesearch' multiple=false plugins=[] style='proton/style.min.css'>
2260 <link rel="stylesheet" href="js/admin/lib/jstree/themes/proton/style.min.css" >
2261 <script src="js/admin/lib/jstree/jstree.min.js"></script>
2262 <script>
2263 $(function(){
2264 let selectedTree=jsTreeId=localStorage.getItem('jsTreeSelectedId' );
2265
2266 $('#tree').jstree({
2267 'core': {
2268 'multiple' : false,
2269 'themes': {
2270 'name': 'proton',
2271 'responsive': true
2272 }
2273 },
2274 'plugins' : [ 'search' , 'wholerow' ,'changed' ]
2275 }).on('click', function( e ){
2276 window.location.replace( e.target.getAttributeNode('href').value );
2277 }).on("changed.jstree", function (e, data) {
2278 localStorage.setItem( 'jsTreeSelectedId', data.changed.selected );
2279 });
2280
2281 $('#tree').jstree( 'select_node', jsTreeId );
2282
2283 var to = false;
2284 $('#treesearch').keyup(function () {
2285 if(to) { clearTimeout(to); }
2286 to = setTimeout(function () {
2287 var v = $('#treesearch').val();
2288 $('#tree').jstree(true).search(v);
2289 }, 250);
2290 });
2291
2292 });
2293 </script>
2294 </#macro>
2295 <#macro jsTreeSearch >
2296 <@formGroup formStyle='inline' labelKey='#i18n{portal.site.admin_page.buttonSearchPage}' hideLabel=['all']>
2297 <@inputGroup size='sm'>
2298 <@input type='text' id='tree_search' name='tree_search' placeHolder='#i18n{portal.site.admin_page.buttonSearchPage}' />
2299 <@inputGroupItem>
2300 <@button id='btn-tree_search' color='link' type='button' title='#i18n{portal.site.admin_page.buttonSearchPage}' buttonIcon='search' hideTitle=['all'] />
2301 </@inputGroupItem>
2302 </@inputGroup>
2303 </@formGroup>
2304 </#macro>
2305 <#-- Display wrong or deprecated macro arguments -->
2306 <#macro deprecatedWarning args=[] >
2307 <#if args?size != 0 ><!-- Warning : wrong or deprecated argument(s) : <#list args?keys as key >${key}, </#list> ... --></#if>
2308 </#macro>
2309 <#macro codeHighLight >
2310 <link rel="stylesheet" href="js/admin/lib/prism/prism.css">
2311 <link rel="stylesheet" href="js/admin/lib/prism/prism-live.css">
2312 <script src="js/admin/lib/prism/prism.js"></script>
2313 <script src="js/admin/lib/prism/prism-live.js"></script>
2314 </#macro>