Solved Emoticon issue

Hi there.

Thanks for the great Kunena Component and the fine Blue Eagle template. I noticed one small glitch: It seems to make a difference if you choose an emoticon from the palette or just enter the code for that emoticon. In the following screenshot the first emoticon is taken from the palette, below I entered the code for it

 

After saving there are two smilies

 

BUT: If I want to edit my posting, the second emoticon just shows a broken Image

 

This also happens if you enter the code for the emoticon and switch to "source" and back to WYSIWYG. It only affects the editor preview. After saving everything is fine again.

Seems to be a bug, because I can reproduce it here in the forum too.

Thanks for the report, we know this issue. Yes, there are some bugs with the smileys. If you choose the emoticons from the smiley bar it adds a link to the smiley-symbol instead the code, therefore the difference.

Thanks rich! So I presume that this bug will be fixed in one of the next releases? 

Another thing that has gone bad is the Emoticon palette itself. Before the update all emoticons on the palette were shown in real-size. Now the "normal" (small) emoticons are shown in real size, but bigger emoticons are scaled down, so that you can not tell what particular emoticon you are choosing:

 

This is okay if you only use emoticons of the same size. I'm using emoticons in different sizes, so this change went in the wrong direction for me. Is it possible to change the behaviour back to the old one?

hmm... you can try it with css. Add this code at the end of your Joomla template- or custom.css. But you must play with the value depending on your smileys (height or width).
You can see an example, the left image with original size and right with this code.
   

Thanks for the code, rich. Unfortunately this does not fix the actual problem. I think the real problem is that the emoticon palette uses a fixed width grid for the emoticons. This is fine if all of your emoticons have the same dimension like 18 x 18 pixels. But I also use non-square images (animated GIFs), for example 25 x100 pixels. Those images get disproportionately decreased in size to make them fit into the grid.

 

Is there any way to use a palette without a grid, like it was before? Or to make the cells of the grid wider?

Maybe was my suggestion not quite right. The smiley bar adjusts the size automatically depending on the numbers and size of the smileys. Try to adjust only the size of smileys with min and max values. It's indifferent whether png or animated gifs (pear and lemon are animated see image).
You can try it also with pixel.
Example:

 

Thanks rich. I played around with the values a little bit and at the moment this code makes it look a bit better:

Result:

 

But what I don't understand: In your example screenshots the rows and columns of the (invisible) grid are of different sizes. For example, the columns where the lemon and pear are in are much bigger than the other columns. In my emoticon palette all rows/columns seem to use the same size.

And the lemon and pear in your screenshot are way bigger than the other smilies. In my palette even the biggest emoticons (229 x 177 px) are only slightly bigger than the standard 18 x 18 smilies.

But what I don't understand: In your example screenshots the rows and columns of the (invisible) grid are of different sizes. For example, the columns where the lemon and pear are in are much bigger than the other columns. In my emoticon palette all rows/columns seem to use the same size.

Because I set the min value to the smallest smiley face. Therefore, only the columns that contain larger smileys are widened. You use for min and max width the same value, so all columns have the same size.

And the lemon and pear in your screenshot are way bigger than the other smilies. In my palette even the biggest emoticons (229 x 177 px) are only slightly bigger than the standard 18 x 18 smilies.

It has nothing to do with css, you need to know how your smileys or animated gifs are structured. Animated gifs are made up of multiple frames, and some smileys have lots of transparent placeholders.
As can be seen in my example, the figure would jump from left to right and back again and so on.
You only see one penguin, and one is hidden. However, the size of the image includes all the content. Your large smileys are displayed with the value of 70px, but you cannot see the transparency.
 

I already tried to set the min-value to my smallest emoticon, and the max-value to the largest. But when I use

all I end up with is this:

 

It just scales all images to a width of 18 pixels. I also thought that this happens with animated GIFs only. For a short test I inserted a static GIF with 229 x 177 pixels, but the result was the same   It just not behaves as in your example. Something must be different on my side

Off topic: Quoting messages with the new editor is a nightmare

wrote:

It just scales all images to a width of 18 pixels.
 

Sorry, this is not true. In the above example, it has scaled the "smiley_emoticons_wafe99.gif" to 41x32 pixels