Title: Cleaning up the [glow] tag (SMF patch)
Post by: PowerGlove on August 16, 2023, 05:44:58 PM
This one is pretty unexciting, but I like doing these seemingly-unimportant small improvements (they're quick to do and I believe that they add up over time). The four problems with this tag (as I see it) are as follows: 1. When you click the "Glow" button on the toolbar, you get this: [glow=red,2,300][/glow]. I don't think red is a good default (mostly I see this tag used with yellow, Husires suggested changing the default (https://bitcointalk.org/index.php?topic=5403616) last year, and I think that's a good suggestion). 2. The extra stuff after the color ( ,2,300) has to do with an ancient Microsoft-specific CSS filter, and the final parameter ( ,300) isn't actually wired up to anything. 3. The example on the help page (https://bitcointalk.org/index.php?action=help;page=post#bbcref) is broken (because the pre-rendered HTML is based on the old Microsoft-specific CSS filter). 4. The toolbar button being green doesn't make much sense (maybe it did when this tag produced a true glow effect on Internet Explorer, but now all this tag does is set the background-color on a <span>, so it makes more sense for it to match whatever the default color is, IMO). The patch below removes the extra parameters (without breaking old posts), sets the default to [glow=yellow][/glow], updates/repairs the example on the help page, and changes the icon so that it's yellow instead of green ( https://talkimg.com/images/2023/08/16/Muzlf.png https://talkimg.com/images/2023/08/16/MuN6Z.png). --- baseline/Sources/Subs.php 2011-09-17 21:59:55.000000000 +0000
+++ modified/Sources/Subs.php 2023-08-16 15:41:43.000000000 +0000
@@ -1273,20 +1273,27 @@
'after' => '</span>',
),
array(
'tag' => 'glow',
'type' => 'unparsed_commas',
'test' => '[#0-9a-zA-Z\-]{3,12},([012]\d{1,2}|\d{1,2})(,[^]]+)?\]',
'before' => $context['browser']['is_ie'] ? '<table border="0" cellpadding="0" cellspacing="0" style="display: inline; vertical-align: middle; font: inherit;"><tr><td style="filter: Glow(color=$1, strength=$2); font: inherit;">' : '<span style="background-color: $1;">',
'after' => $context['browser']['is_ie'] ? '</td></tr></table> ' : '</span>',
),
array(
+ 'tag' => 'glow',
+ 'type' => 'unparsed_equals',
+ 'test' => '(#[\da-fA-F]{3}|#[\da-fA-F]{6}|[A-Za-z]{1,12})\]',
+ 'before' => '<span style="background-color: $1;">',
+ 'after' => '</span>',
+ ),
+ array(
'tag' => 'hr',
'type' => 'closed',
'content' => '<hr />',
'block_level' => true,
),
array(
'tag' => 'html',
'type' => 'unparsed_content',
'content' => '$1',
'block_level' => true,
--- baseline/Themes/default/Post.template.php 2008-04-30 18:30:34.000000000 +0000
+++ modified/Themes/default/Post.template.php 2023-08-16 15:44:50.000000000 +0000
@@ -752,21 +752,21 @@
// ]]></script>';
// The below array makes it dead easy to add images to this page. Add it to the array and everything else is done for you!
$context['bbc_tags'] = array();
$context['bbc_tags'][] = array(
'bold' => array('code' => 'b', 'before' => '[b]', 'after' => '[/b]', 'description' => $txt[253]),
'italicize' => array('code' => 'i', 'before' => '[i]', 'after' => '[/i]', 'description' => $txt[254]),
'underline' => array('code' => 'u', 'before' => '[u]', 'after' => '[/u]', 'description' => $txt[255]),
'strike' => array('code' => 's', 'before' => '[s]', 'after' => '[/s]', 'description' => $txt[441]),
array(),
- 'glow' => array('code' => 'glow', 'before' => '[glow=red,2,300]', 'after' => '[/glow]', 'description' => $txt[442]),
+ 'glow' => array('code' => 'glow', 'before' => '[glow=yellow]', 'after' => '[/glow]', 'description' => $txt[442]),
'shadow' => array('code' => 'shadow', 'before' => '[shadow=red,left]', 'after' => '[/shadow]', 'description' => $txt[443]),
'move' => array('code' => 'move', 'before' => '[move]', 'after' => '[/move]', 'description' => $txt[439]),
array(),
'pre' => array('code' => 'pre', 'before' => '[pre]', 'after' => '[/pre]', 'description' => $txt[444]),
'left' => array('code' => 'left', 'before' => '[left]', 'after' => '[/left]', 'description' => $txt[445]),
'center' => array('code' => 'center', 'before' => '[center]', 'after' => '[/center]', 'description' => $txt[256]),
'right' => array('code' => 'right', 'before' => '[right]', 'after' => '[/right]', 'description' => $txt[446]),
array(),
'hr' => array('code' => 'hr', 'before' => '[hr]', 'description' => $txt[531]),
array(),
--- baseline/Themes/default/Help.template.php 2006-12-01 03:25:52.000000000 +0000
+++ modified/Themes/default/Help.template.php 2023-08-16 15:48:08.000000000 +0000
@@ -1780,23 +1780,23 @@
<td><img onmouseover="bbc_highlight(this, true);" onmouseout="bbc_highlight(this, false);" src="', $settings['images_url'], '/bbc/strike.gif" alt="', $txt['manual_posting_bbc_strike'], '" style="background-image: url(', $settings['images_url'], '/bbc/bbc_bg.gif); margin: 1px 2px 1px 1px;" /></td>
<td>', $txt['manual_posting_strike_code'], '</td>
<td><s>', $txt['manual_posting_strike_output'], '</s></td>
<td>', $txt['manual_posting_strike_comment'], '</td>
</tr>
<tr>
<td>', $txt['manual_posting_bbc_glow'], '</td>
<td><img onmouseover="bbc_highlight(this, true);" onmouseout="bbc_highlight(this, false);" src="', $settings['images_url'], '/bbc/glow.gif" alt="', $txt['manual_posting_bbc_glow'], '" style="background-image: url(', $settings['images_url'], '/bbc/bbc_bg.gif); margin: 1px 2px 1px 1px;" /></td>
<td>', $txt['manual_posting_glow_code'], '</td>
<td>
- <div style="filter: Glow(color=red, strength=2); width: 30px;">
+ <span style="background-color: yellow;">
', $txt['manual_posting_glow_output'], '
- </div>
+ </span>
</td>
<td>', $txt['manual_posting_glow_comment'], '</td>
</tr>
<tr>
<td>', $txt['manual_posting_bbc_shadow'], '</td>
<td><img onmouseover="bbc_highlight(this, true);" onmouseout="bbc_highlight(this, false);" src="', $settings['images_url'], '/bbc/shadow.gif" alt="', $txt['manual_posting_bbc_shadow'], '" style="background-image: url(', $settings['images_url'], '/bbc/bbc_bg.gif); margin: 1px 2px 1px 1px;" /></td>
<td>', $txt['manual_posting_shadow_code'], '</td>
<td>
<div style="filter: Shadow(color=red, direction=240); width: 30px;">
', $txt['manual_posting_shadow_output'], '
--- baseline/Themes/default/languages/Manual.english.php 2011-02-07 16:45:09.000000000 +0000
+++ modified/Themes/default/languages/Manual.english.php 2023-08-16 15:50:43.000000000 +0000
@@ -463,23 +463,23 @@
$txt['manual_posting_italic_comment'] = '*';
$txt['manual_posting_bbc_underline'] = 'Underline';
$txt['manual_posting_underline_code'] = '[u]underline[/u]';
$txt['manual_posting_underline_output'] = 'underline';
$txt['manual_posting_underline_comment'] = '*';
$txt['manual_posting_bbc_strike'] = 'Strikethrough';
$txt['manual_posting_strike_code'] = '[s]strikethrough[/s]';
$txt['manual_posting_strike_output'] = 'strikethrough';
$txt['manual_posting_strike_comment'] = '*';
$txt['manual_posting_bbc_glow'] = 'Glow';
-$txt['manual_posting_glow_code'] = '[glow=red,2,50]glow[/glow]';
+$txt['manual_posting_glow_code'] = '[glow=yellow]glow[/glow]';
$txt['manual_posting_glow_output'] = 'glow';
-$txt['manual_posting_glow_comment'] = 'The three attributes (eg red, 2, 50) in the \'glow\' tag are color, strength and width respectively.';
+$txt['manual_posting_glow_comment'] = '*';
$txt['manual_posting_bbc_shadow'] = 'Shadow';
$txt['manual_posting_shadow_code'] = '[shadow=red,left]<br />shadow<br />[/shadow]';
$txt['manual_posting_shadow_output'] = 'shadow';
$txt['manual_posting_shadow_comment'] = 'The two attributes (eg red, left) in the \'shadow\' tag are color and direction respectively.';
$txt['manual_posting_bbc_move'] = 'Marquee';
$txt['manual_posting_move_code'] = '[move]move[/move]';
$txt['manual_posting_move_output'] = 'move';
$txt['manual_posting_move_comment'] = 'Not valid XHTML, but can also be used for images!';
$txt['manual_posting_bbc_pre'] = 'Preformatted Text';
$txt['manual_posting_pre_comment'] = 'Preserves critical text formatting, rendered in a monospace font.';
This is the command sequence I used to produce the yellow version of the toolbar icon from the original (the second command requires ImageMagick): $ cp ./Themes/default/images/bbc/glow.gif ./Themes/default/images/bbc/glow_original.gif $ convert-im6 ./Themes/default/images/bbc/glow_original.gif -color-matrix '0 1.33 0 0 1.33 0 0 0 0' ./Themes/default/images/bbc/glow.gif
Title: Re: Cleaning up the [glow] tag (SMF patch)
Post by: joker_josue on August 16, 2023, 07:42:16 PM
It may be something simple, but it really is a resource that could be better used and not, a little because of the points you mentioned.
So congratulations on this patch. We will see if it will be accepted. Well done. ;)
Title: Re: Cleaning up the [glow] tag (SMF patch)
Post by: dkbit98 on August 17, 2023, 06:59:41 PM
New patch already? What happened with previous one you worked on for adding 2FA functionality in forum? If this one is done in your free time than I don't mind, but better look for other more serious issues to fix ;)
Title: Re: Cleaning up the [glow] tag (SMF patch)
Post by: dzungmobile on August 18, 2023, 09:12:01 AM
It is a good idea to replace the default Red color to Yellow. I agree that Red color is painful and I believe it does not have good effects in practice. If you can have some other options for Glow effects as follows, that is cool as many newbies don't know about those color options. Generally before using Glow, a poster must know it will have bad effects on Dark background. Test Test Test Test [glow=lightgreen,2,300]Test[/glow]
[glow=lightyellow,2,300]Test[/glow]
[glow=lightcyan,2,300]Test[/glow]
[glow=lightpink,2,300]Test[/glow]
|
