* @link https://github.com/pradosoft/prado
* @copyright Copyright © 2005-2016 The PRADO Group
* @license https://github.com/pradosoft/prado/blob/master/COPYRIGHT
* @package System.Web.UI.WebControls
*/
/**
* TColorPicker class.
*
* TColorPicker displays a text box for color input purpose.
* Next to the textbox there's a button filled with the current chosen color.
* Users can write a color name directly in the text box as an hex triplet (also known as HTML notation, eg: #FF00FF).
* Alternatively, if the ShowColorPicker property is enabled (it is by default), users can click the button
* to have a color picker UI appear. A color chan be chosen directly by clicking on the color picker.
*
* TColorPicker has three different color picker UI Modes:
* # Simple - Grid with 12 simple colors.
* # Basic - Grid with the most common 70 colors. This is the default mode.
* # Full - Full-featured color picker.
*
* The CssClass property can be used to override the CSS class name
* for the color picker panel. The ColorStyle property sets the packages
* styles available. E.g. default.
*
* If the Mode property is set to Full, the color picker panel will
* display an "Ok" and "Cancel" buttons. You can customize the button labels setting the OKButtonText
* and CancelButtonText properties.
*
* @author Wei Zhuo
* @package System.Web.UI.WebControls
* @since 3.0
*/
class TColorPicker extends TTextBox
{
const SCRIPT_PATH = 'prado/colorpicker';
private $_clientSide;
/**
* @return boolean whether the color picker should pop up when the button is clicked.
*/
public function getShowColorPicker()
{
return $this->getViewState('ShowColorPicker',true);
}
/**
* Sets whether to pop up the color picker when the button is clicked.
* @param boolean whether to show the color picker popup
*/
public function setShowColorPicker($value)
{
$this->setViewState('ShowColorPicker',TPropertyValue::ensureBoolean($value),true);
}
/**
* @param TColorPickerMode color picker UI mode
*/
public function setMode($value)
{
$this->setViewState('Mode', TPropertyValue::ensureEnum($value, 'TColorPickerMode'), TColorPickerMode::Basic);
}
/**
* @return TColorPickerMode current color picker UI mode. Defaults to TColorPickerMode::Basic.
*/
public function getMode()
{
return $this->getViewState('Mode', TColorPickerMode::Basic);
}
/**
* @param string set the color picker style
*/
public function setColorPickerStyle($value)
{
$this->setViewState('ColorStyle', $value, 'default');
}
/**
* @return string current color picker style
*/
public function getColorPickerStyle()
{
return $this->getViewState('ColorStyle', 'default');
}
/**
* @return string text for the color picker OK button. Default is "OK".
*/
public function getOKButtonText()
{
return $this->getViewState('OKButtonText', 'OK');
}
/**
* @param string text for the color picker OK button
*/
public function setOKButtonText($value)
{
$this->setViewState('OKButtonText', $value, 'OK');
}
/**
* @return string text for the color picker Cancel button. Default is "Cancel".
*/
public function getCancelButtonText()
{
return $this->getViewState('CancelButtonText', 'Cancel');
}
/**
* @param string text for the color picker Cancel button
*/
public function setCancelButtonText($value)
{
$this->setViewState('CancelButtonText', $value, 'Cancel');
}
/**
* @return TColorPickerClientSide javascript event options.
*/
public function getClientSide()
{
if($this->_clientSide===null)
$this->_clientSide = $this->createClientSide();
return $this->_clientSide;
}
/**
* @return TColorPickerClientSide javascript validator event options.
*/
protected function createClientSide()
{
return new TColorPickerClientSide;
}
/**
* Get javascript color picker options.
* @return array color picker client-side options
*/
protected function getPostBackOptions()
{
$options = parent::getPostBackOptions();
$options['ClassName'] = $this->getCssClass();
$options['ShowColorPicker'] = $this->getShowColorPicker();
if($options['ShowColorPicker'])
{
$mode = $this->getMode();
if($mode == TColorPickerMode::Full) $options['Mode'] = $mode;
else if($mode == TColorPickerMode::Simple) $options['Palette'] = 'Tiny';
$options['OKButtonText'] = $this->getOKButtonText();
$options['CancelButtonText'] = $this->getCancelButtonText();
}
$options = array_merge($options,$this->getClientSide()->getOptions()->toArray());
return $options;
}
/**
* @param string asset file in the self::SCRIPT_PATH directory.
* @return string asset file url.
*/
protected function getAssetUrl($file='')
{
$base = $this->getPage()->getClientScript()->getPradoScriptAssetUrl();
return $base.'/'.self::SCRIPT_PATH.'/'.$file;
}
/**
* Publish the color picker Css asset files.
*/
public function onPreRender($param)
{
parent::onPreRender($param);
$this->publishColorPickerAssets();
}
/**
* Publish the color picker assets.
*/
protected function publishColorPickerAssets()
{
$cs = $this->getPage()->getClientScript();
$key = "prado:".get_class($this);
$imgs['button.gif'] = $this->getAssetUrl('button.gif');
$imgs['background.png'] = $this->getAssetUrl('background.png');
$options = TJavaScript::encode($imgs);
$code = "Prado.WebUI.TColorPicker.UIImages = {$options};";
$cs->registerEndScript($key, $code);
$cs->registerPradoScript("colorpicker");
$url = $this->getAssetUrl($this->getColorPickerStyle().'.css');
if(!$cs->isStyleSheetFileRegistered($url))
$cs->registerStyleSheetFile($url, $url);
}
/**
* Renders additional body content.
* This method overrides parent implementation by adding
* additional color picker button.
* @param THtmlWriter writer
*/
public function renderEndTag($writer)
{
parent::renderEndTag($writer);
$color = $this->getText();
$writer->addAttribute('class', 'TColorPicker_button');
$writer->renderBeginTag('span');
$writer->addAttribute('id', $this->getClientID().'_button');
$writer->addAttribute('src', $this->getAssetUrl('button.gif'));
if($color !== '')
$writer->addAttribute('style', "background-color:{$color};");
$writer->addAttribute('width', '20');
$writer->addAttribute('height', '20');
$writer->addAttribute('alt', '');
$writer->renderBeginTag('img');
$writer->renderEndTag();
$writer->renderEndTag();
}
/**
* Gets the name of the javascript class responsible for performing postback for this control.
* This method overrides the parent implementation.
* @return string the javascript class name
*/
protected function getClientClassName()
{
return 'Prado.WebUI.TColorPicker';
}
}
/**
* TColorPickerMode class.
* TColorPickerMode defines the enumerable type for the possible UI mode
* that a {@link TColorPicker} control can take.
*
* The following enumerable values are defined:
* # Simple - Grid with 12 simple colors.
* # Basic - Grid with the most common 70 colors. This is the default mode.
* # Full - Full-featured color picker.
*
* @author Qiang Xue
* @package System.Web.UI.WebControls
* @since 3.0.4
*/
class TColorPickerMode extends TEnumerable
{
const Simple='Simple';
const Basic='Basic';
const Full='Full';
}
/**
* TColorPickerClientSide class.
*
* Client-side javascript code options.
*
* @author Wei Zhuo
* @package System.Web.UI.WebControls
* @since 3.1
*/
class TColorPickerClientSide extends TClientSideOptions
{
/**
* @return string javascript code for when a color is selected.
*/
public function getOnColorSelected()
{
return $this->getOption('OnColorSelected');
}
/**
* @param string javascript code for when a color is selected.
*/
public function setOnColorSelected($javascript)
{
$this->setFunction('OnColorSelected', $javascript);
}
}