DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:color

This is an old revision of the document!


color Plugin

Compatible with DokuWiki

2009-12-25, 2010-11-07, 2011-05-25, 2012-01-25, 2014-05-05, 2014-09-29d, Adora Belle, Weatherwax, Binky, Ponder Stibbons, Detritus

plugin Opportunity to write colored text in DokuWiki.

Last updated on
2016-06-25
Provides
Syntax
Repository
Source

This extension has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues.

Similar to emphasis, fontcolor, highlight, passwordgrey, wrap

Tagged with highlight, typography

Needed for colorpicker

Disclaimer

Christopher Smith seems leaved the plugin unmaintained. Another user leeyc0 provided hosting of the plugin in the github, but have no time to maintain it. Anyone interested in maintainining may leave a ticket in github and leeyc0 will be glad to hand over the project.

Installation

Please use the plugin manager to install the plugin, no configuration needed.

Usage

Place this code sample in your playground:

<color green>text</color>
<color blue/lightgrey>text</color>
<color #FF0000>text</color>

This plugin supports the X11 color names

Discussion

This source for this plugin is shown in the Sample Plugin Tutorial.

Update History

  • 2008-02-06 — Fixed a security vulnerability in the colour pattern. Any users of this plugin should apply this update. — Christopher Smith 2008-02-06 17:20
  • 2014-01-04 hosted in github by leeyc0
  • 2016-06-25 Added ODT support based on branch “redesign”

Version with ODT renderer support

This modified version is no more suitable for a simple tutorial example. But I needed the ODT renderer support ;-)Gabriel Birke 2008/05/09 11:46

Ooops. The version picked up to add ODT support was from before the 2008-02-06 version (which fixed a Cross Site Scripting vulnerability). So the ODT version was again vulnerable. Now fixed again. — Andy Webber 2009/06/24 16:16

Hello, I put this plugin on our wiki. That work well in the wiki but not at the time of export in odt. At which place must be located the colornames.php ? Do I use the last version of the plugin odt, have a solution? cedric 2010/01/11

Hey, Cedric. colornames.php should go in the same directory as syntax.php if I am reading the source all right. — Luis Machuca Bezzaza 2011/06/13 10:06
syntax.php
<?php
/**
 * Plugin Color: Sets new colors for text and background.
 * 
 * @license    GPL 2 (http://www.gnu.org/licenses/gpl.html)
 * @author     Christopher Smith <chris@jalakai.co.uk>
 */
 
// must be run within DokuWiki
if(!defined('DOKU_INC')) define('DOKU_INC',realpath(dirname(__FILE__).'/../../').'/');
if(!defined('DOKU_PLUGIN')) define('DOKU_PLUGIN',DOKU_INC.'lib/plugins/');
require_once(DOKU_PLUGIN.'syntax.php');
 
/**
 * All DokuWiki plugins to extend the parser/rendering mechanism
 * need to inherit from this class
 */
class syntax_plugin_color extends DokuWiki_Syntax_Plugin {
 
    var $odt_styles = array();
    /**
     * return some info
     */
    function getInfo(){
        return array(
            'author' => 'Christopher Smith',
            'email'  => 'chris@jalakai.co.uk',
            'date'   => '2009-06-24',
            'name'   => 'Color Plugin with ODT',
            'desc'   => 'Changes text colour and background',
            'url'    => 'http://www.dokuwiki.org/plugin:color',
        );
    }
 
    function getType(){ return 'formatting'; }
    function getAllowedTypes() { return array('formatting', 'substition', 'disabled'); }   
    function getSort(){ return 158; }
    function connectTo($mode) { $this->Lexer->addEntryPattern('<color.*?>(?=.*?</color>)',$mode,'plugin_color'); }
    function postConnect() { $this->Lexer->addExitPattern('</color>','plugin_color'); }
 
 
    /**
     * Handle the match
     */
    function handle($match, $state, $pos, &$handler){
        switch ($state) {
          case DOKU_LEXER_ENTER :
                list($color, $background) = preg_split("/\//u", substr($match, 6, -1), 2);
                $color = $this->_isValid($color); 
                $background = $this->_isValid($background); 
                return array($state, array($color, $background));
 
          case DOKU_LEXER_UNMATCHED :  return array($state, $match);
          case DOKU_LEXER_EXIT :       return array($state, '');
        }
        return array();
    }
 
    /**
     * Create output
     */
    function render($mode, &$renderer, $data) {
        if($mode == 'xhtml'){
            list($state, $match) = $data;
            switch ($state) {
              case DOKU_LEXER_ENTER :
                list($color, $background) = $match;
                $color = $color?"color:$color;":"";
                $background = $background?"background-color:$background;":"";
                $renderer->doc .= "<span style='$color $background'>";
                break;
 
              case DOKU_LEXER_UNMATCHED :  $renderer->doc .= $renderer->_xmlEntities($match); break;
              case DOKU_LEXER_EXIT :       $renderer->doc .= "</span>"; break;
            }
            return true;
        }
        if($mode == 'odt'){
          list($state, $match) = $data;
            switch ($state) {
              case DOKU_LEXER_ENTER :
                list($color, $background) = $match;
                $style_index = $color.'/'.$background;
                if(empty($this->odt_styles[$style_index]))
                {
                  $stylename = "ColorizedText".count($this->odt_styles);
                  $this->odt_styles[$style_index] = $stylename;
                  $color = $color?'fo:color="'.$this->_color2hex($color).'" ':'';
                  $background = $background?'fo:background="'.$this->_color2hex($background).'" ':'';
                  $renderer->autostyles[$stylename] = '
                  <style:style style:name="'.$stylename.'" style:family="text">
                      <style:text-properties '.$color.$background.'/>
                  </style:style>';
                }
                $renderer->doc .= '<text:span text:style-name="'.$this->odt_styles[$style_index].'">';
                break;
 
              case DOKU_LEXER_UNMATCHED :  $renderer->doc .= $renderer->_xmlEntities($match); break;
              case DOKU_LEXER_EXIT :       $renderer->doc .= "</text:span>"; break;
            }
            return true;
        }
        return false;
    }
 
    // validate color value $c
    // this is cut price validation - only to ensure the basic format is correct and there is nothing harmful
    // three basic formats  "colorname", "#fff[fff]", "rgb(255[%],255[%],255[%])"
    function _isValid($c) {
        $c = trim($c);
 
        $pattern = "/^\s*(
            ([a-zA-Z]+)|                                #colorname - not verified
            (\#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}))|        #colorvalue
            (rgb\(([0-9]{1,3}%?,){2}[0-9]{1,3}%?\))     #rgb triplet
            )\s*$/x";
 
        if (preg_match($pattern, $c)) return $c;
 
        return "";
    }
    /**
     * Translate color names and RGB to hex values
     */
    function _color2hex($name)
    {
      static $colornames = null;
      if(is_null($colornames))
      {
        include dirname(__FILE__).'/colornames.php';
      }
      if(!preg_match('/^(#|rgb)/', $name) && array_key_exists($name, $colornames))
        return $colornames[$name];
      elseif(preg_match('/rgb\(([0-9]{1,3}%?),([0-9]{1,3}%?),([0-9]{1,3}%?)\)/', $name, $matches))
      {
        $colors = array();
        for($i=1;$i<4;$i++)
        {
          $percent = substr($matches[$i], -1, 1) == '%';
          $colors[$i] = $percent?(substr($matches[$i],0,-1)/100)*256:$matches[$i];
        }
        return sprintf('#%02X%02X%02X', $colors[1], $colors[2], $colors[3]);
      }
      else
        return $name;
    }
}
 
 
//Setup VIM: ex: et ts=4 enc=utf-8 :
colornames.php
<?php
 
// HTML 4.01 color names 
$colornames = array(
  'black'   => '#000000',
  'navy'    => '#000080',
  'blue'    => '#0000FF',
  'green'   => '#008000',
  'teal'    => '#008080',
  'lime'    => '#00FF00',
  'aqua'    => '#00FFFF',
  'maroon'  => '#800000',
  'purple'  => '#800080',
  'olive'   => '#808000',
  'gray'    => '#808080',
  'silver'  => '#C0C0C0',
  'red'     => '#FF0000',
  'fuchsia' => '#FF00FF',
  'yellow'  => '#FFFF00',
  'white'   => '#FFFFFF',
  'orange'  => '#FFA500', // From CSS 2.1 spec
 
  //additional X11 colors, works nicely from Rincewind on.
  'aliceblue'  =>  '#F0F8FF',
'antiquewhite'  =>  '#FAEBD7',
'aqua'  =>  '#00FFFF',
'aquamarine'  =>  '#7FFFD4',
'azure'  =>  '#F0FFFF',
'beige'  =>  '#F5F5DC',
'bisque'  =>  '#FFE4C4',
'black'  =>  '#000000',
'blanchedalmond'  =>  '#FFEBCD',
'blue'  =>  '#0000FF',
'blueviolet'  =>  '#8A2BE2',
'brown'  =>  '#A52A2A',
'burlywood'  =>  '#DEB887',
'cadetblue'  =>  '#5F9EA0',
'chartreuse'  =>  '#7FFF00',
'chocolate'  =>  '#D2691E',
'coral'  =>  '#FF7F50',
'cornflower'  =>  '#6495ED',
'cornsilk'  =>  '#FFF8DC',
'crimson'  =>  '#DC143C',
'cyan'  =>  '#00FFFF',
'darkblue'  =>  '#00008B',
'darkcyan'  =>  '#008B8B',
'darkgoldenrod'  =>  '#B8860B',
'darkgray'  =>  '#A9A9A9',
'darkgreen'  =>  '#006400',
'darkkhaki'  =>  '#BDB76B',
'darkmagenta'  =>  '#8B008B',
'darkolivegreen'  =>  '#556B2F',
'darkorange'  =>  '#FF8C00',
'darkorchid'  =>  '#9932CC',
'darkred'  =>  '#8B0000',
'darksalmon'  =>  '#E9967A',
'darkseagreen'  =>  '#8FBC8F',
'darkslateblue'  =>  '#483D8B',
'darkslategray'  =>  '#2F4F4F',
'darkturquoise'  =>  '#00CED1',
'darkviolet'  =>  '#9400D3',
'deeppink'  =>  '#FF1493',
'deepskyblue'  =>  '#00BFFF',
'dimgray'  =>  '#696969',
'dodgerblue'  =>  '#1E90FF',
'firebrick'  =>  '#B22222',
'floralwhite'  =>  '#FFFAF0',
'forestgreen'  =>  '#228B22',
'fuchsia'  =>  '#FF00FF',
'gainsboro'  =>  '#DCDCDC',
'ghostwhite'  =>  '#F8F8FF',
'gold'  =>  '#FFD700',
'goldenrod'  =>  '#DAA520',
'grayx11'  =>  '#BEBEBE',
'gray'  =>  '#808080',
'greenx11'  =>  '#00FF00',
'green'  =>  '#008000',
'greenyellow'  =>  '#ADFF2F',
'honeydew'  =>  '#F0FFF0',
'hotpink'  =>  '#FF69B4',
'indianred'  =>  '#CD5C5C',
'indigo'  =>  '#4B0082',
'ivory'  =>  '#FFFFF0',
'khaki'  =>  '#F0E68C',
'lavender'  =>  '#E6E6FA',
'lavenderblush'  =>  '#FFF0F5',
'lawngreen'  =>  '#7CFC00',
'lemonchiffon'  =>  '#FFFACD',
'lightblue'  =>  '#ADD8E6',
'lightcoral'  =>  '#F08080',
'lightcyan'  =>  '#E0FFFF',
'lightgoldenrod'  =>  '#FAFAD2',
'lightgray'  =>  '#D3D3D3',
'lightgreen'  =>  '#90EE90',
'lightpink'  =>  '#FFB6C1',
'lightsalmon'  =>  '#FFA07A',
'lightseagreen'  =>  '#20B2AA',
'lightskyblue'  =>  '#87CEFA',
'lightslategray'  =>  '#778899',
'lightsteelblue'  =>  '#B0C4DE',
'lightyellow'  =>  '#FFFFE0',
'lime'  =>  '#00FF00',
'limegreen'  =>  '#32CD32',
'linen'  =>  '#FAF0E6',
'magenta'  =>  '#FF00FF',
'maroonx11'  =>  '#B03060',
'maroon'  =>  '#7F0000',
'mediumaquamarine'  =>  '#66CDAA',
'mediumblue'  =>  '#0000CD',
'mediumorchid'  =>  '#BA55D3',
'mediumpurple'  =>  '#9370DB',
'mediumseagreen'  =>  '#3CB371',
'mediumslateblue'  =>  '#7B68EE',
'mediumspringgreen'  =>  '#00FA9A',
'mediumturquoise'  =>  '#48D1CC',
'mediumvioletred'  =>  '#C71585',
'midnightblue'  =>  '#191970',
'mintcream'  =>  '#F5FFFA',
'mistyrose'  =>  '#FFE4E1',
'moccasin'  =>  '#FFE4B5',
'navajowhite'  =>  '#FFDEAD',
'navy'  =>  '#000080',
'oldlace'  =>  '#FDF5E6',
'olive'  =>  '#808000',
'olivedrab'  =>  '#6B8E23',
'orange'  =>  '#FFA500',
'orangered'  =>  '#FF4500',
'orchid'  =>  '#DA70D6',
'palegoldenrod'  =>  '#EEE8AA',
'palegreen'  =>  '#98FB98',
'paleturquoise'  =>  '#AFEEEE',
'palevioletred'  =>  '#DB7093',
'papayawhip'  =>  '#FFEFD5',
'peachpuff'  =>  '#FFDAB9',
'peru'  =>  '#CD853F',
'pink'  =>  '#FFC0CB',
'plum'  =>  '#DDA0DD',
'powderblue'  =>  '#B0E0E6',
'purplex11'  =>  '#A020F0',
'purple'  =>  '#7F007F',
'red'  =>  '#FF0000',
'rosybrown'  =>  '#BC8F8F',
'royalblue'  =>  '#4169E1',
'saddlebrown'  =>  '#8B4513',
'salmon'  =>  '#FA8072',
'sandybrown'  =>  '#F4A460',
'seagreen'  =>  '#2E8B57',
'seashell'  =>  '#FFF5EE',
'sienna'  =>  '#A0522D',
'silver'  =>  '#C0C0C0',
'skyblue'  =>  '#87CEEB',
'slateblue'  =>  '#6A5ACD',
'slategray'  =>  '#708090',
'snow'  =>  '#FFFAFA',
'springgreen'  =>  '#00FF7F',
'steelblue'  =>  '#4682B4',
'tan'  =>  '#D2B48C',
'teal'  =>  '#008080',
'thistle'  =>  '#D8BFD8',
'tomato'  =>  '#FF6347',
'turquoise'  =>  '#40E0D0',
'violet'  =>  '#EE82EE',
'wheat'  =>  '#F5DEB3',
'white'  =>  '#FFFFFF',
'whitesmoke'  =>  '#F5F5F5',
'yellow'  =>  '#FFFF00',
'yellowgreen'  =>  '#9ACD32' //from https://en.wikipedia.org/wiki/X11_color_names
);

No header support

Hi there, i realized that coloring of headers is not possible. The = delimiters turn to plain text when wrapped with the color tag. It would be great to have that feature, if possible.
Thanks for this otherwise awesome plugin! rapho 2012/08/03

I agree that would be very helpful newbie 2013/04/30

This would be really nice CyrilM 2013/07/12

I like colourful headers as well. HH 2014/07/29

Mee Too CW in Miami 2015/6/30

This plugin also supports background color, which is defined with <color blue/yellow> Blue text on yellow background</color>. AndyF 2016/04/05

plugin/color.1472853896.txt.gz · Last modified: 2016-09-03 00:04 by Klap-in

Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki