← Back to branch summary

~kosova/+junk/tuxfamily-twiki

« back to all changes in this revision

Viewing changes to foswiki/pub/System/TwistyPlugin/twisty.jquery.js

  • Committer: James Michael DuPont
  • Date: 2009-07-18 19:58:49 UTC
  • Revision ID: jamesmikedupont@gmail.com-20090718195849-vgbmaht2ys791uo2
added foswiki

Show diffs side-by-side

added added

removed removed

Lines of Context:
foswiki/pub/System/TwistyPlugin/twisty.jquery.js
 
1
/*
 
2
To compress this file you can use Dojo ShrinkSafe compressor at
 
3
http://alex.dojotoolkit.org/shrinksafe/
 
4
*/
 
5
 
 
6
/**
 
7
Singleton class.
 
8
*/
 
9
var foswiki; if (!foswiki) foswiki = {};
 
10
foswiki.JQueryTwistyPlugin = new function () {
 
11
 
 
12
        var self = this;
 
13
 
 
14
        /**
 
15
        Retrieves the name of the twisty from an HTML element id. For example 'demotoggle' will return 'demo'.
 
16
        @param inId : (String) HTML element id
 
17
        @return String
 
18
        @privileged
 
19
        */
 
20
        this._getName = function (e) {
 
21
                var re = new RegExp("(.*)(hide|show|toggle)", "g");
 
22
                var inId = $(e).attr('id');
 
23
                var m = re.exec(inId);
 
24
                var name = (m && m[1]) ? m[1] : "";
 
25
        return name;
 
26
        }
 
27
        
 
28
        /**
 
29
        Retrieves the type of the twisty from an HTML element id. For example 'demotoggle' will return 'toggle'.
 
30
        @param inId : (String) HTML element id
 
31
        @return String
 
32
        @privileged
 
33
        */
 
34
        this._getType = function (inId) {
 
35
                var re = new RegExp("(.*)(hide|show|toggle)", "g");
 
36
                var m = re.exec(inId);
 
37
        var type = (m && m[2]) ? m[2] : "";
 
38
        return type;
 
39
        }
 
40
        
 
41
        /**
 
42
        Toggles the collapsed state. Calls _update().
 
43
        @privileged
 
44
        */
 
45
        this._toggleTwisty = function (ref) {
 
46
                if (!ref) return;
 
47
                ref.state = (ref.state == foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN) ? foswiki.JQueryTwistyPlugin.CONTENT_SHOWN : foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN;
 
48
                self._update(ref, true);
 
49
        }
 
50
        
 
51
        /**
 
52
        Updates the states of UI trinity 'show', 'hide' and 'content'.
 
53
        Saves new state in a cookie if one of the elements has CSS class 'twistyRememberSetting'.
 
54
        @param ref : (Object) foswiki.JQueryTwistyPlugin.Storage object
 
55
        @privileged
 
56
        */
 
57
        this._update = function (ref, inMaySave) {
 
58
                var showControl = ref.show;
 
59
                var hideControl = ref.hide;
 
60
                var contentElem = ref.toggle;
 
61
                if (ref.state == foswiki.JQueryTwistyPlugin.CONTENT_SHOWN) {
 
62
                        // show content
 
63
                        if (inMaySave) {
 
64
                          $(contentElem).slideDown({easing:'easeInOutQuad', duration:300});
 
65
                        } else {
 
66
                          $(contentElem).show();
 
67
 
 
68
                        }
 
69
                        $(showControl).addClass("twistyHidden");
 
70
                        $(hideControl).removeClass("twistyHidden");
 
71
                        $(contentElem).removeClass("twistyHidden");
 
72
                } else {
 
73
                        // hide content
 
74
                        if (inMaySave) {
 
75
                          $(contentElem).slideUp({easing:'easeInOutQuad', duration:300});
 
76
                        } else {
 
77
                          $(contentElem).hide();
 
78
                        }
 
79
                        $(showControl).removeClass("twistyHidden");
 
80
                        $(hideControl).addClass("twistyHidden");
 
81
                        $(contentElem).addClass("twistyHidden");
 
82
                }
 
83
                if (inMaySave && ref.saveSetting) {
 
84
                foswiki.Pref.setPref(foswiki.JQueryTwistyPlugin.COOKIE_PREFIX + ref.name, ref.state);
 
85
                }
 
86
                if (ref.clearSetting) {
 
87
                foswiki.Pref.setPref(foswiki.JQueryTwistyPlugin.COOKIE_PREFIX + ref.name, "");
 
88
                }
 
89
        }
 
90
        
 
91
        /**
 
92
        Stores a twisty HTML element (either show control, hide control or content 'toggle').
 
93
        @param e : (Object) HTMLElement
 
94
        @privileged
 
95
        */
 
96
        this._register = function (e) {
 
97
                if (!e) return;
 
98
                var name = self._getName(e);
 
99
                var ref = self._storage[name];
 
100
                if (!ref) {
 
101
                        ref = new foswiki.JQueryTwistyPlugin.Storage();
 
102
                }
 
103
                var classValue = $(e).attr('class');
 
104
                if (classValue.match(/\btwistyRememberSetting\b/)) 
 
105
                  ref.saveSetting = true;
 
106
                if (classValue.match(/\btwistyForgetSetting\b/)) 
 
107
                  ref.clearSetting = true;
 
108
                if (classValue.match(/\btwistyStartShow\b/)) 
 
109
                  ref.startShown = true;
 
110
                if (classValue.match(/\btwistyStartHide\b/)) 
 
111
                  ref.startHidden = true;
 
112
                if (classValue.match(/\btwistyFirstStartShow\b/)) 
 
113
                  ref.firstStartShown = true;
 
114
                if (classValue.match(/\btwistyFirstStartHide\b/)) 
 
115
                  ref.firstStartHidden = true;
 
116
 
 
117
                ref.name = name;
 
118
                var type = self._getType(e.id);
 
119
                ref[type] = e;
 
120
                self._storage[name] = ref;
 
121
                switch (type) {
 
122
                        case 'show': // fall through
 
123
                        case 'hide':
 
124
                                e.onclick = function() {
 
125
                                        self._toggleTwisty(ref);
 
126
                                        return false;
 
127
                                }
 
128
                                break;
 
129
                }
 
130
                return ref;
 
131
        }
 
132
        
 
133
        /**
 
134
        Key-value set of foswiki.JQueryTwistyPlugin.Storage objects. The value is accessed by twisty id identifier name.
 
135
        @example var ref = self._storage["demo"];
 
136
        @privileged
 
137
        */
 
138
        this._storage = {};
 
139
};
 
140
 
 
141
/**
 
142
Public constants.
 
143
*/
 
144
foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN = 0;
 
145
foswiki.JQueryTwistyPlugin.CONTENT_SHOWN = 1;
 
146
foswiki.JQueryTwistyPlugin.COOKIE_PREFIX = "JQueryTwistyPlugin_";
 
147
 
 
148
/**
 
149
The cached full preference cookie string so the data has to be read only once during init.
 
150
*/
 
151
foswiki.JQueryTwistyPlugin.prefList;
 
152
 
 
153
/**
 
154
Initializes a twisty HTML element (either show control, hide control or content 'toggle') by registering and setting the visible state.
 
155
Calls _register() and _update().
 
156
@public
 
157
@param inId : (String) id of HTMLElement
 
158
@return The stored foswiki.JQueryTwistyPlugin.Storage object.
 
159
*/
 
160
foswiki.JQueryTwistyPlugin.init = function(e) {
 
161
        if (!e) return;
 
162
 
 
163
        // check if already inited
 
164
        var name = this._getName(e);
 
165
        var ref = this._storage[name];
 
166
        if (ref && ref.show && ref.hide && ref.toggle) return ref;
 
167
 
 
168
        // else register
 
169
        ref = this._register(e);
 
170
        
 
171
        if (ref.show && ref.hide && ref.toggle) {
 
172
                // all Twisty elements present
 
173
 
 
174
                var classValue = $(e).attr('class');
 
175
                if (classValue.match(/\btwistyInited1\b/)) {
 
176
                        ref.state = foswiki.JQueryTwistyPlugin.CONTENT_SHOWN
 
177
                        this._update(ref, false);
 
178
                        return ref;
 
179
                }
 
180
                if (classValue.match(/\btwistyInited0\b/)) {
 
181
                        ref.state = foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN
 
182
                        this._update(ref, false);
 
183
                        return ref;
 
184
                }
 
185
 
 
186
                if (foswiki.JQueryTwistyPlugin.prefList == null) {
 
187
                        // cache complete cookie string
 
188
                        foswiki.JQueryTwistyPlugin.prefList = foswiki.Pref.getPrefList();
 
189
                }
 
190
                var cookie = foswiki.Pref.getPrefValueFromPrefList(foswiki.JQueryTwistyPlugin.COOKIE_PREFIX + ref.name, foswiki.JQueryTwistyPlugin.prefList);
 
191
                if (ref.firstStartHidden) ref.state = foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN;
 
192
                if (ref.firstStartShown) ref.state = foswiki.JQueryTwistyPlugin.CONTENT_SHOWN;
 
193
                // cookie setting may override  firstStartHidden and firstStartShown
 
194
                if (cookie && cookie == "0") ref.state = foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN;
 
195
                if (cookie && cookie == "1") ref.state = foswiki.JQueryTwistyPlugin.CONTENT_SHOWN;
 
196
                // startHidden and startShown may override cookie
 
197
                if (ref.startHidden) ref.state = foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN;
 
198
                if (ref.startShown) ref.state = foswiki.JQueryTwistyPlugin.CONTENT_SHOWN;
 
199
 
 
200
                this._update(ref, false);
 
201
        }
 
202
        return ref;     
 
203
}
 
204
 
 
205
foswiki.JQueryTwistyPlugin.toggleAll = function(inState) {
 
206
        var i;
 
207
        for (var i in this._storage) {
 
208
                var e = this._storage[i];
 
209
                e.state = inState;
 
210
                this._update(e, true);
 
211
        }
 
212
}
 
213
 
 
214
/**
 
215
Storage container for properties of a twisty HTML element: show control, hide control or toggle content.
 
216
*/
 
217
foswiki.JQueryTwistyPlugin.Storage = function () {
 
218
        this.name;                                                                              // String
 
219
        this.state = foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN; // Number
 
220
        this.hide;                                                                              // HTMLElement
 
221
        this.show;                                                                              // HTMLElement
 
222
        this.toggle;                                                                    // HTMLElement (content element)
 
223
        this.saveSetting = false;                                               // Boolean; default not saved
 
224
        this.clearSetting = false;                                              // Boolean; default not cleared
 
225
        this.startShown;                                                                // Boolean
 
226
        this.startHidden;                                                               // Boolean
 
227
        this.firstStartShown;                                                   // Boolean
 
228
        this.firstStartHidden;                                                  // Boolean
 
229
}
 
230
 
 
231
/**
 
232
 * jquery init 
 
233
 */
 
234
$(function() {
 
235
  $(".twistyTrigger, .twistyContent").
 
236
    removeClass("twistyMakeHidden foswikiMakeHidden foswikiMakeVisible foswikiMakeVisibleBlock foswikiMakeVisibleInline").
 
237
    addClass("twistyHidden").
 
238
    each(function() {
 
239
      foswiki.JQueryTwistyPlugin.init(this);
 
240
    });
 
241
  $(".twistyExpandAll").click(function() {
 
242
    foswiki.JQueryTwistyPlugin.toggleAll(foswiki.JQueryTwistyPlugin.CONTENT_SHOWN);
 
243
  });
 
244
  $(".twistyCollapseAll").click(function() {
 
245
    foswiki.JQueryTwistyPlugin.toggleAll(foswiki.JQueryTwistyPlugin.CONTENT_HIDDEN);
 
246
  });
 
247
});