Download as
Browse Code »

Commit f920d2dd2ad3555aff926715ecf932831cfa8385

Authored by Moises Machado
Committed by Antonio Terceiro
1 parent 08f5a543
Exists in master and in 29 other branches add_member_task_reject_details, admin_visible_profile, article-list-template, community_notifications, contact_admin_translation, event_fixes, fix_comments_pagination, fix_rails4_organization_ratings, fix_sign_up_form, follow_step_fix, forum_topic_creation, mirror_block_improvements, multi_env_on_remote_user, new_security, noosfero_spb_ci, organization_ratings_improvements, organization_ratings_link_to_profile_stable-spb-1.3, organization_ratings_translations_fix, profile_api_improvements, ratings_minor_fixes, remote_user_fix, send_email_to_admins, stable-spb-1.3, stable-spb-1.3-fixes, stable-spb-1.4, stable-spb-1.5, suggest_rejected_value, web_steps_improvements, xss_terminate_custom_options

ActionItem929: changed gallery to picachoose

Showing 15 changed files with 595 additions and 848 deletions   Show diff stats
app/controllers/public/content_viewer_controller.rb
  Diff comments   View file @f920d2d
@@ -87,6 +87,9 @@ class ContentViewerController < ApplicationController @@ -87,6 +87,9 @@ class ContentViewerController < ApplicationController
87 end 87 end
88 88
89 @comments = @page.comments(true) 89 @comments = @page.comments(true)
  90 + if params[:slideshow]
  91 + render :action => 'slideshow', :layout => 'slideshow'
  92 + end
90 end 93 end
91 94
92 protected 95 protected
app/views/content_viewer/image_gallery.rhtml
  Diff comments   View file @f920d2d
1 <div class="image-gallery"> 1 <div class="image-gallery">
2 - <% if params[:slideshow] %>  
3 - <p><%= button('', _('View as gallery'), @page.url)%></p>  
4 -  
5 - <div id='slideshow' >  
6 - <% @images.each do |img| %>  
7 - <%= image_tag(url_for(img.url), :alt => (img.abstract.blank? ? img.name : img.abstract)) if img.image? %>  
8 - <% end %>  
9 - </div>  
10 -  
11 - <link href="/javascripts/jquery.aslideshow/simple/styles.css" media="screen" rel="stylesheet" type="text/css" />  
12 - <script type="text/javascript" src="/javascripts/jquery.aslideshow.js"></script>  
13 -  
14 - <script type="text/javascript">  
15 - //<![CDATA[  
16 - jQuery(document).ready(function(){  
17 - jQuery('#slideshow').slideshow({ width: 640, height: 480, playframe: false, play: true, controls : { hide: false }, imgresize:false, effect:false });  
18 - });  
19 - //]]>  
20 - </script>  
21 -  
22 - <% else %>  
23 - <p><%= button('', _('View as slideshow'), @page.url.merge(:slideshow => true))%></p> 2 + <p><%= button(:slideshow, _('View as slideshow'), @page.url.merge(:slideshow => true))%></p>
24 <ul> 3 <ul>
25 <% @images.each do |a| %> 4 <% @images.each do |a| %>
26 <li class="image-gallery-item"> 5 <li class="image-gallery-item">
@@ -29,7 +8,6 @@ @@ -29,7 +8,6 @@
29 </li> 8 </li>
30 <% end %> 9 <% end %>
31 </ul> 10 </ul>
32 - <% end %>  
33 <br style="clear:both" /> 11 <br style="clear:both" />
34 <%= will_paginate @images, :param_name => 'npage' %> 12 <%= will_paginate @images, :param_name => 'npage' %>
35 </div> 13 </div>
app/views/content_viewer/slideshow.rhtml 0 → 100644
  Diff comments   View file @f920d2d
@@ -0,0 +1,8 @@ @@ -0,0 +1,8 @@
  1 +<p class='back-button' ><%= button('', _('Back to gallery'), @page.url)%></p>
  2 +<ul id='slideshow' >
  3 + <% @images.each do |img| -%>
  4 + <% if img.image? -%>
  5 + <li><%= image_tag(url_for(img.url), :title => (img.abstract.blank? ? img.name : img.abstract)) %></li>
  6 + <% end -%>
  7 + <% end unless @images.blank? -%>
  8 +</ul>
app/views/layouts/slideshow.rhtml 0 → 100644
  Diff comments   View file @f920d2d
@@ -0,0 +1,32 @@ @@ -0,0 +1,32 @@
  1 +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2 + "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3 +<html>
  4 + <head>
  5 + <title><%=
  6 + (@page ? @page.name + ' - ' : '') +
  7 + (@profile ? @profile.name + ' - ' : '') +
  8 + @environment.name +
  9 + (@category ? "&rarr; #{@category.full_name}" : '')
  10 + %></title>
  11 +
  12 + <%= stylesheet_import "slideshow" %>
  13 + <%= javascript_include_tag 'jquery-latest', 'sliderjs', 'pikachoose' %>
  14 + <script language="javascript">
  15 + <!--
  16 + $(document).ready(function (){
  17 + $("#slideshow").PikaChoose();
  18 + $("#slideshow").SliderJS({
  19 + window_width: 320,
  20 + window_height: 55,
  21 + list_width: 832,
  22 + pikachoose: true,
  23 + auto_play: false
  24 + });
  25 + });
  26 + -->
  27 + </script>
  28 + </head>
  29 + <body>
  30 + <%= yield %>
  31 + </body>
  32 +</html>
public/designs/icons/default/slideshow.gif 0 → 100644
View file @f920d2d

589 Bytes
public/designs/icons/default/style.css
  Diff comments   View file @f920d2d
@@ -55,3 +55,4 @@ @@ -55,3 +55,4 @@
55 .icon-menu-people { background-image: url(album-HC.gif) } 55 .icon-menu-people { background-image: url(album-HC.gif) }
56 .icon-menu-mail { background-image: url(mail-HC.gif) } 56 .icon-menu-mail { background-image: url(mail-HC.gif) }
57 .icon-upload-file { background-image: url(go-up-HC.gif) } 57 .icon-upload-file { background-image: url(go-up-HC.gif) }
  58 +.icon-slideshow { background-image: url(slideshow.gif) }
public/javascripts/jquery.aslideshow.js
View file @08f5a54
@@ -1,645 +0,0 @@ @@ -1,645 +0,0 @@
1 -/**  
2 - * jQuery (a)Slideshow plugin  
3 - *  
4 - * Copyright (c) 2008 Trent Foley  
5 - * Dual licensed under the MIT (MIT-LICENSE.txt)  
6 - * and GPL (GPL-LICENSE.txt) licenses.  
7 - *  
8 - * @author Anton Shevchuk AntonShevchuk@gmail.com  
9 - * @version 0.5.5  
10 - */  
11 -;(function($) {  
12 - defaults = {  
13 - width:320, // width in px  
14 - height:240, // height in px  
15 - index:0, // start from frame number N  
16 - time:3000, // time out beetwen slides  
17 - title:true, // show title  
18 - titleshow:false,// always show title  
19 - panel:true, // show controls panel  
20 - play:false, // play slideshow  
21 - loop:true,  
22 - effect:'fade', // aviable fade, scrollUp/Down/Left/Right, zoom, zoomFade, growX, growY  
23 - effecttime:1000,// aviable fast,slow,normal and any valid fx speed value  
24 - filter:true, // remove <br/>, empty <div>, <p> and other stuff  
25 - nextclick:false, // bind content click next slide  
26 - playclick:false, // bind content click play/stop  
27 - playhover:false, // bind content hover play/stop  
28 - playhoverr:false, // bind content hover stop/play (reverse of playhover)  
29 - playframe:true, // show frame "Play Now!"  
30 - fullscreen:false, // in full window size  
31 - imgresize:false, // resize image to slideshow window  
32 - imgcenter:true, // set image to center // TODO  
33 - imgajax:true, // load images from links  
34 - linkajax:false, // load html from links  
35 - help:'Plugin homepage: <a href="http://slideshow.hohli.com">(a)Slideshow</a><br/>'+  
36 - 'Author homepage: <a href="http://anton.shevchuk.name">Anton Shevchuk</a>',  
37 -  
38 - controls :{ // show/hide controls elements  
39 - 'hide':true, // show controls bar on mouse hover  
40 - 'first':true, // goto first frame  
41 - 'prev':true, // goto previouse frame (if it first go to last)  
42 - 'play':true, // play slideshow  
43 - 'next':true, // goto next frame (if it last go to first)  
44 - 'last':true, // goto last frame  
45 - 'help':true, // show help message  
46 - 'counter':true // show slide counter  
47 - }  
48 - };  
49 - /**  
50 - * Create a new instance of slideshow.  
51 - *  
52 - * @classDescription This class creates a new slideshow and manipulate it  
53 - *  
54 - * @return {Object} Returns a new slideshow object.  
55 - * @constructor  
56 - */  
57 - $.fn.slideshow = function(settings) {  
58 -  
59 - var _slideshow = this;  
60 -  
61 - /*  
62 - * Construct  
63 - */  
64 - this.each(function(){  
65 -  
66 - var ext = $(this);  
67 -  
68 - this.playFlag = false;  
69 - this.playId = null;  
70 - this.length = 0;  
71 - this.inited = new Array();  
72 -  
73 - /**  
74 - * Build Html  
75 - * @method  
76 - */  
77 - this.build = function () {  
78 - var _self = this;  
79 -  
80 - ext.wrapInner('<div class="slideshow"><div class="slideshow-content"></div></div>');  
81 - ext = ext.find('.slideshow');  
82 -  
83 - // filter content  
84 - if (this.options.filter) {  
85 - ext.find('.slideshow-content > br').remove();  
86 - ext.find('.slideshow-content > p:empty').remove();  
87 - ext.find('.slideshow-content > div:empty').remove();  
88 - }  
89 -  
90 -  
91 - // fullscreen  
92 - if (this.options.fullscreen) {  
93 - $('body').css({overflow:'hidden', padding:0});  
94 -  
95 - this.options.width = $(window).width();  
96 - this.options.height = ($(window).height()>$(document).height())?$(window).height():$(document).height();  
97 -  
98 -// this.options.width = this.options.width;  
99 -// this.options.height = this.options.height;  
100 -  
101 - ext.addClass('slideshow-fullscreen');  
102 - }  
103 -  
104 - this.length = ext.find('.slideshow-content > *').length;  
105 -  
106 - // build title  
107 - if (this.options.title) {  
108 - ext.prepend('<div class="slideshow-label-place"><div class="slideshow-label slideshow-opacity"></div></div>');  
109 -  
110 - if (!this.options.titleshow) {  
111 - ext.find('.slideshow-label-place').hover(function(){  
112 - $(this).find('.slideshow-label').fadeIn();  
113 - }, function() {  
114 - $(this).find('.slideshow-label').fadeOut();  
115 - });  
116 - ext.find('.slideshow-label').hide();  
117 - }  
118 -  
119 -  
120 - ext.find('.slideshow-label-place').css('width', this.options.width);  
121 - }  
122 -  
123 - // build panel  
124 - if (this.options.panel) {  
125 - ext.append('<div class="slideshow-panel-place"><div class="slideshow-panel slideshow-opacity"></div></div>');  
126 - panel = ext.find('.slideshow-panel');  
127 - if (this.options.controls.first)  
128 - panel.append('<a class="first slideshowbutton" href="#first">First</a>');  
129 -  
130 - if (this.options.controls.prev)  
131 - panel.append('<a class="prev slideshowbutton" href="#prev">Prev</a>');  
132 -  
133 - if (this.options.controls.play)  
134 - panel.append('<a class="play slideshowbutton" href="#play">Play</a>');  
135 -  
136 - if (this.options.controls.next)  
137 - panel.append('<a class="next slideshowbutton" href="#next">Next</a>');  
138 -  
139 - if (this.options.controls.last)  
140 - panel.append('<a class="last slideshowbutton" href="#last">Last</a>');  
141 -  
142 - if (this.options.controls.help) {  
143 - panel.append('<a class="help slideshowbutton" href="#help">Help</a>');  
144 - panel.prepend('<div class="slideshow-help">'+this.options.help+'</div>');  
145 -  
146 -// panel.find('.slideshow-help').css('width', this.options.width - 4 + 'px');  
147 - }  
148 -  
149 -  
150 - if (this.options.controls.counter) {  
151 - panel.append('<span class="counter">'+(this.options.index+1)+' / '+this.length+'</span>');  
152 - }  
153 -  
154 - if (this.options.controls.hide) {  
155 - ext.find('.slideshow-panel-place').hover(function(){  
156 - $(this).find('.slideshow-panel').fadeIn();  
157 - }, function() {  
158 - $(this).find('.slideshow-panel').fadeOut();  
159 - });  
160 - panel.hide();  
161 - }  
162 -  
163 -  
164 - ext.find('.slideshow-panel-place').css('width', this.options.width);  
165 - }  
166 -  
167 - /**  
168 - * Set Size Options  
169 - */  
170 - ext.css('width', this.options.width + 'px');  
171 -// ext.css('height', this.options.height + 'px');  
172 -  
173 - ext.find('.slideshow-content').css('width', this.options.width);  
174 - ext.find('.slideshow-content').css('height', this.options.height);  
175 -  
176 - /**  
177 - * Change children styles  
178 - */  
179 - ext.find('.slideshow-content > *').each(function(){  
180 - _self._build($(this));  
181 - });  
182 -  
183 - // init slide (replace by ajax etc)  
184 - this.init(this.options.index);  
185 -  
186 - // hide all slides  
187 - ext.find('.slideshow-content > *:not(:eq('+this.options.index+'))').hide();  
188 -  
189 - // show label  
190 - this.label();  
191 -  
192 - // add playframe  
193 - if (this.options.playframe) {  
194 - ext.find('.slideshow-content').append('<div class="slideshow-shadow slideshow-opacity"><div class="slideshow-frame"></div></div>');  
195 - }  
196 -  
197 - // bind all events  
198 - this.events();  
199 -  
200 - return true;  
201 - };  
202 -  
203 - /**  
204 - * Change CSS for every entity  
205 - */  
206 - this._build = function(el){  
207 - el.css({margin :0,  
208 - position: 'absolute',  
209 - left: (this.options.width/2 - el.attr('width')/2),  
210 - top : (this.options.height/2 - el.attr('height')/2),  
211 - overflow:'hidden'  
212 - });  
213 -  
214 - if (el.is('img') && this.options.imgresize || el.is(':not(img)')){  
215 - el.css({width:'100%',height:'100%'});  
216 - }  
217 - };  
218 -  
219 - /**  
220 - * Bind Events  
221 - */  
222 - this.events = function() {  
223 -  
224 - var _self = this;  
225 -  
226 - /**  
227 - * Go to next slide on content click (optional)  
228 - */  
229 - if (_self.options.nextclick)  
230 - ext.find('.slideshow-content').click(function(){  
231 - _self.stop();  
232 - _self.next();  
233 - return false;  
234 - });  
235 -  
236 - /**  
237 - * Goto first slide button  
238 - */  
239 - if (this.options.controls.first)  
240 - ext.find('a.first').click(function(){  
241 - _self.stop();  
242 - _self.goSlide(0);  
243 - return false;  
244 - });  
245 -  
246 - /**  
247 - * Goto previouse slide button  
248 - */  
249 - if (this.options.controls.prev)  
250 - ext.find('a.prev').click(function(){  
251 - _self.stop();  
252 - _self.prev();  
253 - return false;  
254 - });  
255 -  
256 - /**  
257 - * Play slideshow button  
258 - */  
259 - if (this.options.controls.play)  
260 - ext.find('a.play').click(function(){  
261 - if (_self.playFlag) {  
262 - _self.stop();  
263 - } else {  
264 - _self.play();  
265 - }  
266 - return false;  
267 - });  
268 -  
269 - /**  
270 - * Goto next slide button  
271 - */  
272 - if (this.options.controls.next)  
273 - ext.find('a.next').click(function(){  
274 - _self.stop();  
275 - _self.next();  
276 - return false;  
277 - });  
278 -  
279 - /**  
280 - * Goto last slide button  
281 - */  
282 - if (this.options.controls.last)  
283 - ext.find('a.last').click(function(){  
284 - _self.stop();  
285 - _self.goSlide(_self.length-1);  
286 - return false;  
287 - });  
288 -  
289 - /**  
290 - * Show help message  
291 - */  
292 - if (this.options.controls.help)  
293 - ext.find('a.help').click(function(){  
294 - _self.stop();  
295 - ext.find('.slideshow-help').slideToggle();  
296 - return false;  
297 - });  
298 -  
299 - /**  
300 - * Show playframe  
301 - */  
302 - if (this.options.playframe)  
303 - ext.find('.slideshow-frame').click(function(){  
304 - ext.find('.slideshow-frame').remove();  
305 - ext.find('.slideshow-shadow').remove();  
306 -  
307 - if (_self.options.playclick)  
308 - setTimeout(function(ms){ _self.play() }, _self.options.time);  
309 - return false;  
310 - });  
311 -  
312 - /**  
313 - * Play/stop on slideshow hover  
314 - */  
315 - if (this.options.playhover)  
316 - ext.hover(function(){  
317 - if (!_self.playFlag) {  
318 - _self.play();  
319 - }  
320 - }, function(){  
321 - if (_self.playFlag) {  
322 - _self.stop();  
323 - }  
324 - });  
325 -  
326 -  
327 - /**  
328 - * Stop/Play on slideshow hover  
329 - */  
330 - if (this.options.playhoverr)  
331 - ext.hover(function(){  
332 - if (_self.playFlag) {  
333 - _self.stop();  
334 - }  
335 - }, function(){  
336 - if (!_self.playFlag) {  
337 - _self.play();  
338 - }  
339 - });  
340 - };  
341 -  
342 - /**  
343 - * Find and show label of slide  
344 - * @method  
345 - */  
346 - this.label = function () {  
347 - if (!this.options.title) return false;  
348 -  
349 - label = '';  
350 -  
351 - current = ext.find('.slideshow-content > *:eq('+this.options.index +')');  
352 -  
353 - if (current.attr('alt')) {  
354 - label = current.attr('alt');  
355 - } else if (current.attr('title')) {  
356 - label = current.attr('title');  
357 - }else if (current.find('label:first').length>0) {  
358 - current.find('label:first').hide();  
359 - label = current.find('label:first').html();  
360 - }  
361 -  
362 - ext.find('.slideshow-label').html(label);  
363 - };  
364 -  
365 - /**  
366 - * Goto previous slide  
367 - * @method  
368 - */  
369 - this.prev = function () {  
370 - if (this.options.index == 0) {  
371 - i = (this.length-1);  
372 - } else {  
373 - i = this.options.index - 1;  
374 - }  
375 -  
376 - this.goSlide(i);  
377 - };  
378 -  
379 -  
380 - /**  
381 - * Play Slideshow  
382 - * @method  
383 - */  
384 - this.play = function () {  
385 - var _self = this;  
386 - this.playFlag = true;  
387 - this.playId = setTimeout(function(ms){ _self._play() }, this.options.time);  
388 - ext.find('a.play').addClass('stop');  
389 - };  
390 -  
391 - /**  
392 - * Play Slideshow  
393 - * @method  
394 - */  
395 - this._play = function () {  
396 - var _self = this;  
397 - this.next();  
398 - if (this.playFlag) {  
399 - if (this.options.index == (this.length-1) && !this.options.loop) { this.stop();return false; }  
400 - this.playId = setTimeout(function(ms){ _self._play() }, this.options.time);  
401 - }  
402 - };  
403 -  
404 - /**  
405 - * Stop Slideshow  
406 - * @method  
407 - */  
408 - this.stop = function () {  
409 - ext.find('a.play').removeClass('stop');  
410 - this.playFlag = false;  
411 - clearTimeout(this.playId);  
412 - };  
413 -  
414 - /**  
415 - * Goto next slide  
416 - * @method  
417 - */  
418 - this.next = function () {  
419 - if (this.options.index == (this.length-1)) {  
420 - i = 0;  
421 - } else {  
422 - i = this.options.index + 1;  
423 - }  
424 - this.goSlide(i);  
425 - };  
426 -  
427 - /**  
428 - * Init N-slide  
429 - * @method  
430 - * @param {Integer} n  
431 - */  
432 - this.init = function (index) {  
433 - // initialize only ones  
434 - for (var i = 0, loopCnt = this.inited.length; i < loopCnt; i++) {  
435 - if (this.inited[i] === index) {  
436 - return true;  
437 - }  
438 - }  
439 -  
440 - // index to inited stack  
441 - this.inited.push(index);  
442 -  
443 - // current slide  
444 - slide = ext.find('.slideshow-content > *:eq('+index+')');  
445 -  
446 - var _self = this;  
447 - /**  
448 - * Replace A to content from HREF  
449 - */  
450 - if (slide.get(0).tagName == 'A') {  
451 - var href = slide.attr('href');  
452 -  
453 - var title = slide.attr('title');  
454 - title = title.replace(/\"/i,'\''); // if you use single quotes for tag attribs  
455 -  
456 - var domain = document.domain;  
457 - domain = domain.replace(/\./i,"\."); // for strong check domain name  
458 -  
459 - var reimage = new RegExp("\.(png|gif|jpg|jpeg|svg)$", "i");  
460 - var relocal = new RegExp("^((https?:\/\/"+domain+")|(?!http:\/\/))", "i");  
461 -  
462 -  
463 - if (this.options.imgajax && reimage.test(href)) {  
464 - slide.replaceWith('<img src="'+href+'" alt="'+title+'"/>');  
465 - } else if (this.options.linkajax && relocal.test(href)) {  
466 - $.get(href, function(data){  
467 - slide.replaceWith('<div><label>'+title+'</label>'+data+'</div>');  
468 - });  
469 - } else { // nothing else  
470 -// slide.wrap('<p></p>');  
471 - }  
472 -  
473 - slide = ext.find('.slideshow-content > *:eq('+index+')');  
474 -  
475 - // reset css  
476 - this._build(slide);  
477 - }  
478 -  
479 - /**  
480 - * Play/stop on content click (like image and other)  
481 - */  
482 - if (this.options.playclick)  
483 - $(slide).click(function(){  
484 - if (_self.playFlag) {  
485 - _self.stop();  
486 - } else {  
487 - _self.play();  
488 - }  
489 - return false;  
490 - });  
491 - };  
492 -  
493 - /**  
494 - * Goto N-slide  
495 - * @method  
496 - * @param {Integer} n  
497 - */  
498 - this.goSlide = function (n) {  
499 -  
500 - if (this.options.index == n) return;  
501 -  
502 - this.init(n);  
503 -  
504 - var next = ext.find('.slideshow-content > *:eq('+n+')');  
505 - var prev = ext.find('.slideshow-content > *:eq('+this.options.index+')');  
506 -  
507 - // restore next slide after all effects, set z-index = 0 for prev slide  
508 - prev.css({zIndex:0});  
509 - if (this.options.imgresize) {  
510 - next.css({zIndex:1, top: 0, left: 0, opacity: 1, width: this.options.width, height: this.options.height});  
511 - } else {  
512 - next.css({zIndex:1, top: (this.options.height/2 - next.attr('height')/2), left: (this.options.width/2 - next.attr('width')/2), opacity: 1});  
513 - }  
514 -  
515 - this.options.index = n;  
516 -  
517 - if (this.options.effect == 'random' ) {  
518 - var r = Math.random();  
519 - r = Math.floor(r*12);  
520 - } else {  
521 - r = -1;  
522 - }  
523 - // effect between slides  
524 - switch (true) {  
525 - case (this.options.effect == 'scrollUp' || r == 0):  
526 - prev.css({width:'100%'});  
527 - next.css({top:0, height:0});  
528 -  
529 - prevAni = {height: 0, top:this.options.height};  
530 - break;  
531 - case (this.options.effect == 'scrollDown' || r == 1):  
532 - prev.css({width:'100%'});  
533 - next.css({top:this.options.height,height:0});  
534 -  
535 - prevAni = {height: 0, top:0};  
536 - break;  
537 - case (this.options.effect == 'scrollRight' || r == 2):  
538 - prev.css({right:0,left:'',height:'100%'});  
539 - next.css({right:'',left:0,height:'100%',width:'0%'});  
540 -  
541 - prevAni = {width: 0};  
542 - break;  
543 - case (this.options.effect == 'scrollLeft' || r == 3):  
544 - prev.css({right:'',left:0,height:'100%'});  
545 - next.css({right:0,left:'',height:'100%',width:'0%'});  
546 -  
547 - prevAni = {width: 0};  
548 - break;  
549 - case (this.options.effect == 'growX' || r == 4):  
550 - next.css({zIndex:2,opacity: 1,left: this.options.width/2, width: '0%', height:'100%'});  
551 -  
552 - prevAni = {opacity: 0.8};  
553 - break;  
554 -  
555 - case (this.options.effect == 'growY' || r == 5):  
556 - next.css({opacity: 1,top: this.options.height/2, width:'100%', height: '0%'});  
557 -  
558 - prevAni = {opacity: 0.8};  
559 - break;  
560 -  
561 - case (this.options.effect == 'zoom' || r == 6):  
562 - next.css({width: 0, height: 0, top: this.options.height/2, left: this.options.width/2});  
563 -  
564 - prevAni = {width: 0, height: 0, top: this.options.height/2, left: this.options.width/2};  
565 - break;  
566 -  
567 - case (this.options.effect == 'zoomFade' || r == 7):  
568 - next.css({zIndex:1, opacity: 0,width: 0, height: 0, top: this.options.height/2, left: this.options.width/2});  
569 -  
570 - prevAni = {opacity: 0, width: 0, height: 0, top: this.options.height/2, left: this.options.width/2};  
571 - break;  
572 -  
573 - case (this.options.effect == 'zoomTL' || r == 8):  
574 - next.css({zIndex:1, opacity: 0,width: this.options.width/2, height: this.options.height/2, top:0, left: 0});  
575 -  
576 - prevAni = {opacity: 0, width: 0, height: 0, top: this.options.height, left: this.options.width};  
577 - break;  
578 - case (this.options.effect == 'zoomBR' || r == 9):  
579 - next.css({zIndex:1, opacity: 0,width: this.options.width/2, height: this.options.height/2, top: this.options.height/2, left: this.options.width/2});  
580 -  
581 - prevAni = {opacity: 0, width: 0, height: 0, top: 0, left: 0};  
582 - break;  
583 - case (this.options.effect == 'fade' || r == 10):  
584 - default:  
585 - prev.css({zIndex:0, opacity: 1});  
586 - next.css({zIndex:1, opacity: 0});  
587 -  
588 - prevAni = {opacity: 0};  
589 - break;  
590 - }  
591 -  
592 - var _self = this;  
593 -  
594 - prev.animate(prevAni,this.options.effecttime);  
595 -  
596 - // play next slide animation, hide prev slide, update label, update counter  
597 - next.show().animate({opacity: 1}, this.options.effecttime, function () { prev.hide(); _self.label(); _self.counter(); });  
598 - };  
599 -  
600 - /**  
601 - * Update counter data  
602 - * @method  
603 - */  
604 - this.counter = function () {  
605 - if (this.options.controls.counter)  
606 - ext.find('.slideshow-panel span.counter').html((this.options.index+1) + ' / ' + this.length);  
607 -  
608 - };  
609 -  
610 - // Now initialize the slideshow  
611 - this.options = $.extend({}, defaults, settings);  
612 -  
613 - if (typeof(settings) != 'undefined') {  
614 - if (typeof(settings.controls) != 'undefined')  
615 - this.options.controls = $.extend({}, defaults.controls, settings.controls);  
616 - }  
617 -  
618 - this.build();  
619 -  
620 - /**  
621 - * Show slideshow  
622 - */  
623 - ext.show();  
624 -  
625 - /**  
626 - * Check play option  
627 - */  
628 - if (this.options.play) {  
629 - this.play();  
630 - }  
631 -  
632 - return ext;  
633 - });  
634 -  
635 - /**  
636 - * external functions - append to $  
637 - */  
638 - _slideshow.playSlide = function(){ _slideshow.each(function () { this.play(); }) };  
639 - _slideshow.stopSlide = function(){ _slideshow.each(function () { this.stop(); }) };  
640 - _slideshow.nextSlide = function(){ _slideshow.each(function () { this.next(); }) };  
641 - _slideshow.prevSlide = function(){ _slideshow.each(function () { this.prev(); }) };  
642 -  
643 - return this;  
644 - }  
645 -})(jQuery);  
public/javascripts/jquery.aslideshow/simple/images/big-play.png
View file @08f5a54

17.3 KB
public/javascripts/jquery.aslideshow/simple/images/buttons.png
View file @08f5a54

4.9 KB
public/javascripts/jquery.aslideshow/simple/styles.css
View file @08f5a54
@@ -1,180 +0,0 @@ @@ -1,180 +0,0 @@
1 -.slideshow, .slideshow-label, .slideshow-content, .slideshow-panel {  
2 - font:12px Verdana, Tahoma, sans-serif;  
3 -}  
4 -  
5 -.slideshow {  
6 - padding:0;  
7 - border:0;  
8 - position:relative;  
9 - display:none; /* Set to "none" for not preview slideshow content */  
10 -}  
11 -  
12 -.slideshow-fullscreen {  
13 - position:absolute;  
14 - top:0;  
15 - left:0;  
16 - padding:0;  
17 - border:0;  
18 - overflow:hidden;  
19 -}  
20 -  
21 -.slideshow-label-place {  
22 - padding:0;  
23 - position:absolute;  
24 - top:0px;  
25 - left:0px;  
26 - z-index:100;  
27 - height:30px;  
28 -}  
29 - .slideshow-label {  
30 - z-index:101;  
31 - color:#fff;  
32 - width:100%;  
33 - height:100%;  
34 - line-height:30px;  
35 - text-indent:8px;  
36 - font-weight:bold  
37 - }  
38 -  
39 -.slideshow-panel-place {  
40 - padding:0;  
41 - position:absolute;  
42 - bottom:-29px;  
43 - left:0px;  
44 - z-index:100;  
45 - height:28px;  
46 -}  
47 -  
48 -  
49 - .slideshow-panel {  
50 - z-index:101;  
51 - width:100%;  
52 - height:100%;  
53 - }  
54 -  
55 - .slideshow-panel a.slideshowbutton {  
56 - display: block;  
57 - width:26px;  
58 - height:26px;  
59 - float:left;  
60 - text-indent:-99999%;  
61 - overflow:hidden;  
62 - outline: 0; /* @ Firefox, prevent dotted border after click */  
63 - background-image:url(images/buttons.png);  
64 - background-repeat:no-repeat;  
65 - border:1px solid transparent  
66 - }  
67 -  
68 - .slideshow-panel a.slideshowbutton:hover {  
69 - border:1px solid #777;  
70 - }  
71 -  
72 -  
73 - .slideshow-panel a.first {  
74 - background-position: 0 0  
75 - }  
76 -  
77 - .slideshow-panel a.prev {  
78 - background-position: -24px 0  
79 - }  
80 -  
81 - .slideshow-panel a.play {  
82 - background-position: -48px 0  
83 - }  
84 -  
85 - .slideshow-panel a.stop {  
86 - background-position: -72px 0  
87 - }  
88 -  
89 - .slideshow-panel a.next {  
90 - background-position: -96px 0  
91 - }  
92 -  
93 - .slideshow-panel a.last {  
94 - background-position: -120px 0  
95 - }  
96 -  
97 - .slideshow-panel a.help {  
98 - position:relative;  
99 - background-position: -144px 0  
100 - }  
101 -  
102 - .slideshow-panel span.counter {  
103 - float:right;  
104 - display: block;  
105 - /*width:26px;*/  
106 - height:26px;  
107 - line-height:26px;  
108 - padding:0 4px;  
109 - color: white;  
110 - }  
111 -  
112 -  
113 -.slideshow-help {  
114 - position:absolute;  
115 - bottom:28px;  
116 - left:0px;  
117 - z-index:101;  
118 - background-color:#ff9;  
119 - display:none;  
120 - opacity: 0.9;  
121 - width:100%;  
122 -}  
123 -  
124 -.slideshow-content {  
125 - padding:0;  
126 - background-color:#fff;  
127 - color:#333;  
128 - overflow:hidden;  
129 - position:relative;  
130 - width:100%;  
131 - height:100%;  
132 -}  
133 -  
134 - /* Some Content Changes */  
135 - .slideshow-content p {  
136 - padding:0;  
137 - overflow:auto;  
138 - }  
139 -  
140 -.slideshow-frame {  
141 - position:absolute;  
142 - top:0px;  
143 - left:0px;  
144 - background:url(images/big-play.png) 50% 50% no-repeat;  
145 - z-index:201;  
146 - cursor:pointer;  
147 - width:100%;  
148 - height:100%;  
149 -}  
150 -  
151 -.slideshow-shadow{  
152 - position:absolute;  
153 - top:0px;  
154 - left:0px;  
155 - z-index:200;  
156 - width:100%;  
157 - height:100%;  
158 -}  
159 -  
160 -.slideshow-opacity{  
161 - background-color: black;  
162 -}  
163 - *:first-child+html .slideshow-opacity, * html .slideshow-opacity {  
164 - zoom:1;  
165 - background:#000;  
166 - filter:alpha(opacity=50);  
167 - }  
168 - * html .slideshow-opacity {  
169 - zoom:1;  
170 - background:#000;  
171 - filter:alpha(opacity=50);  
172 - }  
173 -  
174 - *:first-child+html .slideshow-opacity *{  
175 - position:relative;  
176 - }  
177 -  
178 - * html .slideshow-opacity *{  
179 - position:relative;  
180 - }  
public/javascripts/pikachoose.js 0 → 100644
  Diff comments   View file @f920d2d
@@ -0,0 +1,275 @@ @@ -0,0 +1,275 @@
  1 +/* 1/13/2009
  2 + PikaChoose
  3 + Jquery plugin for photo galleries
  4 + Copyright (C) 2009 Jeremy Fry
  5 +
  6 + This program is free software: you can redistribute it and/or modify
  7 + it under the terms of the GNU General Public License as published by
  8 + the Free Software Foundation, either version 3 of the License, or
  9 + (at your option) any later version.
  10 +
  11 + This program is distributed in the hope that it will be useful,
  12 + but WITHOUT ANY WARRANTY; without even the implied warranty of
  13 + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  14 + GNU General Public License for more details.
  15 +
  16 + You should have received a copy of the GNU General Public License
  17 + along with this program. If not, see <http://www.gnu.org/licenses/>.
  18 +*/
  19 +
  20 +
  21 +jQuery.iPikaChoose = {
  22 + build : function(user_options)
  23 + {
  24 + var user_options;
  25 + var defaults = {
  26 + show_captions: true,
  27 + slide_enabled: true,
  28 + auto_play: true,
  29 + show_prev_next: true,
  30 + slide_speed: 5000,
  31 + thumb_width: 50,
  32 + thumb_height: 42
  33 + };
  34 +
  35 + return $(this).each(
  36 + function() {
  37 + //bring in options
  38 + var options = $.extend(defaults, user_options);
  39 + // grab our images
  40 + var $images = $(this).children('li').children('img');
  41 + //hide the images so the user doesn't see crap
  42 + $images.fadeOut(1);
  43 +
  44 + //save our list for future ref
  45 + var $ulist = $(this);
  46 + $images.each(LoadImages);
  47 + //start building structure
  48 + $(this).before("<div class='pika_main'></div>");
  49 + // houses eveything about the UL
  50 + var $main_div = $(this).prev(".pika_main");
  51 +
  52 + //add in slideshow elements when appropriate
  53 + if(options.slide_enabled){
  54 + $main_div.append("<div class='pika_play'></div>");
  55 + var $play_div = $(this).prev(".pika_main").children(".pika_play");
  56 + $play_div.html("<a class='pika_play_button'>Play</a><a class='pika_stop_button'>Stop</a>");
  57 + $play_div.fadeOut(1);
  58 + var $play_anchor = $play_div.children('a:first');
  59 + var $stop_anchor = $play_div.children('a:last');
  60 + }
  61 + //this div is used to make image and caption fade together
  62 + $main_div.append("<div class='pika_subdiv'></div>");
  63 + var $sub_div = $main_div.children(".pika_subdiv");
  64 +
  65 + //the main image we'll be using to load
  66 + $sub_div.append("<img />");
  67 + var $main_img = $sub_div.children("img");
  68 +
  69 + //create the caption div when appropriate
  70 + if(options.show_captions){
  71 + $sub_div.append("<div class='pika_caption'></div>");
  72 + var $caption_div = $sub_div.children(".pika_caption");
  73 + }
  74 +
  75 + //navigation div ALWAYS gets created, its refrenced a lot
  76 + $(this).after("<div class='pika_navigation'></div>");
  77 + var $navigation_div = $(this).next(".pika_navigation");
  78 + //fill in sub elements
  79 + $navigation_div.prepend("<a>Previous</a> :: <a>Next</a>");
  80 + var $previous_image_anchor = $navigation_div.children('a:first');
  81 + var $next_image_anchor = $navigation_div.children('a:last');
  82 +
  83 + //hide the navigation if the user doesn't want it
  84 + if(!options.show_prev_next){
  85 + $navigation_div.css("display","none");
  86 + }
  87 +
  88 + //$playing triggers the loop for the slideshow
  89 + var $playing = options.auto_play;
  90 +
  91 + $main_img.wrap("<a></a>");
  92 + var $main_link = $main_img.parent("a");
  93 +
  94 + function LoadImages(){
  95 + $(this).bind("load", function(){
  96 + //had to make a seperate function so that the thumbnails wouldn't have problems
  97 + //from beings resized before loaded, thus not h/w
  98 +
  99 + var $w = $(this).width();
  100 + var $h = $(this).height();
  101 + if($w===0){$w = $(this).attr("width");}
  102 + if($h===0){$h = $(this).attr("height");}
  103 + //grab a ratio for image to user defined settings
  104 + var $rw = options.thumb_width/$w;
  105 + var $rh = options.thumb_height/$h;
  106 +
  107 + //determine which has the smallest ratio (thus needing
  108 + //to be the side we use to scale so our whole thumb is filled)
  109 + if($rw<$rh){
  110 + //we'll use ratio later to scale and not distort
  111 + var $ratio = $rh;
  112 + var $left = (($w*$ratio-options.thumb_width)/2)*-1;
  113 + $left = Math.round($left);
  114 + //set images left offset to match
  115 + $(this).css({left:$left});
  116 + }else{
  117 + var $ratio = $rw;
  118 + //you can uncoment this lines to have the vertical picture centered
  119 + //but usually tall photos have the focal point at the top...
  120 + //var $top = (($h*$ratio-options.thumb_height)/2)*-1;
  121 + //var $top = Math.round($top);
  122 + $top = 0;
  123 + $(this).css({top:$top});
  124 + }
  125 + //use those ratios to calculate scale
  126 + var $width = Math.round($w*$ratio);
  127 + var $height = Math.round($h*$ratio);
  128 + $(this).css("position","relative");
  129 + $(this).width($width).height($height);
  130 + var imgcss={
  131 + width: $width,
  132 + height: $height
  133 + };
  134 + $(this).css(imgcss);
  135 +
  136 + $(this).fadeTo(250,0.4);
  137 + if($(this).hasClass('pika_first')){
  138 + $(this).trigger("click",["auto"]);
  139 + }
  140 + });
  141 +
  142 + //clone so the on loads will fire correctly
  143 + $(this).clone(true).insertAfter(this);
  144 +
  145 + $(this).remove();
  146 + //reset images to the clones
  147 + $images = $ulist.children('li').children('img');
  148 + }
  149 + function activate(){
  150 + //sets the intial phase for everything
  151 +
  152 + //image_click is controls the fading
  153 + $images.bind("click",image_click);
  154 + //hiding refrence to slide elements if slide is disabled
  155 + if(options.slide_enabled){
  156 + if(options.auto_play){
  157 + $playing = true;
  158 + $play_anchor.hide();
  159 + $stop_anchor.show();
  160 + }else{
  161 + $play_anchor.show();
  162 + $stop_anchor.hide();
  163 + }
  164 + }
  165 +
  166 + //resizes and centers thumbs
  167 + prep_thumbs();
  168 + //previous link to go back an image
  169 + $previous_image_anchor.bind("click",previous_image);
  170 + //ditto for forward, also the item that gets auto clicked for slideshow
  171 + $next_image_anchor.bind("click",next_image);
  172 + }//end activate function
  173 +
  174 +
  175 + function prep_thumbs(){
  176 + //now we know the first and last images
  177 + $images.filter(":last").addClass("pika_last");
  178 + $images.filter(":first").addClass("pika_first");
  179 + //parse images
  180 + $images.each(function(){
  181 + var licss = {
  182 + width: options.thumb_width+"px",
  183 + height: options.thumb_height+"px",
  184 + "list-style": "none",
  185 + overflow: "hidden"
  186 + };
  187 + $(this).parent('li').css(licss);
  188 + $(this).hover(
  189 + function(){$(this).fadeTo(250,1);},
  190 + function(){if(!$(this).hasClass("pika_selected")){$(this).fadeTo(250,0.4);}}
  191 + );
  192 + });
  193 +
  194 + }//end fix thumbs functions
  195 + function image_click(event, how){
  196 + //catch when user clicks on an image Then cancel current slideshow
  197 + if(how!="auto"){
  198 + if(options.slide_enabled){
  199 + $stop_anchor.hide();
  200 + $play_anchor.show();
  201 + $playing=false;
  202 + }
  203 + $sub_div.stop();
  204 + $sub_div.dequeue();
  205 + }
  206 + //all our image variables
  207 + var $image_source = $(this).attr("src");
  208 + var $image_link = $(this).attr("ref");
  209 + var $image_caption = $(this).attr("title");
  210 +
  211 + //fade out the old thumb
  212 + $images.filter(".pika_selected").fadeTo(250,0.4);
  213 + $images.filter(".pika_selected").removeClass("pika_selected");
  214 + //fade in the new thumb
  215 + $(this).fadeTo(250,1);
  216 + $(this).addClass("pika_selected");
  217 + //fade the old image out and the new one in
  218 + $sub_div.fadeTo(500,0.05,function(){
  219 + $main_img.attr("src",$image_source);
  220 + $main_link.attr("href", $image_link);
  221 + if(options.show_captions){$caption_div.html($image_caption);}
  222 + });
  223 + $sub_div.fadeTo(800,1,function(){
  224 + if($playing){
  225 + $(this).animate({top:0},options.slide_speed, function(){
  226 + //redudency needed here to catch the user clicking on an image during a change.
  227 + if($playing){$next_image_anchor.trigger("click",["auto"]);}
  228 + });
  229 + }
  230 + });
  231 + }//end image_click function
  232 +
  233 + function next_image(event, how){
  234 + if($images.filter(".pika_selected").hasClass("pika_last")){
  235 + $images.filter(":first").trigger("click",how);
  236 + }else{
  237 + $images.filter(".pika_selected").parent('li').next('li').children('img').trigger("click",how);
  238 + }
  239 + }//end next image function
  240 +
  241 + function previous_image(event, how){
  242 + if($images.filter(".pika_selected").hasClass("pika_first")){
  243 + $images.filter(":last").trigger("click",how);
  244 + }else{
  245 + $images.filter(".pika_selected").parent('li').prev('li').children('img').trigger("click",how);
  246 + }
  247 + }//end previous image function
  248 +
  249 + function play_button(){
  250 + $main_div.hover(
  251 + function(){$play_div.fadeIn(400);},
  252 + function(){$play_div.fadeOut(400);}
  253 + );
  254 + $play_anchor.bind("click", function(){
  255 + $playing = true;
  256 + $next_image_anchor.trigger("click",["auto"]);
  257 + $(this).hide();
  258 + $stop_anchor.show();
  259 + });
  260 + $stop_anchor.bind("click", function(){
  261 + $playing = false;
  262 + $(this).hide();
  263 + $play_anchor.show();
  264 + });
  265 + }
  266 + if(options.slide_enabled){play_button();}
  267 + activate();
  268 +
  269 + });//end return this.each
  270 + }//end build function
  271 +
  272 + //activate applies the appropriate actions to all the different parts of the structure.
  273 + //and loads the sets the first image
  274 +};//end jquery.ipikachoose
  275 +jQuery.fn.PikaChoose = jQuery.iPikaChoose.build;
public/javascripts/sliderjs.js 0 → 100644
  Diff comments   View file @f920d2d
@@ -0,0 +1,213 @@ @@ -0,0 +1,213 @@
  1 +/*The easing code was provided by George Smith. Please check out his site
  2 +as without him this would look really horrible!
  3 +http://gsgd.co.uk/sandbox/jquery/easing/
  4 +*/
  5 +
  6 +jQuery.easing.jswing = jQuery.swing;
  7 +jQuery.extend( jQuery.easing,
  8 +{
  9 + def: 'easeOutCubic',
  10 + swing: function (x, t, b, c, d) {
  11 + return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
  12 + },
  13 + easeOutCubic: function (x, t, b, c, d) {
  14 + return c*((t=t/d-1)*t*t + 1) + b;
  15 + }
  16 +});
  17 +
  18 +/*
  19 + 12/20/08
  20 + SliderJS
  21 + Jquery plugin for smooth and pretty sliding divs
  22 + Copyright (C) 2008 Jeremy Fry
  23 +
  24 + This program is free software: you can redistribute it and/or modify
  25 + it under the terms of the GNU General Public License as published by
  26 + the Free Software Foundation, either version 3 of the License, or
  27 + (at your option) any later version.
  28 +
  29 + This program is distributed in the hope that it will be useful,
  30 + but WITHOUT ANY WARRANTY; without even the implied warranty of
  31 + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  32 + GNU General Public License for more details.
  33 +
  34 + You should have received a copy of the GNU General Public License
  35 + along with this program. If not, see <http://www.gnu.org/licenses/>.
  36 +*/
  37 +
  38 +
  39 +jQuery.iSliderJS = {
  40 + build : function(user_options)
  41 + {
  42 + var defaults = {
  43 + direction:"horizontal",
  44 + list_width: 6740,
  45 + window_width: 500,
  46 + window_height: 350,
  47 + pikachoose: false
  48 + };
  49 + return $(this).each(function(){
  50 + //declare variables. God knows I've missed half of them I'll use
  51 + var options = $.extend(defaults, user_options);
  52 + var acceleration = 0;
  53 + var initx = 0; //intial
  54 + var inity = 0;
  55 + var movex = [];
  56 + var downtime = 0;
  57 +
  58 + //wrap the list in a sliderjs div.
  59 + $(this).wrap("<div class='sliderjs'></div>");
  60 + var $sliderul = $(this);
  61 + var $sliderjs = $(this).parent("<div>");
  62 + var divcss = {
  63 + width: options.window_width+"px",
  64 + height: options.window_height+"px",
  65 + overflow:"hidden",
  66 + position:"relative"
  67 + };
  68 + var ulcss = {
  69 + position: "relative",
  70 + width: options.list_width+"px"
  71 + };
  72 + $sliderjs.css(divcss);
  73 + $sliderul.css(ulcss);
  74 + //TODO:add a scroll bar and buttons maybe.
  75 + if($.browser.msie){
  76 + //$sliderjs.children().mousedown(function(){ return true;});
  77 + $sliderul.children().mousedown(function(){
  78 + return false;});
  79 + $sliderul.children().children().mousedown(function(){
  80 + return false;});
  81 + }
  82 +
  83 + //mouse fucntions for tosses
  84 + $sliderjs.bind('selectstart', function() {
  85 + return false;
  86 + });
  87 + $sliderjs.bind("mousedown", function(e){
  88 + $sliderul.stop();
  89 + $sliderul.dequeue();
  90 + movex.splice(0);
  91 + initx = e.pageX;
  92 + var date = new Date();
  93 + downtime = date.getTime();
  94 + var xlen = 0;
  95 + var ulinitx = $sliderul.position().left;
  96 + $().bind("mousemove", function(e){
  97 + //track the mouse movements
  98 + //duplicates cause some issues. Though moving only one direction would
  99 + //cause this. it tends to be unintentional
  100 + if(movex[xlen-1]!=e.pageX){
  101 + xlen = movex.push(e.pageX);
  102 + }
  103 +
  104 + //keep trimming our array
  105 + if(xlen>10){
  106 + movex.splice(0,6);
  107 + xlen = movex.push(e.pageX);
  108 + }
  109 +
  110 + //track direction of last three movements. if directions changes reset time
  111 + if(movex.length>3){
  112 + if((movex[xlen-3]>=movex[xlen-2]) &&(movex[xlen-2]>=movex[xlen-1])){
  113 + }else if((movex[xlen-3]<=movex[xlen-2]) &&(movex[xlen-2]<=movex[xlen-1])){
  114 + }else{
  115 + //if we made it here the user has changed direction so now we need to reset the time
  116 + //downtime = date.getTime();
  117 + }
  118 + }
  119 +
  120 + //move the list around well the mouse is pressed
  121 + var newleft = parseInt(ulinitx, 10)+parseInt((e.pageX-initx)/1.5, 10);
  122 + if(newleft<((options.list_width*-1)+parseInt(options.window_width, 10)-50)){
  123 + newleft=((options.list_width*-1)+parseInt(options.window_width, 10)-50);
  124 + }
  125 + if(newleft>50){newleft=50;}
  126 + //$('.pika_navigation').html(newleft);
  127 + $sliderul.css("left",newleft+"px");
  128 + });
  129 + $().bind("mouseup", MeatAndPatatos);
  130 + return false;
  131 + });
  132 +
  133 + function Animate(xvalue){
  134 + $sliderul.stop();
  135 + $sliderul.dequeue();
  136 + $sliderul.animate({
  137 + left:xvalue+"px"
  138 + },1500,"easeOutCubic");
  139 + }
  140 +
  141 + //TODO: find a better name for this func... nevermind I like it
  142 + function MeatAndPatatos(e){
  143 + $().unbind("mousemove");
  144 + $().unbind("mouseup", MeatAndPatatos);
  145 + var date = new Date();
  146 + var uptime = date.getTime();
  147 +
  148 + //calculate velocity... did math class just pay off?
  149 + var velocity = (movex[movex.length-1]*100-movex[movex.length-2]*100)/(uptime-downtime);
  150 + var distance = movex[movex.length-1]-movex[movex.length-2];
  151 + var negative = 1;
  152 + //they're both negative when they get multiplied together we're going to end up with a positive
  153 + if(distance<0){
  154 + negative = -1;
  155 + }
  156 + var ulinitx = $sliderul.position().left;
  157 + var animateleft = parseInt(ulinitx, 10)+(velocity * distance * negative)/2;
  158 + if(animateleft<(options.list_width*-1)+parseInt(options.window_width, 10)){
  159 + animateleft=(options.list_width*-1)+parseInt(options.window_width, 10);
  160 + }
  161 + //alert(animateleft);
  162 + if(animateleft>0){animateleft=0;}
  163 + //now that we have velocity figure out the distance to go and the time
  164 + if(isNaN(animateleft)){}else{
  165 + Animate(animateleft);
  166 + }
  167 +
  168 + }
  169 +
  170 +
  171 +
  172 + function MoveToLi(){
  173 + var pos = $(this).parent('li').position();
  174 + var width = $(this).css("width").slice(0,-2);
  175 + var lileft = pos.left;
  176 + var liright = parseInt(pos.left, 10)+parseInt(width, 10);
  177 + var ulleft = $sliderul.position().left;
  178 + //find out if the li is inside the viewable area
  179 + //first find range of viewable values
  180 + var low = ulleft*-1;
  181 + var high = low+options.window_width;
  182 + //is my li in that?
  183 + if((lileft>=low)&&(liright<=high)){
  184 + //viewable we're gravy
  185 + return;
  186 + }else{
  187 + //uh oh! not viewable lets slide
  188 + //find how far outside view we are
  189 + var slide =0;
  190 + if(lileft<low){
  191 + //i know it seems like we should subtract.. however we have
  192 + //negatives people! (I'm really writing this for me so I don't change
  193 + //it later. :(
  194 + slide = parseInt(lileft, 10)*-1;
  195 + }else{
  196 + slide = ((liright-high)*-1)+parseInt(ulleft, 10);
  197 + }
  198 +
  199 + Animate(slide);
  200 + }
  201 +
  202 + }
  203 +
  204 + if(options.pikachoose){
  205 + var $lis = $sliderul.children('li');
  206 + $lis.children().bind("click", MoveToLi);
  207 +
  208 + }
  209 + });
  210 +
  211 + }
  212 +};
  213 +jQuery.fn.SliderJS = jQuery.iSliderJS.build;
0 \ No newline at end of file 214 \ No newline at end of file
public/stylesheets/folder.css
  Diff comments   View file @f920d2d
@@ -6,6 +6,7 @@ @@ -6,6 +6,7 @@
6 6
7 .image-gallery ul { 7 .image-gallery ul {
8 padding: 0px; 8 padding: 0px;
  9 + text-align: center;
9 } 10 }
10 11
11 .image-gallery-item { 12 .image-gallery-item {
public/stylesheets/slideshow.css 0 → 100644
  Diff comments   View file @f920d2d
@@ -0,0 +1,54 @@ @@ -0,0 +1,54 @@
  1 +body {
  2 + background-color:#000;
  3 + color:white;
  4 + padding-top:20px;
  5 + text-align: center;
  6 +}
  7 +
  8 +/* These hieghts and widths should be edited to your images */
  9 +ul#slideshow {
  10 + padding-left: 0;
  11 + margin: 0 auto;
  12 +}
  13 +
  14 +a, a:link, a:visited {
  15 + color: #FFF;
  16 + text-decoration: bold;
  17 +}
  18 +
  19 +.back-button {
  20 + position: absolute;
  21 + right: 10px;
  22 + margin: 0px;
  23 + top: 3px
  24 +}
  25 +
  26 +.pika_main {
  27 + width: 680px;
  28 + height: 510px;
  29 + padding-right: 20px;
  30 + margin: 0 auto;
  31 + overflow: hidden;
  32 +}
  33 +
  34 +#slideshow li {
  35 + margin: 5px;
  36 + float: left;
  37 + border: 2px solid #222;
  38 +}
  39 +
  40 +/* thats all you NEED to edit. But continue if you'd like. */
  41 +ul#slideshow li img{position:relative;cursor:pointer;}
  42 +.pika_main img{border:5px solid #222;}
  43 +.pika_main{position: relative;margin:0 auto;}
  44 +.pikachoose li{float:left;position:relative;overflow:hidden;list-style:none;}
  45 +.pika_play{position:absolute;top:10px;right:20px;z-index:1;}
  46 +.pika_play a{position:relative;margin-left:auto;cursor:pointer;}
  47 +.pika_play img{border:none !important;}
  48 +.pika_caption{width:100%;height:30px;text-align:center;}
  49 +.pika_navigation a{font-size: 12px;color:white;text-decoration: none;}
  50 +.pika_navigation a:hover{text-decoration: underline;}
  51 +.pika_navigation{padding-top:10px;clear:both;text-align:center;}
  52 +
  53 +/* SliderJS */
  54 +.sliderjs{margin:0 auto;}
test/functional/content_viewer_controller_test.rb
  Diff comments   View file @f920d2d
@@ -717,4 +717,11 @@ class ContentViewerControllerTest &lt; Test::Unit::TestCase @@ -717,4 +717,11 @@ class ContentViewerControllerTest &lt; Test::Unit::TestCase
717 assert_template 'view_page' 717 assert_template 'view_page'
718 end 718 end
719 719
  720 + should 'render slideshow template' do
  721 + f = Folder.create!(:name => 'gallery', :profile => profile)
  722 + get :view_page, :profile => profile.identifier, :page => f.explode_path, :slideshow => true
  723 +
  724 + assert_template 'slideshow'
  725 + end
  726 +
720 end 727 end