head	1.3;
access;
symbols;
locks; strict;
comment	@# @;


1.3
date	2006.06.25.16.26.33;	author TWikiContributor;	state Exp;
branches;
next	1.2;

1.2
date	2006.04.01.05.55.38;	author TWikiContributor;	state Exp;
branches;
next	1.1;

1.1
date	2006.02.01.12.01.24;	author TWikiContributor;	state Exp;
branches;
next	;


desc
@new-topic
@


1.3
log
@buildrelease
@
text
@%META:TOPICINFO{author="TWikiContributor" date="1140597757" format="1.1" version="3"}%
---+!! <nop>%TOPIC%

%TOC%

---++ Summary

This contrib packages in a convenient way the Javascript library and the CSS file needed to implement TWisty Sections.

See the  [[%ATTACHURL%/toggle-optm-jsoff-sep.html][attached file]] for a demo and an example of usage.

To use the libraries, you must place the following scriplet either in the head section of the page (by modifying the %TWIKIWEB%.TWikiSkins) or putting it somewhere in the topic:

<verbatim>
<style type="text/css" media="all">
@@import url("%PUBURLPATH%/TWiki/TwistyContrib/twist.css");
</style>

<script type="text/javascript" src="%PUBURLPATH%/TWiki/TwistyContrib/twist.js"></script>
</verbatim>

It's recommended to use the TWiki:Plugins.TwistyPlugin, as it eases the deployment and use of this contrib.

%RED%Caution: If the previous scriplet is put in the HEAD section of the page or the TWiki:Plugins.TwistyPlugin is used, it won't work if the =&lt;body onload=""&gt;= manager is set by the skin. Check the [[%ATTACHURL%/twist.js][twist.js]] file for an idea on how to register an eventmanager for the onload event without overwriting the previous one.%ENDCOLOR%

This Contrib should work in all versions of TWiki. It has been tested against TWiki:Codev.CairoRelease and TWiki:Codev.DakarRelease.

---++ Customization

Skins can customize the color of the twisty placeholder by modifiying the =.twistyPlaceholder= style.

---++ Settings

	* Set SHORTDESCRIPTION = Twisty section javascript library to open/close content dynamically 
	* Set STUB = TWiki::Contrib::TwistyContrib

---++ Installation Instructions

	* Download the ZIP file from the Plugin web (see below)
	* Unzip ==%TOPIC%.zip== in your ($TWIKI_ROOT) directory. Content:
	| *File:* | *Description:* |
   | ==data/TWiki/TwistyContrib.txt== |  |
   | ==lib/TWiki/Contrib/TwistyContrib.pm== |  |
   | ==pub/TWiki/TwistyContrib/toggle-optm-jsoff-sep.html== |  |
   | ==pub/TWiki/TwistyContrib/twist.css== |  |
   | ==pub/TWiki/TwistyContrib/twist.js== |  |

	* Optionally, run ==%TOPIC%_installer== to automatically check and install other TWiki modules that this module depends on. You can also do this step manually.
	* Alternatively, manually make sure the dependencies listed in the table below are resolved.
	None

---++ Demo & Text

If the contrib is properly installed (and Javascript is enabled in your browser!), then you should see some folding sections below. Look at [[%SCRIPTURLPATH{"view"}%/%WEB%.%TOPIC%?raw=on]] to see how it's done.

<style type="text/css" media="all">
@@import url("%PUBURLPATH%/TWiki/TwistyContrib/twist.css");
</style>

<script type="text/javascript" src="%PUBURLPATH%/TWiki/TwistyContrib/twist.js"></script>


<span id="demoshow" class="twistyHidden">
<button class="twistyTrigger"> Unfold </button>
</span>
<span id="demohide" class="twistyMakeVisible">
<button class="twistyTrigger"> Fold </button>
</span>
<div id="demotoggle" class="twistyMakeVisible">
---
Click on the button above to fold this section.
---
</div>

<span id="no_1show" class="twistyMakeVisible">
	<a href="#" class="twistyTrigger">Expand...</a>
	<span class="twistyPlaceholder twistyMakeVisible">Hamlet is without question the most famous play in the English language...</span>
</span>
<span id="no_1hide" class="twistyHidden">
	<a href="#" class="twistyTrigger">Collapse...</a>
</span>
<div id="no_1toggle" class="twistyMakeHidden">
Hamlet is without question the most famous play in the English language. Probably written in 1601 or 1602, the tragedy is a milestone in Shakespeare's dramatic development; the playwright achieved artistic maturity in this work through his brilliant depiction of the hero's struggle with two opposing forces: moral integrity and the need to avenge his father's murder.

<span id="no_2show" class="twistyMakeVisible">
<a href="#" class="twistyTrigger">More...</a>
</span>
<span id="no_2hide" class="twistyHidden twistyMakeVisible">
<a href="#" class="twistyTrigger">Hide more</a>
</span>

</div>

<div id="no_2toggle" class="twistyMakeHidden">
For more Shakespeare plays, see Wikipedia:WilliamShakespeare
</div>

---++ Contrib Info

| Authors: | Javascript created by TWiki:Main.SamHasler, Contrib packaged by  TWiki:Main.RafaelAlvarez |
| Copyright &copy;: | 2005 Sam Hasler and Rafael Alvarez |
| License: | [[http://www.gnu.org/copyleft/gpl.html][GPL]] |
| Dependencies: | None |
|  12 Sep 2005 | 1.000 First Version |
|  Home: | http://TWiki.org/cgi-bin/view/Plugins/%TOPIC% |
|  Feedback: | http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Dev |
|  Appraisal: | http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Appraisal |

__Related Topics:__ %TWIKIWEB%.TWikiPreferences
 
-- TWiki:Main.SamHasler - 12 Sep 2005
%META:FILEATTACHMENT{name="twist.js" attachment="twist.js" attr="" comment="Javscript library" date="1126427179" path="twist.js" size="3441" stream="twist.js" user="TWikiContributors" version="0"}%
%META:FILEATTACHMENT{name="twist.css" attachment="twist.css" attr="" comment="Style Sheet" date="1126427224" path="twist.css" size="122" stream="twist.css" user="TWikiContributors" version="0"}%
%META:FILEATTACHMENT{name="toggle-optm-jsoff-sep.html" attachment="toggle-optm-jsoff-sep.html" attr="" comment="Example of usage" date="1126427282" path="toggle-optm-jsoff-sep.html" size="1716" stream="toggle-optm-jsoff-sep.html" user="TWikiContributors" version="0"}%
@


1.2
log
@buildrelease
@
text
@d1 1
a1 1
%META:TOPICINFO{author="TWikiContributor" date="1140597757" format="1.1" version="2"}%
d42 5
a46 5
   | ==data/TWiki/TwistyContrib.txt== | NEW |
   | ==lib/TWiki/Contrib/TwistyContrib.pm== | NEW |
   | ==pub/TWiki/TwistyContrib/toggle-optm-jsoff-sep.html== | NEW |
   | ==pub/TWiki/TwistyContrib/twist.css== | NEW |
   | ==pub/TWiki/TwistyContrib/twist.js== | NEW |
@


1.1
log
@buildrelease
@
text
@d1 2
a2 2
%META:TOPICINFO{author="RafaelAlvarez" date="1126490512" format="1.1" version="1"}%
---+!! %TOPIC%
d6 1
a6 1
---+ Summary
d10 2
d34 2
a35 5
	* Name of the perl package
		* Set STUB = TWiki::Contrib::TwistyContrib

	* One line description:
		* Set SHORTDESCRIPTION = Placeholder for the twisty javascript library.
d37 1
a37 1
---+ Installation Instructions
d42 5
a46 5
	| ==data/TWiki/TwistyContrib.txt== | NEW |
	| ==lib/TWiki/Contrib/TwistyContrib.pm== | NEW |
	| ==pub/TWiki/TwistyContrib/toggle-optm-jsoff-sep.html== | NEW |
	| ==pub/TWiki/TwistyContrib/twist.css== | NEW |
	| ==pub/TWiki/TwistyContrib/twist.js== | NEW |
d52 1
a52 1
---+ Demo & Text
d98 1
a98 1
---+ Contrib Info
d104 1
a104 1
| 12/09/2005 | 1.000 First Version |
d111 4
a114 4

%META:FILEATTACHMENT{name="twist.js" attachment="twist.js" attr="" comment="Javscript library" date="1126427179" path="twist.js" size="3441" stream="twist.js" user="Main.RafaelAlvarez" version="0"}%
%META:FILEATTACHMENT{name="twist.css" attachment="twist.css" attr="" comment="Style Sheet" date="1126427224" path="twist.css" size="122" stream="twist.css" user="Main.RafaelAlvarez" version="0"}%
%META:FILEATTACHMENT{name="toggle-optm-jsoff-sep.html" attachment="toggle-optm-jsoff-sep.html" attr="" comment="Example of usage" date="1126427282" path="toggle-optm-jsoff-sep.html" size="1716" stream="toggle-optm-jsoff-sep.html" user="Main.RafaelAlvarez" version="0"}%
@
