Author: SvenDowideit Date: 2008-04-21 21:01:38 -0500 (Mon, 21 Apr 2008) New Revision: 16707 Trac url: http://develop.twiki.org/trac/changeset/16707 Added: twiki/trunk/TwistyPlugin/pub/ twiki/trunk/TwistyPlugin/pub/TWiki/ twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/ twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.dojo.js twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.css twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.js twiki/trunk/TwistyPlugin/templates/ twiki/trunk/TwistyPlugin/templates/twistyplugin.dojo.tmpl twiki/trunk/TwistyPlugin/templates/twistyplugin.jquery.tmpl twiki/trunk/TwistyPlugin/templates/twistyplugin.tmpl Modified: twiki/trunk/TwistyPlugin/data/TWiki/TwistyPlugin.txt twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin.pm twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/DEPENDENCIES twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/MANIFEST Log: Item5557: dojo, jquery and original backends for twisty Modified: twiki/trunk/TwistyPlugin/data/TWiki/TwistyPlugin.txt =================================================================== --- twiki/trunk/TwistyPlugin/data/TWiki/TwistyPlugin.txt 2008-04-20 19:18:59 UTC (rev 16706) +++ twiki/trunk/TwistyPlugin/data/TWiki/TwistyPlugin.txt 2008-04-22 02:01:38 UTC (rev 16707) @@ -14,6 +14,8 @@ Twisty has a fallback mechanism in case !JavaScript is not available: all content is displayed and the control buttons are hidden. +Twisty now uses a SKIN path mechanism to allow you to choose which implementation to use - you can choose from the 'TWiki default' (currently BehaviourContrib based), JQuery based, or Dojo Toolkit based. see #PluginSettings for details. + %TOC{title="On this page:"}% ---++ Usage examples @@ -554,52 +556,40 @@ * Set SHORTDESCRIPTION = Twisty section !JavaScript library to open/close content dynamically * Set DEBUG = 0 + +---+++ Twisty implementation selection. +By default, Twisty uses the BehaviourContrib javascript to make the content hide and show. If your TWiki (or complete web site) uses JQuery or Dojo toolkit, you can choose to use those for Twisty too. + +to select JQuery, you need to install and enable JQueryPlugin, and then add =jquery= to the front of your SKIN setting in %MAINWEB%.TWikiPreferences. eg. + * Set <nop>SKIN = jquery,pattern + +to select Dojo toolkit, you need to install DojoToolkitContrib, and then add =dojo= to the front of your SKIN setting in %MAINWEB%.TWikiPreferences. eg. + * Set <nop>SKIN = dojo,moveabletype + +to use the home made TWiki javascript Twisties, don't specify a javascript toolkit in %MAINWEB%.TWikiPreferences. eg. + * Set <nop>SKIN = moveabletype + ---++ Plugin Installation Instructions * Download the ZIP file from the Plugin web (see below) * Unzip ==%TOPIC%.zip== in your root ($TWIKI_ROOT) directory. Content: | *File:* | *Description:* | - | ==TwistyBundleTWiki04x02_installer== | | - | ==TwistyBundleTWiki04x02_installer.pl== | | - | ==data/TWiki/TwistyBundleTWiki04x02.txt== | | - | ==data/TWiki/BehaviourContrib.txt== | | - | ==data/TWiki/TwistyContrib.txt== | | - | ==data/TWiki/TwistyPlugin.txt== | | - | ==lib/TWiki/Contrib/BehaviourContrib.pm== | | - | ==lib/TWiki/Contrib/TwistyBundleTWiki04x02.pm== | | - | ==lib/TWiki/Contrib/TwistyContrib.pm== | | - | ==lib/TWiki/Plugins/TwistyPlugin.pm== | | - | ==pub/TWiki/BehaviourContrib/behaviour.compressed.js== | | - | ==pub/TWiki/BehaviourContrib/behaviour.compressed_src.js== | | - | ==pub/TWiki/BehaviourContrib/behaviour.js== | | - | ==pub/TWiki/BehaviourContrib/behaviour_src.js== | | - | ==pub/TWiki/BehaviourContrib/cssQuery/cssQuery-p.js== | | - | ==pub/TWiki/BehaviourContrib/cssQuery/src/cssQuery-level2.js== | | - | ==pub/TWiki/BehaviourContrib/cssQuery/src/cssQuery-level3.js== | | - | ==pub/TWiki/BehaviourContrib/cssQuery/src/cssQuery-standard.js== | | - | ==pub/TWiki/BehaviourContrib/cssQuery/src/cssQuery.js== | | - | ==pub/TWiki/BehaviourContrib/cssQuery/src/test.html== | | - | ==pub/TWiki/BehaviourContrib/cssQuery/test.html== | | - | ==pub/TWiki/TwistyContrib/twist.compressed.js== | | - | ==pub/TWiki/TwistyContrib/twist.compressed_src.js== | | - | ==pub/TWiki/TwistyContrib/twist.css== | | - | ==pub/TWiki/TwistyContrib/twist.js== | | - | ==pub/TWiki/TwistyContrib/twist_src.js== | | - +%$MANIFEST% * Optionally, if it exists, 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 + %$DEPENDENCIES% * Visit =configure= in your TWiki installation, and enable the plugin in the {Plugins} section. ---++ Plugin Info -| Authors: | TWiki:Main.RafaelAlvarez, TWiki:Main.ArthurClemens | -| Copyright ©: | 2005 Rafael Alvarez; 2006, 2007 Arthur Clemens | +| Authors: | TWiki:Main.RafaelAlvarez, TWiki:Main.ArthurClemens, TWiki:Main.SvenDowideit | +| Copyright ©: | 2005 Rafael Alvarez; 2006, 2007 Arthur Clemens, 2008 Sven Dowideit | | License: | [[http://www.gnu.org/copyleft/gpl.html][GPL]] | -| Dependencies: | None | -| Plugin Version: | 24 Nov 2007 (version 1.4.8) | +| Dependencies: | %$DEPENDENCIES% | +| Plugin Version: | 16 Apr 2008 (version 1.5) | | Change History: | <!-- versions below in reverse order --> | +| 16 Apr 2008 | 1.5 pluggable JS using skin path, adding selectable JQuery and DojoToolkit support | | 24 Nov 2007 | 1.4.6 - 1.4.8 Arthur Clemens - Added format tokens. | | 07 Oct 2007 | 1.4.5 Arthur Clemens - Fix html tag with show/hide controls. | | 25 Sep 2007 | 1.4.4 Arthur Clemens - Fix rendering of headers when =prefix= is used. | Modified: twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/DEPENDENCIES =================================================================== --- twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/DEPENDENCIES 2008-04-20 19:18:59 UTC (rev 16706) +++ twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/DEPENDENCIES 2008-04-22 02:01:38 UTC (rev 16707) @@ -1,2 +1,4 @@ -TWiki::Contrib::TwistyContrib,>=1.4.1,perl,Required. Twisty javascript library -TWiki::Contrib::BehaviourContrib,>=0,perl,Javascript module +TWiki::Contrib::TwistyContrib,>=1.4.1,perl,Required if using TwistyContrib twisties. +TWiki::Contrib::BehaviourContrib,>=0,perl,Required if using TwistyContrib twisties. +TWiki::Plugins::JQueryPlugin,>=0.5,perl,Required if using jquery twisties. +TWiki::Plugins::DojoToolkitContrib,>=0,perl,Required if using dojo twisties. Modified: twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/MANIFEST =================================================================== --- twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/MANIFEST 2008-04-20 19:18:59 UTC (rev 16706) +++ twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin/MANIFEST 2008-04-22 02:01:38 UTC (rev 16707) @@ -1,2 +1,13 @@ data/TWiki/TwistyPlugin.txt 0644 lib/TWiki/Plugins/TwistyPlugin.pm 0444 + +templates/twistyplugin.tmpl 0444 + + +templates/twistyplugin.dojo.tmpl 0444 +pub/TWiki/TwistyPlugin/twistie.dojo.js 0644 + + +templates/twistyplugin.jquery.tmpl 0444 +pub/TWiki/TwistyPlugin/twistie.jquery.css 0644 +pub/TWiki/TwistyPlugin/twistie.jquery.js 0644 Modified: twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin.pm =================================================================== --- twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin.pm 2008-04-20 19:18:59 UTC (rev 16706) +++ twiki/trunk/TwistyPlugin/lib/TWiki/Plugins/TwistyPlugin.pm 2008-04-22 02:01:38 UTC (rev 16707) @@ -44,7 +44,7 @@ # This is a free-form string you can use to "name" your own plugin version. # It is *not* used by the build automation tools, but is reported as part # of the version number in PLUGINDESCRIPTIONS. -$RELEASE = '1.4.9'; +$RELEASE = '1.5'; $pluginName = 'TwistyPlugin'; @@ -106,24 +106,11 @@ return if $doneHeader; $doneHeader = 1; - my $header .= <<'EOF'; -<style type="text/css" media="all"> -@import url("%PUBURL%/%TWIKIWEB%/TwistyContrib/twist.css"); -</style> -<script type='text/javascript' src='%PUBURL%/%TWIKIWEB%/BehaviourContrib/behaviour.compressed.js'></script> -<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikilib.js"></script> -<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikiPref.js"></script> -<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikiCSS.js"></script> -<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TwistyContrib/twist.compressed.js"></script> -<script type="text/javascript"> -// <![CDATA[ -var styleText = '<style type="text/css" media="all">.twikiMakeVisible{display:inline;}.twikiMakeVisibleInline{display:inline;}.twikiMakeVisibleBlock{display:block;}.twikiMakeHidden{display:none;}</style>'; -document.write(styleText); -// ]]> -</script> -EOF + #get twistyplugin.tmpl by default + TWiki::Func::loadTemplate( lc($pluginName) ); + my $header = TWiki::Func::expandTemplate('twisty:header'); - TWiki::Func::addToHEAD( 'TWISTYPLUGIN_TWISTY', $header ); + TWiki::Func::addToHEAD( 'TWISTYPLUGIN_TWISTY', $header||'<!-- twisty:header not found in %SKIN% -->' ); } sub _TWISTYSHOW { Added: twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.dojo.js =================================================================== --- twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.dojo.js (rev 0) +++ twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.dojo.js 2008-04-22 02:01:38 UTC (rev 16707) @@ -0,0 +1,243 @@ +/* +To compress this file you can use Dojo ShrinkSafe compressor at +http://alex.dojotoolkit.org/shrinksafe/ +*/ + +/** +Singleton class. +*/ +var twiki; +if (!twiki) twiki = {}; +twiki.TwistyPlugin = new function () { + + var self = this; + + /** + Retrieves the name of the twisty from an HTML element id. For example 'demotoggle' will return 'demo'. + @param inId : (String) HTML element id + @return String + @privileged + */ + this._getName = function (e) { + var re = new RegExp("(.*)(hide|show|toggle)", "g"); + var inId = dojo.attr(e, 'id'); + var m = re.exec(inId); + var name = (m && m[1]) ? m[1] : ""; + return name; + } + + /** + Retrieves the type of the twisty from an HTML element id. For example 'demotoggle' will return 'toggle'. + @param inId : (String) HTML element id + @return String + @privileged + */ + this._getType = function (inId) { + var re = new RegExp("(.*)(hide|show|toggle)", "g"); + var m = re.exec(inId); + var type = (m && m[2]) ? m[2] : ""; + return type; + } + + /** + Toggles the collapsed state. Calls _update(). + @privileged + */ + this._toggleTwisty = function (ref) { + if (!ref) return; + ref.state = (ref.state == twiki.TwistyPlugin.CONTENT_HIDDEN) ? twiki.TwistyPlugin.CONTENT_SHOWN : twiki.TwistyPlugin.CONTENT_HIDDEN; + self._update(ref, true); + } + + /** + Updates the states of UI trinity 'show', 'hide' and 'content'. + Saves new state in a cookie if one of the elements has CSS class 'twistyRememberSetting'. + @param ref : (Object) twiki.TwistyPlugin.Storage object + @privileged + */ + this._update = function (ref, inMaySave) { + var showControl = ref.show; + var hideControl = ref.hide; + var contentElem = ref.toggle; + + //can implement Micha's animation using + //dojo.anim("thinger", { width: 500, height: 500 }, 500); + + if (ref.state == twiki.TwistyPlugin.CONTENT_SHOWN) { + // show content + dojo.addClass(showControl, 'twistyHidden'); // hide 'show' + dojo.removeClass(hideControl, 'twistyHidden'); // show 'hide' + dojo.removeClass(contentElem, 'twistyHidden'); // show content + } else { + // hide content + dojo.removeClass(showControl, 'twistyHidden'); // show 'show' + dojo.addClass(hideControl, 'twistyHidden'); // hide 'hide' + dojo.addClass(contentElem, 'twistyHidden'); // hide content + } + if (inMaySave && ref.saveSetting) { + twiki.Pref.setPref(twiki.TwistyPlugin.COOKIE_PREFIX + ref.name, ref.state); + } + if (ref.clearSetting) { + twiki.Pref.setPref(twiki.TwistyPlugin.COOKIE_PREFIX + ref.name, ""); + } + } + + /** + Stores a twisty HTML element (either show control, hide control or content 'toggle'). + @param e : (Object) HTMLElement + @privileged + */ + this._register = function (e) { + if (!e) return; + var name = self._getName(e); + var ref = self._storage[name]; + if (!ref) { + ref = new twiki.TwistyPlugin.Storage(); + } + var classValue = dojo.attr(e, 'class'); //TODO: replace with dojo.hasClass + ref.saveSetting = dojo.hasClass(e, 'twistyRememberSetting'); + ref.clearSetting = dojo.hasClass(e, 'twistyForgetSetting'); + ref.startShown = dojo.hasClass(e, 'twistyStartShow'); + ref.startHidden = dojo.hasClass(e, 'twistyStartHide'); + ref.firstStartShown = dojo.hasClass(e, 'twistyFirstStartShow'); + ref.firstStartHidden = dojo.hasClass(e, 'twistyFirstStartHide'); + + ref.name = name; + var type = self._getType(e.id); + ref[type] = e; + self._storage[name] = ref; + switch (type) { + case 'show': // fall through + case 'hide': + e.onclick = function() { + self._toggleTwisty(ref); + return false; + } + break; + } + return ref; + } + + /** + Key-value set of twiki.TwistyPlugin.Storage objects. The value is accessed by twisty id identifier name. + @example var ref = self._storage["demo"]; + @privileged + */ + this._storage = {}; +}; + +/** +Public constants. +*/ +twiki.TwistyPlugin.CONTENT_HIDDEN = 0; +twiki.TwistyPlugin.CONTENT_SHOWN = 1; +twiki.TwistyPlugin.COOKIE_PREFIX = "TwistyPlugin_"; + +/** +The cached full TWiki cookie string so the data has to be read only once during init. +*/ +twiki.TwistyPlugin.prefList; + +/** +Initializes a twisty HTML element (either show control, hide control or content 'toggle') by registering and setting the visible state. +Calls _register() and _update(). +@public +@param inId : (String) id of HTMLElement +@return The stored twiki.TwistyPlugin.Storage object. +*/ +twiki.TwistyPlugin.init = function(e) { + if (!e) return; + + // check if already inited + var name = this._getName(e); + var ref = this._storage[name]; + if (ref && ref.show && ref.hide && ref.toggle) return ref; + + // else register + ref = this._register(e); + + //twiki.CSS.replaceClass(e, "twistyMakeHidden", "twistyHidden"); + dojo.removeClass(e, "twikiMakeVisible"); + dojo.removeClass(e, "twikiMakeVisibleBlock"); + dojo.removeClass(e, "twikiMakeVisibleInline"); + dojo.removeClass(e, "twikiMakeHidden"); + + + if (ref.show && ref.hide && ref.toggle) { + // all Twisty elements present + + if (dojo.hasClass(e, 'twistyInited1')) { + ref.state = twiki.TwistyPlugin.CONTENT_SHOWN + this._update(ref, false); + return ref; + } + if (dojo.hasClass(e, 'twistyInited0')) { + ref.state = twiki.TwistyPlugin.CONTENT_HIDDEN + this._update(ref, false); + return ref; + } + + if (twiki.TwistyPlugin.prefList == null) { + // cache complete cookie string + twiki.TwistyPlugin.prefList = twiki.Pref.getPrefList(); + } + var cookie = twiki.Pref.getPrefValueFromPrefList(twiki.TwistyPlugin.COOKIE_PREFIX + ref.name, twiki.TwistyPlugin.prefList); + if (ref.firstStartHidden) ref.state = twiki.TwistyPlugin.CONTENT_HIDDEN; + if (ref.firstStartShown) ref.state = twiki.TwistyPlugin.CONTENT_SHOWN; + // cookie setting may override firstStartHidden and firstStartShown + if (cookie && cookie == "0") ref.state = twiki.TwistyPlugin.CONTENT_HIDDEN; + if (cookie && cookie == "1") ref.state = twiki.TwistyPlugin.CONTENT_SHOWN; + // startHidden and startShown may override cookie + if (ref.startHidden) ref.state = twiki.TwistyPlugin.CONTENT_HIDDEN; + if (ref.startShown) ref.state = twiki.TwistyPlugin.CONTENT_SHOWN; + + this._update(ref, false); + } + return ref; +} + +twiki.TwistyPlugin.toggleAll = function(inState) { + var i; + for (var i in this._storage) { + var e = this._storage[i]; + e.state = inState; + this._update(e, true); + } +} +twiki.TwistyPlugin.toggleAll_Show = function() { + twiki.TwistyPlugin.toggleAll(twiki.TwistyPlugin.CONTENT_SHOWN); +} +twiki.TwistyPlugin.toggleAll_Hide = function() { + twiki.TwistyPlugin.toggleAll(twiki.TwistyPlugin.CONTENT_HIDDEN); +} + +/** +Storage container for properties of a twisty HTML element: show control, hide control or toggle content. +*/ +twiki.TwistyPlugin.Storage = function () { + this.name; // String + this.state = twiki.TwistyPlugin.CONTENT_HIDDEN; // Number + this.hide; // HTMLElement + this.show; // HTMLElement + this.toggle; // HTMLElement (content element) + this.saveSetting = false; // Boolean; default not saved + this.clearSetting = false; // Boolean; default not cleared + this.startShown; // Boolean + this.startHidden; // Boolean + this.firstStartShown; // Boolean + this.firstStartHidden; // Boolean +} + +/** + * dojo init + */ +twiki.TwistyPlugin.onLoad = function() { + dojo.query(".twistyTrigger").forEach("twiki.TwistyPlugin.init(item);"); + dojo.query(".twistyContent").forEach("twiki.TwistyPlugin.init(item);"); + + dojo.query(".twistyExpandAll").onclick(twiki.TwistyPlugin.toggleAll_Show); + dojo.query(".twistyCollapseAll").onclick(twiki.TwistyPlugin.toggleAll_Hide); +} + +dojo.addOnLoad(twiki.TwistyPlugin.onLoad); + Copied: twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.css (from rev 16706, twiki/trunk/JQueryTwistyPlugin/pub/TWiki/JQueryTwistyPlugin/twist.css) =================================================================== --- twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.css (rev 0) +++ twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.css 2008-04-22 02:01:38 UTC (rev 16707) @@ -0,0 +1,20 @@ +.twistyHidden { display:none; } +.twistyMakeHidden {} /* reserved */ +.twistyMakeVisible { display:none; } + +.twistyTrigger {} +span.twistyContent {} +.twistyPlaceholder { /* color to be implemented by skin */ } +.twistyRememberSetting { /* behavior class */ } +.twistyForgetSetting { /* behavior class */ } +.twistyStartHide { /* behavior class */ } +.twistyStartShow { /* behavior class */ } +.twistyInited1 { /* behavior class: state is set to shown */ } +.twistyInited0 { /* behavior class: state is set to hidden */ } + +/* These styles are available in TWiki 4.2, but provided here for older TWiki versions: */ +.twikiMakeVisible, +.twikiMakeVisibleInline, +.twikiMakeVisibleBlock { + display:none; /* will be made visible with javascript */ +} \ No newline at end of file Copied: twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.js (from rev 16706, twiki/trunk/JQueryTwistyPlugin/pub/TWiki/JQueryTwistyPlugin/twist.js) =================================================================== --- twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.js (rev 0) +++ twiki/trunk/TwistyPlugin/pub/TWiki/TwistyPlugin/twistie.jquery.js 2008-04-22 02:01:38 UTC (rev 16707) @@ -0,0 +1,248 @@ +/* +To compress this file you can use Dojo ShrinkSafe compressor at +http://alex.dojotoolkit.org/shrinksafe/ +*/ + +/** +Singleton class. +*/ +var twiki; +if (!twiki) twiki = {}; +twiki.JQueryTwistyPlugin = new function () { + + var self = this; + + /** + Retrieves the name of the twisty from an HTML element id. For example 'demotoggle' will return 'demo'. + @param inId : (String) HTML element id + @return String + @privileged + */ + this._getName = function (e) { + var re = new RegExp("(.*)(hide|show|toggle)", "g"); + var inId = $(e).attr('id'); + var m = re.exec(inId); + var name = (m && m[1]) ? m[1] : ""; + return name; + } + + /** + Retrieves the type of the twisty from an HTML element id. For example 'demotoggle' will return 'toggle'. + @param inId : (String) HTML element id + @return String + @privileged + */ + this._getType = function (inId) { + var re = new RegExp("(.*)(hide|show|toggle)", "g"); + var m = re.exec(inId); + var type = (m && m[2]) ? m[2] : ""; + return type; + } + + /** + Toggles the collapsed state. Calls _update(). + @privileged + */ + this._toggleTwisty = function (ref) { + if (!ref) return; + ref.state = (ref.state == twiki.JQueryTwistyPlugin.CONTENT_HIDDEN) ? twiki.JQueryTwistyPlugin.CONTENT_SHOWN : twiki.JQueryTwistyPlugin.CONTENT_HIDDEN; + self._update(ref, true); + } + + /** + Updates the states of UI trinity 'show', 'hide' and 'content'. + Saves new state in a cookie if one of the elements has CSS class 'twistyRememberSetting'. + @param ref : (Object) twiki.JQueryTwistyPlugin.Storage object + @privileged + */ + this._update = function (ref, inMaySave) { + var showControl = ref.show; + var hideControl = ref.hide; + var contentElem = ref.toggle; + if (ref.state == twiki.JQueryTwistyPlugin.CONTENT_SHOWN) { + // show content + if (inMaySave) { + $(contentElem).slideDown({easing:'easeInOutQuad', duration:300}); + } else { + $(contentElem).show(); + + } + $(showControl).addClass("twistyHidden"); + $(hideControl).removeClass("twistyHidden"); + $(contentElem).removeClass("twistyHidden"); + } else { + // hide content + if (inMaySave) { + $(contentElem).slideUp({easing:'easeInOutQuad', duration:300}); + } else { + $(contentElem).hide(); + } + $(showControl).removeClass("twistyHidden"); + $(hideControl).addClass("twistyHidden"); + $(contentElem).addClass("twistyHidden"); + } + if (inMaySave && ref.saveSetting) { + twiki.Pref.setPref(twiki.JQueryTwistyPlugin.COOKIE_PREFIX + ref.name, ref.state); + } + if (ref.clearSetting) { + twiki.Pref.setPref(twiki.JQueryTwistyPlugin.COOKIE_PREFIX + ref.name, ""); + } + } + + /** + Stores a twisty HTML element (either show control, hide control or content 'toggle'). + @param e : (Object) HTMLElement + @privileged + */ + this._register = function (e) { + if (!e) return; + var name = self._getName(e); + var ref = self._storage[name]; + if (!ref) { + ref = new twiki.JQueryTwistyPlugin.Storage(); + } + var classValue = $(e).attr('class'); + if (classValue.match(/\btwistyRememberSetting\b/)) + ref.saveSetting = true; + if (classValue.match(/\btwistyForgetSetting\b/)) + ref.clearSetting = true; + if (classValue.match(/\btwistyStartShow\b/)) + ref.startShown = true; + if (classValue.match(/\btwistyStartHide\b/)) + ref.startHidden = true; + if (classValue.match(/\btwistyFirstStartShow\b/)) + ref.firstStartShown = true; + if (classValue.match(/\btwistyFirstStartHide\b/)) + ref.firstStartHidden = true; + + ref.name = name; + var type = self._getType(e.id); + ref[type] = e; + self._storage[name] = ref; + switch (type) { + case 'show': // fall through + case 'hide': + e.onclick = function() { + self._toggleTwisty(ref); + return false; + } + break; + } + return ref; + } + + /** + Key-value set of twiki.JQueryTwistyPlugin.Storage objects. The value is accessed by twisty id identifier name. + @example var ref = self._storage["demo"]; + @privileged + */ + this._storage = {}; +}; + +/** +Public constants. +*/ +twiki.JQueryTwistyPlugin.CONTENT_HIDDEN = 0; +twiki.JQueryTwistyPlugin.CONTENT_SHOWN = 1; +twiki.JQueryTwistyPlugin.COOKIE_PREFIX = "JQueryTwistyPlugin_"; + +/** +The cached full TWiki cookie string so the data has to be read only once during init. +*/ +twiki.JQueryTwistyPlugin.prefList; + +/** +Initializes a twisty HTML element (either show control, hide control or content 'toggle') by registering and setting the visible state. +Calls _register() and _update(). +@public +@param inId : (String) id of HTMLElement +@return The stored twiki.JQueryTwistyPlugin.Storage object. +*/ +twiki.JQueryTwistyPlugin.init = function(e) { + if (!e) return; + + // check if already inited + var name = this._getName(e); + var ref = this._storage[name]; + if (ref && ref.show && ref.hide && ref.toggle) return ref; + + // else register + ref = this._register(e); + + if (ref.show && ref.hide && ref.toggle) { + // all Twisty elements present + + var classValue = $(e).attr('class'); + if (classValue.match(/\btwistyInited1\b/)) { + ref.state = twiki.JQueryTwistyPlugin.CONTENT_SHOWN + this._update(ref, false); + return ref; + } + if (classValue.match(/\btwistyInited0\b/)) { + ref.state = twiki.JQueryTwistyPlugin.CONTENT_HIDDEN + this._update(ref, false); + return ref; + } + + if (twiki.JQueryTwistyPlugin.prefList == null) { + // cache complete cookie string + twiki.JQueryTwistyPlugin.prefList = twiki.Pref.getPrefList(); + } + var cookie = twiki.Pref.getPrefValueFromPrefList(twiki.JQueryTwistyPlugin.COOKIE_PREFIX + ref.name, twiki.JQueryTwistyPlugin.prefList); + if (ref.firstStartHidden) ref.state = twiki.JQueryTwistyPlugin.CONTENT_HIDDEN; + if (ref.firstStartShown) ref.state = twiki.JQueryTwistyPlugin.CONTENT_SHOWN; + // cookie setting may override firstStartHidden and firstStartShown + if (cookie && cookie == "0") ref.state = twiki.JQueryTwistyPlugin.CONTENT_HIDDEN; + if (cookie && cookie == "1") ref.state = twiki.JQueryTwistyPlugin.CONTENT_SHOWN; + // startHidden and startShown may override cookie + if (ref.startHidden) ref.state = twiki.JQueryTwistyPlugin.CONTENT_HIDDEN; + if (ref.startShown) ref.state = twiki.JQueryTwistyPlugin.CONTENT_SHOWN; + + this._update(ref, false); + } + return ref; +} + +twiki.JQueryTwistyPlugin.toggleAll = function(inState) { + var i; + for (var i in this._storage) { + var e = this._storage[i]; + e.state = inState; + this._update(e, true); + } +} + +/** +Storage container for properties of a twisty HTML element: show control, hide control or toggle content. +*/ +twiki.JQueryTwistyPlugin.Storage = function () { + this.name; // String + this.state = twiki.JQueryTwistyPlugin.CONTENT_HIDDEN; // Number + this.hide; // HTMLElement + this.show; // HTMLElement + this.toggle; // HTMLElement (content element) + this.saveSetting = false; // Boolean; default not saved + this.clearSetting = false; // Boolean; default not cleared + this.startShown; // Boolean + this.startHidden; // Boolean + this.firstStartShown; // Boolean + this.firstStartHidden; // Boolean +} + +/** + * jquery init + */ +$(function() { + $(".twistyTrigger, .twistyContent"). + removeClass("twistyMakeHidden twikiMakeHidden twikiMakeVisible twikiMakeVisibleBlock twikiMakeVisibleInline"). + addClass("twistyHidden"). + each(function() { + twiki.JQueryTwistyPlugin.init(this); + }); + $(".twistyExpandAll").click(function() { + twiki.JQueryTwistyPlugin.toggleAll(twiki.JQueryTwistyPlugin.CONTENT_SHOWN); + }); + $(".twistyCollapseAll").click(function() { + twiki.JQueryTwistyPlugin.toggleAll(twiki.JQueryTwistyPlugin.CONTENT_HIDDEN); + }); +}); Added: twiki/trunk/TwistyPlugin/templates/twistyplugin.dojo.tmpl =================================================================== --- twiki/trunk/TwistyPlugin/templates/twistyplugin.dojo.tmpl (rev 0) +++ twiki/trunk/TwistyPlugin/templates/twistyplugin.dojo.tmpl 2008-04-22 02:01:38 UTC (rev 16707) @@ -0,0 +1,22 @@ + +%TMPL:INCLUDE{twistyplugin}% + +%TMPL:DEF{twisty:header}% +<style type="text/css" media="all"> +@import url("%PUBURL%/%TWIKIWEB%/TwistyContrib/twist.css"); +</style> +<!-- style type="text/css"> + @import "dojoroot/dijit/themes/tundra/tundra.css"; + @import "dojoroot/dojo/resources/dojo.css" +</style +--> +<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/DojoToolkitContrib/dojo/dojo.js" djConfig="parseOnLoad: true"></script> +<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikiPref.js"></script> +<script type="text/javascript" src="%PUBURLPATH%/%TWIKIWEB%/TwistyPlugin/twistie.dojo.js"></script> +<script type="text/javascript"> +// <![CDATA[ +var styleText = '<style type="text/css" media="all">.twikiMakeVisible{display:inline;}.twikiMakeVisibleInline{display:inline;}.twikiMakeVisibleBlock{display:block;}.twikiMakeHidden{display:none;}</style>'; +document.write(styleText); +// ]]> +</script> +%TMPL:END% Added: twiki/trunk/TwistyPlugin/templates/twistyplugin.jquery.tmpl =================================================================== --- twiki/trunk/TwistyPlugin/templates/twistyplugin.jquery.tmpl (rev 0) +++ twiki/trunk/TwistyPlugin/templates/twistyplugin.jquery.tmpl 2008-04-22 02:01:38 UTC (rev 16707) @@ -0,0 +1,17 @@ + +%TMPL:INCLUDE{twistyplugin}% + +%TMPL:DEF{twisty:header}% +<style type="text/css" media="all"> +@import url("%PUBURL%/%TWIKIWEB%/TwistyPlugin/twistie.jquery.css"); +</style> +<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TwistyPlugin/twistie.jquery.js"></script> +<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikiPref.js"></script> +<script type="text/javascript"> +// <![CDATA[ +var styleText = '<style type="text/css" media="all">.twikiMakeVisible{display:inline;}.twikiMakeVisibleInline{display:inline;}.twikiMakeVisibleBlock{display:block;}.twikiMakeHidden{display:none;}</style>'; +document.write(styleText); +// ]]> +</script> +%TMPL:END% + Added: twiki/trunk/TwistyPlugin/templates/twistyplugin.tmpl =================================================================== --- twiki/trunk/TwistyPlugin/templates/twistyplugin.tmpl (rev 0) +++ twiki/trunk/TwistyPlugin/templates/twistyplugin.tmpl 2008-04-22 02:01:38 UTC (rev 16707) @@ -0,0 +1,18 @@ +%{ this is the default fallback header for TwistyPlugin, thus using TwistyContrib (currently part of default TWiki ) }% + +%TMPL:DEF{twisty:header}% +<style type="text/css" media="all"> +@import url("%PUBURL%/%TWIKIWEB%/TwistyContrib/twist.css"); +</style> +<script type='text/javascript' src='%PUBURL%/%TWIKIWEB%/BehaviourContrib/behaviour.compressed.js'></script> +<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikilib.js"></script> +<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikiPref.js"></script> +<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TWikiJavascripts/twikiCSS.js"></script> +<script type="text/javascript" src="%PUBURL%/%TWIKIWEB%/TwistyContrib/twist.compressed.js"></script> +<script type="text/javascript"> +// <![CDATA[ +var styleText = '<style type="text/css" media="all">.twikiMakeVisible{display:inline;}.twikiMakeVisibleInline{display:inline;}.twikiMakeVisibleBlock{display:block;}.twikiMakeHidden{display:none;}</style>'; +document.write(styleText); +// ]]> +</script> +%TMPL:END% |