The Caboteria / TWiki Web / ColorPickerPlugin (04 Dec 2012, TWikiContributor)

Color Picker Plugin

screenshot-edit.png

Color picker for use in TWiki forms and TWiki applications

Introduction

This TWiki plugin packages the Farbtastic color picker, which is a jQuery plugin developed by Steven Wittens of Acko.net. The package adds a color picker to TWiki forms and TWiki applications.

Using the color picker in TWikiForms

This package adds a color type to TWikiForms:

Type Description Size Value
color Single-line text box and a color picker to pick a color. The color can also be typed into the text box, such as #123456. Text box width in number of characters Initial (default) color

Example form definition:

Name: Type: Size Values: Tooltip message:
Background color color 12   Select color

Using the color picker in an HTML form

You can also use the color picker directly in your HTML forms, without having to write any code. Just include this in the topic text:

<form action="...">
%COLORPICKER{ name="text_color" size="12" value="#123456" class="twikiInputField" }%
<form>
This will show an HTML input field named "text_color" and a color picker tied to it.

Parameter Description Default Example
name Name of input field (required) name="text_color"
value Initial color value, in hexadecimal notation for the combination of Red, Green, and Blue color values (RGB). (none) value="#0000ff"
size Size of input field (browser default) size="12"
class CSS class of input field (none) class="twikiInputField"
Additional parameters can be supplied; they will be added to the HTML input field.

Test: (this only works if the ColorPickerPlugin is installed and enabled)

Using the color picker with disabled plugin

It is also possible to use the color picker in HTML forms with disabled ColorPickerPlugin:

%INCLUDE{ "%SYSTEMWEB%.ColorPickerPlugin" section="code" }%
<form action="...">
%INCLUDE{ "%SYSTEMWEB%.ColorPickerPlugin" section="picker" NAME="demo_color" SIZE="12" VALUE="#123456" EXTRA="class=\"twikiInputField\"" }%
</form>
This will show an HTML input field named "demo_color" and a color picker tied to it. The "code" section should be included once per topic, the "picker" section can be included as many times as needed. The NAME parameter is required; SIZE, VALUE and EXTRA parameters are optional. Use the EXTRA parameter to add additional parameters to the HTML input field.

Test: (this works only if the ColorPickerPlugin is installed and disabled)

Installation Instructions

Note: You do not need to install anything on the browser to use this extension. The following instructions are for the administrator who installs the extension on the TWiki server.

Plugin Info

Author: TWiki:Main.PeterThoeny, TWiki.org
Copyright: © 2007 Steven Wittens, Acko.net for Farbtastic jQuery plugin
© 2010-2012 TWiki:Main.PeterThoeny and TWiki:TWiki.TWikiContributor for TWiki ColorPickerPlugin
License: GPL (GNU General Public License)
Dependencies:
NameVersionDescription
TWiki::Plugins::JQueryPlugin>=1.0Required; download from TWiki:Plugins/JQueryPlugin
Version: 2012-12-03
Change History:  
2012-12-03: TWikibug:Item7020: Add VarCOLORPICKER with category; doc improvements
2012-08-11: TWikibug:Item6837: Doc fixes; updated installation instructions
2011-06-11: TWikibug:Item6725: Change global package variables from "use vars" to "our"
2010-11-30: TWikibug:Item6610: Rewrite ColorPickerContrib into ColorPickerPlugin
2010-11-27: TWikibug:Item6609: In TWikiForms type table, automatically list the color form field type defined in this contrib -- TWiki:Main.PeterThoeny
2010-11-26: TWikibug:Item6606: Complete rewrite of contrib using Farbtastic color picker -- TWiki:Main.PeterThoeny
2006-10-27: Initial version of ColorPickerContrib by TWiki:Main.FlavioCurti using Colorpicker by Norman Timmler (inlet media e.K., Hamburg, Germany)
Home: http://TWiki.org/cgi-bin/view/Plugins/ColorPickerPlugin
Feedback: http://TWiki.org/cgi-bin/view/Plugins/ColorPickerPluginDev
Appraisal: http://TWiki.org/cgi-bin/view/Plugins/ColorPickerPluginAppraisal

Related Topics: VarCOLORPICKER, TWikiPreferences, TWikiForms, TWikiPlugins

Edit | Attach | Print version | History: r3 < r2 < r1 | Backlinks | Raw View | Raw edit | More topic actions
Copyright © 1999-2024 by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding The Caboteria? Send feedback
Note: Please contribute updates to this topic on TWiki.org at TWiki:TWiki.ColorPickerPlugin.