====== Styler plugin ======

---- plugin ----
description: This plugin provide additional formatting of your texts: expanded quotations, epigraps, verses, etc
author     : Ivan A-R
email      : ivan@iar.spb.ru
type       : syntax
lastupdate : 2007-07-23
compatible : 
depends    : 
conflicts  : 
similar    : 
tags       : quotation, epigraph, verse
----

[[http://iar.spb.ru/en/projects/dokuwiki/styler/start|Details and Download]]

===== Description =====

This plugin provide additional formatting of your texts:
  * ''%%<quote>%%'' - the expanded quotations;
  * ''%%<epigraph>%%'' - epigraps;
  * ''%%<verse>%%'' - formatting of verses;
  * ''%%<style>%%'' - generic style blocks.

As you can specify attributes for each formatted block:
  * ''left'' - text align to left;
  * ''right'' - text align to right;
  * ''center'' - center text;
  * ''justify'' - justify text;
  * ''float-left'' - To create the floating block to the left of the text;
  * ''float-right'' - To create the floating block to the right of the text;
  * ''box'' - To draw a framework around of the block;
  * ''background'' - To fill in a background with solid color.

====== Contribution: StylerPlus ======
A contribution for this great plugin. This extends the attributes to allow to select background and border colors in a block, width size, and nested blocks.
 --- //[[victorcastelan@gmail.com|victor castelan]] 2008/10/17 08:01//

The extend attributes are:

==== Background Light Colors ====
To fill in with a specific background **light** color
  * ''background'' - light gray
  * ''background-lwhite'' - white
  * ''background-lyellow'' - yellow
  * ''background-lorange'' - orange
  * ''background-lgreen'' - green
  * ''background-lblue'' - blue
  * ''background-lbrown'' - brown
  * ''background-lpink'' - pink
  * ''background-lred'' - red

**example:**
<code><style background-lgreen>some text</style></code>

==== Background Dark colors ====
To fill in with a specific background **dark** color and text in white
  * ''background-d'' - dark gray
  * ''background-dblack'' - black
  * ''background-dyellow'' - yellow
  * ''background-dorange'' - orange
  * ''background-dgreen'' - green
  * ''background-dblue'' - blue
  * ''background-dbrown'' - brown
  * ''background-dpink'' - pink
  * ''background-dred'' - red

**example:**
<code><style background-dorange>some text</style></code>

==== Borders colors ====
To draw a border around of the block with a dark color;
  * ''box'' - gray
  * ''box-dblack'' - black
  * ''box-dyellow'' - yellow
  * ''box-dorange'' - orange
  * ''box-dgreen'' - green
  * ''box-dblue'' - blue
  * ''box-dbrown'' - brown
  * ''box-dpink'' - pink
  * ''box-dred'' - red

**example:** This fill the block with light orange and apply a dark orange border color
<code><style background-lorange box-dorange>some text</style></code>

==== Sizes ====
You can specify a width to your block.
  * ''s25'' - 25% block width
  * ''s50'' - 50% block width
  * ''s75'' - 75% block width

**example 1:** Draw two blocks in the same row (floating-left)
<code>
<style background-lorange box-dorange float-left s50>some text</style>
<style background-lorange box-dorange float-left s50>some text</style>
</code>

**example 2:** Draw three blocks in the same row (floating-left)
<code>
<style background-lorange box-dorange float-left s50>some text</style>
<style background-lorange box-dorange float-left s25>some text</style>
<style background-lorange box-dorange float-left s25>some text</style>
</code>

==== Clear attributes ====
To apply clear attribute when floating blocks
  * ''clear-left''
  * ''clear-right''
  * ''clear-both''

==== Nested blocks ====
**example:** Draw a block inside other block
<code>
<style background-lorange box-dorange float-left s50>
<style background-dgreen center>**Maybe a title in bold**</style>
Here your text
</style>
</code>

===== About this =====
Just replace this files in the styler plugin. 

If you have been installed styler, Don't forget to reset the dokuwiki cache. To do this, put after the url **?purge=true**

===== styler.php =====
<code php>
<?php

  /**

  * Plugin Style: More styles for dokuwiki

  * Format: see README

  *

  * @license    GPL 2 (http://www.gnu.org/licenses/gpl.html)

  * @author     Ivan A-R <ivan@iar.spb.ru>

  * @page       http://iar.spb.ru/projects/doku/styler

  * @version	0.2

  */



  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_styler_styler extends DokuWiki_Syntax_Plugin {



    /**

    * return some info

    */

    function getInfo(){

      return array(

        'author' => 'Ivan A-R',

        'email'  => 'ivan@iar.spb.ru',

        'date'   => '2007-07-23',

        'name'   => 'Styler plugin',

        'desc'   => 'More formatings: quote, epigraph, style [left, right, center, justify, float-left, float-right, box, background]',

        'url'    => 'http://iar.spb.ru/en/projects/doku/styler',

        'version' => '0.2',

      );

    }



    function getType(){ return 'container';}

    function getAllowedTypes() { return array('container','substition','protected','disabled','formatting','paragraphs'); }

    //function getAllowedTypes() { return array('formatting', 'substition', 'container', 'disabled'); }

    function getPType(){ return 'stack';}



    function getSort(){ return 205; }
    
     // override default accepts() method to allow nesting 
    // - ie, to get the plugin accepts its own entry syntax (vmc)
    function accepts($mode) {
      if ($mode == substr(get_class($this), 7)) return true;
        return parent::accepts($mode);
      }



    function connectTo($mode) {

      /*$this->Lexer->addEntryPattern('<style.*?>(?=.*?\x3C/style\x3E)', $mode, 'plugin_styler_styler');

      $this->Lexer->addEntryPattern('<quote.*?>(?=.*?\x3C/quote\x3E)', $mode, 'plugin_styler_styler');

      $this->Lexer->addEntryPattern('<epigraph.*?>(?=.*?\x3C/epigraph\x3E)', $mode, 'plugin_styler_styler');*/
      $this->Lexer->addEntryPattern('<style.*?>(?=.*?\</style>)', $mode, 'plugin_styler_styler');

      $this->Lexer->addEntryPattern('<quote.*?>(?=.*?\</quote>)', $mode, 'plugin_styler_styler');

      $this->Lexer->addEntryPattern('<epigraph.*?>(?=.*?\</epigraph>)', $mode, 'plugin_styler_styler');

    }

    function postConnect() {

      $this->Lexer->addExitPattern('</style>', 'plugin_styler_styler');

      $this->Lexer->addExitPattern('</quote>', 'plugin_styler_styler');

      $this->Lexer->addExitPattern('</epigraph>', 'plugin_styler_styler');

    }





    /**

    * Handle the match

    */

    function handle($match, $state, $pos, &$handler){

      global $conf;

      switch ($state) {

        case DOKU_LEXER_ENTER :

          $match = str_replace(array('<', '>'), array('', ''), $match);

          $attrib = preg_split('/\s+/', strtolower($match));

          if ($attrib[0])

          {

            return array(array_shift($attrib), $state, $attrib);

          }

          else

          {

            return array($match, $state, array());

          }

        case DOKU_LEXER_UNMATCHED : return array($match, $state, array());

        case DOKU_LEXER_EXIT :      return array('',     $state, array());

      }

      return array();

    }



    /**

    * Create output

    */

    function render($mode, &$renderer, $data) {

      global $st;

      global $et;

      global $conf;

      global $prt;

      if($mode == 'xhtml'){

        switch ($data[1]) {

        case DOKU_LEXER_ENTER :

          $class = '';

          foreach(array('left', 'right', 'center', 'justify', 'box', 'float-left', 'float-right', 'background', 'background-lwhite', 'background-lyellow', 'background-lorange', 'background-lgreen', 'background-lblue', 'background-lbrown', 'background-lpink', 'background-lred', 'background-dblack', 'background-dyellow', 'background-dorange', 'background-dgreen', 'background-dblue', 'background-dbrown', 'background-dpink', 'background-dred', 'background-d', 'box-dblack', 'box-dyellow', 'box-dorange', 'box-dgreen', 'box-dblue', 'box-dbrown', 'box-dpink', 'box-dred', 's25', 's50', 's75', 'clear-left', 'clear-right', 'clear-both') as $v)

          {

            if (in_array($v, $data[2]))

            {

              $class .= ' styler-'.$v;

            }

          }

          $renderer->doc .= "</p>\n"; // It is hack

          if ($data[0] == 'quote')

          {

            $renderer->doc .= '<div class="styler-quote'.$class.'">';

          }

          elseif ($data[0] == 'epigraph')

          {

            $renderer->doc .= '<div class="epigraph'.$class.'">';

          }

          else

          {

            $renderer->doc .= '<div class="styler'.$class.'">';

          }

          break;

        case DOKU_LEXER_UNMATCHED :

          $renderer->doc .= $data[0];

          break;

        case DOKU_LEXER_EXIT :

          $renderer->doc .= "</div>\n<p>"; // "</p>" and "\n</p>" is hack

          break;

        }

        return true;

      }

      return false;

    }

  }

//Setup VIM: ex: et ts=4 enc=utf-8 :

?>

</code>

===== style.css =====
<code css>
div.dokuwiki div.preview {margin:0 !important;}

/* Styler */
div.styler-box {border: 1px solid #cccccc; padding: 1em;}/*gray*/
div.styler-box-dblack {border: 1px solid #000000; padding: 1em;}
div.styler-box-dyellow {border: 1px solid #ffcc33; padding: 1em;}
div.styler-box-dorange {border: 1px solid #ff9933; padding: 1em;}
div.styler-box-dgreen {border: 1px solid #33cc33; padding: 1em;}
div.styler-box-dblue {border: 1px solid #3366cc; padding: 1em;}
div.styler-box-dbrown {border: 1px solid #99cc33; padding: 1em;}
div.styler-box-dpink {border: 1px solid #ff66cc; padding: 1em;}
div.styler-box-dred {border: 1px solid #ff66cc; padding: 1em;}

/* sizes */
div.styler-s25 {width:20%}
div.styler-s50 {width:45%}
div.styler-s75 {width:70%}

/**/
/*vmc light colors*/
div.styler-background { background-color: #f6f6f6 }/*gray*/
div.styler-background-lwhite { background-color: #ffffff }
div.styler-background-lyellow { background-color: #ffffd6 }
div.styler-background-lorange { background-color: #ffebd6 }
div.styler-background-lgreen { background-color: #e0ffd6 }
div.styler-background-lblue { background-color: #d6e0f5 }
div.styler-background-lbrown { background-color: #ebe0d6 }
div.styler-background-lpink { background-color: #ffe0f5 }
div.styler-background-lred { background-color: #ffcccc }

/*vmc dark colors*/
div.styler-background-d { background-color: #333333; color:#ffffff; }/*gray*/
div.styler-background-dblack { background-color: #000000; color:#ffffff; }
div.styler-background-dyellow { background-color: #ffcc33; color:#ffffff; }
div.styler-background-dorange { background-color: #ff9933; color:#ffffff; }
div.styler-background-dgreen { background-color: #33cc33; color:#ffffff; }
div.styler-background-dblue { background-color: #3366cc; color:#ffffff; }
div.styler-background-dbrown { background-color: #996633; color:#ffffff; }
div.styler-background-dpink { background-color: #ff66cc; color:#ffffff; }
div.styler-background-dred { background-color: #ff66cc; color:#ff0000; }

/*div.styler-float-left { float: left; margin: 0 1em 0.5em 1em; }
div.styler-float-right { float: right; margin: 0 1em 0.5em 1em; }*/
div.styler-float-left { float: left; margin: 0 1em 0.5em 0; }
div.styler-float-right { float: right; margin: 0 0 0.5em 1em; }

/*clear*/
div.styler-clear-left { clear: left; }
div.styler-clear-right { clear: right; }
div.styler-clear-both { clear: both; }

div.styler-left { text-align: left; }
div.styler-right { text-align: right; }
div.styler-center { text-align: center; }
div.styler-justify { text-align: justify; }

/* epigraph */
div.epigraph {
	margin-left: 60%;
	margin-top: 1em;
	margin-bottom: 1em;
	padding-left: 1em;
	font-family: Times New Roman, Georgia, Garamond, Times, serif;
	font-style: italic;
}

/* quote */
div.styler-quote {
	/*margin-left: 3em; */
	margin: 1em 0px 1em 3em;
	border: 1px dotted #CCCCCC;
	background: #ffffff url(images/blockquote.gif) no-repeat 0.3em 0.3em;
	padding: 1em;
	
}
</code>