From 0cb35d5b03ec8664cff82327c71fa65fbaaaef84 Mon Sep 17 00:00:00 2001 From: John BOTELLA <68917336+thersane-john@users.noreply.github.com> Date: Sat, 23 Nov 2024 09:15:34 +0100 Subject: [PATCH 1/3] New doc for icon list --- .../tools/ui/class/documentation.class.php | 6 + .../tools/ui/components/event-message.php | 2 +- htdocs/admin/tools/ui/components/icons.php | 131 ++++++++++++++++++ htdocs/admin/tools/ui/css/documentation.css | 6 +- htdocs/langs/en_US/uxdocumentation.lang | 5 + 5 files changed, 148 insertions(+), 2 deletions(-) create mode 100644 htdocs/admin/tools/ui/components/icons.php diff --git a/htdocs/admin/tools/ui/class/documentation.class.php b/htdocs/admin/tools/ui/class/documentation.class.php index 584f6c36a7f..8d498125adb 100644 --- a/htdocs/admin/tools/ui/class/documentation.class.php +++ b/htdocs/admin/tools/ui/class/documentation.class.php @@ -126,6 +126,12 @@ class Documentation 'DocButtonSubmenu' => '#buttonsection-submenu', ), ), + 'Icons' => array( + 'url' => dol_buildpath($baseUrl.'/components/icons.php', 1), + 'icon' => 'far fa-flag pictofixedwidth', + 'submenu' => array(), + 'summary' => array(), + ), 'Progress' => array( 'url' => dol_buildpath($baseUrl.'/components/progress-bars.php', 1), 'icon' => 'fas fa-battery-half pictofixedwidth', diff --git a/htdocs/admin/tools/ui/components/event-message.php b/htdocs/admin/tools/ui/components/event-message.php index 98e3080c7d3..2e60227fcc3 100644 --- a/htdocs/admin/tools/ui/components/event-message.php +++ b/htdocs/admin/tools/ui/components/event-message.php @@ -104,7 +104,7 @@ $documentation->showSidebar(); ?> $lines = array( ' + * + * 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 . + */ + +$res=0; +if (! $res && file_exists("../../main.inc.php")) : $res=@include '../../main.inc.php'; +endif; +if (! $res && file_exists("../../../main.inc.php")) : $res=@include '../../../main.inc.php'; +endif; +if (! $res && file_exists("../../../../main.inc.php")) : $res=@include '../../../../main.inc.php'; +endif; + +// Protection if external user +if ($user->socid > 0) : accessforbidden(); +endif; + +// Includes +dol_include_once('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'); + +// Set view for menu and breadcrumb +// Menu must be set in constructor of documentation class +$documentation->view = array('Components','Icons'); + +// Output sidebar +$documentation->showSidebar(); ?> + +
+ + showBreadCrumb(); ?> + +
+ +

trans('DocIconsTitle'); ?>

+

trans('DocIconsMainDescription'); ?>

+ + + showSummary(); ?> + + +
+ + + +

trans('DocIconsList'); ?>

+ trans('DocDocIconsListDescription'); ?>

*/ ?> + + +
+ +
+ + '; + + + print '
+ + '.$iconCode.' + +
+
'. ($iconData[2]??($iconData[0]??'')) .'
+
+
+
+ 
'.dol_htmlentities($iconCode).'
+
+
+
+
+
'; + } + } + ?> +
+
+
+ +
+
+ +docFooter(); +?> diff --git a/htdocs/admin/tools/ui/css/documentation.css b/htdocs/admin/tools/ui/css/documentation.css index 0bee0aae2bf..3dbd1abdfb2 100644 --- a/htdocs/admin/tools/ui/css/documentation.css +++ b/htdocs/admin/tools/ui/css/documentation.css @@ -78,8 +78,12 @@ body.dolibarr-doc { .doc-wrapper .doc-content-wrapper .documentation-section h2.documentation-title {margin: 0;margin-bottom:16px;padding: 0;color: rgb(38,60,92);} .doc-wrapper .doc-content-wrapper .documentation-section .documentation-example {border:1px dashed #ccc;box-sizing: border-box;padding: 16px;margin-bottom: 16px;} .doc-wrapper .doc-content-wrapper .documentation-section .documentation-code {background: var(--colorbacklinepairchecked);border:1px dashed #ccc;box-sizing: border-box;padding: 16px;margin-bottom: 16px;overflow: auto;} +.doc-wrapper .doc-content-wrapper .documentation-section .info-box .documentation-code {padding: 3px 16px; margin-bottom: 5px;} .doc-wrapper .doc-content-wrapper .documentation-section .documentation-code pre {margin: 0;padding: 0;tab-size: 24px;} /* Documentation scroll indicator */ #documentation-scrollwrapper {height: 5px;position: fixed;bottom: 0;left: 260px;right:0;z-index: 99;} -#documentation-scroll {background: rgb(0, 123, 140);height: 5px;position: absolute;top: 0;left:0} \ No newline at end of file +#documentation-scroll {background: rgb(0, 123, 140);height: 5px;position: absolute;top: 0;left:0} + +/* component icons */ +.documentation-fontawesome-icon-list span{ color: #333; } diff --git a/htdocs/langs/en_US/uxdocumentation.lang b/htdocs/langs/en_US/uxdocumentation.lang index 56d3c587185..d8df8d0de27 100644 --- a/htdocs/langs/en_US/uxdocumentation.lang +++ b/htdocs/langs/en_US/uxdocumentation.lang @@ -79,3 +79,8 @@ DocSetEventMessage = Message #%s DocButtonIconsLowEmphasis = Low emphasis icon buttons DocButtonIconsDescriptionLowEmphasis = An icon button with low emphasis is typically a button that includes only an icon (no accompanying text) and has minimal styling to make it unobtrusive. Icon buttons with low emphasis are ideal for secondary or tertiary actions, like clear field, fill field, bookmarking, or sharing, especially in interfaces that have more prominent primary actions (like "Submit" or "Continue"). DocButtonIconsForTitle = Buttons for list title + +# Fontawesome icons +DocIconsTitle = Icons used by Dolibarr +DocIconsMainDescription = Dolibarr use a part of fontawesome 5 icons +DocIconsList = List of usable font icons From 469baa0b5bac7d6b4778216d08c8cf579894f77f Mon Sep 17 00:00:00 2001 From: John BOTELLA <68917336+thersane-john@users.noreply.github.com> Date: Sat, 23 Nov 2024 17:53:12 +0100 Subject: [PATCH 2/3] remove double --- htdocs/admin/tools/ui/components/icons.php | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/htdocs/admin/tools/ui/components/icons.php b/htdocs/admin/tools/ui/components/icons.php index d0261f884aa..0b47d4d10d5 100644 --- a/htdocs/admin/tools/ui/components/icons.php +++ b/htdocs/admin/tools/ui/components/icons.php @@ -88,6 +88,7 @@ $documentation->showSidebar(); ?>
showSidebar(); ?> $class.= ' fa-'.$iconData[0]??''; } + if (in_array($class, $alreadyDisplay)) { + continue; + } + + $alreadyDisplay[] = $class; $iconCode = ''; From c642396dcaaca6cc1e26fe120306ab7f9016cce8 Mon Sep 17 00:00:00 2001 From: John BOTELLA <68917336+thersane-john@users.noreply.github.com> Date: Sat, 23 Nov 2024 18:26:40 +0100 Subject: [PATCH 3/3] Add List of usable icons with img_picto function --- .../tools/ui/class/documentation.class.php | 5 +- htdocs/admin/tools/ui/components/icons.php | 55 +++++++++++- htdocs/core/lib/functions.lib.php | 85 +++++++++++-------- htdocs/langs/en_US/uxdocumentation.lang | 3 +- 4 files changed, 106 insertions(+), 42 deletions(-) diff --git a/htdocs/admin/tools/ui/class/documentation.class.php b/htdocs/admin/tools/ui/class/documentation.class.php index 8d498125adb..183d89b547f 100644 --- a/htdocs/admin/tools/ui/class/documentation.class.php +++ b/htdocs/admin/tools/ui/class/documentation.class.php @@ -130,7 +130,10 @@ class Documentation 'url' => dol_buildpath($baseUrl.'/components/icons.php', 1), 'icon' => 'far fa-flag pictofixedwidth', 'submenu' => array(), - 'summary' => array(), + 'summary' => array( + 'DocIconsList' => '#img-picto-section-list', + 'DocIconsFontAwesomeList' => '#icon-section-list', + ), ), 'Progress' => array( 'url' => dol_buildpath($baseUrl.'/components/progress-bars.php', 1), diff --git a/htdocs/admin/tools/ui/components/icons.php b/htdocs/admin/tools/ui/components/icons.php index 0b47d4d10d5..e8f8b365f97 100644 --- a/htdocs/admin/tools/ui/components/icons.php +++ b/htdocs/admin/tools/ui/components/icons.php @@ -60,7 +60,58 @@ $documentation->showSidebar(); ?> showSummary(); ?> - + + +
+ + + +

trans('DocIconsList'); ?>

+ trans('DocDocIconsListDescription'); ?>

*/ ?> +
+
+ + + '.$iconCode.' + +
+
'. $iconName .'
+
+
+
+ 
'.dol_htmlentities('img_picto(\''.$labelAlt.'\', '.$iconName.')').'
+
+
+
+
+
'; + } + ?> +
+
+
+ + + +
showSidebar(); ?>

trans('DocIconsList'); ?>

trans('DocDocIconsListDescription'); ?>

*/ ?> - -
diff --git a/htdocs/core/lib/functions.lib.php b/htdocs/core/lib/functions.lib.php index d2609495d49..3e103e06931 100644 --- a/htdocs/core/lib/functions.lib.php +++ b/htdocs/core/lib/functions.lib.php @@ -5065,43 +5065,7 @@ function img_picto($titlealt, $picto, $moreatt = '', $pictoisfullpath = 0, $srco return $enabledisablehtml; } - if (empty($srconly) && in_array($pictowithouttext, array( - '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', '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-top', - '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', - 'gears', 'generate', 'generic', 'globe', 'globe-americas', 'graph', 'grip', 'grip_title', 'group', - 'hands-helping', 'help', 'holiday', - 'id-card', 'images', 'incoterm', 'info', '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', - 'paiment', 'paragraph', 'play', 'pdf', 'phone', 'phoning', 'phoning_mobile', 'phoning_fax', 'playdisabled', 'previous', 'poll', 'pos', 'printer', 'product', 'propal', 'proposal', 'puce', - 'stock', 'resize', 'service', 'stats', - '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', - 'github', 'google', 'jabber', 'microsoft', 'skype', 'twitter', 'facebook', 'linkedin', 'instagram', 'snapchat', 'youtube', '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', - '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', 'vat', 'website', 'workstation', 'webhook', 'world', 'private', - 'conferenceorbooth', 'eventorganization', - 'stamp', 'signature', - 'webportal' - ))) { + if (empty($srconly) && in_array($pictowithouttext, getImgPictoNameList())) { $fakey = $pictowithouttext; $facolor = ''; $fasize = ''; @@ -5337,6 +5301,53 @@ function img_picto($titlealt, $picto, $moreatt = '', $pictoisfullpath = 0, $srco return ''.dol_escape_htmltag($alt).''; // Alt is used for accessibility, title for popup } +/** + * Get all usage icon name for img_picto + * @return string[] + */ +function getImgPictoNameList() +{ + + return array( + '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', '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-top', + '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', + 'gears', 'generate', 'generic', 'globe', 'globe-americas', 'graph', 'grip', 'grip_title', 'group', + 'hands-helping', 'help', 'holiday', + 'id-card', 'images', 'incoterm', 'info', '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', + 'paiment', 'paragraph', 'play', 'pdf', 'phone', 'phoning', 'phoning_mobile', 'phoning_fax', 'playdisabled', 'previous', 'poll', 'pos', 'printer', 'product', 'propal', 'proposal', 'puce', + 'stock', 'resize', 'service', 'stats', + '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', + 'github', 'google', 'jabber', 'microsoft', 'skype', 'twitter', 'facebook', 'linkedin', 'instagram', 'snapchat', 'youtube', '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', + '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', 'vat', 'website', 'workstation', 'webhook', 'world', 'private', + 'conferenceorbooth', 'eventorganization', + 'stamp', 'signature', + 'webportal' + ); +} + + /** * Show a picto called object_picto (generic function) * diff --git a/htdocs/langs/en_US/uxdocumentation.lang b/htdocs/langs/en_US/uxdocumentation.lang index d8df8d0de27..590a150fccf 100644 --- a/htdocs/langs/en_US/uxdocumentation.lang +++ b/htdocs/langs/en_US/uxdocumentation.lang @@ -82,5 +82,6 @@ DocButtonIconsForTitle = Buttons for list title # Fontawesome icons DocIconsTitle = Icons used by Dolibarr +DocIconsList = List of usable icons with img_picto function DocIconsMainDescription = Dolibarr use a part of fontawesome 5 icons -DocIconsList = List of usable font icons +DocIconsFontAwesomeList = List of usable fontawesome icons