facebox-render 0.9.5 → 0.9.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.rdoc +58 -0
- data/install.rb +36 -0
- data/lib/facebox_render.rb +19 -7
- data/media/images/b.png +0 -0
- data/media/images/bl.png +0 -0
- data/media/images/br.png +0 -0
- data/media/images/closelabel.gif +0 -0
- data/media/images/loading.gif +0 -0
- data/media/images/tl.png +0 -0
- data/media/images/tr.png +0 -0
- data/media/javascripts/facebox.js +319 -0
- data/media/javascripts/facebox.pack.js +8 -0
- data/media/stylesheets/facebox.css +95 -0
- metadata +41 -33
- data/History.txt +0 -5
- data/Manifest.txt +0 -7
- data/README.txt +0 -55
- data/Rakefile +0 -11
data/README.rdoc
ADDED
@@ -0,0 +1,58 @@
|
|
1
|
+
= Description
|
2
|
+
|
3
|
+
FaceboxRender improved plugin let you use lightbox seamlessly using Facebox library.
|
4
|
+
|
5
|
+
= Install
|
6
|
+
|
7
|
+
* script/plugin install git://github.com/ihower/facebox_render.git (for Rails 2)
|
8
|
+
* rails plugin install git://github.com/ihower/facebox_render.git (for Rails 3)
|
9
|
+
|
10
|
+
= USAGE
|
11
|
+
|
12
|
+
== Helper
|
13
|
+
|
14
|
+
* facebox_link_to helper, it's will launch loading facebox first, send ajax request second)
|
15
|
+
* link_to_remote, form_remote_tag ...etc Ajax helper. (for Rails 2)
|
16
|
+
* link_to :remote => true, form_for :remote => true ...etc Ajax helper (for Rails 3)
|
17
|
+
|
18
|
+
Don't use <a href="somelink" ref="facebox">
|
19
|
+
|
20
|
+
== Controller
|
21
|
+
|
22
|
+
Add "include FaceboxRender" to your controller,
|
23
|
+
or simply put it at /app/controllers/application.rb
|
24
|
+
|
25
|
+
Then in your action:
|
26
|
+
|
27
|
+
respond_to do |format|
|
28
|
+
format.html
|
29
|
+
format.js { render_to_facebox }
|
30
|
+
end
|
31
|
+
|
32
|
+
By Default render the html without layout,
|
33
|
+
otherwise you can pass options[:template], options[:layout], options[:action], options[:partial] or options[:html] string.
|
34
|
+
Passing options[:msg] will pulsate a message.
|
35
|
+
|
36
|
+
If block given, it will yield after facebox script, eg:
|
37
|
+
|
38
|
+
render_to_facebox do |page|
|
39
|
+
page << "alert('test')"
|
40
|
+
end
|
41
|
+
|
42
|
+
Besides render_facebox, we have close_facebox, redirect_from_facebox.
|
43
|
+
|
44
|
+
respond_to do |format|
|
45
|
+
format.html
|
46
|
+
format.js { close_facebox }
|
47
|
+
end
|
48
|
+
|
49
|
+
= Authors & Contributors
|
50
|
+
|
51
|
+
* Wen-Tien Chang http://ihower.tw
|
52
|
+
* Francisco J. http://github.com/franciscoj
|
53
|
+
* Pavel Y. http://github.com/xedin
|
54
|
+
* Blake Chambers
|
55
|
+
|
56
|
+
= License
|
57
|
+
|
58
|
+
Licensed under the MIT: http://www.opensource.org/licenses/mit-license.php
|
data/install.rb
ADDED
@@ -0,0 +1,36 @@
|
|
1
|
+
require 'rubygems'
|
2
|
+
|
3
|
+
puts 'Copying files...'
|
4
|
+
|
5
|
+
public_path = File.join(Rails.root, 'public')
|
6
|
+
current_path = File.join(File.dirname(__FILE__), 'media')
|
7
|
+
|
8
|
+
javascripts_path = File.join(public_path, 'javascripts')
|
9
|
+
stylesheets_path = File.join(public_path, 'stylesheets')
|
10
|
+
images_path = File.join(public_path, 'images', 'facebox')
|
11
|
+
|
12
|
+
# copying JS
|
13
|
+
['facebox.js', 'facebox.pack.js'].each do |js_file|
|
14
|
+
dest_file = File.join(javascripts_path, js_file)
|
15
|
+
src_file = File.join(current_path, 'javascripts', js_file)
|
16
|
+
FileUtils.cp_r(src_file, dest_file)
|
17
|
+
end
|
18
|
+
|
19
|
+
# copying CSS
|
20
|
+
FileUtils.cp_r(File.join(current_path, 'stylesheets', 'facebox.css'), File.join(stylesheets_path, 'facebox.css'))
|
21
|
+
|
22
|
+
# copying images
|
23
|
+
Dir.mkdir(images_path) unless File.exists?(images_path)
|
24
|
+
|
25
|
+
plugin_images_path = File.join(current_path, 'images')
|
26
|
+
|
27
|
+
Dir.foreach(plugin_images_path) do |image|
|
28
|
+
src_image = File.join(plugin_images_path, image)
|
29
|
+
|
30
|
+
if File.file?(src_image)
|
31
|
+
dest_image = File.join(images_path, image)
|
32
|
+
FileUtils.cp_r(src_image, dest_image)
|
33
|
+
end
|
34
|
+
end
|
35
|
+
|
36
|
+
puts 'Done - Installation complete!'
|
data/lib/facebox_render.rb
CHANGED
@@ -1,16 +1,28 @@
|
|
1
1
|
module FaceboxRender
|
2
2
|
|
3
3
|
def render_to_facebox( options = {} )
|
4
|
-
|
4
|
+
l = options.delete(:layout) { false }
|
5
5
|
|
6
|
-
|
7
|
-
|
6
|
+
if options[:action]
|
7
|
+
s = render_to_string(:action => options[:action], :layout => l)
|
8
|
+
elsif options[:template]
|
9
|
+
s = render_to_string(:template => options[:template], :layout => l)
|
10
|
+
elsif !options[:partial] && !options[:html]
|
11
|
+
s = render_to_string(:layout => l)
|
12
|
+
end
|
8
13
|
|
9
14
|
render :update do |page|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
15
|
+
if options[:action]
|
16
|
+
page << "jQuery.facebox(#{s.to_json})"
|
17
|
+
elsif options[:template]
|
18
|
+
page << "jQuery.facebox(#{s.to_json})"
|
19
|
+
elsif options[:partial]
|
20
|
+
page << "jQuery.facebox(#{(render :partial => options[:partial]).to_json})"
|
21
|
+
elsif options[:html]
|
22
|
+
page << "jQuery.facebox(#{options[:html].to_json})"
|
23
|
+
else
|
24
|
+
page << "jQuery.facebox(#{s.to_json})"
|
25
|
+
end
|
14
26
|
|
15
27
|
if options[:msg]
|
16
28
|
page << "jQuery('#facebox .content').prepend('<div class=\"message\">#{options[:msg]}</div>')"
|
data/media/images/b.png
ADDED
Binary file
|
data/media/images/bl.png
ADDED
Binary file
|
data/media/images/br.png
ADDED
Binary file
|
Binary file
|
Binary file
|
data/media/images/tl.png
ADDED
Binary file
|
data/media/images/tr.png
ADDED
Binary file
|
@@ -0,0 +1,319 @@
|
|
1
|
+
/*
|
2
|
+
* Facebox (for jQuery)
|
3
|
+
* version: 1.2 (05/05/2008)
|
4
|
+
* @requires jQuery v1.2 or later
|
5
|
+
*
|
6
|
+
* Examples at http://famspam.com/facebox/
|
7
|
+
*
|
8
|
+
* Licensed under the MIT:
|
9
|
+
* http://www.opensource.org/licenses/mit-license.php
|
10
|
+
*
|
11
|
+
* Copyright 2007, 2008 Chris Wanstrath [ chris@ozmm.org ]
|
12
|
+
*
|
13
|
+
* Usage:
|
14
|
+
*
|
15
|
+
* jQuery(document).ready(function() {
|
16
|
+
* jQuery('a[rel*=facebox]').facebox()
|
17
|
+
* })
|
18
|
+
*
|
19
|
+
* <a href="#terms" rel="facebox">Terms</a>
|
20
|
+
* Loads the #terms div in the box
|
21
|
+
*
|
22
|
+
* <a href="terms.html" rel="facebox">Terms</a>
|
23
|
+
* Loads the terms.html page in the box
|
24
|
+
*
|
25
|
+
* <a href="terms.png" rel="facebox">Terms</a>
|
26
|
+
* Loads the terms.png image in the box
|
27
|
+
*
|
28
|
+
*
|
29
|
+
* You can also use it programmatically:
|
30
|
+
*
|
31
|
+
* jQuery.facebox('some html')
|
32
|
+
*
|
33
|
+
* The above will open a facebox with "some html" as the content.
|
34
|
+
*
|
35
|
+
* jQuery.facebox(function($) {
|
36
|
+
* $.get('blah.html', function(data) { $.facebox(data) })
|
37
|
+
* })
|
38
|
+
*
|
39
|
+
* The above will show a loading screen before the passed function is called,
|
40
|
+
* allowing for a better ajaxy experience.
|
41
|
+
*
|
42
|
+
* The facebox function can also display an ajax page or image:
|
43
|
+
*
|
44
|
+
* jQuery.facebox({ ajax: 'remote.html' })
|
45
|
+
* jQuery.facebox({ image: 'dude.jpg' })
|
46
|
+
*
|
47
|
+
* Want to close the facebox? Trigger the 'close.facebox' document event:
|
48
|
+
*
|
49
|
+
* jQuery(document).trigger('close.facebox')
|
50
|
+
*
|
51
|
+
* Facebox also has a bunch of other hooks:
|
52
|
+
*
|
53
|
+
* loading.facebox
|
54
|
+
* beforeReveal.facebox
|
55
|
+
* reveal.facebox (aliased as 'afterReveal.facebox')
|
56
|
+
* init.facebox
|
57
|
+
*
|
58
|
+
* Simply bind a function to any of these hooks:
|
59
|
+
*
|
60
|
+
* $(document).bind('reveal.facebox', function() { ...stuff to do after the facebox and contents are revealed... })
|
61
|
+
*
|
62
|
+
*/
|
63
|
+
(function($) {
|
64
|
+
$.facebox = function(data, klass) {
|
65
|
+
$.facebox.loading()
|
66
|
+
|
67
|
+
if (data.ajax) fillFaceboxFromAjax(data.ajax)
|
68
|
+
else if (data.image) fillFaceboxFromImage(data.image)
|
69
|
+
else if (data.div) fillFaceboxFromHref(data.div)
|
70
|
+
else if ($.isFunction(data)) data.call($)
|
71
|
+
else $.facebox.reveal(data, klass)
|
72
|
+
}
|
73
|
+
|
74
|
+
/*
|
75
|
+
* Public, $.facebox methods
|
76
|
+
*/
|
77
|
+
|
78
|
+
$.extend($.facebox, {
|
79
|
+
settings: {
|
80
|
+
opacity : 0,
|
81
|
+
overlay : true,
|
82
|
+
loadingImage : '/images/facebox/loading.gif',
|
83
|
+
closeImage : '/images/facebox/closelabel.gif',
|
84
|
+
imageTypes : [ 'png', 'jpg', 'jpeg', 'gif' ],
|
85
|
+
faceboxHtml : '\
|
86
|
+
<div id="facebox" style="display:none;"> \
|
87
|
+
<div class="popup"> \
|
88
|
+
<table> \
|
89
|
+
<tbody> \
|
90
|
+
<tr> \
|
91
|
+
<td class="tl"/><td class="b"/><td class="tr"/> \
|
92
|
+
</tr> \
|
93
|
+
<tr> \
|
94
|
+
<td class="b"/> \
|
95
|
+
<td class="body"> \
|
96
|
+
<div class="content"> \
|
97
|
+
</div> \
|
98
|
+
<div class="footer"> \
|
99
|
+
<a href="#" class="close"> \
|
100
|
+
<img src="/images/facebox/closelabel.gif" title="close" class="close_image" /> \
|
101
|
+
</a> \
|
102
|
+
</div> \
|
103
|
+
</td> \
|
104
|
+
<td class="b"/> \
|
105
|
+
</tr> \
|
106
|
+
<tr> \
|
107
|
+
<td class="bl"/><td class="b"/><td class="br"/> \
|
108
|
+
</tr> \
|
109
|
+
</tbody> \
|
110
|
+
</table> \
|
111
|
+
</div> \
|
112
|
+
</div>'
|
113
|
+
},
|
114
|
+
|
115
|
+
loading: function() {
|
116
|
+
init()
|
117
|
+
if ($('#facebox .loading').length == 1) return true
|
118
|
+
showOverlay()
|
119
|
+
|
120
|
+
$('#facebox .content').empty()
|
121
|
+
$('#facebox .body').children().hide().end().
|
122
|
+
append('<div class="loading"><img src="'+$.facebox.settings.loadingImage+'"/></div>')
|
123
|
+
|
124
|
+
$('#facebox').css({
|
125
|
+
top: getPageScroll()[1] + (getPageHeight() / 10),
|
126
|
+
left: 385.5
|
127
|
+
}).show()
|
128
|
+
|
129
|
+
$(document).bind('keydown.facebox', function(e) {
|
130
|
+
if (e.keyCode == 27) $.facebox.close()
|
131
|
+
return true
|
132
|
+
})
|
133
|
+
$(document).trigger('loading.facebox')
|
134
|
+
},
|
135
|
+
|
136
|
+
reveal: function(data, klass) {
|
137
|
+
$(document).trigger('beforeReveal.facebox')
|
138
|
+
if (klass) $('#facebox .content').addClass(klass)
|
139
|
+
$('#facebox .content').append(data)
|
140
|
+
$('#facebox .loading').remove()
|
141
|
+
$('#facebox .body').children().fadeIn('normal')
|
142
|
+
$('#facebox').css('left', $(window).width() / 2 - ($('#facebox table').width() / 2))
|
143
|
+
$(document).trigger('reveal.facebox').trigger('afterReveal.facebox')
|
144
|
+
},
|
145
|
+
|
146
|
+
close: function() {
|
147
|
+
$(document).trigger('close.facebox')
|
148
|
+
return false
|
149
|
+
}
|
150
|
+
})
|
151
|
+
|
152
|
+
/*
|
153
|
+
* Public, $.fn methods
|
154
|
+
*/
|
155
|
+
|
156
|
+
$.fn.facebox = function(settings) {
|
157
|
+
init(settings)
|
158
|
+
|
159
|
+
function clickHandler() {
|
160
|
+
$.facebox.loading(true)
|
161
|
+
|
162
|
+
// support for rel="facebox.inline_popup" syntax, to add a class
|
163
|
+
// also supports deprecated "facebox[.inline_popup]" syntax
|
164
|
+
var klass = this.rel.match(/facebox\[?\.(\w+)\]?/)
|
165
|
+
if (klass) klass = klass[1]
|
166
|
+
|
167
|
+
fillFaceboxFromHref(this.href, klass)
|
168
|
+
return false
|
169
|
+
}
|
170
|
+
|
171
|
+
return this.click(clickHandler)
|
172
|
+
}
|
173
|
+
|
174
|
+
/*
|
175
|
+
* Private methods
|
176
|
+
*/
|
177
|
+
|
178
|
+
// called one time to setup facebox on this page
|
179
|
+
function init(settings) {
|
180
|
+
if ($.facebox.settings.inited) return true
|
181
|
+
else $.facebox.settings.inited = true
|
182
|
+
|
183
|
+
$(document).trigger('init.facebox')
|
184
|
+
makeCompatible()
|
185
|
+
|
186
|
+
var imageTypes = $.facebox.settings.imageTypes.join('|')
|
187
|
+
$.facebox.settings.imageTypesRegexp = new RegExp('\.' + imageTypes + '$', 'i')
|
188
|
+
|
189
|
+
if (settings) $.extend($.facebox.settings, settings)
|
190
|
+
$('body').append($.facebox.settings.faceboxHtml)
|
191
|
+
|
192
|
+
var preload = [ new Image(), new Image() ]
|
193
|
+
preload[0].src = $.facebox.settings.closeImage
|
194
|
+
preload[1].src = $.facebox.settings.loadingImage
|
195
|
+
|
196
|
+
$('#facebox').find('.b:first, .bl, .br, .tl, .tr').each(function() {
|
197
|
+
preload.push(new Image())
|
198
|
+
preload.slice(-1).src = $(this).css('background-image').replace(/url\((.+)\)/, '$1')
|
199
|
+
})
|
200
|
+
|
201
|
+
$('#facebox .close').click($.facebox.close)
|
202
|
+
$('#facebox .close_image').attr('src', $.facebox.settings.closeImage)
|
203
|
+
}
|
204
|
+
|
205
|
+
// getPageScroll() by quirksmode.com
|
206
|
+
function getPageScroll() {
|
207
|
+
var xScroll, yScroll;
|
208
|
+
if (self.pageYOffset) {
|
209
|
+
yScroll = self.pageYOffset;
|
210
|
+
xScroll = self.pageXOffset;
|
211
|
+
} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
|
212
|
+
yScroll = document.documentElement.scrollTop;
|
213
|
+
xScroll = document.documentElement.scrollLeft;
|
214
|
+
} else if (document.body) {// all other Explorers
|
215
|
+
yScroll = document.body.scrollTop;
|
216
|
+
xScroll = document.body.scrollLeft;
|
217
|
+
}
|
218
|
+
return new Array(xScroll,yScroll)
|
219
|
+
}
|
220
|
+
|
221
|
+
// Adapted from getPageSize() by quirksmode.com
|
222
|
+
function getPageHeight() {
|
223
|
+
var windowHeight
|
224
|
+
if (self.innerHeight) { // all except Explorer
|
225
|
+
windowHeight = self.innerHeight;
|
226
|
+
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
|
227
|
+
windowHeight = document.documentElement.clientHeight;
|
228
|
+
} else if (document.body) { // other Explorers
|
229
|
+
windowHeight = document.body.clientHeight;
|
230
|
+
}
|
231
|
+
return windowHeight
|
232
|
+
}
|
233
|
+
|
234
|
+
// Backwards compatibility
|
235
|
+
function makeCompatible() {
|
236
|
+
var $s = $.facebox.settings
|
237
|
+
|
238
|
+
$s.loadingImage = $s.loading_image || $s.loadingImage
|
239
|
+
$s.closeImage = $s.close_image || $s.closeImage
|
240
|
+
$s.imageTypes = $s.image_types || $s.imageTypes
|
241
|
+
$s.faceboxHtml = $s.facebox_html || $s.faceboxHtml
|
242
|
+
}
|
243
|
+
|
244
|
+
// Figures out what you want to display and displays it
|
245
|
+
// formats are:
|
246
|
+
// div: #id
|
247
|
+
// image: blah.extension
|
248
|
+
// ajax: anything else
|
249
|
+
function fillFaceboxFromHref(href, klass) {
|
250
|
+
// div
|
251
|
+
if (href.match(/#/)) {
|
252
|
+
var url = window.location.href.split('#')[0]
|
253
|
+
var target = href.replace(url,'')
|
254
|
+
$.facebox.reveal($(target).clone().show(), klass)
|
255
|
+
|
256
|
+
// image
|
257
|
+
} else if (href.match($.facebox.settings.imageTypesRegexp)) {
|
258
|
+
fillFaceboxFromImage(href, klass)
|
259
|
+
// ajax
|
260
|
+
} else {
|
261
|
+
fillFaceboxFromAjax(href, klass)
|
262
|
+
}
|
263
|
+
}
|
264
|
+
|
265
|
+
function fillFaceboxFromImage(href, klass) {
|
266
|
+
var image = new Image()
|
267
|
+
image.onload = function() {
|
268
|
+
$.facebox.reveal('<div class="image"><img src="' + image.src + '" /></div>', klass)
|
269
|
+
}
|
270
|
+
image.src = href
|
271
|
+
}
|
272
|
+
|
273
|
+
function fillFaceboxFromAjax(href, klass) {
|
274
|
+
$.get(href, function(data) { $.facebox.reveal(data, klass) })
|
275
|
+
}
|
276
|
+
|
277
|
+
function skipOverlay() {
|
278
|
+
return $.facebox.settings.overlay == false || $.facebox.settings.opacity === null
|
279
|
+
}
|
280
|
+
|
281
|
+
function showOverlay() {
|
282
|
+
if (skipOverlay()) return
|
283
|
+
|
284
|
+
if ($('facebox_overlay').length == 0)
|
285
|
+
$("body").append('<div id="facebox_overlay" class="facebox_hide"></div>')
|
286
|
+
|
287
|
+
$('#facebox_overlay').hide().addClass("facebox_overlayBG")
|
288
|
+
.css('opacity', $.facebox.settings.opacity)
|
289
|
+
.click(function() { $(document).trigger('close.facebox') })
|
290
|
+
.fadeIn(200)
|
291
|
+
return false
|
292
|
+
}
|
293
|
+
|
294
|
+
function hideOverlay() {
|
295
|
+
if (skipOverlay()) return
|
296
|
+
|
297
|
+
$('#facebox_overlay').fadeOut(200, function(){
|
298
|
+
$("#facebox_overlay").removeClass("facebox_overlayBG")
|
299
|
+
$("#facebox_overlay").addClass("facebox_hide")
|
300
|
+
$("#facebox_overlay").remove()
|
301
|
+
})
|
302
|
+
|
303
|
+
return false
|
304
|
+
}
|
305
|
+
|
306
|
+
/*
|
307
|
+
* Bindings
|
308
|
+
*/
|
309
|
+
|
310
|
+
$(document).bind('close.facebox', function() {
|
311
|
+
$(document).unbind('keydown.facebox')
|
312
|
+
$('#facebox').fadeOut(function() {
|
313
|
+
$('#facebox .content').removeClass().addClass('content')
|
314
|
+
hideOverlay()
|
315
|
+
$('#facebox .loading').remove()
|
316
|
+
})
|
317
|
+
})
|
318
|
+
|
319
|
+
})(jQuery);
|
@@ -0,0 +1,8 @@
|
|
1
|
+
(function(a){function e(b){if(a.a.b.u)return true;else a.a.b.u=true;a(document).c("init.facebox");j();var c=a.a.b.j.join("|");a.a.b.t=new RegExp("."+c+"$","i");b&&a.extend(a.a.b,b);a("body").append(a.a.b.i);var d=[new Image,new Image];d[0].src=a.a.b.d;d[1].src=a.a.b.e;a("#facebox").find(".b:first, .bl, .br, .tl, .tr").D(function(){d.push(new Image);d.slice(-1).src=a(this).h("background-image").replace(/url\((.+)\)/,"$1")});a("#facebox .close").click(a.a.close);a("#facebox .close_image").A("src",a.a.b.d)}
|
2
|
+
function k(){var b,c;if(self.pageYOffset){c=self.pageYOffset;b=self.pageXOffset}else if(document.documentElement&&document.documentElement.scrollTop){c=document.documentElement.scrollTop;b=document.documentElement.scrollLeft}else if(document.body){c=document.body.scrollTop;b=document.body.scrollLeft}return new Array(b,c)}function l(){var b;if(self.innerHeight)b=self.innerHeight;else if(document.documentElement&&document.documentElement.clientHeight)b=document.documentElement.clientHeight;else if(document.body)b=
|
3
|
+
document.body.clientHeight;return b}function j(){var b=a.a.b;b.e=b.L||b.e;b.d=b.C||b.d;b.j=b.J||b.j;b.i=b.G||b.i}function f(b,c){if(b.match(/#/)){var d=window.location.href.split("#")[0];b=b.replace(d,"");a.a.f(a(b).B().z(),c)}else b.match(a.a.b.t)?g(b,c):h(b,c)}function g(b,c){var d=new Image;d.onload=function(){a.a.f('<div class="image"><img src="'+d.src+'" /></div>',c)};d.src=b}function h(b,c){a.I(b,function(d){a.a.f(d,c)})}function i(){return a.a.b.v==false||a.a.b.opacity===null}function m(){if(!i()){a("facebox_overlay").length==
|
4
|
+
0&&a("body").append('<div id="facebox_overlay" class="facebox_hide"></div>');a("#facebox_overlay").r().g("facebox_overlayBG").h("opacity",a.a.b.opacity).click(function(){a(document).c("close.facebox")}).p(200);return false}}function n(){if(!i()){a("#facebox_overlay").q(200,function(){a("#facebox_overlay").w("facebox_overlayBG");a("#facebox_overlay").g("facebox_hide");a("#facebox_overlay").remove()});return false}}a.a=function(b,c){a.a.k();if(b.l)h(b.l);else if(b.s)g(b.s);else if(b.o)f(b.o);else a.K(b)?
|
5
|
+
b.call(a):a.a.f(b,c)};a.extend(a.a,{b:{opacity:0,v:true,e:"/images/facebox/loading.gif",d:"/images/facebox/closelabel.gif",j:["png","jpg","jpeg","gif"],i:' <div id="facebox" style="display:none;"> <div class="popup"> <table> <tbody> <tr> <td class="tl"/><td class="b"/><td class="tr"/> </tr> <tr> <td class="b"/> <td class="body"> <div class="content"> </div> <div class="footer"> <a href="#" class="close"> <img src="/images/facebox/closelabel.gif" title="close" class="close_image" /> </a> </div> </td> <td class="b"/> </tr> <tr> <td class="bl"/><td class="b"/><td class="br"/> </tr> </tbody> </table> </div> </div>'},
|
6
|
+
k:function(){e();if(a("#facebox .loading").length==1)return true;m();a("#facebox .content").empty();a("#facebox .body").n().r().F().append('<div class="loading"><img src="'+a.a.b.e+'"/></div>');a("#facebox").h({top:k()[1]+l()/10,left:385.5}).z();a(document).m("keydown.facebox",function(b){b.keyCode==27&&a.a.close();return true});a(document).c("loading.facebox")},f:function(b,c){a(document).c("beforeReveal.facebox");c&&a("#facebox .content").g(c);a("#facebox .content").append(b);a("#facebox .loading").remove();
|
7
|
+
a("#facebox .body").n().p("normal");a("#facebox").h("left",a(window).width()/2-a("#facebox table").width()/2);a(document).c("reveal.facebox").c("afterReveal.facebox")},close:function(){a(document).c("close.facebox");return false}});a.H.a=function(b){function c(){a.a.k(true);var d=this.rel.match(/facebox\[?\.(\w+)\]?/);if(d)d=d[1];f(this.href,d);return false}e(b);return this.click(c)};a(document).m("close.facebox",function(){a(document).M("keydown.facebox");a("#facebox").q(function(){a("#facebox .content").w().g("content");
|
8
|
+
n();a("#facebox .loading").remove()})})})(jQuery);
|
@@ -0,0 +1,95 @@
|
|
1
|
+
#facebox .b {
|
2
|
+
background:url(/images/facebox/b.png);
|
3
|
+
}
|
4
|
+
|
5
|
+
#facebox .tl {
|
6
|
+
background:url(/images/facebox/tl.png);
|
7
|
+
}
|
8
|
+
|
9
|
+
#facebox .tr {
|
10
|
+
background:url(/images/facebox/tr.png);
|
11
|
+
}
|
12
|
+
|
13
|
+
#facebox .bl {
|
14
|
+
background:url(/images/facebox/bl.png);
|
15
|
+
}
|
16
|
+
|
17
|
+
#facebox .br {
|
18
|
+
background:url(/images/facebox/br.png);
|
19
|
+
}
|
20
|
+
|
21
|
+
#facebox {
|
22
|
+
position: absolute;
|
23
|
+
top: 0;
|
24
|
+
left: 0;
|
25
|
+
z-index: 100;
|
26
|
+
text-align: left;
|
27
|
+
}
|
28
|
+
|
29
|
+
#facebox .popup {
|
30
|
+
position: relative;
|
31
|
+
}
|
32
|
+
|
33
|
+
#facebox table {
|
34
|
+
border-collapse: collapse;
|
35
|
+
}
|
36
|
+
|
37
|
+
#facebox td {
|
38
|
+
border-bottom: 0;
|
39
|
+
padding: 0;
|
40
|
+
}
|
41
|
+
|
42
|
+
#facebox .body {
|
43
|
+
padding: 10px;
|
44
|
+
background: #fff;
|
45
|
+
width: 370px;
|
46
|
+
}
|
47
|
+
|
48
|
+
#facebox .loading {
|
49
|
+
text-align: center;
|
50
|
+
}
|
51
|
+
|
52
|
+
#facebox .image {
|
53
|
+
text-align: center;
|
54
|
+
}
|
55
|
+
|
56
|
+
#facebox img {
|
57
|
+
border: 0;
|
58
|
+
margin: 0;
|
59
|
+
}
|
60
|
+
|
61
|
+
#facebox .footer {
|
62
|
+
border-top: 1px solid #DDDDDD;
|
63
|
+
padding-top: 5px;
|
64
|
+
margin-top: 10px;
|
65
|
+
text-align: right;
|
66
|
+
}
|
67
|
+
|
68
|
+
#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
|
69
|
+
height: 10px;
|
70
|
+
width: 10px;
|
71
|
+
overflow: hidden;
|
72
|
+
padding: 0;
|
73
|
+
}
|
74
|
+
|
75
|
+
#facebox_overlay {
|
76
|
+
position: fixed;
|
77
|
+
top: 0px;
|
78
|
+
left: 0px;
|
79
|
+
height:100%;
|
80
|
+
width:100%;
|
81
|
+
}
|
82
|
+
|
83
|
+
.facebox_hide {
|
84
|
+
z-index:-100;
|
85
|
+
}
|
86
|
+
|
87
|
+
.facebox_overlayBG {
|
88
|
+
background-color: #000;
|
89
|
+
z-index: 99;
|
90
|
+
}
|
91
|
+
|
92
|
+
* html #facebox_overlay { /* ie6 hack */
|
93
|
+
position: absolute;
|
94
|
+
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
|
95
|
+
}
|
metadata
CHANGED
@@ -1,7 +1,12 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: facebox-render
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
|
4
|
+
prerelease: false
|
5
|
+
segments:
|
6
|
+
- 0
|
7
|
+
- 9
|
8
|
+
- 9
|
9
|
+
version: 0.9.9
|
5
10
|
platform: ruby
|
6
11
|
authors:
|
7
12
|
- Wen-Tien Chang
|
@@ -9,63 +14,66 @@ autorequire:
|
|
9
14
|
bindir: bin
|
10
15
|
cert_chain: []
|
11
16
|
|
12
|
-
date:
|
17
|
+
date: 2010-05-28 00:00:00 +08:00
|
13
18
|
default_executable:
|
14
|
-
dependencies:
|
15
|
-
|
16
|
-
|
17
|
-
version_requirement:
|
18
|
-
version_requirements: !ruby/object:Gem::Requirement
|
19
|
-
requirements:
|
20
|
-
- - ">="
|
21
|
-
- !ruby/object:Gem::Version
|
22
|
-
version: 1.5.3
|
23
|
-
version:
|
24
|
-
description: ""
|
19
|
+
dependencies: []
|
20
|
+
|
21
|
+
description: "FaceboxRender is a Rails plugin let you use lightbox seamlessly using Facebox library (http://famspam.com/facebox/) "
|
25
22
|
email:
|
26
|
-
- ihower@
|
23
|
+
- ihower@gmail.com
|
27
24
|
executables: []
|
28
25
|
|
29
26
|
extensions: []
|
30
27
|
|
31
|
-
extra_rdoc_files:
|
32
|
-
|
33
|
-
- Manifest.txt
|
34
|
-
- README.txt
|
28
|
+
extra_rdoc_files: []
|
29
|
+
|
35
30
|
files:
|
36
|
-
- History.txt
|
37
|
-
- init.rb
|
38
|
-
- Manifest.txt
|
39
|
-
- Rakefile
|
40
31
|
- lib/facebox_render.rb
|
41
32
|
- lib/facebox_render_helper.rb
|
42
|
-
-
|
33
|
+
- media/images/b.png
|
34
|
+
- media/images/bl.png
|
35
|
+
- media/images/br.png
|
36
|
+
- media/images/closelabel.gif
|
37
|
+
- media/images/loading.gif
|
38
|
+
- media/images/tl.png
|
39
|
+
- media/images/tr.png
|
40
|
+
- media/javascripts/facebox.js
|
41
|
+
- media/javascripts/facebox.pack.js
|
42
|
+
- media/stylesheets/facebox.css
|
43
|
+
- README.rdoc
|
44
|
+
- init.rb
|
45
|
+
- install.rb
|
43
46
|
has_rdoc: true
|
44
|
-
homepage:
|
47
|
+
homepage:
|
48
|
+
licenses: []
|
49
|
+
|
45
50
|
post_install_message:
|
46
|
-
rdoc_options:
|
47
|
-
|
48
|
-
- README.txt
|
51
|
+
rdoc_options: []
|
52
|
+
|
49
53
|
require_paths:
|
50
54
|
- lib
|
51
55
|
required_ruby_version: !ruby/object:Gem::Requirement
|
56
|
+
none: false
|
52
57
|
requirements:
|
53
58
|
- - ">="
|
54
59
|
- !ruby/object:Gem::Version
|
60
|
+
segments:
|
61
|
+
- 0
|
55
62
|
version: "0"
|
56
|
-
version:
|
57
63
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
64
|
+
none: false
|
58
65
|
requirements:
|
59
66
|
- - ">="
|
60
67
|
- !ruby/object:Gem::Version
|
68
|
+
segments:
|
69
|
+
- 0
|
61
70
|
version: "0"
|
62
|
-
version:
|
63
71
|
requirements: []
|
64
72
|
|
65
|
-
rubyforge_project:
|
66
|
-
rubygems_version: 1.
|
73
|
+
rubyforge_project:
|
74
|
+
rubygems_version: 1.3.7
|
67
75
|
signing_key:
|
68
|
-
specification_version:
|
69
|
-
summary:
|
76
|
+
specification_version: 3
|
77
|
+
summary: FaceboxRender is a Rails plugin let you use lightbox seamlessly using Facebox library (http://famspam.com/facebox/)
|
70
78
|
test_files: []
|
71
79
|
|
data/History.txt
DELETED
data/Manifest.txt
DELETED
data/README.txt
DELETED
@@ -1,55 +0,0 @@
|
|
1
|
-
Author:: Wen-Tien Chang(mailto:ihower@handlino.com)
|
2
|
-
Copyright:: Copyright (c) 2008 Handlino Inc.
|
3
|
-
Licensed under the MIT: http://www.opensource.org/licenses/mit-license.php
|
4
|
-
|
5
|
-
== Description ==
|
6
|
-
FaceboxRender plugin let you use lightbox seamlessly using Facebox library.
|
7
|
-
http://handlino.com/blog/2008/02/26/57/
|
8
|
-
|
9
|
-
== Install ==
|
10
|
-
* download from http://github.com/ihower/facebox-render/
|
11
|
-
* uncompress to /vendor/plugins/facebox_render
|
12
|
-
|
13
|
-
Note that you must install Facebox first(see http://famspam.com/facebox/).
|
14
|
-
|
15
|
-
1.Download jQuery (or you can try to install http://ennerchi.com/projects/jrails to replace Prototype library totally)
|
16
|
-
2.Download facebox
|
17
|
-
3.Copy facebox js file to /public/javascripts/
|
18
|
-
4.Copy facebox css file to /public/styleshees/
|
19
|
-
5.Copy facebox all image files to /public/facebox/
|
20
|
-
6.Config your layout (stylesheet_link_tag and javascript_include_tag) to add these js,css files
|
21
|
-
|
22
|
-
= USAGE =
|
23
|
-
|
24
|
-
== Helper ==
|
25
|
-
We have facebox_link_to helper (it's will launch loading facebox first, send ajax request second)
|
26
|
-
or you can use link_to_remote, form_remote_tag...etc Ajax helper.
|
27
|
-
Don't use <a href="somelink" ref="facebox">
|
28
|
-
|
29
|
-
== Controller ==
|
30
|
-
Add "include FaceboxRender" to your controller,
|
31
|
-
or simply put it at /app/controllers/application.rb
|
32
|
-
|
33
|
-
Then in your action:
|
34
|
-
|
35
|
-
respond_to do |format|
|
36
|
-
format.html
|
37
|
-
format.js { render_to_facebox }
|
38
|
-
end
|
39
|
-
|
40
|
-
By Default render the html without layout,
|
41
|
-
otherwise you can pass options[:template], options[:action], options[:partial] or options[:html] string.
|
42
|
-
Passing options[:msg] will pulsate a message.
|
43
|
-
|
44
|
-
If block given, it will yield after facebox script, eg:
|
45
|
-
|
46
|
-
render_to_facebox do |page|
|
47
|
-
page << "alert('test')"
|
48
|
-
end
|
49
|
-
|
50
|
-
Besides render_facebox, we have close_facebox, redirect_from_facebox.
|
51
|
-
|
52
|
-
respond_to do |format|
|
53
|
-
format.html
|
54
|
-
format.js { close_facebox }
|
55
|
-
end
|
data/Rakefile
DELETED
@@ -1,11 +0,0 @@
|
|
1
|
-
# -*- ruby -*-
|
2
|
-
|
3
|
-
require 'rubygems'
|
4
|
-
require 'hoe'
|
5
|
-
|
6
|
-
Hoe.new('facebox-render', '0.9.5') do |p|
|
7
|
-
p.rubyforge_name = 'facebox-render' # if different than lowercase project name
|
8
|
-
p.developer('Wen-Tien Chang', 'ihower@handlino.com')
|
9
|
-
end
|
10
|
-
|
11
|
-
# vim: syntax=Ruby
|