[refs #443] add pirobox popup

app/assets/javascripts/tour.js

@@ -0,0 +1,3 @@
+//= require jquery
+//= require jquery-ui
+//= require pirobox_extended_min

app/assets/stylesheets/tour.scss

@@ -447,6 +447,8 @@ article div.tour-gap {
   width: 10px;
 }
 
+@import "pirobox";
+
 /* Custom */
 header menu ul li a {
     padding: 15px 8px 15px 8px;

app/views/layouts/tour.html.haml

@@ -3,8 +3,11 @@
   %head
     %meta{:content => "text/html; charset=utf-8", "http-equiv" => "Content-Type"}/
     %title Сборочная среда
-    %script{:src => "http://html5shiv.googlecode.com/svn/trunk/html5.js", :type => "text/javascript"}
     = stylesheet_link_tag "tour"
+    /[if lt IE 9]
+      = javascript_include_tag 'https://html5shiv.googlecode.com/svn/trunk/html5.js'
+    = javascript_include_tag "tour"
+    = csrf_meta_tag
   %body
     .wrap
       %header.top
@@ -45,3 +48,11 @@
         -#.tour-gap
     %footer= render "layouts/menu/bottom"
     = render 'layouts/counters' unless current_user.try(:admin?)
+    :javascript
+      $(document).ready(function() {
+          $().piroBox_ext({
+              piro_speed : 700,
+              bg_alpha : 0.5,
+              piro_scroll : true //pirobox always positioned at the center of the page
+          });
+      });

app/views/pages/tour/abf-tour-project-description-1.html.haml

@@ -1,7 +1,8 @@
 .feature-wrap
   .feature
     .left
-      =image_tag "tour/1/control.png", :alt => "Управление проектами"
+      %a.pirobox{:href => image_path('tour/big/control.png'), :rel => "single", :title => "Управление проектами"}
+        =image_tag 'tour/1/control.png'
     .right
       %a{:href => tour_inside_path('projects')}
         %h1 Управление проектами
@@ -22,12 +23,14 @@
         %br/
         =link_to 'Читать далее...', tour_inside_path('sources')
     .right
-      =image_tag "tour/2/code.png", :alt => "Исходный код"
+      %a.pirobox{:href => image_path('tour/big/source.png'), :rel => "single", :title => "Исходный код"}
+        =image_tag 'tour/2/source.png'
     .both
 .feature-wrap
   .feature
     .left
-      =image_tag "tour/3/monitoring.png", :alt => "Сборка пакетов"
+      %a.pirobox{:href => image_path('tour/big/monitoring.png'), :rel => "single", :title => "Сборка пакетов"}
+        =image_tag 'tour/3/monitoring.png'
     .right
       %a{:href => tour_inside_path('builds')}
         %h1 Сборка пакетов

app/views/pages/tour/tour-inside-builds.html.haml

@@ -14,7 +14,8 @@
   .feature-wrap
     .feature
       .left
-        =image_tag "tour/3/repo.png", :alt => "Персональный репозиторий"
+        %a.pirobox{:href => image_path('tour/big/repo.png'), :rel => "single", :title => "Персональный репозиторий"}
+          =image_tag 'tour/3/repo.png'
       .right
         %h1 Персональный репозиторий
         %p
@@ -35,12 +36,14 @@
           и дистрибутивов, используя свои вычислительные мощности.
           Никаких затрат с вашей стороны!
       .right
-        =image_tag "tour/3/build.png", :alt => "Сборка пакета"
+        %a.pirobox{:href => image_path('tour/big/build.png'), :rel => "single", :title => "Сборка пакета"}
+          =image_tag 'tour/3/build.png'
       .both
   .feature-wrap
     .feature
       .left
-        =image_tag "tour/3/monitoring.png", :alt => "Мониторинг"
+        %a.pirobox{:href => image_path('tour/big/monitoring.png'), :rel => "single", :title => "Мониторинг"}
+          =image_tag 'tour/3/monitoring.png'
       .right
         %h1 Мониторинг
         %p

app/views/pages/tour/tour-inside-projects.html.haml

@@ -15,7 +15,8 @@
   .feature-wrap
     .feature
       .left
-        =image_tag('tour/1/control.png', :alt => 'Управление проектами')
+        %a.pirobox{:href => image_path('tour/big/control.png'), :rel => "single", :title => "Управление проектами"}
+          =image_tag 'tour/1/control.png'
       .right
         %h1 Управление проектами
         %p
@@ -42,12 +43,14 @@
           Примечание: для приватного проекта вики доступна только его
           участникам. Для публичного — всем для чтения.
       .right
-        =image_tag "tour/1/git.png", :alt => "Git Wiki"
+        %a.pirobox{:href => image_path('tour/big/git.png'), :rel => "single", :title => "Git Wiki"}
+          =image_tag 'tour/1/git.png'
       .both
   .feature-wrap
     .feature
       .left
-        =image_tag "tour/1/tracker.png", :alt => "Легкий трекер задач"
+        %a.pirobox{:href => image_path('tour/big/tracker.png'), :rel => "single", :title => "Легкий трекер задач"}
+          =image_tag 'tour/1/tracker.png'
       .right
         %h1 Легкий трекер задач
         %p

app/views/pages/tour/tour-inside-sources.html.haml

@@ -14,7 +14,8 @@
   .feature-wrap
     .feature
       .left
-        =image_tag('tour/2/code.png', :alt => 'Исходный код онлайн')
+        %a.pirobox{:href => image_path('tour/big/source.png'), :rel => "single", :title => "Исходный код онлайн"}
+          =image_tag 'tour/2/source.png'
       .right
         %h1 Исходный код онлайн
         %p
@@ -34,12 +35,14 @@
           Каждый файл в git-репозитории имеет историю, которую вы
           легко можете посмотреть: кто, когда и что в нем поменял.
       .right
-        =image_tag('tour/2/history.png', :alt => 'История файла')
+        %a.pirobox{:href => image_path('tour/big/history.png'), :rel => "single", :title => "История файла"}
+          =image_tag 'tour/2/history.png'
       .both
   .feature-wrap
     .feature
       .left
-        =image_tag('tour/2/annotation.png', :alt => 'Аннотация файла')
+        %a.pirobox{:href => image_path('tour/big/annotation.png'), :rel => "single", :title => "Аннотация файла"}
+          =image_tag 'tour/2/annotation.png'
       .right
         %h1 Аннотация файла
         %p
@@ -57,5 +60,6 @@
           Мы предлагаем простой редактор для каждого файла в
           git-репозитории.
       .right
-        =image_tag('tour/2/edit.png', :alt => 'Редактирования онлайн')
+        %a.pirobox{:href => image_path('tour/big/edit.png'), :rel => "single", :title => "Редактирования онлайн"}
+          =image_tag 'tour/2/edit.png'
       .both

lib/ext/rails/reserved_name_validator.rb

@@ -23,10 +23,7 @@ class ReservedNameValidator < ActiveModel::EachValidator
     unfollow unsubscribe url user
     widget widgets wiki
     xfn xmpp
-    abf-tour-project-description-1
-    tour-inside-1_1
-    tour-inside-1_2
-    tour-inside-1_3
+    tour
   }
 
   def reserved_names

vendor/assets/javascripts/pirobox_extended_min.js

@@ -0,0 +1,33 @@
+/**
+* Name: PiroBox Extended v.1.0
+* Date: Gen 2011
+* Autor: Diego Valobra (http://www.pirolab.it),(http://www.diegovalobra.com)
+* Version: 1.0
+* Licence: CC-BY-SA http://creativecommons.org/licenses/by-sa/3/it/
+**/
+(function($){$.fn.piroBox_ext=function(opt){opt=jQuery.extend({piro_speed:700,bg_alpha:0.9,piro_scroll:true},opt);$.fn.piroFadeIn=function(speed,callback){$(this).fadeIn(speed,function(){if(jQuery.browser.msie)
+$(this).get(0).style.removeAttribute('filter');if(callback!=undefined)
+callback();});};$.fn.piroFadeOut=function(speed,callback){$(this).fadeOut(speed,function(){if(jQuery.browser.msie)
+$(this).get(0).style.removeAttribute('filter');if(callback!=undefined)
+callback();});};var my_gall_obj=$('a[class*="pirobox"]');var map=new Object();for(var i=0;i<my_gall_obj.length;i++){var it=$(my_gall_obj[i]);map['a.'+it.attr('class').match(/^pirobox_gall\w*/)]=0;}
+var gall_settings=new Array();for(var key in map){gall_settings.push(key);}
+for(var i=0;i<gall_settings.length;i++){$(gall_settings[i]+':first').addClass('first');$(gall_settings[i]+':last').addClass('last');}
+var piro_gallery=$(my_gall_obj);$('a[class*="pirobox_gall"]').each(function(rev){this.rev=rev+0});var struct=('<div class="piro_overlay"></div>'+'<table class="piro_html"  cellpadding="0" cellspacing="0">'+'<tr>'+'<td class="h_t_l"></td>'+'<td class="h_t_c" title="drag me!!"></td>'+'<td class="h_t_r"></td>'+'</tr>'+'<tr>'+'<td class="h_c_l"></td>'+'<td class="h_c_c">'+'<div class="piro_loader" title="close"><span></span></div>'+'<div class="resize">'+'<div class="nav_container">'+'<a href="#prev" class="piro_prev" title="previous"></a>'+'<a href="#next" class="piro_next" title="next"></a>'+'<div class="piro_prev_fake">prev</div>'+'<div class="piro_next_fake">next</div>'+'<div class="piro_close" title="close"></div>'+'</div>'+'<div class="caption"></div>'+'<div class="div_reg"></div>'+'</div>'+'</td>'+'<td class="h_c_r"></td>'+'</tr>'+'<tr>'+'<td class="h_b_l"></td>'+'<td class="h_b_c"></td>'+'<td class="h_b_r"></td>'+'</tr>'+'</table>');$('body').append(struct);var wrapper=$('.piro_html'),piro_capt=$('.caption'),piro_bg=$('.piro_overlay'),piro_next=$('.piro_next'),piro_prev=$('.piro_prev'),piro_next_fake=$('.piro_next_fake'),piro_prev_fake=$('.piro_prev_fake'),piro_close=$('.piro_close'),div_reg=$('.div_reg'),piro_loader=$('.piro_loader'),resize=$('.resize'),btn_info=$('.btn_info');var rz_img=0.95;if($.browser.msie){wrapper.draggable({handle:'.h_t_c,.h_b_c,.div_reg img'});}else{wrapper.draggable({handle:'.h_t_c,.h_b_c,.div_reg img',opacity:0.80});}
+var y=$(window).height();var x=$(window).width();$('.nav_container').hide();wrapper.css({left:((x/2)-(250))+'px',top:parseInt($(document).scrollTop())+(100)});$(wrapper).add(piro_capt).add(piro_bg).hide();piro_bg.css({'opacity':opt.bg_alpha});$(piro_prev).add(piro_next).bind('click',function(c){$('.nav_container').hide();c.preventDefault();piro_next.add(piro_prev).hide();var obj_count=parseInt($('a[class*="pirobox_gall"]').filter('.item').attr('rev'));var start=$(this).is('.piro_prev')?$('a[class*="pirobox_gall"]').eq(obj_count-1):$('a[class*="pirobox_gall"]').eq(obj_count+1);start.click();});$('html').bind('keyup',function(c){if(c.keyCode==27){c.preventDefault();if($(piro_close).is(':visible')){close_all();}}});$('html').bind('keyup',function(e){if($('.item').is('.first')){}else if(e.keyCode==37){e.preventDefault();if($(piro_close).is(':visible')){piro_prev.click();}}});$('html').bind('keyup',function(z){if($('.item').is('.last')){}else if(z.keyCode==39){z.preventDefault();if($(piro_close).is(':visible')){piro_next.click();}}});$(window).resize(function(){var new_y=$(window).height();var new_x=$(window).width();var new_h=wrapper.height();var new_w=wrapper.width();wrapper.css({left:((new_x/2)-(new_w/2))+'px',top:parseInt($(document).scrollTop())+(new_y-new_h)/2});});function scrollIt(){$(window).scroll(function(){var new_y=$(window).height();var new_x=$(window).width();var new_h=wrapper.height();var new_w=wrapper.width();wrapper.css({left:((new_x/2)-(new_w/2))+'px',top:parseInt($(document).scrollTop())+(new_y-new_h)/2});});}
+if(opt.piro_scroll==true){scrollIt()}
+$(piro_gallery).each(function(){var descr=$(this).attr('title');var params=$(this).attr('rel').split('-');var p_link=$(this).attr('href');$(this).unbind();$(this).bind('click',function(e){piro_bg.css({'opacity':opt.bg_alpha});e.preventDefault();piro_next.add(piro_prev).hide().css('visibility','hidden');$(piro_gallery).filter('.item').removeClass('item');$(this).addClass('item');open_all();if($(this).is('.first')){piro_prev.hide();piro_next.show();piro_prev_fake.show().css({'opacity':0.5,'visibility':'hidden'});}else{piro_next.add(piro_prev).show();piro_next_fake.add(piro_prev_fake).hide();}
+if($(this).is('.last')){piro_prev.show();piro_next_fake.show().css({'opacity':0.5,'visibility':'hidden'});piro_next.hide();}
+if($(this).is('.pirobox')){piro_next.add(piro_prev).hide();}});function open_all(){wrapper.add(piro_bg).add(div_reg).add(piro_loader).show();function animate_html(){if(params[1]=='full'&&params[2]=='full'){params[2]=$(window).height()-70;params[1]=$(window).width()-55;}
+var y=$(window).height();var x=$(window).width();piro_close.hide();div_reg.add(resize).animate({'height':+(params[2])+'px','width':+(params[1])+'px'},opt.piro_speed).css('visibility','visible');wrapper.animate({height:+(params[2])+20+'px',width:+(params[1])+20+'px',left:((x/2)-((params[1])/2+10))+'px',top:parseInt($(document).scrollTop())+(y-params[2])/2-10},opt.piro_speed,function(){piro_next.add(piro_prev).css({'height':'20px','width':'20px'});piro_next.add(piro_prev).add(piro_prev_fake).add(piro_next_fake).css('visibility','visible');$('.nav_container').show();piro_close.show();});}
+function animate_image(){var img=new Image();img.onerror=function(){piro_capt.html('');img.src="http://www.pirolab.it/pirobox/js/error.jpg";}
+img.onload=function(){piro_capt.add(btn_info).hide();var y=$(window).height();var x=$(window).width();var imgH=img.height;var imgW=img.width;if(imgH+20>y||imgW+20>x){var _x=(imgW+20)/x;var _y=(imgH+20)/y;if(_y>_x){imgW=Math.round(img.width*(rz_img/_y));imgH=Math.round(img.height*(rz_img/_y));}else{imgW=Math.round(img.width*(rz_img/_x));imgH=Math.round(img.height*(rz_img/_x));}}else{imgH=img.height;imgW=img.width;}
+var y=$(window).height();var x=$(window).width();$(img).height(imgH).width(imgW).hide();$(img).fadeOut(300,function(){});$('.div_reg img').remove();$('.div_reg').html('');div_reg.append(img).show();$(img).addClass('immagine');div_reg.add(resize).animate({height:imgH+'px',width:imgW+'px'},opt.piro_speed);wrapper.animate({height:(imgH+20)+'px',width:(imgW+20)+'px',left:((x/2)-((imgW+20)/2))+'px',top:parseInt($(document).scrollTop())+(y-imgH)/2-20},opt.piro_speed,function(){var cap_w=resize.width();piro_capt.css({width:cap_w+'px'});piro_loader.hide();$(img).fadeIn(300,function(){piro_close.add(btn_info).show();piro_capt.slideDown(200);piro_next.add(piro_prev).css({'height':'20px','width':'20px'});piro_next.add(piro_prev).add(piro_prev_fake).add(piro_next_fake).css('visibility','visible');$('.nav_container').show();resize.resize(function(){NimgW=img.width;NimgH=img.heigh;piro_capt.css({width:(NimgW)+'px'});});});});}
+img.src=p_link;piro_loader.click(function(){img.src='about:blank';});}
+switch(params[0]){case'iframe':div_reg.html('').css('overflow','hidden');resize.css('overflow','hidden');piro_close.add(btn_info).add(piro_capt).hide();animate_html();div_reg.piroFadeIn(300,function(){div_reg.append('<iframe id="my_frame" class="my_frame" src="'+p_link+'" frameborder="0" allowtransparency="true" scrolling="auto" align="top"></iframe>');$('.my_frame').css({'height':+(params[2])+'px','width':+(params[1])+'px'});piro_loader.hide();});break;case'content':div_reg.html('').css('overflow','auto');resize.css('overflow','auto');$('.my_frame').remove();piro_close.add(btn_info).add(piro_capt).hide();animate_html()
+div_reg.piroFadeIn(300,function(){div_reg.load(p_link);piro_loader.hide();});break;case'inline':div_reg.html('').css('overflow','auto');resize.css('overflow','auto');$('.my_frame').remove();piro_close.add(btn_info).add(piro_capt).hide();animate_html()
+div_reg.piroFadeIn(300,function(){$(p_link).clone(true).appendTo(div_reg).piroFadeIn(300);piro_loader.hide();});break
+case'gallery':div_reg.css('overflow','hidden');resize.css('overflow','hidden');$('.my_frame').remove();piro_close.add(btn_info).add(piro_capt).hide();if(descr==""){piro_capt.html('');}else{piro_capt.html('<p>'+descr+'</p>');}
+animate_image();break;case'single':piro_close.add(btn_info).add(piro_capt).hide();div_reg.html('').css('overflow','hidden');resize.css('overflow','hidden');$('.my_frame').remove();if(descr==""){piro_capt.html('');}else{piro_capt.html('<p>'+descr+'</p>');}
+animate_image();break}}});$('.immagine').live('click',function(){piro_capt.slideToggle(200);});function close_all(){if($('.piro_close').is(':visible')){$('.my_frame').remove();wrapper.add(div_reg).add(resize).stop();var ie_sucks=wrapper;if($.browser.msie){ie_sucks=div_reg.add(piro_bg);$('.div_reg img').remove();}else{ie_sucks=wrapper.add(piro_bg);}
+ie_sucks.piroFadeOut(200,function(){div_reg.html('');piro_loader.add(piro_capt).add(btn_info).hide();$('.nav_container').hide();piro_bg.add(wrapper).hide().css('visibility','visible');});}}
+piro_close.add(piro_loader).add(piro_bg).bind('click',function(y){y.preventDefault();close_all();});}})(jQuery);

vendor/assets/stylesheets/pirobox.css

@@ -0,0 +1,44 @@
+/*
+*{
+	margin:0;
+	padding:0;
+}*/
+.piro_html {position:absolute; top:0; left:0; padding:0; width:500px; height: 500px; margin:0; display:block; padding:0; z-index:150001; padding:0;  }
+.piro_html table,.piro_html tbody,.piro_html tr,.piro_html th,.piro_html td{margin:0;padding:0;border:none;}
+.piro_html img{ margin:0; padding:0; border:none;}
+
+.piro_html .h_t_l{ width:10px; height:10px; background: image-url('pirobox/new_skin.png') top left no-repeat;}
+.piro_html .h_t_r{ width:10px; height:10px; background: image-url('pirobox/new_skin.png') top right no-repeat;}
+.piro_html .h_t_c{ cursor:move; height:10px;background: image-url('pirobox/new_skin_top.png') top repeat-x;}
+
+.piro_html .h_c_l{width:10px; background: image-url('pirobox/new_skin_left.png') left repeat-y; }
+.piro_html .h_c_c{background: image-url('pirobox/caption.png');margin:0; padding:0;}
+.piro_html .h_c_c .div_reg{ background: image-url('pirobox/caption.png'); width:480px; overflow:hidden; height:480px; margin:0; padding:0; }
+.piro_html .h_c_c .div_reg img{ cursor:move;}
+.piro_html .h_c_r{width:10px; background: image-url('pirobox/new_skin_left.png') right repeat-y;}
+
+.piro_html .h_b_c{ cursor:move; height:10px;background: image-url('pirobox/new_skin_top.png') bottom repeat-x;}
+.piro_html .h_b_l{ width:10px; height:10px;background: image-url('pirobox/new_skin.png') bottom left no-repeat;}
+.piro_html .h_b_r{ width:10px; height:10px;background: image-url('pirobox/new_skin.png') bottom right no-repeat;}
+
+.piro_overlay{position:fixed; top:0; left:0; width:100%; height:100%;  z-index:150000;background:#fff;display:none; cursor:pointer;}
+.piro_loader{position:absolute;top:50%;left:50%;margin:-59px 0 0 -59px;width:118px;height:118px;display:block;z-index:150005;  cursor:pointer; }
+.piro_loader span{position:absolute;top:50%;left:50%;margin-top:-36px;margin-left:-36px;width:72px;height:72px;display:block;z-index:150009; background: image-url('pirobox/loadinfo.gif') center top no-repeat; }
+.piro_title{position:fixed; background: image-url('pirobox/bg_title.png') bottom repeat-x;top:0;left:0;width:100%; text-align:center;display:block; padding:6px 0 10px 0; color:white; z-index:150000; font-size:18px; display:none;}
+.btn_info{position:absolute;bottom:-7px;right:-7px;width:25px; height:25px;margin:0;display:block; padding:0px; color:black; cursor:pointer; background: image-url('pirobox/b_w/info.png') no-repeat; z-index:1500440}
+.caption{position:absolute;bottom:10px;left:10px;margin:0;display:block; padding:0px; color:black; cursor:text; background: image-url('pirobox/caption.png'); z-index:150018}
+.caption p{ display:block; margin:0;padding:7px 5px; text-align:center; font-weight:normal; font-size:14px; color:white; z-index:150019; color:white;}
+
+.nav_container{position:absolute; right:5px; bottom:-20px;  height:25px; width:60px; background:  image-url('pirobox/bottom_nav.png') bottom; z-index:1500190000000;}
+.piro_close{position:absolute;right:20px; top:0;height:20px;width:20px;background: transparent image-url('pirobox/close.png') no-repeat center center;cursor:pointer;margin:0 0 0 0;z-index:150022;display:none;}
+a.piro_next{position:absolute;width:20px; top:0; right:0px; height:20px;text-indent:-999em;outline:none; display:block; margin:0;background:image-url('pirobox/next.png') center right no-repeat; border:none; cursor:pointer;z-index:150023}
+a:hover.piro_next{background:image-url('pirobox/next.png') center right no-repeat;}
+.piro_next_fake{position:absolute;width:20px;  top:0;right:0px; height:20px;outline:none; text-indent:-999em; display:none; margin:0;background: image-url('pirobox/next.png') center right no-repeat; border:none; cursor:auto;z-index:150020}
+.piro_prev_fake{position:absolute;width:20px;  top:0;right:40px; height:20px;outline:none; text-indent:-999em; display:none; margin:0;background: image-url('pirobox/prev.png') center right no-repeat; border:none; cursor:auto;z-index:150020}
+
+a.piro_prev{position:absolute;width:20px; right:40px; top:0; height:20px; text-indent:-999em; outline:none;display:block;margin:0;background: image-url('pirobox/prev.png') center left no-repeat;border:none; cursor:pointer; z-index:150024}
+a:hover.piro_prev{background:image-url('pirobox/prev.png') center left no-repeat;}
+a.close_pirobox{color:#bb0f05;}
+
+
+