(redirected from Programming.PmToggleEdit)

 

 

Summary: easier addition of toggle-markup.
Version: 0.1.20090914
Prerequisites: PmWiki 2.2.0, Cookbook:Toggle
Status: beta
Maintainer: MichaelPaulukonis
Categories: Editing Markup

Questions answered by this recipe

How can I easily add toggle markup when editing pages?
How can I add a toggle-button to the edit-gui-buttons?

 

pmToggleEdit adds a button to the edit-bar for easier addition of toggle-markup.

 

Requires the PmWiki Cookbook recipe Toggle to be enabled.

 

 

Basic usage

 

  1. edit page
  2. highlight region
  3. click the button that looks like a window-shade:

 

 

 

Output will look something like:

 

(:toggle id="tog1252880238887" show="Show message" init=hide button=1:)
(:div1252880238887 id="tog1252880238887" style="border:1px solid #999;
padding:5px;":)
toggle this text
(:div1252880238887end:)

toggle this text

 

 

By default, the text is hidden, and the show message is simply “Show message”. A simple border-style has also been included. To ensure that divs can be safely toggled, the (:divn:)...(:divnend:) markup has been used. A unique id and div-number is assigned using on the Java Script Date.getTime() function.

 

 

Installation

 

Download Programming/pm-toggle-edit.zip (3kb)

  1. Install Toggle
  2. copy toggle.gif to pub\guiedit\
  3. copy pm-toggle-edit.js to pub\
  4. add the following to your local\config.php:
$GUIButtons['toggle'] = array(90, '', '', '',
   '<a href=\"#\" onclick=\"pmAddToggle();\"><img src=\'$GUIButtonDirUrlFmt/toggle.gif\' title=\'$[toggle]\' /></a>');

 

$HTMLFooterFmt['toggle'] = '<script type="text/javascript"
   src="$FarmPubDirUrl/pm-toggle-edit.js"></script>'
;

 

 

  • Don’t forget to enable javascript in your browser!  

 

 

TODO - further development

The use of css for styling would be preferable to the hard-coded style currently included.

 

At least putting the default style into a more-readily-edited config variable, instead of the less-accessible javascript-file.

 

 

Unobtrusive JavaScript toggle

NOTE: as toggle.php is currently implemented, it does not degrade gracefully when JS is disabled (eg, hidden text remains hidden with no easy way to view, outside of page-source). See notes and proposed patch @ Cookbook:Toggle-Talk

 

see also: Cookbook:UnToggle which deals with this issue (but is a less robust toggle implementation?)

 

 

Button template

I’ve found it useful to keep a blank 22x22 button template lying around for adding new entries.
It’s included in pm-toggle-edit.zip Δ, but looks like

 

Hrm. Pretty boring, yeah? Use your imagination, and start filling it up.

 

See more buttons and ideas at Cookbook:GuiEdit

 

 

See Also

Cookbook:Toggle
Cookbook:GuiEdit

 

 

Category tags

Programming javascript php pmwiki cookbook editing