dolibarr 21.0.0-beta
progress-bars.php
1<?php
2/*
3 * Copyright (C) 2024 Anthony Damhet <a.damhet@progiseize.fr>
4 * Copyright (C) 2024 Frédéric France <frederic.france@free.fr>
5 *
6 * This program is free software; you can redistribute it and/or modify
7 * it under the terms of the GNU General Public License as published by
8 * the Free Software Foundation; either version 3 of the License, or
9 * (at your option) any later version.
10 *
11 * This program is distributed in the hope that it will be useful,
12 * but WITHOUT ANY WARRANTY; without even the implied warranty of
13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
14 * GNU General Public License for more details.
15 *
16 * You should have received a copy of the GNU General Public License
17 * along with this program. If not, see <https://www.gnu.org/licenses/>.
18 */
19
20// Load Dolibarr environment
21require '../../../../main.inc.php';
22
30// Protection if external user
31if ($user->socid > 0) {
33}
34
35// Includes
36require_once DOL_DOCUMENT_ROOT . '/admin/tools/ui/class/documentation.class.php';
37
38// Load documentation translations
39$langs->load('uxdocumentation');
40
41//
42$documentation = new Documentation($db);
43
44$morejs = [
45 '/includes/ace/src/ace.js',
46 '/includes/ace/src/ext-statusbar.js',
47 '/includes/ace/src/ext-language_tools.js',
48];
49// Output html head + body - Param is Title
50$documentation->docHeader('Progress-bars', $morejs);
51
52// Set view for menu and breadcrumb
53// Menu must be set in constructor of documentation class
54$documentation->view = array('Components','Progress');
55
56// Output sidebar
57$documentation->showSidebar(); ?>
58
59<div class="doc-wrapper">
60
61 <?php $documentation->showBreadCrumb(); ?>
62
63 <div class="doc-content-wrapper">
64
65 <h1 class="documentation-title"><?php echo $langs->trans('DocProgressBarsTitle'); ?></h1>
66 <p class="documentation-text"><?php echo $langs->trans('DocProgressBarsMainDescription'); ?></p>
67
68 <!-- Summary -->
69 <?php $documentation->showSummary(); ?>
70
71 <!-- Basic usage -->
72 <div class="documentation-section" id="progresse-section-basic-usage">
73 <h2 class="documentation-title"><?php echo $langs->trans('DocBasicUsage'); ?></h2>
74 <p class="documentation-text"><?php echo $langs->trans('DocProgressBarsDescription'); ?></p>
75 <div class="documentation-example">
76
77 <?php echo 'Xss'; ?>
78 <div class="progress xxs spaced" title="10%">
79 <div class="progress-bar" role="progressbar" style="width: 10%" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"></div>
80 </div>
81
82 <?php echo 'Xs'; ?>
83 <div class="progress xs spaced" title="20%">
84 <div class="progress-bar" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
85 </div>
86
87 <?php echo 'Sm'; ?>
88 <div class="progress sm spaced" title="40%">
89 <div class="progress-bar" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
90 </div>
91
92 <?php echo $langs->trans('Default'); ?>
93 <div class="progress" title="80%">
94 <div class="progress-bar" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
95 </div>
96 </div>
97
98 <?php
99 $lines = array(
100 '<div class="progress xxs" title="10%">',
101 ' <div class="progress-bar" role="progressbar" style="width: 10%" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"></div>',
102 '</div>',
103 '',
104 '<div class="progress xs" title="20%">',
105 ' <div class="progress-bar" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>',
106 '</div>',
107 '',
108 '<div class="progress sm" title="40%">',
109 ' <div class="progress-bar" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
110 '</div>',
111 '',
112 '<div class="progress" title="80%">',
113 ' <div class="progress-bar" role="progressbar" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>',
114 '</div>',
115 );
116 echo $documentation->showCode($lines); ?>
117
118 <p class="documentation-text"><?php echo $langs->trans('DocProgressCanBeSpaced'); ?></p>
119 <div class="documentation-example">
120 <div class="progress spaced" title="40%">
121 <div class="progress-bar" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
122 </div>
123 </div>
124
125 <?php
126 $lines = array(
127 '<div class="progress spaced" title="40%">',
128 ' <div class="progress-bar" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
129 '</div>',
130 );
131 echo $documentation->showCode($lines); ?>
132
133 </div>
134
135
136 <!-- Colors usage -->
137 <div class="documentation-section" id="progress-section-color">
138 <h2 class="documentation-title"><?php echo $langs->trans('DocColorVariants'); ?></h2>
139 <p class="documentation-text"><?php echo $langs->trans('DocColorVariantsDesc'); ?></p>
140 <div class="documentation-example">
141 <div class="progress spaced" title="40%">
142 <div class="progress-bar progress-bar-success" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
143 </div>
144 <div class="progress spaced" title="40%">
145 <div class="progress-bar progress-bar-warning" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
146 </div>
147 <div class="progress spaced" title="40%">
148 <div class="progress-bar progress-bar-info" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
149 </div>
150 <div class="progress spaced" title="40%">
151 <div class="progress-bar progress-bar-danger" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
152 </div>
153 </div>
154
155 <?php
156 $lines = array(
157 '<div class="progress" title="40%">',
158 ' <div class="progress-bar progress-bar-success" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
159 '</div>',
160 '',
161 '<div class="progress" title="40%">',
162 ' <div class="progress-bar progress-bar-warning" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
163 '</div>',
164 '',
165 '<div class="progress" title="40%">',
166 ' <div class="progress-bar progress-bar-info" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
167 '</div>',
168 '',
169 '<div class="progress" title="40%">',
170 ' <div class="progress-bar progress-bar-danger" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
171 '</div>',
172 '',
173
174 );
175 echo $documentation->showCode($lines); ?>
176 </div>
177
178
179 <!-- Striped usage -->
180 <div class="documentation-section" id="progresse-section-stripped">
181 <h2 class="documentation-title"><?php echo $langs->trans('DocStripedVariants'); ?></h2>
182 <p class="documentation-text"><?php echo $langs->trans('DocStripedVariantsDesc'); ?></p>
183
184 <div class="documentation-example">
185 <div class="progress spaced progress-striped" title="40%">
186 <div class="progress-bar progress-bar-success" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
187 </div>
188 <div class="progress spaced progress-striped" title="40%">
189 <div class="progress-bar progress-bar-warning" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
190 </div>
191 <div class="progress spaced progress-striped" title="40%">
192 <div class="progress-bar progress-bar-info" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
193 </div>
194 <div class="progress spaced progress-striped" title="40%">
195 <div class="progress-bar progress-bar-danger" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
196 </div>
197 </div>
198
199 <?php
200 $lines = array(
201 '<div class="progress progress-striped" title="40%">',
202 ' <div class="progress-bar progress-bar-success" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
203 '</div>',
204 '',
205 '<div class="progress progress-striped" title="40%">',
206 ' <div class="progress-bar progress-bar-warning" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
207 '</div>',
208 '',
209 '<div class="progress progress-striped" title="40%">',
210 ' <div class="progress-bar progress-bar-info" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
211 '</div>',
212 '',
213 '<div class="progress progress-striped" title="40%">',
214 ' <div class="progress-bar progress-bar-danger" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
215 '</div>',
216 '',
217
218 );
219 echo $documentation->showCode($lines); ?>
220 </div>
221 <!-- -->
222
223
224 <!-- other usage -->
225 <div class="documentation-section" id="progresse-section-stripped">
226 <h2 class="documentation-title"><?php echo $langs->trans('DocOtherVariants'); ?></h2>
227 <p class="documentation-text"><?php echo $langs->trans('DocOtherVariantsDesc'); ?></p>
228
229 <div class="documentation-example">
230 .progress-bar-consumed
231 <div class="progress spaced progress-bar-consumed" title="40%">
232 <div class="progress-bar" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
233 </div>
234 .progress-bar-consumed-late
235 <div class="progress spaced progress-bar-consumed" title="40%">
236 <div class="progress-bar" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
237 </div>
238 </div>
239
240 <?php
241 $lines = array(
242 '<div class="progress progress-striped" title="40%">',
243 ' <div class="progress-bar progress-bar-success" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
244 '</div>',
245 '',
246 '<div class="progress progress-striped" title="40%">',
247 ' <div class="progress-bar progress-bar-warning" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
248 '</div>',
249 '',
250 '<div class="progress progress-striped" title="40%">',
251 ' <div class="progress-bar progress-bar-info" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
252 '</div>',
253 '',
254 '<div class="progress progress-striped" title="40%">',
255 ' <div class="progress-bar progress-bar-danger" role="progressbar" style="width: 40%" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>',
256 '</div>',
257 '',
258 '',
259
260 );
261 echo $documentation->showCode($lines); ?>
262 </div>
263 <!-- -->
264
265
266 </div>
267
268 </div>
269
270<?php
271// Output close body + html
272$documentation->docFooter();
273?>
Class to manage UI documentation.
usage($program, $header)
Print the usage when executing scripts from install/.
Definition inc.php:94
accessforbidden($message='', $printheader=1, $printfooter=1, $showonlymessage=0, $params=null)
Show a message to say access is forbidden and stop program.