Files
dolibarr/htdocs/admin/tools/ui/components/icons.php
ldestailleur 5aee279f5a Clean code
2025-10-10 14:47:31 +02:00

567 lines
13 KiB
PHP

<?php
/*
* Copyright (C) 2024 Anthony Damhet <a.damhet@progiseize.fr>
*
* This program and files/directory inner it is free software: you can
* redistribute it and/or modify it under the terms of the
* GNU Affero General Public License (AGPL) as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU AGPL for more details.
*
* You should have received a copy of the GNU AGPL
* along with this program. If not, see <https://www.gnu.org/licenses/agpl-3.0.html>.
*/
// Load Dolibarr environment
require '../../../../main.inc.php';
/**
* @var DoliDB $db
* @var HookManager $hookmanager
* @var Translate $langs
* @var User $user
*/
// Protection if external user
if ($user->socid > 0) {
accessforbidden();
}
// Includes
require_once DOL_DOCUMENT_ROOT . '/admin/tools/ui/class/documentation.class.php';
// Load documentation translations
$langs->load('uxdocumentation');
//
$documentation = new Documentation($db);
// Output html head + body - Param is Title
$documentation->docHeader('Icons', [], ['admin/tools/ui/css/doc-icons.css'], GETPOST('hidenavmenu'));
// Set view for menu and breadcrumb
// Menu must be set in constructor of documentation class
$documentation->view = array('Components','Icons');
$form = new Form($db);
$mode=GETPOST('mode'); // ex : no-btn
$displayMode = GETPOST('displayMode') == 'kanban' ? 'kanban' : 'icon-only';
$revertDisplayMode = $displayMode == 'kanban' ? 'icon-only' : 'kanban';
$revertDisplayName = $displayMode == 'kanban' ? $langs->trans('ViewList') : $langs->trans('ViewKanban');
$switchDisplayLink = dol_buildpath($documentation->baseUrl . '/components/icons.php', 1) . '?displayMode=' . $revertDisplayMode;
$switchDisplayLinkIcon = $displayMode == 'kanban' ? 'fa fa-th' : 'fa fa-th-list';
// Output sidebar
if (!GETPOST('hidenavmenu')) {
$documentation->showSidebar();
}
?>
<div class="doc-wrapper<?php print GETPOST('hidenavmenu') ? "-bis" : ""; ?>">
<?php
if (!GETPOST('hidenavmenu')) {
$documentation->showBreadCrumb();
}
?>
<div class="doc-content-wrapper">
<h1 class="documentation-title"><?php echo $langs->trans('DocIconsTitle'); ?></h1>
<p class="documentation-text"><?php echo $langs->trans('DocIconsMainDescription'); ?></p>
<!-- Summary -->
<?php $documentation->showSummary(); ?>
<br>
<!-- List of usage font awesome icon -->
<div class="documentation-section" id="img-picto-section-list">
<?php
$iconFileName = 'shims.json';
$iconFilePath = DOL_DOCUMENT_ROOT . '/theme/common/fontawesome-5/metadata';
$fontAwesomeIconRaw = file_get_contents($iconFilePath. '/' .$iconFileName);
if ($fontAwesomeIconRaw === false) {
dol_print_error($db, 'Error missing file '. $iconFilePath . '/' . $iconFileName);
}
$fontAwesomeIcons = json_decode($fontAwesomeIconRaw);
if ($fontAwesomeIcons === null) {
dol_print_error($db, 'Error decoding '. $iconFilePath . '/' . $iconFileName);
}
?>
<h2 class="documentation-title"><?php echo $langs->trans('DocIconsListImgPicto'); ?></h2>
<?php /* <p class="documentation-text"><?php echo $langs->trans('DocDocIconsListDescription'); ?></p>*/ ?>
<?php print $form->getSearchFilterToolInput(
'.documentation-img-picto-icon-list .info-box, .documentation-img-picto-icon-list .doc-icon-list-item',
'search-tools-input',
'',
['attr' => [
'data-no-item-target' => '#img-picto-section-list .search-tool-no-results',
],
]
); ?>
<div class="right">
<?php
if ($mode != 'no-btn') {
print dolGetButtonTitle($revertDisplayName, '', $switchDisplayLinkIcon, $switchDisplayLink.'#img-picto-section-list', '', 1, ['forcenohideoftext'=>1]);
}
?>
</div>
<div class="documentation-example">
<div class="documentation-img-picto-icon-list">
<?php
$arrayofdolibarriconkey = getImgPictoNameList();
foreach ($arrayofdolibarriconkey as $iconName) {
$labelAlt = 'Text on title tag for tooltip';
if ($displayMode == 'kanban') {
$iconCode = img_picto($iconName, $iconName);
print '<div class="info-box ">
<span class="info-box-icon bg-infobox-expensereport">
'.$iconCode.'
</span>
<div class="info-box-content">
<div class="info-box-title" >'. $iconName .'</div>
<div class="info-box-lines">
<div class="info-box-line spanoverflow nowrap">
<div class="inline-block nowraponall">
<div class="documentation-code"><pre>'.dol_htmlentities('img_picto(\''.$labelAlt.'\', \''.$iconName.'\')').'</pre></div>
</div>
</div>
</div><!-- /.info-box-lines -->
</div><!-- /.info-box-content -->
</div>';
} else {
$tooltip = '<u>'.$langs->trans("DocCodeForMenuOrModuleBuilder").':</u><br>'.$iconName;
$tooltip .= '<br><br><u>'.$langs->trans("DocExampleForPHPCode").':</u><br>img_picto(\''.$labelAlt.'\', \''.$iconName.'\')';
$iconCode = img_picto($tooltip, $iconName, '', 0, 0, 0, '', 'classfortooltip');
print '<span class="doc-icon-list-item">'.$iconCode;
print '<span class="doc-icon-hidden-name-for-search">'.$iconName.'</span></span>';
}
}
?>
</div>
<div class="search-tool-no-results center hidden-search-result" ><?php print $langs->trans('NoResults') ?></div>
</div>
</div>
<!-- -->
<br><br>
<!-- List of usage font awesome icon -->
<div class="documentation-section" id="icon-section-list">
<?php
$iconFileName = 'shims.json';
$iconFilePath = DOL_DOCUMENT_ROOT . '/theme/common/fontawesome-5/metadata';
$fontAwesomeIconRaw = file_get_contents($iconFilePath. '/' .$iconFileName);
if ($fontAwesomeIconRaw === false) {
dol_print_error($db, 'Error missing file '. $iconFilePath . '/' . $iconFileName);
}
$fontAwesomeIcons = json_decode($fontAwesomeIconRaw);
if ($fontAwesomeIcons === null) {
dol_print_error($db, 'Error decoding '. $iconFilePath . '/' . $iconFileName);
}
?>
<h2 class="documentation-title"><?php echo $langs->trans('DocIconsListFontAwesome'); ?></h2>
<?php /* <p class="documentation-text"><?php echo $langs->trans('DocDocIconsListDescription'); ?></p>*/ ?>
<?php print $form->getSearchFilterToolInput('.documentation-fontawesome-icon-list .info-box, .documentation-fontawesome-icon-list .doc-icon-list-item',
'search-tools-input',
'',
['attr' => [
'data-no-item-target' => '#icon-section-list .search-tool-no-results',
],
]
); ?>
<div class="right">
<?php
if ($mode != 'no-btn') {
print dolGetButtonTitle($revertDisplayName, '', $switchDisplayLinkIcon, $switchDisplayLink.'#icon-section-list', '', 1, ['forcenohideoftext'=>1]);
}
?>
</div>
<div class="documentation-example">
<div class="documentation-fontawesome-icon-list">
<?php
$alreadyDisplay = [];
if ($fontAwesomeIcons && is_array($fontAwesomeIcons)) {
foreach ($fontAwesomeIcons as $iconData) {
$class= $iconData[1]??'fa';
if (!empty($iconData[2])) {
$class.= ' fa-'.$iconData[2];
} else {
$class.= ' fa-'.$iconData[0];
}
if (in_array($class, $alreadyDisplay)) {
continue;
}
$alreadyDisplay[] = $class;
$iconCode = '<span class="'.$class.'" ></span>';
if ($displayMode == 'kanban') {
print '<div class="info-box ">
<span class="info-box-icon bg-infobox-expensereport">
' . $iconCode . '
</span>
<div class="info-box-content">
<div class="info-box-title" >' . ($iconData[2] ?? ($iconData[0] ?? '')) . '</div>
<div class="info-box-lines">
<div class="info-box-line spanoverflow nowrap">
<div class="inline-block nowraponall">
<div class="documentation-code"><pre>' . dol_htmlentities($iconCode) . '</pre></div>
</div>
</div>
</div><!-- /.info-box-lines -->
</div><!-- /.info-box-content -->
</div>';
} else {
$tooltip = '<u>'.$langs->trans("DocCodeForMenuOrModuleBuilder").':</u><br>'.$class;
print '<span class="doc-icon-list-item classfortooltip" title="'.dol_escape_htmltag($tooltip).'">'.$iconCode.'<span class="doc-icon-hidden-name-for-search">'.$class.'</span></span>';
}
}
}
?>
</div>
<div class="search-tool-no-results center hidden-search-result" ><?php print $langs->trans('NoResults') ?></div>
</div>
</div>
<!-- -->
</div>
</div>
<?php
// Output close body + html
$documentation->docFooter();
/**
* Get all usage icon key usable for img_picto(..., key)
*
* @return string[]
* @see getImgPictoConv()
*/
function getImgPictoNameList()
{
return array_merge(array_keys(getImgPictoConv()), array(
// Reduce this list to picto that are not already into getImgPictoConv()
'1downarrow',
'1uparrow',
'1leftarrow',
'1rightarrow',
'1uparrow_selected',
'1downarrow_selected',
'1leftarrow_selected',
'1rightarrow_selected',
'accountancy',
'accounting_account',
'account',
'accountline',
'action',
'add',
'address',
'ai',
'angle-double-down',
'angle-double-up',
'asset',
'back',
'bank_account',
'barcode',
'bank',
'bell',
'bill',
'billa',
'billr',
'billd',
'birthday-cake',
'blockedlog',
'bom',
'bookcal',
'bookmark',
'briefcase-medical',
'bug',
'building',
'card',
'calendarlist',
'calendar',
'calendarmonth',
'calendarweek',
'calendarday',
'calendarperuser',
'calendarpertype',
'hourglass',
'cash-register',
'category',
'chart',
'check',
'clock',
'clone',
'close_title',
'code',
'cog',
'collab',
'company',
'contact',
'country',
'contract',
'conversation',
'cron',
'cross',
'cubes',
'check-circle',
'check-square',
'circle',
'stop-circle',
'currency',
'multicurrency',
'chevron-left',
'chevron-right',
'chevron-down',
'chevron-up',
'chevron-double-left',
'chevron-double-right',
'chevron-double-down',
'chevron-double-top',
'commercial',
'companies',
'delete',
'dolly',
'dollyrevert',
'donation',
'download',
'dynamicprice',
'edit',
'ellipsis-h',
'email',
'entity',
'envelope',
'eraser',
'establishment',
'expensereport',
'external-link-alt',
'external-link-square-alt',
'eye',
'filter',
'file',
'file-o',
'file-code',
'file-export',
'file-import',
'file-upload',
'autofill',
'folder',
'folder-open',
'folder-plus',
'font',
'generate',
'generic',
'globe',
'globe-americas',
'graph',
'grip',
'grip_title',
'group',
'hands-helping',
'help',
'holiday',
'id-card',
'images',
'incoterm',
'info',
'info_black',
'intervention',
'inventory',
'intracommreport',
'jobprofile',
'key',
'knowledgemanagement',
'label',
'language',
'layout',
'line',
'link',
'list',
'list-alt',
'listlight',
'loan',
'lock',
'lot',
'long-arrow-alt-right',
'margin',
'map-marker-alt',
'member',
'meeting',
'minus',
'money-bill-alt',
'movement',
'mrp',
'note',
'next',
'off',
'on',
'order',
'paragraph',
'play',
'pdf',
'phone',
'phoning',
'phoning_mobile',
'phoning_fax',
'playdisabled',
'previous',
'poll',
'pos',
'printer',
'product',
'propal',
'proposal',
'puce',
'resize',
'search',
'service',
'stats',
'stock',
'security',
'setup',
'share-alt',
'sign-out',
'split',
'stripe',
'stripe-s',
'switch_off',
'switch_on',
'switch_on_grey',
'switch_on_warning',
'switch_on_red',
'tools',
'unlink',
'uparrow',
'user',
'user-tie',
'vcard',
'wrench',
'discord',
'facebook',
'flickr',
'instagram',
'linkedin',
'github',
'google',
'jabber',
'meetup',
'microsoft',
'skype',
'slack',
'twitter',
'pinterest',
'reddit',
'snapchat',
'tumblr',
'youtube',
'viadeo',
'google-plus-g',
'whatsapp',
'generic',
'home',
'hrm',
'members',
'products',
'invoicing',
'partnership',
'payment',
'payment_vat',
'pencil-ruler',
'pictoconfirm',
'preview',
'project',
'projectpub',
'projecttask',
'question',
'refresh',
'region',
'salary',
'shipment',
'state',
'supplier_invoice',
'supplier_invoicea',
'supplier_invoicer',
'supplier_invoiced',
'technic',
'ticket',
'error',
'warning',
'recent',
'reception',
'recruitmentcandidature',
'recruitmentjobposition',
'replacement',
'resource',
'recurring',
'rss',
'search-plus',
'shapes',
'skill',
'square',
'sort-numeric-down',
'status',
'stop-circle',
'supplier',
'supplier_proposal',
'supplier_order',
'supplier_invoice',
'terminal',
'tick',
'timespent',
'title_setup',
'title_accountancy',
'title_bank',
'title_hrm',
'title_agenda',
'trip',
'uncheck',
'undo',
'url',
'user-cog',
'user-injured',
'user-md',
'upload',
'vat',
'website',
'workstation',
'webhook',
'world',
'private',
'conferenceorbooth',
'eventorganization',
'stamp',
'signature',
'webportal'
));
}