applicious_utils 0.0.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (35) hide show
  1. data/Gemfile +4 -0
  2. data/Rakefile +2 -0
  3. data/app/assets/javascripts/applicious_utils/Applicious/applicious.coffee +9 -0
  4. data/app/assets/javascripts/applicious_utils/Applicious/facebook.coffee +12 -0
  5. data/app/assets/javascripts/applicious_utils/FbMultiFriendSelector/README.md +122 -0
  6. data/app/assets/javascripts/applicious_utils/FbMultiFriendSelector/index.html +100 -0
  7. data/app/assets/javascripts/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select-list.css +158 -0
  8. data/app/assets/javascripts/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select.css +160 -0
  9. data/app/assets/javascripts/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select.js +366 -0
  10. data/app/assets/javascripts/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select.min.js +11 -0
  11. data/app/assets/javascripts/applicious_utils/LightboxMe/LICENSE +11 -0
  12. data/app/assets/javascripts/applicious_utils/LightboxMe/README.markdown +44 -0
  13. data/app/assets/javascripts/applicious_utils/LightboxMe/jquery.lightbox_me.js +250 -0
  14. data/app/assets/javascripts/applicious_utils/index.js +4 -0
  15. data/app/assets/stylesheets/applicious_utils/Applicious/applicious.css +0 -0
  16. data/app/assets/stylesheets/applicious_utils/FbMultiFriendSelector/README.md +122 -0
  17. data/app/assets/stylesheets/applicious_utils/FbMultiFriendSelector/index.html +100 -0
  18. data/app/assets/stylesheets/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select-list.css +158 -0
  19. data/app/assets/stylesheets/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select.css +160 -0
  20. data/app/assets/stylesheets/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select.js +366 -0
  21. data/app/assets/stylesheets/applicious_utils/FbMultiFriendSelector/jquery.facebook.multifriend.select.min.js +11 -0
  22. data/app/assets/stylesheets/applicious_utils/index.css +9 -0
  23. data/applicious_utils-0.0.1.gem +0 -0
  24. data/applicious_utils-0.0.2.gem +0 -0
  25. data/applicious_utils-0.0.3.gem +0 -0
  26. data/applicious_utils-0.0.4.gem +0 -0
  27. data/applicious_utils-0.0.5.gem +0 -0
  28. data/applicious_utils.gemspec +22 -0
  29. data/lib/applicious_utils/applicious_railtie.rb +11 -0
  30. data/lib/applicious_utils/engine.rb +5 -0
  31. data/lib/applicious_utils/version.rb +3 -0
  32. data/lib/applicious_utils/view_helpers.rb +16 -0
  33. data/lib/applicious_utils.rb +4 -0
  34. data/pkg/applicious_utils-0.0.4.gem +0 -0
  35. metadata +81 -0
@@ -0,0 +1,250 @@
1
+ /*
2
+ * $ lightbox_me
3
+ * By: Buck Wilson
4
+ * Version : 2.3
5
+ *
6
+ * Licensed under the Apache License, Version 2.0 (the "License");
7
+ * you may not use this file except in compliance with the License.
8
+ * You may obtain a copy of the License at
9
+ *
10
+ * http://www.apache.org/licenses/LICENSE-2.0
11
+ *
12
+ * Unless required by applicable law or agreed to in writing, software
13
+ * distributed under the License is distributed on an "AS IS" BASIS,
14
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
+ * See the License for the specific language governing permissions and
16
+ * limitations under the License.
17
+ */
18
+
19
+
20
+ (function($) {
21
+
22
+ $.fn.lightbox_me = function(options) {
23
+
24
+ return this.each(function() {
25
+
26
+ var
27
+ opts = $.extend({}, $.fn.lightbox_me.defaults, options),
28
+ $overlay = $(),
29
+ $self = $(this),
30
+ $iframe = $('<iframe id="foo" style="z-index: ' + (opts.zIndex + 1) + ';border: none; margin: 0; padding: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0; filter: mask();"/>'),
31
+ ie6 = ($.browser.msie && $.browser.version < 7);
32
+
33
+ if (opts.showOverlay) {
34
+ //check if there's an existing overlay, if so, make subequent ones clear
35
+ var $currentOverlays = $(".js_lb_overlay:visible");
36
+ if ($currentOverlays.length > 0){
37
+ $overlay = $('<div class="lb_overlay_clear js_lb_overlay"/>');
38
+ } else {
39
+ $overlay = $('<div class="' + opts.classPrefix + '_overlay js_lb_overlay"/>');
40
+ }
41
+ }
42
+
43
+ /*----------------------------------------------------
44
+ DOM Building
45
+ ---------------------------------------------------- */
46
+ if (ie6) {
47
+ var src = /^https/i.test(window.location.href || '') ? 'javascript:false' : 'about:blank';
48
+ $iframe.attr('src', src);
49
+ $('body').append($iframe);
50
+ } // iframe shim for ie6, to hide select elements
51
+ $('body').append($self.hide()).append($overlay);
52
+
53
+
54
+ /*----------------------------------------------------
55
+ Overlay CSS stuffs
56
+ ---------------------------------------------------- */
57
+
58
+ // set css of the overlay
59
+ if (opts.showOverlay) {
60
+ setOverlayHeight(); // pulled this into a function because it is called on window resize.
61
+ $overlay.css({ position: 'absolute', width: '100%', top: 0, left: 0, right: 0, bottom: 0, zIndex: (opts.zIndex + 2), display: 'none' });
62
+ if (!$overlay.hasClass('lb_overlay_clear')){
63
+ $overlay.css(opts.overlayCSS);
64
+ }
65
+ }
66
+
67
+ /*----------------------------------------------------
68
+ Animate it in.
69
+ ---------------------------------------------------- */
70
+ //
71
+ if (opts.showOverlay) {
72
+ $overlay.fadeIn(opts.overlaySpeed, function() {
73
+ setSelfPosition();
74
+ $self[opts.appearEffect](opts.lightboxSpeed, function() { setOverlayHeight(); setSelfPosition(); opts.onLoad()});
75
+ });
76
+ } else {
77
+ setSelfPosition();
78
+ $self[opts.appearEffect](opts.lightboxSpeed, function() { opts.onLoad()});
79
+ }
80
+
81
+ /*----------------------------------------------------
82
+ Hide parent if parent specified (parentLightbox should be jquery reference to any parent lightbox)
83
+ ---------------------------------------------------- */
84
+ if (opts.parentLightbox) {
85
+ opts.parentLightbox.fadeOut(200);
86
+ }
87
+
88
+
89
+ /*----------------------------------------------------
90
+ Bind Events
91
+ ---------------------------------------------------- */
92
+
93
+ $(window).resize(setOverlayHeight)
94
+ .resize(setSelfPosition)
95
+ .scroll(setSelfPosition)
96
+ .keyup(observeKeyPress);
97
+ $overlay.click(function(e) { closeLightbox(); e.preventDefault; });
98
+ $self.delegate(opts.closeSelector, "click", function(e) {
99
+ closeLightbox(); e.preventDefault();
100
+ });
101
+ $self.bind('close', closeLightbox);
102
+ $self.bind('reposition', setSelfPosition);
103
+
104
+
105
+
106
+ /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
107
+ -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
108
+
109
+
110
+ /*----------------------------------------------------
111
+ Private Functions
112
+ ---------------------------------------------------- */
113
+
114
+ /* Remove or hide all elements */
115
+ function closeLightbox() {
116
+ var s = $self[0].style;
117
+ if (opts.destroyOnClose) {
118
+ $self.add($overlay).remove();
119
+ } else {
120
+ $self.add($overlay).hide();
121
+ }
122
+
123
+ //show the hidden parent lightbox
124
+ if (opts.parentLightbox) {
125
+ opts.parentLightbox.fadeIn(200);
126
+ }
127
+
128
+ $iframe.remove();
129
+
130
+ // clean up events.
131
+ $self.undelegate(opts.closeSelector, "click");
132
+
133
+ $(window).unbind('reposition', setOverlayHeight);
134
+ $(window).unbind('reposition', setSelfPosition);
135
+ $(window).unbind('scroll', setSelfPosition);
136
+ $(window).unbind('keypress', observeKeyPress);
137
+ if (ie6)
138
+ s.removeExpression('top');
139
+ opts.onClose();
140
+ }
141
+
142
+
143
+ /* Function to bind to the window to observe the escape/enter key press */
144
+ function observeKeyPress(e) {
145
+ if((e.keyCode == 27 || (e.DOM_VK_ESCAPE == 27 && e.which==0)) && opts.closeEsc) closeLightbox();
146
+ }
147
+
148
+
149
+ /* Set the height of the overlay
150
+ : if the document height is taller than the window, then set the overlay height to the document height.
151
+ : otherwise, just set overlay height: 100%
152
+ */
153
+ function setOverlayHeight() {
154
+ if ($(window).height() < $(document).height()) {
155
+ $overlay.css({height: $(document).height() + 'px'});
156
+ $iframe.css({height: $(document).height() + 'px'});
157
+ } else {
158
+ $overlay.css({height: '100%'});
159
+ if (ie6) {
160
+ $('html,body').css('height','100%');
161
+ $iframe.css('height', '100%');
162
+ } // ie6 hack for height: 100%; TODO: handle this in IE7
163
+ }
164
+ }
165
+
166
+
167
+ /* Set the position of the modal'd window ($self)
168
+ : if $self is taller than the window, then make it absolutely positioned
169
+ : otherwise fixed
170
+ */
171
+ function setSelfPosition() {
172
+ var s = $self[0].style;
173
+
174
+ // reset CSS so width is re-calculated for margin-left CSS
175
+ $self.css({left: '50%', marginLeft: ($self.outerWidth() / 2) * -1, zIndex: (opts.zIndex + 3) });
176
+
177
+
178
+ /* we have to get a little fancy when dealing with height, because lightbox_me
179
+ is just so fancy.
180
+ */
181
+
182
+ // if the height of $self is bigger than the window and self isn't already position absolute
183
+ if (($self.height() + 80 >= $(window).height()) && ($self.css('position') != 'absolute' || ie6)) {
184
+
185
+ // we are going to make it positioned where the user can see it, but they can still scroll
186
+ // so the top offset is based on the user's scroll position.
187
+ var topOffset = $(document).scrollTop() + 40;
188
+ $self.css({position: 'absolute', top: topOffset + 'px', marginTop: 0})
189
+ if (ie6) {
190
+ s.removeExpression('top');
191
+ }
192
+ } else if ($self.height()+ 80 < $(window).height()) {
193
+ //if the height is less than the window height, then we're gonna make this thing position: fixed.
194
+ // in ie6 we're gonna fake it.
195
+ if (ie6) {
196
+ s.position = 'absolute';
197
+ if (opts.centered) {
198
+ s.setExpression('top', '(document.documentElement.clientHeight || document.body.clientHeight) / 2 - (this.offsetHeight / 2) + (blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"')
199
+ s.marginTop = 0;
200
+ } else {
201
+ var top = (opts.modalCSS && opts.modalCSS.top) ? parseInt(opts.modalCSS.top) : 0;
202
+ s.setExpression('top', '((blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + '+top+') + "px"')
203
+ }
204
+ } else {
205
+ if (opts.centered) {
206
+ $self.css({ position: 'fixed', top: '50%', marginTop: ($self.outerHeight() / 2) * -1})
207
+ } else {
208
+ $self.css({ position: 'fixed'}).css(opts.modalCSS);
209
+ }
210
+
211
+ }
212
+ }
213
+ }
214
+
215
+ });
216
+
217
+
218
+
219
+ };
220
+
221
+ $.fn.lightbox_me.defaults = {
222
+
223
+ // animation
224
+ appearEffect: "fadeIn",
225
+ appearEase: "",
226
+ overlaySpeed: 250,
227
+ lightboxSpeed: 300,
228
+
229
+ // close
230
+ closeSelector: ".close",
231
+ closeClick: true,
232
+ closeEsc: true,
233
+
234
+ // behavior
235
+ destroyOnClose: false,
236
+ showOverlay: true,
237
+ parentLightbox: false,
238
+
239
+ // callbacks
240
+ onLoad: function() {},
241
+ onClose: function() {},
242
+
243
+ // style
244
+ classPrefix: 'lb',
245
+ zIndex: 999,
246
+ centered: false,
247
+ modalCSS: {top: '40px'},
248
+ overlayCSS: {background: 'black', opacity: .3}
249
+ }
250
+ })(jQuery);
@@ -0,0 +1,4 @@
1
+ //= require ./LightboxMe/jquery.lightbox_me.js
2
+ //= require ./FbMultiFriendSelector/jquery.facebook.multifriend.select.min.js
3
+ //= require ./Applicious/applicious.coffee
4
+ //= require ./Applicious/facebook.coffee
@@ -0,0 +1,122 @@
1
+ This is an client side alternative to the Facebook Multi-Friend Selector that
2
+ relies on jQuery. No server side component necessary which makes it really
3
+ easy to adapt and use. Check out this blog post with more details and [screencast](http://bit.ly/cHDkzm). To see a demo go [here](http://mbrevoort.github.com/jquery-facebook-multi-friend-selector/). Click login and login to your facebook account and you should see the friend selector.
4
+
5
+ Much can be customized by CSS, for example if you want a stacked list type selector that's [more stripped down](http://mbrevoort.github.com/jquery-facebook-multi-friend-selector/list.html)
6
+
7
+
8
+ How to use it
9
+ -------------
10
+
11
+ This plugin is depends on the Facebook Javascript API so you have to include it:
12
+
13
+ <script src="http://connect.facebook.net/en_US/all.js"></script>
14
+
15
+ Include the plugin javascript file and CSS
16
+
17
+ Assuming you have a container like:
18
+
19
+ <div id="jfmfs-container"></div>
20
+
21
+ And you have included the Facebook Javascript API
22
+ And you have already logged the user in. (FB.init and FB.login)
23
+ You can load the friend selector in a container like this:
24
+
25
+ $("#jfmfs-container").jfmfs();
26
+
27
+ This should fetch the current users friends and give you the interface to select friends. Then when you're ready to move on, there's a function to call that returns an array of the Facebook Ids of the selected friends.
28
+
29
+ var friendSelector = $("#jfmfs-container").data('jfmfs');
30
+ var selectedFriends = friendSelector.getSelectedIds();
31
+
32
+ Options
33
+ -------
34
+ These options can be passed into the jfmfs function with a map of options like jfmfs({key1: val, key2: val})
35
+
36
+ * max_selected: int (optional)- max number of items that can be selected
37
+ * labels: object with i18n labels for translations. If you pass this, you need to define all of the labels.
38
+
39
+ labels: {
40
+ selected: "Selected",
41
+ filter_default: "Start typing a name",
42
+ filter_title: "Find Friends:",
43
+ all: "All",
44
+ max_selected_message: "{0} of {1} selected"
45
+ // message to display showing how many items are already selected like: "{0} of {1} chosen"
46
+ }
47
+
48
+ * friend_fields: a comma separated list of fields to return in case you need additional fields for sorting. However you should always at least specify: "id,name",
49
+ * sorter: a function reference that will be called to do the sorting. It takes two arguments which are the two friend objects to be compared and returns "truthy if the first should come before the second. The default is:
50
+
51
+ function(a, b) {
52
+ var x = a.name.toLowerCase();
53
+ var y = b.name.toLowerCase();
54
+ return ((x < y) ? -1 : ((x > y) ? 1 : 0));
55
+ }
56
+
57
+ * pre_selected_friends: an array of ids of friends to preselect once loaded like: pre_selected_friends: [1014025367]
58
+
59
+ * exclude_friends: an array of ids of friends to exclude from the list like: exclude_friends: [33333333]
60
+
61
+ For example your options might look like this if you want a max of 3 friends selected, friends 11111111 and 22222222 preselected, friend 33333333 excluded from the list and to sort by friends' last name:
62
+
63
+ {
64
+ max_selected: 3,
65
+ max_selected_message: "{0} of {1} sucker selected",
66
+ friend_fields: "id,name,last_name",
67
+ pre_selected_friends: [11111111, 22222222],
68
+ exclude_friends: [33333333],
69
+ sorter: function(a, b) {
70
+ var x = a.last_name.toLowerCase();
71
+ var y = b.last_name.toLowerCase();
72
+ return ((x < y) ? -1 : ((x > y) ? 1 : 0));
73
+ }
74
+ }
75
+
76
+ Events
77
+ ------
78
+ jfmfs.friendload.finished - triggered on the container when the list of friends is finished loading
79
+
80
+ $("#jfmfs-container").bind("jfmfs.friendload.finished", function() {
81
+ alert("finished loaded!");
82
+ });
83
+
84
+ jfmfs.selection.changed - triggered on the container when a selection has changed with an array of selected friends each like { id: "123", name: "John Doe"}
85
+
86
+ $("#jfmfs-container").bind("jfmfs.selection.changed", function(e, data) {
87
+ console.log("changed", data);
88
+ });
89
+
90
+ # Changelog
91
+
92
+ ## Version v4
93
+ 2/5/2011:
94
+
95
+ * Fixed issue with images not loading when list is filtered
96
+
97
+ * Added i18n label object option to override default text
98
+
99
+ * Fixed bug when there was only one row of friends
100
+
101
+ * Added minified version [5.37KB (2.06KB gzipped)]
102
+
103
+ ## Version v3
104
+ 1/28/2011:
105
+
106
+ * Added customizable sorter option (see details in options section)
107
+
108
+ * Added pre_selected_friends option (see details in options section)
109
+
110
+ * Added exclude_friends option (see details in options section)
111
+
112
+ ## Version v2 (yeah, not 0.0.0.2)
113
+ 1/21/2011:
114
+
115
+ * Added some performance optimizations especially with a large number of friends
116
+
117
+ * Custom events for notification when friends are loaded or selections change
118
+
119
+ * Progressive image loading when scrolling including the usage of Ben Alman's awesome throttle/debounce library for smoother scrolling
120
+
121
+
122
+
@@ -0,0 +1,100 @@
1
+
2
+ <html>
3
+ <head>
4
+ <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
5
+ <script type="text/javascript" src="jquery.facebook.multifriend.select.js"></script>
6
+ <link rel="stylesheet" href="jquery.facebook.multifriend.select.css" />
7
+ <style>
8
+ body {
9
+ background: #fff;
10
+ color: #333;
11
+ font: 11px verdana, arial, helvetica, sans-serif;
12
+ }
13
+ a:link, a:visited, a:hover {
14
+ color: #666;
15
+ font-weight: bold;
16
+ text-decoration: none;
17
+ }
18
+ </style>
19
+ </head>
20
+ <body>
21
+
22
+ <div id="pageBody">
23
+ <div id="fb-root"></div>
24
+ <script src="http://connect.facebook.net/en_US/all.js"></script>
25
+ <script>
26
+ FB.init({appId: '194478650562619', cookie: true});
27
+
28
+ FB.getLoginStatus(function(response) {
29
+ if (response.session) {
30
+ init();
31
+ } else {
32
+ // no user session available, someone you dont know
33
+ }
34
+ });
35
+
36
+
37
+ function login() {
38
+ FB.login(function(response) {
39
+ if (response.session) {
40
+ init();
41
+ } else {
42
+ alert('Login Failed!');
43
+ }
44
+ });
45
+ }
46
+
47
+ function init() {
48
+ FB.api('/me', function(response) {
49
+ $("#username").html("<img src='https://graph.facebook.com/" + response.id + "/picture'/><div>" + response.name + "</div>");
50
+
51
+
52
+
53
+ $("#jfmfs-container").jfmfs({
54
+ max_selected: 15,
55
+ max_selected_message: "{0} of {1} selected",
56
+ friend_fields: "id,name,last_name",
57
+ pre_selected_friends: [1014025367],
58
+ exclude_friends: [1211122344, 610526078],
59
+ sorter: function(a, b) {
60
+ var x = a.last_name.toLowerCase();
61
+ var y = b.last_name.toLowerCase();
62
+ return ((x < y) ? -1 : ((x > y) ? 1 : 0));
63
+ }
64
+ });
65
+ $("#jfmfs-container").bind("jfmfs.friendload.finished", function() {
66
+ window.console && console.log("finished loading!");
67
+ });
68
+ $("#jfmfs-container").bind("jfmfs.selection.changed", function(e, data) {
69
+ window.console && console.log("changed", data);
70
+ });
71
+
72
+ $("#logged-out-status").hide();
73
+ $("#show-friends").show();
74
+
75
+ });
76
+ }
77
+
78
+
79
+
80
+ $("#show-friends").live("click", function() {
81
+ var friendSelector = $("#jfmfs-container").data('jfmfs');
82
+ $("#selected-friends").html(friendSelector.getSelectedIds().join(', '));
83
+ });
84
+
85
+
86
+ </script>
87
+
88
+ <div id="logged-out-status" style="">
89
+ <a href="javascript:login()">Login</a>
90
+ </div>
91
+
92
+ <div>
93
+ <div id="username"></div>
94
+ <a href="#" id="show-friends" style="display:none;">Show Selected Friends</a>
95
+ <div id="selected-friends" style="height:30px"></div>
96
+ <div id="jfmfs-container"></div>
97
+ </div>
98
+ </div>
99
+ </body>
100
+ </html>
@@ -0,0 +1,158 @@
1
+ /*
2
+ Copyright 2010 Mike Brevoort http://mike.brevoort.com @mbrevoort
3
+
4
+ v1.0 jquery-facebook-multi-friend-selector
5
+
6
+ Licensed under the Apache License, Version 2.0 (the "License");
7
+ you may not use this file except in compliance with the License.
8
+ You may obtain a copy of the License at
9
+
10
+ http://www.apache.org/licenses/LICENSE-2.0
11
+
12
+ Unless required by applicable law or agreed to in writing, software
13
+ distributed under the License is distributed on an "AS IS" BASIS,
14
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
+ See the License for the specific language governing permissions and
16
+ limitations under the License.
17
+ */
18
+
19
+ #jfmfs-friend-selector input {
20
+ background-color: #fcfcfc;
21
+ border: 1px solid #ccc;
22
+ font: 11px verdana, arial, helvetica, sans-serif;
23
+ margin: 2px 0;
24
+ padding: 2px 4px;
25
+ }
26
+ .jfmfs-friend {
27
+ cursor:pointer;
28
+ display:block;
29
+ float:left;
30
+ margin:3px;
31
+ padding:2px;
32
+ width:180px;
33
+ overflow: hidden;
34
+ border: 1px solid #FFFFFF;
35
+ -moz-border-radius: 5px;
36
+ -webkit-border-radius: 5px;
37
+ -webkit-user-select:none;
38
+ -moz-user-select:none;
39
+ }
40
+
41
+ .jfmfs-friend img {
42
+ border: 1px solid #CCC;
43
+ float:left;
44
+ margin:0;
45
+ width:20px;
46
+ height:20px;
47
+ }
48
+
49
+ .jfmfs-friend.selected img {
50
+ border: 1px solid #233E75;
51
+ }
52
+
53
+ .jfmfs-friend div {
54
+ color:#111111;
55
+ font-size:11px;
56
+ overflow:hidden;
57
+ padding:2px 0 0 6px;
58
+ width:145px;
59
+ }
60
+
61
+ #jfmfs-friend-container {
62
+ overflow:scroll;
63
+ overflow-x: hidden;
64
+ -ms-overflow-x: hidden;
65
+ width:100%;
66
+ height:250px;
67
+ font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
68
+ color: #333;
69
+ font-size: 12px;
70
+ }
71
+
72
+ #jfmfs-friend-selector {
73
+ width:210px;
74
+ height:226px;
75
+ }
76
+
77
+ #jfmfs-inner-header {
78
+ background:none repeat scroll 0 0 #F7F7F7;
79
+ border-bottom:1px solid #CCCCCC;
80
+ color:#3B5998;
81
+ font-size:11px;
82
+ font-weight:bold;
83
+ height:25px;
84
+ padding:2px;
85
+ }
86
+
87
+ .jfmfs-friend.selected {
88
+ background-color: #3B5998;
89
+ border: 1px solid #3B5998;
90
+
91
+ background: #6D84B4; /* for non-css3 browsers */
92
+
93
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#233E75', endColorstr='#6D84B4'); /* for IE */
94
+ background: -webkit-gradient(linear, left top, left bottom, from(#233E75), to(#6D84B4)); /* for webkit browsers */
95
+ background: -moz-linear-gradient(top, #233E75, #6D84B4); /* for firefox 3.6+ */
96
+ }
97
+
98
+ .jfmfs-friend.selected div {
99
+ color: #FFFFFF;
100
+ }
101
+
102
+ .hover {
103
+ background-color: #EFF2F7;
104
+ }
105
+
106
+ .hide-non-selected, .hide-filtered {
107
+ display: none;
108
+ }
109
+
110
+ div.jfmfs-button {
111
+ background:none repeat scroll 0 0 #6D84B4;
112
+ border:1px solid #3B5998;
113
+ color:white;
114
+ cursor:pointer;
115
+ margin:4px 5px 0 4px;
116
+ padding:2px 5px;
117
+ text-decoration:none;
118
+ }
119
+
120
+ #jfmfs-friend-selector a.filter-link:link, a.filter-link:visited {
121
+ color: #3B5998;
122
+ font-weight: bold;
123
+ text-decoration: none;
124
+ }
125
+
126
+ #jfmfs-friend-selector a.filter-link:hover, #jfmfs-friend-selector a.selected {
127
+ background-color: #6D84B4;
128
+ -moz-border-radius: 5px;
129
+ -webkit-border-radius: 5px;
130
+ color: #FFFFFF;
131
+ }
132
+
133
+ #jfmfs-friend-selector .filter-link {
134
+ margin:4px 5px 4px 5px;
135
+ padding:3px 5px 3px 5px;
136
+ }
137
+
138
+ #jfmfs-inner-header .filter-link {
139
+ float:right;
140
+ }
141
+
142
+ #jfmfs-inner-header div.jfmfs-button-hover {
143
+ text-decoration: underline;
144
+ }
145
+
146
+
147
+ #jfmfs-friend-filter-text {
148
+ height: 23px;
149
+ }
150
+
151
+
152
+ #jfmfs-inner-header span.jfmfs-title {
153
+ display:none;
154
+ }
155
+
156
+ #jfmfs-max-selected-wrapper, #jfmfs-filter-all, #jfmfs-filter-selected {
157
+ display:none;
158
+ }