View source for Formatter: Colorbox

#||
||
Compatible with: !!(green)**R6.x**!!
Current version: 0.4
Credits: ((user:WikiAdmin WikiAdmin))
|{{toc numerate=1}} ||
||#
visualize color sets as boxes, not thought as infoboxes

===Action===
##~{{colorbox}}##

**~/action/colorbox.php**
%%(hl php)
<?php

if (!defined('IN_WACKO'))
{
	exit;
}

/*

visualize color sets as boxes

{{colorbox bg_color="#FDFEB8" border_color="#FFBB00"}}
	$bg_color		- background color
	$border_color		- border color
	$text				- description
	$text_color			- text color
	$border_width		- border width
	$width				- width
	$spec				- show color values
*/

// set defaults
$text				??= null;
$border_width		??= '1px';
$bg_color		??= '#ffa';
$border_color		??= '#000000';
$text_color			??= '#000000';
$width				??= '200px';
$spec				??= 1;

$sanitize = function($value, $filter)
{
	switch ($filter)
	{
		case 'color':
			if (preg_match('/^(
				(\#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}))|		# color value
				(rgb\(([0-9]{1,3}%?,){2}[0-9]{1,3}%?\))		# rgb triplet
				)$/x', $value))
			{
				return $value;
			}
			break;
		case 'width':
			if (preg_match('/^\d*\.?\d+(%|px|em|ex|pt|cm|mm|pi|in)$/', $value))
			{
				return $value;
			}
		case 'class':
			if (preg_match('/[^A-Za-z0-9_-]/', $value))
			{
				return $value;
			}
			break;
	}
};

$bgcolor			=
$tpl->s_bgcolor		= $sanitize($bg_color, 'color');
$tpl->s_bdwidth		= $sanitize($border_width, 'width');
$bdcolor			=
$tpl->s_bdcolor		= $sanitize($border_color, 'color');
$tpl->s_width		= $sanitize($width, 'width');
$color				=
$tpl->s_color		= $sanitize($text_color, 'color');
$tpl->text			= $this->format($text);

if ($spec)
{
	$tpl->spec_xbgcolor		= $bgcolor;
	$tpl->spec_xbdcolor		= $bdcolor;
	$tpl->spec_xcolor		= $color;
}
%%

**~/action/template/colorbox.tpl**
%%
[ === main === ]
	<div style="[ ' s style ' ]">
	[ ' text ' ]
	[= spec _ =
		<br>
		background: [ ' xbgcolor ' ]<br>
		border: 	[ ' xbdcolor ' ]<br>
		color: 		[ ' xcolor ' ]
	=]
	</div>

[ === style === ]
background-color: [ ' bgcolor ' ];
border: [ ' bdwidth ' ] solid [ ' bdcolor ' ];
width: [ ' width ' ];
clear: both;
margin: 10px 0;
padding: 10px;
color: [ ' color ' ];
float: left;
%%

====local usage of repository====
Symlink the formatter from community folder in the **src/action** folder and the corresponding template in the **src/action/template** folder in your repo.
%%
ln -s ../../community/action/colorbox.php colorbox.php
ln -s ../../../community/action/template/colorbox.tpl colorbox.tpl
%%

====Example====
``(wacko wrapper="text" col=2 clear)
{{colorbox bg_color="#FFFFE0" border_color="#E6DB55" text_color=#555555" text="info"}}
{{colorbox bg_color="#C3FF88" border_color="#8DFF1C" text_color=#555555" text="success"}}
{{colorbox bg_color="#FFEC8B" border_color="#FFCC00" text_color=#555555" text="ok"}}
{{colorbox bg_color="#FFB78C" border_color="#FF853C" text_color=#555555" text="error"}}
{{colorbox bg_color="#FFA0A0" border_color="#F04040" text_color=#555555" text="error"}}

{{colorbox bg_color="#FFFBCC" border_color="#E6DB55" text_color=#555555" text="info"}}
{{colorbox bg_color="#DDFFDD" border_color="#BBFFBB" text="**!!message!!**"}}
{{colorbox bg_color="#DDEEFF" border_color="#99CCFF" text="info"}}
{{colorbox bg_color="#FDFEB8" border_color="#FFBB00" text="//warning//"}}
{{colorbox bg_color="#FFDDDD" border_color="#FFBBBB" text="error"}}
``
===Formatter===
##""%%(colorbox) %%""##

((source:master/community/formatter/highlight/colorbox.php formatter/highlight/colorbox.php))
``(hl php)
<?php

if (!defined('IN_WACKO'))
{
	exit;
}

/*

visualize color sets as boxes

%%(colorbox bg_color="#FDFEB8" border_color="#FFBB00") %%
	bg_color			- background color
	border_color		- border color
	text				- description
	text_color			- text color
	border_width		- border width
	width				- width
	spec				- show color values
*/

// set defaults
$text						??= null;
$options['border_width']	??= '1px';
$options['bg_color']		??= '#ffa';
$options['border_color']	??= '#000000';
$options['text_color']		??= '#000000';
$options['width']			??= '200px';
$options['spec']			??= 1;

$sanitize = function($value, $filter)
{
	switch ($filter)
	{
		case 'color':
			if (preg_match('/^(
				(\#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}))|		# color value
				(rgb\(([0-9]{1,3}%?,){2}[0-9]{1,3}%?\))		# rgb triplet
				)$/x', $value))
			{
				return $value;
			}
			break;
		case 'width':
			if (preg_match('/^\d*\.?\d+(%|px|em|ex|pt|cm|mm|pi|in)$/', $value))
			{
				return $value;
			}
		case 'class':
			if (preg_match('/[^A-Za-z0-9_-]/', $value))
			{
				return $value;
			}
			break;
	}
};

$bgcolor			=
$tpl->s_bgcolor		= $sanitize($options['bg_color'], 'color');
$tpl->s_bdwidth		= $sanitize($options['border_width'], 'width');
$bdcolor			=
$tpl->s_bdcolor		= $sanitize($options['border_color'], 'color');
$tpl->s_width		= $sanitize($options['width'], 'width');
$color				=
$tpl->s_color		= $sanitize($options['text_color'], 'color');
$tpl->text			= $this->format($text);

if ($options['spec'])
{
	$css['background']	= $bgcolor;
	$css['border']		= $bdcolor;
	$css['color']		= $color;

	foreach ($css as $style => $value)
	{
		$tpl->spec_n_style		= $style;
		$tpl->spec_n_value		= $value;
	}
}

``

((source:master/community/formatter/highlight/template/colorbox.tpl formatter/highlight/template/colorbox.tpl))
%%
[ === main === ]
<ignore>
<!--notypo-->
	<div style="[ ' s css ' ]">
	[ ' text ' ]
	[= spec _ =
		<table class="usertable">
			[= n _ =
				<tr>
					<th>[ ' style ' ]:</th>
					<td><code>[ ' value ' ]</code></td>
					<td style="background-color: [ ' value ' ]">  </td>
				</tr>
			=]
		</table>
	=]
	</div>
<!--/notypo-->
</ignore>

[ === css === ]
background-color: [ ' bgcolor ' ];
border: [ ' bdwidth ' ] solid [ ' bdcolor ' ];
width: [ ' width ' ];
clear: both;
margin: 10px 0;
padding: 10px;
color: [ ' color ' ];
float: left;
%%

====local usage of repository====
Symlink the formatter from community folder in the **src/action** folder and the corresponding template in the **src/action/template** folder in your repo.
%%
ln -s ../../../community/formatter/highlight/colorbox.php colorbox.php
ln -s ../../../../community/formatter/highlight/template/colorbox.tpl colorbox.tpl
%%

====Example====
``(wacko wrapper="text" col=2 clear)
%%(colorbox bg_color="#FFFFE0" border_color="#E6DB55" text_color=#555555") info%%
%%(colorbox bg_color="#C3FF88" border_color="#8DFF1C" text_color=#555555") success%%
%%(colorbox bg_color="#FFEC8B" border_color="#FFCC00" text_color=#555555") ok%%
%%(colorbox bg_color="#FFB78C" border_color="#FF853C" text_color=#555555") error%%
%%(colorbox bg_color="#FFA0A0" border_color="#F04040" text_color=#555555") error%%

%%(colorbox bg_color="#FFFBCC" border_color="#E6DB55" text_color=#555555") info%%
%%(colorbox bg_color="#DDFFDD" border_color="#BBFFBB") **!!message!!**%%
%%(colorbox bg_color="#DDEEFF" border_color="#99CCFF") info%%
%%(colorbox bg_color="#FDFEB8" border_color="#FFBB00") //warning//%%
%%(colorbox bg_color="#FFDDDD" border_color="#FFBBBB") error%%
``
===Changelog===
0.1 Initial
0.3 added sanitizer
0.4 added template

===To Do===
  * actually this is more a example for a **formatter**, there are currently no dynamic elements in it
  * modify the action (formatter) for your purpose

{{backlinks}}