?
avatar C-Lodder
C-Lodder
6 Jul 2020

Steps to reproduce the issue

  1. Go to /administrator/index.php?option=com_templates&view=templates
  2. Cassiopeia Details and Files
  3. Click template_thumbnail.png

Actual result

Missing icon on Crop button

screeny2

avatar C-Lodder C-Lodder - open - 6 Jul 2020
avatar joomla-cms-bot joomla-cms-bot - change - 6 Jul 2020
Labels Added: ?
avatar joomla-cms-bot joomla-cms-bot - labeled - 6 Jul 2020
avatar C-Lodder C-Lodder - change - 6 Jul 2020
Title
[4.0] Missong icon
[4.0] Missong icon on Crop button
avatar C-Lodder C-Lodder - edited - 6 Jul 2020
avatar infograf768
infograf768 - comment - 7 Jul 2020

Found where is the issue but I don't know how to solve.
The button itself has a class made up with the icon class

Screen Shot 2020-07-07 at 10 55 03

It should only have btn btn-primary

This comes from the renderButton() method in /libraries/src/Toolbar/ToolbarButton.php
$options['btnClass'] = 'button-' . $this->getName() . ' ' . ($options['btnClass'] ?? '');

where $this->getName() = the icon class defined in the HtmlView
ToolbarHelper::custom('template.cropImage', 'fas fa-crop', 'fas fa-arrows-alt', 'COM_TEMPLATES_BUTTON_CROP', false);

Other instances of ToolbarHelper::custom( do not have this issue.

@N6REJ
Any idea?

avatar infograf768
infograf768 - comment - 7 Jul 2020

Ok, found it.

The issue is that this is the ONLY HtmlView using directly some fas fa-stuff as icon for quite a few toolbar buttons.
All other use wordings which correspond to icons.
Example here envelope:
ToolbarHelper::custom('mail.send', 'envelope.png', 'send_f2.png', 'COM_USERS_TOOLBAR_MAIL_SEND_MAIL', false);
will use as button class:
<button class="button-envelope btn btn-primary" type="button">

avatar infograf768
infograf768 - comment - 7 Jul 2020

One solution is to modify the custom method

	public static function custom($task = '', $icon = '', $iconOver = '', $alt = '', $listSelect = true, $formId = null)
	{
		$bar = Toolbar::getInstance('toolbar');

		// Strip extension.
		$icon = preg_replace('#\.[^.]*$#', '', $icon);
		$icon = str_replace('fas fa-', '', $icon);  // ADD THIS LINE to STILL GET A CUSTOM CLASS

		// Add a standard button.
		$bar->appendButton('Standard', $icon, $alt, $task, $listSelect, $formId);
	}

to get
<button class="button-crop btn btn-primary" type="button">

What do you think?

avatar N6REJ
N6REJ - comment - 7 Jul 2020

I'm having a hard time thinking clearly today but my first question is why are we using .png for class's? Did we plan on using images then change our mind? Whats the real purpose?

avatar infograf768
infograf768 - comment - 8 Jul 2020

It is a remnant of older code. 2.5.0 and 3.0+ have these images in the images folder of the template. It became unnecessary when we started to use icomoon.
In 2.5 they were used in the css
.icon-32-featured { background-image: url(../images/toolbar/icon-32-featured.png); }

Instead of getting rid of these (the images could be used for B/C and were kept in the template), was coded $icon = preg_replace('#\.[^.]*$#', '', $icon); for .png not to be present in the button class.

Screen Shot 2020-07-08 at 06 58 28

I guess we can safely get rid of these now as these images are not provided anymore in 4.0 template.

Anyhow, this can be for another patch as this is not the original issue here.

avatar N6REJ
N6REJ - comment - 8 Jul 2020

I'll have to leave this to better folks then me.. I think your on to something though @infograf768
I think aside from your fix, the use of toolbar::custom needs to be consistent.

avatar N6REJ
N6REJ - comment - 27 Jul 2020

@infograf768 it should not be
<button class="button-crop btn btn-primary" type="button">
but instead <button class="btn btn-primary" type="button">
the class belongs on the span.

avatar Quy Quy - change - 28 Jul 2020
Status New Closed
Closed_Date 0000-00-00 00:00:00 2020-07-28 20:53:17
Closed_By Quy
avatar Quy Quy - close - 28 Jul 2020
avatar Quy
Quy - comment - 28 Jul 2020

PR #30206

Add a Comment

Login with GitHub to post a comment