Merge remote-tracking branch 'origin/master'

Weblate
2 parents 23123065 ffae019b
Showing 56 changed files with 239 additions and 1940 deletions Show diff stats
app/helpers/application_helper.rb
app/helpers/boxes_helper.rb
app/helpers/colorbox_helper.rb
app/helpers/comment_helper.rb
app/helpers/lightbox_helper.rb
app/helpers/modal_helper.rb
app/helpers/thickbox_helper.rb
app/views/account/_login_form.html.erb
app/views/account/index_anonymous.html.erb
app/views/account/login.html.erb
app/views/account/logout_popup.html.erb
app/views/box_organizer/add_block.html.erb
app/views/box_organizer/edit.html.erb
app/views/box_organizer/index.html.erb
app/views/cms/edit.html.erb
app/views/cms/select_article_type.html.erb
app/views/cms/view.html.erb
app/views/cms/why_categorize.html.erb
app/views/comment/_comment_form.html.erb
app/views/content_viewer/_article_toolbar.html.erb
@@ -8,11 +8,7 @@ module ApplicationHelper
  
   include PermissionNameHelper
  
-  include LightboxHelper
-
-  include ThickboxHelper
-
-  include ColorboxHelper
+  include ModalHelper
  
   include BoxesHelper
  
@@ -651,8 +647,8 @@ module ApplicationHelper
       ' onfocus="if(this.value==\''+s+'\'){this.value=\'\'} this.form.className=\'focus-in\'"'+
       ' onblur="if(/^\s*$/.test(this.value)){this.value=\''+s+'\'} this.form.className=\'focus-out\'">'+
       '</form>'
-    else #opt == 'lightbox_link' is default
-      lightbox_link_to '<span class="icon-menu-search"></span>'+ _('Search'), {
+    else
+      modal_link_to '<span class="icon-menu-search"></span>'+ _('Search'), {
                        :controller => 'search',
                        :action => 'popup',
                        :category_path => (@category ? @category.explode_path : nil)},
@@ -1050,7 +1046,7 @@ module ApplicationHelper
       {s_('contents|Most commented') => {:href => url_for({:controller => 'search', :action => 'contents', :filter => 'more_comments'})}}
     ]
     if logged_in?
-      links.push(_('New content') => colorbox_options({:href => url_for({:controller => 'cms', :action => 'new', :profile => current_user.login, :cms => true})}))
+      links.push(_('New content') => modal_options({:href => url_for({:controller => 'cms', :action => 'new', :profile => current_user.login, :cms => true})}))
     end
  
     link_to(content_tag(:span, _('Contents'), :class => 'icon-menu-articles'), {:controller => "search", :action => 'contents', :category_path => nil}, :id => 'submenu-contents') +
@@ -231,7 +231,7 @@ module BoxesHelper
       end
  
       if block.editable?
-        buttons << colorbox_icon_button(:edit, _('Edit'), { :action => 'edit', :id => block.id })
+        buttons << modal_icon_button(:edit, _('Edit'), { :action => 'edit', :id => block.id })
       end
  
       if !block.main?
@@ -241,7 +241,7 @@ module BoxesHelper
     end
  
     if block.respond_to?(:help)
-      buttons << thickbox_inline_popup_icon(:help, _('Help on this block'), {}, "help-on-box-#{block.id}") << content_tag('div', content_tag('h2', _('Help')) + content_tag('div', block.help, :style => 'margin-bottom: 1em;') + thickbox_close_button(_('Close')), :style => 'display: none;', :id => "help-on-box-#{block.id}")
+      buttons << modal_inline_icon(:help, _('Help on this block'), {}, "#help-on-box-#{block.id}") << content_tag('div', content_tag('h2', _('Help')) + content_tag('div', block.help, :style => 'margin-bottom: 1em;') + modal_close_button(_('Close')), :style => 'display: none;', :id => "help-on-box-#{block.id}")
     end
  
     if block.embedable?
@@ -1,25 +0,0 @@
-module ColorboxHelper
-
-  def colorbox_close_button(text, options = {})
-    button(:close, text, '#', colorbox_options(options, :close))
-  end
-
-  def colorbox_button(type, label, url, options = {})
-    button(type, label, url, colorbox_options(options))
-  end
-
-  def colorbox_icon_button(type, label, url, options = {})
-    icon_button(type, label, url, colorbox_options(options))
-  end
-
-  # options must be an HTML options hash as passed to link_to etc.
-  #
-  # returns a new hash with colorbox class added. Keeps existing classes.
-  def colorbox_options(options, type=nil)
-    the_class = 'colorbox'
-    the_class += "-#{type.to_s}" unless type.nil?
-    the_class << " #{options[:class]}" if options.has_key?(:class)
-    options.merge(:class => the_class)
-  end
-
-end
@@ -65,7 +65,7 @@ module CommentHelper
  
   def link_for_edit(comment)
     if comment.can_be_updated_by?(user)
-      {:link => expirable_comment_link(comment, :edit, _('Edit'), url_for(:profile => profile.identifier, :controller => :comment, :action => :edit, :id => comment.id),:class => 'colorbox')}
+      {:link => expirable_comment_link(comment, :edit, _('Edit'), url_for(:profile => profile.identifier, :controller => :comment, :action => :edit, :id => comment.id),:class => 'modal')}
     end
   end
  
@@ -1,36 +0,0 @@
-module LightboxHelper
-
-  def lightbox_link_to(text, url, options = {})
-    link_to(text, url, lightbox_options(options))
-  end
-
-  def lightbox_close_button(text, options = {})
-    button(:close, text, '#', lightbox_options(options, 'lbAction').merge(:rel => 'deactivate'))
-  end
-
-  def lightbox_button(type, label, url, options = {})
-    button(type, label, url, lightbox_options(options))
-  end
-
-  def lightbox_icon_button(type, label, url, options = {})
-    icon_button(type, label, url, lightbox_options(options))
-  end
-
-  # options must be an HTML options hash as passed to link_to etc.
-  #
-  # returns a new hash with lightbox class added. Keeps existing classes. 
-  def lightbox_options(options, lightbox_type = 'lbOn')
-    the_class = lightbox_type
-    the_class << " #{options[:class]}" if options.has_key?(:class)
-    options.merge(:class => the_class)
-  end
-
-  def lightbox?
-    request.xhr?
-  end
-
-  def lightbox_remote_button(type, label, url, options = {})
-    button(type, label, url, lightbox_options(options, 'remote-lbOn'))
-  end
-
-end
@@ -0,0 +1,46 @@
+module ModalHelper
+
+  def modal_inline_link_to title, url, selector, options = {}
+    link_to title, url, modal_options(options.merge(:inline => selector))
+  end
+
+  def modal_inline_icon type, title, url, selector, options = {}
+    icon_button type, title, url, modal_options(options.merge(:inline => selector))
+  end
+
+  def modal_link_to title, url, options = {}
+    link_to title, url, modal_options(options)
+  end
+
+  def modal_close_link text, options = {}
+    link_to text, '#', modal_options(options, :close)
+  end
+
+  def modal_close_button(text, options = {})
+    button :close, text, '#', modal_options(options, :close).merge(:rel => 'deactivate')
+  end
+
+  def modal_button(type, label, url, options = {})
+    button type, label, url, modal_options(options)
+  end
+
+  def modal_icon_button(type, label, url, options = {})
+    icon_button type, label, url, modal_options(options)
+  end
+
+  # options must be an HTML options hash as passed to link_to etc.
+  #
+  # returns a new hash with modal class added. Keeps existing classes.
+  def modal_options(options, type=nil)
+    inline_selector = options.delete :inline
+    options[:onclick] = "return noosfero.modal.inline('#{inline_selector}')" if inline_selector
+
+    classes = if inline_selector then '' else 'modal-toggle' end
+    classes += " modal-#{type.to_s}" if type.present?
+    classes << " #{options[:class]}" if options.has_key? :class
+    options.merge!(:class => classes)
+
+    options
+  end
+
+end
@@ -1,11 +0,0 @@
-module ThickboxHelper
-  def thickbox_inline_popup_link(title, url, id, options = {})
-    link_to(title, url_for(url) + "#TB_inline?height=300&width=500&inlineId=#{id}&modal=true", {:class => 'thickbox'}.merge(options))
-  end
-  def thickbox_inline_popup_icon(type, title, url, id, options = {})
-    icon_button(type, title, url_for(url) + "#TB_inline?height=300&width=500&inlineId=#{id}&modal=true", {:class => "thickbox"}.merge(options))
-  end
-  def thickbox_close_button(title)
-    button_to_function(:close, title, 'tb_remove();')
-  end
-end
 <%= labelled_form_for :user,
    :url => { :controller => 'account', :action => (params[:enterprise_code] ? 'activate_enterprise' : 'login') }  do |f| %>
  
-<%= f.text_field :login,
-                 :id => ( lightbox? ? 'lightbox_' : '' ) + 'user_login',
-                 :onchange => 'this.value = convToValidLogin( this.value )' %>
+<%= f.text_field :login, :id => 'user_login', :onchange => 'this.value = convToValidLogin( this.value )' %>
  
-<%= f.password_field :password,
-                     :id => ( lightbox? ? 'lightbox_' : '' ) + 'user_password' %>
+<%= f.password_field :password, :id => 'user_password' %>
  
 <% if params[:enterprise_code] %>
   <%= hidden_field_tag :enterprise_code, params[:enterprise_code] %>
@@ -16,7 +13,7 @@
  
 <% button_bar do %>
   <%= submit_button( 'login', _('Log in') )%>
-  <%= lightbox_close_button(_('Cancel')) if lightbox? %>
+  <%= modal_close_button _('Cancel') if request.xhr? %>
 <% end %>
  
 <% end %>
 <h1><%= _('Identify yourself') %></h1>
  
 <p>
-<%= lightbox_link_to _('Login.'), { :controller => 'account', :action => 'login_popup' } %>
+<%= modal_link_to _('Login.'), { :controller => 'account', :action => 'login_popup' } %>
  
 <%= _('You need to login to be able to use all the features in this environment.') %>
 </p>
@@ -3,7 +3,7 @@
 <h2><%= _('Login') %></h2>
  
 <% @user ||= User.new %>
-<% is_thickbox ||= false %>
+<% is_popin ||= false %>
  
 <%= @message %>
  
@@ -17,8 +17,8 @@
  
      <% button_bar do %>
        <%= submit_button( 'login', _('Log in') )%>
-       <% if is_thickbox %>
-         <%= thickbox_close_button(_('Cancel')) %>
+       <% if is_popin %>
+         <%= modal_close_button(_('Cancel')) %>
        <% end %>
      <% end %>
  
@@ -2,6 +2,6 @@
 <p>
 <% button_bar do %>
   <%= button :ok, _('Yes'), { :controller => 'account', :action => 'logout' } %>
-  <%= lightbox_close_button _('No, I want to stay.') %>
+  <%= modal_close_button _('No, I want to stay.') %>
 <% end %>
 </p>
@@ -42,7 +42,7 @@
  
     <% button_bar do %>
       <%= submit_button(:add, _("Add")) %>
-      <%= colorbox_close_button(_('Close')) %>
+      <%= modal_close_button(_('Close')) %>
     <% end %>
  
   <% end %>
@@ -27,7 +27,7 @@
  
     <% button_bar do %>
       <%= submit_button(:save, _('Save')) %>
-      <%= colorbox_close_button(_('Cancel')) %>
+      <%= modal_close_button(_('Cancel')) %>
     <% end %>
  
   <% end %>
 <h1><%= _('Editing sideboxes')%></h1>
  
 <% button_bar :class=>'design-menu' do %>
-  <%= colorbox_button('add', _('Add a block'), { :action => 'add_block' }) %>
+  <%= modal_button('add', _('Add a block'), { :action => 'add_block' }) %>
   <%= button(:back, _('Back to control panel'), :controller => (profile.nil? ? 'admin_panel': 'profile_editor')) %>
 <% end %>
@@ -28,7 +28,7 @@
   <% end %>
  
   <div style='float: right'>
-    <%= lightbox_button :help, _('Why categorize?'), :action => 'why_categorize' %>
+    <%= modal_button :help, _('Why categorize?'), :action => 'why_categorize' %>
   </div>
  
   <%= select_categories(:article, _('Categorize your article')) %>
@@ -15,6 +15,6 @@
 </ul>
 <br style="clear:both" />
  
-<%= colorbox_close_button(_('Cancel')) %>
+<%= modal_close_button(_('Cancel')) %>
  
 </div>
@@ -17,7 +17,7 @@
 <% button_bar(:style => 'margin-bottom: 1em;') do %>
   <% parent_id = ((@article && @article.allow_children?) ? @article : nil) %>
  
-  <%= colorbox_button('new', _('New content'), :action => 'new', :parent_id => parent_id, :cms => true) %>
+  <%= modal_button('new', _('New content'), :action => 'new', :parent_id => parent_id, :cms => true) %>
   <%= button(:back, _('Back to control panel'), :controller => 'profile_editor', :action => "index") %>
 <% end %>
  
@@ -5,5 +5,5 @@
 </p>
  
 <% button_bar do %>
-  <%= lightbox_close_button _('Close') %>
+  <%= modal_close_button _('Close') %>
 <% end %>
@@ -10,7 +10,7 @@
     <%= recaptcha_tags(:display => { :theme => 'clean' }, :ajax => true) %>
     <% button_bar do %>
       <%= button_to_function :add, _('Confirm'), "return false", :id => "confirm-captcha" %>
-      <%= button_to_function :cancel, _('Cancel'), "jQuery.colorbox.close()" %>
+      <%= button_to_function :cancel, _('Cancel'), "noosfero.modal.close()" %>
     <% end %>
   </div>
  
@@ -31,10 +31,10 @@ function check_captcha(button, confirm_action) {
   return true;
   <% else %>
   jQuery('#recaptcha-container').show();
-  jQuery.colorbox({ html: jQuery('#recaptcha-container').html(), maxWidth : '600px', maxHeight : '300px' });
+  noosfero.modal.inline('#recaptcha-container', {maxWidth :'600px', maxHeight : '300px' });
   jQuery('#confirm-captcha').unbind('click');
   jQuery('#confirm-captcha').bind('click', function() {
-    jQuery.colorbox.close();
+    noosfero.modal.close();
     button.form.recaptcha_response_field.value = jQuery('#recaptcha_response_field').val();
     button.form.recaptcha_challenge_field.value = jQuery('#recaptcha_challenge_field').val();
     button.form.confirm.value = 'true';
@@ -88,7 +88,7 @@ function check_captcha(button, confirm_action) {
     <% if !edition_mode %>
       <%= button :cancel, _('Cancel'), '', :id => 'cancel-comment' %>
     <% else %>
-      <%= button :cancel, _('Cancel'), '#', :onclick => "jQuery.colorbox.close();" %>
+      <%= button :cancel, _('Cancel'), '#', :onclick => "noosfero.modal.close();" %>
     <% end %>
   <% end %>
 <% end %>
@@ -28,7 +28,7 @@
         <%= expirable_button @page, :locale, content, url %>
       <% end %>
  
-      <%= colorbox_button(:new, label_for_new_article(@page), profile.admin_url.merge(:controller => 'cms', :action => 'new', :parent_id => (@page.folder? ? @page : (@page.parent.nil? ? nil : @page.parent)))) unless remove_content_button(:new, @page) %>
+      <%= modal_button(:new, label_for_new_article(@page), profile.admin_url.merge(:controller => 'cms', :action => 'new', :parent_id => (@page.folder? ? @page : (@page.parent.nil? ? nil : @page.parent)))) unless remove_content_button(:new, @page) %>
     <% end %>
  
     <% if @page.accept_uploads? && @page.allow_create?(user) %>
@@ -7,10 +7,10 @@ function submit_comment_form(button) {
   return true;
   <% else %>
   jQuery('#recaptcha-container').show();
-  jQuery.colorbox({ inline : true, href : '#recaptcha-container', maxWidth : '600px', maxHeight : '300px' });
+  noosfero.modal.inline('#recaptcha-container', {maxWidth :'600px', maxHeight : '300px' });
   jQuery('#confirm-captcha').unbind('click');
   jQuery('#confirm-captcha').bind('click', function() {
-    jQuery.colorbox.close();
+    noosfero.modal.close();
     button.form.recaptcha_response_field.value = jQuery('#recaptcha_response_field').val();
     button.form.recaptcha_challenge_field.value = jQuery('#recaptcha_challenge_field').val();
     button.form.confirm.value = 'true';
@@ -38,7 +38,7 @@ function submit_comment_form(button) {
     <%= recaptcha_tags(:display => { :theme => 'clean' }, :ajax => true) %>
     <% button_bar do %>
       <%= button_to_function :add, _('Confirm'), "return false", :id => "confirm-captcha" %>
-      <%= button_to_function :cancel, _('Cancel'), "jQuery.colorbox.close()" %>
+      <%= button_to_function :cancel, _('Cancel'), "noosfero.modal.close()" %>
     <% end %>
   </div>
  
@@ -7,11 +7,11 @@
     </span>
   <% else %>
     <span class='not-logged-in'>
-      <%= _("<span class='login'>%s</span>") % thickbox_inline_popup_link('<i class="icon-menu-login"></i><strong>' + _('Login') + '</strong>', login_url, 'inlineLoginBox', :id => 'link_login') %>
+      <%= _("<span class='login'>%s</span>") % modal_inline_link_to('<i class="icon-menu-login"></i><strong>' + _('Login') + '</strong>', login_url, '#inlineLoginBox', :id => 'link_login') %>
       <%= @plugins.dispatch(:alternative_authentication_link).collect { |content| instance_exec(&content) }.join("") %>
  
     <div id='inlineLoginBox' style='display: none;'>
-      <%= render :file => 'account/login', :locals => { :is_thickbox => true } %>
+      <%= render :file => 'account/login', :locals => { :is_popin => true } %>
     </div>
  
     <% unless @plugins.dispatch(:allow_user_registration).include?(false) %>
@@ -18,7 +18,7 @@
     <%= yield :head %>
     <%=
       @plugins.dispatch(:head_ending).map do |content|
-        if content.respond_to?(:call) then instance_exec(&content).html_safe else content.html_safe end
+        if content.respond_to?(:call) then instance_exec(&content).to_s.html_safe else content.to_s.html_safe end
       end.join("\n")
     %>
  
@@ -32,7 +32,7 @@
  
     <%=
       @plugins.dispatch(:body_beginning).map do |content|
-        if content.respond_to?(:call) then instance_exec(&content).html_safe else content.html_safe end
+        if content.respond_to?(:call) then instance_exec(&content).to_s.html_safe else content.to_s.html_safe end
       end.join("\n")
     %>
  
@@ -9,7 +9,7 @@
   <%= hidden_field_tag(:confirmation, 1) %>
   <%= submit_button(:ok, _("Yes, I want to join.") % profile.name) %>
   <% if logged_in? && request.xhr? %>
-    <%= lightbox_close_button(_("No, I don't want")) %>
+    <%= modal_close_button _("No, I don't want") %>
   <% else %>
     <%= button(:cancel, _("No, I don't want."), profile.url) %>
   <% end %>
@@ -9,7 +9,7 @@
   <%= hidden_field_tag(:back_to, @back_to) %>
   <%= submit_button(:ok, _("Yes, I want to leave.") % profile.name) %>
   <% if logged_in? && request.xhr? %>
-    <%= lightbox_close_button(_("No, I don't want")) %>
+    <%= modal_close_button _("No, I don't want") %>
   <% else %>
     <%= button(:cancel, _("No, I don't want."), profile.url) %>
   <% end %>
@@ -9,7 +9,7 @@
   <% end %>
  
   <%= submit_button(:send, _('Report profile'), :style => 'float: left; cursor: pointer;', :id => 'report-abuse-submit-button', :onclick => "jQuery('#form-submit-loading').show()") %>
-  <%= button(:cancel, _('Cancel'), {}, :style => 'float: left; padding-top: 0px; padding-bottom: 0px;', :onclick => 'jQuery.colorbox.close(); return false;')%>
+  <%= button(:cancel, _('Cancel'), {}, :style => 'float: left; padding-top: 0px; padding-bottom: 0px;', :onclick => 'noosfero.modal.close(); return false;')%>
   <div id="form-submit-loading" class="small-loading" style="width: 16px; height: 16px; margin-top: 3px; float: left; display: none;"></div>
 <% end %>
  
@@ -30,7 +30,7 @@
       success: function(data, status, ajax){
         if ( !data.ok ) display_notice(data.error.message);
         else {
-          $.colorbox.close();
+          noosfero.modal.close();
           display_notice(data.message);
           window.location.reload();
         }
@@ -5,7 +5,7 @@
  
   <% button_bar do %>
     <%= submit_button(:add, _('Add')) %>
-    <%= lightbox_close_button(_('Cancel')) %>
+    <%= modal_close_button _('Cancel') %>
   <% end %>
  
 <% end %>
@@ -16,7 +16,7 @@
     <% end %>
   </ul>
   <% button_bar do %>
-    <%= lightbox_button(:add, _('New CSS'), :action => 'add_css', :id => @theme.id) %>
+    <%= modal_button :add, _('New CSS'), :action => 'add_css', :id => @theme.id %>
   <% end %>
 </div>
  
@@ -25,10 +25,10 @@
   <ul>
     <% for image in @image_files %>
       <li><%= image_tag("/user_themes/#{@theme.id}/images/#{image}") %></li>
-    <% end %> 
+    <% end %>
   </ul>
   <% button_bar do %>
-    <%= lightbox_button(:add, _('Add image'), :action => 'add_image', :id =>  @theme.id) %>
+    <%= modal_button :add, _('Add image'), :action => 'add_image', :id =>  @theme.id %>
   <% end %>
 </div>
  
@@ -42,7 +42,7 @@
  
 <% button_bar do %>
   <% if environment.enabled?('user_themes')  %>
-    <%= lightbox_button(:add, _('New theme ...'), :action => 'new') %>
+    <%= modal_button :add, _('New theme ...'), :action => 'new' %>
   <% end %>
   <%= button(:back, _('Back'), :controller => 'profile_editor', :action => 'index') %>
 <% end %>
@@ -20,7 +20,7 @@
         </li>
  
         <li>
-        <%= lightbox_link_to('<span class="icon-new"></span>' + _('New article'), '/myprofile/{login}/cms/new') %>
+        <%= modal_link_to '<span class="icon-new"></span>' + _('New article'), '/myprofile/{login}/cms/new' %>
         </li>
  
         <li id='manage-enterprises-link-template' style='display: none'><a href='/myprofile/{identifier}'><span class="icon-menu-enterprise"></span><%= _('Manage %s') % '{name}' %></a></li>
@@ -58,9 +58,9 @@
       <% if theme_option( :menu_login ) == 'full_form' %>
         <%= render :file => 'account/login_block' %>
       <% else %>
-        <%= thickbox_inline_popup_link('<span class="icon-menu-login"></span>'+ _('Login'), login_url, 'inlineLoginBox', :id => 'link_login') %>
+        <%= modal_inline_link_to('<span class="icon-menu-login"></span>'+ _('Login'), login_url, '#inlineLoginBox', :id => 'link_login') %>
         <div id='inlineLoginBox' style='display: none;'>
-          <%= render :file => 'account/login', :locals => { :is_thickbox => true } %>
+          <%= render :file => 'account/login', :locals => { :is_popin => true } %>
         </div>
       <% end %>
     <% end %>
@@ -25,7 +25,7 @@
 .edit-information {
   display: none;
 }
-#colorbox .edit-information {
+.modal .edit-information {
   display: block;
 }
  
@@ -26,7 +26,7 @@
   <%= labelled_radio_button 'Multiple Select', "fields[#{counter}][kind]", 'multiple_select', field.multiple && field.list %><br />
  
   <% button_bar do %>
-    <%= button :ok, c_('Ok'), '#', :class => 'colorbox-ok-button', :div_id => elem_id %>
+    <%= button :ok, _('Ok'), '#', :div_id => elem_id %>
   <% end %>
 </div>
  
@@ -290,14 +290,11 @@ function Cart(config) {
         log.error('Send request - HTTP '+status, errorThrown);
       },
       complete: function() {
-        $.colorbox.close();
+        noosfero.modal.close();
       }
     });
   }
  
-  Cart.colorbox_close = function() {
-    $.colorbox.close();
-  }
  
   $(window).bind('beforeunload', function(){
     log('Page unload.');
@@ -5,7 +5,7 @@
       <a href="cart:clean" onclick="Cart.clean(this); return false" class="cart-clean"><%=_('Clean basket')%></a>
       <ul class="cart-items"></ul>
       <div class="cart-total"><%=_('Total:')%> <b></b></div>
-      <a href="/plugin/shopping_cart/buy" class="cart-buy colorbox"><%=_('Shopping checkout')%></a>
+      <a href="/plugin/shopping_cart/buy" class="cart-buy modal"><%=_('Shopping checkout')%></a>
     </div>
     <a href="#" onclick="Cart.toggle(this); return false" class="cart-toggle">
       <span class="str-show"><%=_('Show basket')%></span>
@@ -24,7 +24,7 @@
   <% end %>
   <% delivery_option = @settings.delivery_options.first && @settings.delivery_options.first.first %>
   <%= items_table(@cart[:items], @profile, delivery_option) %>
-  <%= link_to '', '#', :onclick => "Cart.colorbox_close(this);", :class => 'cart-box-close icon-cancel' %>
+  <%= link_to_function '', "noosfero.modal.close();", :class => 'cart-box-close icon-cancel' %>
 </div>
  
 <%= javascript_include_tag '../plugins/shopping_cart/buy' %>
@@ -17,7 +17,7 @@
     </div>
   <% end %>
   <%= items_table(session[:cart][:items], profile) %>
-  <%= link_to '', '#', :onclick => "Cart.colorbox_close(this);", :class => 'cart-box-close icon-cancel' %>
+  <%= link_to_function '', "noosfero.modal.close();", :class => 'cart-box-close icon-cancel' %>
 </div>
  
 <script type="text/javascript">
@@ -55,9 +55,10 @@ $(&quot;#usp_id_field&quot;).observe_field(1, function(){
 });
  
 function displayValidationUspIdError(error){
-  jQuery.colorbox({html: '<h2>'+error.message+'</h2>'+error.backtrace.join("<br />"),
+  noosfero.modal.html('<h2>'+error.message+'</h2>'+error.backtrace.join("<br />"), {
     height: "80%",
-    width:  "70%" });
+    width:  "70%"
+  });
 }
  
 jQuery('#usp_id_field').focus(function() { jQuery('#usp-id-balloon').fadeIn('slow'); });
@@ -1005,31 +1005,6 @@ log.error = function() {
   window.log.apply(window, jQuery.merge(['error'], arguments));
 }
  
-jQuery(function($) {
-  $('.colorbox').live('click', function() {
-    $.colorbox({
-      href:       $(this).attr('href'),
-      maxWidth:   $(window).width()-50,
-      height:     $(window).height()-50,
-      open:       true,
-      fixed:      true,
-      close:      'Cancel',
-      onComplete: function(bt) {
-        var opt = {}, maxH = $(window).height()-50;
-        if ($('#cboxLoadedContent *:first').height() > maxH) opt.height = maxH;
-        $.colorbox.resize(opt);
-      }
-    });
-    return false;
-  });
-
-  $('.colorbox-close').live('click', function() {
-    $.colorbox.close();
-    return false;
-  });
-
-});
-
 function showHideTermsOfUse() {
   if( jQuery("#article_has_terms_of_use").attr("checked") )
     jQuery("#text_area_terms_of_use").show();
@@ -88,7 +88,7 @@ jQuery(function($) {
     var $item = $(this).closest('.item');
     var html_selector = $item.attr('data-item');
     insert_item_in_text($item.find(html_selector));
-    $.colorbox.close();
+    noosfero.modal.close();
     return false;
   });
   $('a.zoom').live('click', function() {
@@ -96,14 +96,13 @@ jQuery(function($) {
     var html_selector = $item.attr('data-item');
     var name = $item.attr('title');
     var img = $item.find(html_selector).find('img').attr('src');
-    $.colorbox({
-      html: zoom_dialog_html(name, img),
-      scrolling: false
+    noosfero.modal.html(zoom_dialog_html(img), {
+      scrolling: false,
     });
     return false;
   });
   $('a.close').live('click', function() {
-    $.colorbox.close();
+    noosfero.modal.close();
     return false;
   })
  
@@ -1,814 +0,0 @@
-// ColorBox v1.3.16 - a full featured, light-weight, customizable lightbox based on jQuery 1.3+
-// Copyright (c) 2011 Jack Moore - jack@colorpowered.com
-// Licensed under the MIT license: http://www.opensource.org/licenses/mit-license.php
-(function ($, document, window) {
-	var
-	// ColorBox Default Settings.	
-	// See http://colorpowered.com/colorbox for details.
-	defaults = {
-		transition: "elastic",
-		speed: 300,
-		width: false,
-		initialWidth: "600",
-		innerWidth: false,
-		maxWidth: false,
-		height: false,
-		initialHeight: "450",
-		innerHeight: false,
-		maxHeight: false,
-		scalePhotos: true,
-		scrolling: true,
-		inline: false,
-		html: false,
-		iframe: false,
-		fastIframe: true,
-		photo: false,
-		href: false,
-		title: false,
-		rel: false,
-		opacity: 0.9,
-		preloading: true,
-		current: "image {current} of {total}",
-		previous: "previous",
-		next: "next",
-		close: "close",
-		open: false,
-		returnFocus: true,
-		loop: true,
-		slideshow: false,
-		slideshowAuto: true,
-		slideshowSpeed: 2500,
-		slideshowStart: "start slideshow",
-		slideshowStop: "stop slideshow",
-		onOpen: false,
-		onLoad: false,
-		onComplete: false,
-		onCleanup: false,
-		onClosed: false,
-		overlayClose: true,		
-		escKey: true,
-		arrowKey: true
-	},
-	
-	// Abstracting the HTML and event identifiers for easy rebranding
-	colorbox = 'colorbox',
-	prefix = 'cbox',
-	
-	// Events	
-	event_open = prefix + '_open',
-	event_load = prefix + '_load',
-	event_complete = prefix + '_complete',
-	event_cleanup = prefix + '_cleanup',
-	event_closed = prefix + '_closed',
-	event_purge = prefix + '_purge',
-	
-	// Special Handling for IE
-	isIE = $.browser.msie && !$.support.opacity, // feature detection alone gave a false positive on at least one phone browser and on some development versions of Chrome.
-	isIE6 = isIE && $.browser.version < 7,
-	event_ie6 = prefix + '_IE6',
-
-	// Cached jQuery Object Variables
-	$overlay,
-	$box,
-	$wrap,
-	$content,
-	$topBorder,
-	$leftBorder,
-	$rightBorder,
-	$bottomBorder,
-	$related,
-	$window,
-	$loaded,
-	$loadingBay,
-	$loadingOverlay,
-	$title,
-	$current,
-	$slideshow,
-	$next,
-	$prev,
-	$close,
-	$groupControls,
-
-	// Variables for cached values or use across multiple functions
-	settings = {},
-	interfaceHeight,
-	interfaceWidth,
-	loadedHeight,
-	loadedWidth,
-	element,
-	index,
-	photo,
-	open,
-	active,
-	closing = false,
-	
-	publicMethod,
-	boxElement = prefix + 'Element';
-	
-	// ****************
-	// HELPER FUNCTIONS
-	// ****************
-
-	// jQuery object generator to reduce code size
-	function $div(id, cssText) { 
-		var div = document.createElement('div');
-		if (id) {
-            div.id = prefix + id;
-        }
-		div.style.cssText = cssText || false;
-		return $(div);
-	}
-
-	// Convert % values to pixels
-	function setSize(size, dimension) {
-		dimension = dimension === 'x' ? $window.width() : $window.height();
-		return (typeof size === 'string') ? Math.round((/%/.test(size) ? (dimension / 100) * parseInt(size, 10) : parseInt(size, 10))) : size;
-	}
-	
-	// Checks an href to see if it is a photo.
-	// There is a force photo option (photo: true) for hrefs that cannot be matched by this regex.
-	function isImage(url) {
-		return settings.photo || /\.(gif|png|jpg|jpeg|bmp)(?:\?([^#]*))?(?:#(\.*))?$/i.test(url);
-	}
-	
-	// Assigns function results to their respective settings.  This allows functions to be used as values.
-	function process(settings) {
-		for (var i in settings) {
-			if ($.isFunction(settings[i]) && i.substring(0, 2) !== 'on') { // checks to make sure the function isn't one of the callbacks, they will be handled at the appropriate time.
-			    settings[i] = settings[i].call(element);
-			}
-		}
-		settings.rel = settings.rel || element.rel || 'nofollow';
-		settings.href = $.trim(settings.href || $(element).attr('href'));
-		settings.title = settings.title || element.title;
-	}
-
-	function trigger(event, callback) {
-		if (callback) {
-			callback.call(element);
-		}
-		$.event.trigger(event);
-	}
-
-	// Slideshow functionality
-	function slideshow() {
-		var
-		timeOut,
-		className = prefix + "Slideshow_",
-		click = "click." + prefix,
-		start,
-		stop,
-		clear;
-		
-		if (settings.slideshow && $related[1]) {
-			start = function () {
-				$slideshow
-					.text(settings.slideshowStop)
-					.unbind(click)
-					.bind(event_complete, function () {
-						if (index < $related.length - 1 || settings.loop) {
-							timeOut = setTimeout(publicMethod.next, settings.slideshowSpeed);
-						}
-					})
-					.bind(event_load, function () {
-						clearTimeout(timeOut);
-					})
-					.one(click + ' ' + event_cleanup, stop);
-				$box.removeClass(className + "off").addClass(className + "on");
-				timeOut = setTimeout(publicMethod.next, settings.slideshowSpeed);
-			};
-			
-			stop = function () {
-				clearTimeout(timeOut);
-				$slideshow
-					.text(settings.slideshowStart)
-					.unbind([event_complete, event_load, event_cleanup, click].join(' '))
-					.one(click, start);
-				$box.removeClass(className + "on").addClass(className + "off");
-			};
-			
-			if (settings.slideshowAuto) {
-				start();
-			} else {
-				stop();
-			}
-		}
-	}
-
-	function launch(elem) {
-		if (!closing) {
-			
-			element = elem;
-			
-			process($.extend(settings, $.data(element, colorbox)));
-			
-			$related = $(element);
-			
-			index = 0;
-			
-			if (settings.rel !== 'nofollow') {
-				$related = $('.' + boxElement).filter(function () {
-					var relRelated = $.data(this, colorbox).rel || this.rel;
-					return (relRelated === settings.rel);
-				});
-				index = $related.index(element);
-				
-				// Check direct calls to ColorBox.
-				if (index === -1) {
-					$related = $related.add(element);
-					index = $related.length - 1;
-				}
-			}
-			
-			if (!open) {
-				open = active = true; // Prevents the page-change action from queuing up if the visitor holds down the left or right keys.
-				
-				$box.show();
-				
-				if (settings.returnFocus) {
-					try {
-						element.blur();
-						$(element).one(event_closed, function () {
-							try {
-								this.focus();
-							} catch (e) {
-								// do nothing
-							}
-						});
-					} catch (e) {
-						// do nothing
-					}
-				}
-				
-				// +settings.opacity avoids a problem in IE when using non-zero-prefixed-string-values, like '.5'
-				$overlay.css({"opacity": +settings.opacity, "cursor": settings.overlayClose ? "pointer" : "auto"}).show();
-				
-				// Opens inital empty ColorBox prior to content being loaded.
-				settings.w = setSize(settings.initialWidth, 'x');
-				settings.h = setSize(settings.initialHeight, 'y');
-				publicMethod.position(0);
-				
-				if (isIE6) {
-					$window.bind('resize.' + event_ie6 + ' scroll.' + event_ie6, function () {
-						$overlay.css({width: $window.width(), height: $window.height(), top: $window.scrollTop(), left: $window.scrollLeft()});
-					}).trigger('resize.' + event_ie6);
-				}
-				
-				trigger(event_open, settings.onOpen);
-				
-				$groupControls.add($title).hide();
-				
-				$close.html(settings.close).show();
-			}
-			
-			publicMethod.load(true);
-		}
-	}
-
-	// ****************
-	// PUBLIC FUNCTIONS
-	// Usage format: $.fn.colorbox.close();
-	// Usage from within an iframe: parent.$.fn.colorbox.close();
-	// ****************
-	
-	publicMethod = $.fn[colorbox] = $[colorbox] = function (options, callback) {
-		var $this = this, autoOpen;
-		
-		if (!$this[0] && $this.selector) { // if a selector was given and it didn't match any elements, go ahead and exit.
-			return $this;
-		}
-		
-		options = options || {};
-		
-		if (callback) {
-			options.onComplete = callback;
-		}
-		
-		if (!$this[0] || $this.selector === undefined) { // detects $.colorbox() and $.fn.colorbox()
-			$this = $('<a/>');
-			options.open = true; // assume an immediate open
-		}
-		
-		$this.each(function () {
-			$.data(this, colorbox, $.extend({}, $.data(this, colorbox) || defaults, options));
-			$(this).addClass(boxElement);
-		});
-		
-		autoOpen = options.open;
-		
-		if ($.isFunction(autoOpen)) {
-			autoOpen = autoOpen.call($this);
-		}
-		
-		if (autoOpen) {
-			launch($this[0]);
-		}
-		
-		return $this;
-	};
-
-	// Initialize ColorBox: store common calculations, preload the interface graphics, append the html.
-	// This preps colorbox for a speedy open when clicked, and lightens the burdon on the browser by only
-	// having to run once, instead of each time colorbox is opened.
-	publicMethod.init = function () {
-		// Create & Append jQuery Objects
-		$window = $(window);
-		$box = $div().attr({id: colorbox, 'class': isIE ? prefix + (isIE6 ? 'IE6' : 'IE') : ''});
-		$overlay = $div("Overlay", isIE6 ? 'position:absolute' : '').hide();
-		
-		$wrap = $div("Wrapper");
-		$content = $div("Content").append(
-			$loaded = $div("LoadedContent", 'width:0; height:0; overflow:hidden'),
-			$loadingOverlay = $div("LoadingOverlay").add($div("LoadingGraphic")),
-			$title = $div("Title"),
-			$current = $div("Current"),
-			$next = $div("Next"),
-			$prev = $div("Previous"),
-			$slideshow = $div("Slideshow").bind(event_open, slideshow),
-			$close = $div("Close")
-		);
-		$wrap.append( // The 3x3 Grid that makes up ColorBox
-			$div().append(
-				$div("TopLeft"),
-				$topBorder = $div("TopCenter"),
-				$div("TopRight")
-			),
-			$div(false, 'clear:left').append(
-				$leftBorder = $div("MiddleLeft"),
-				$content,
-				$rightBorder = $div("MiddleRight")
-			),
-			$div(false, 'clear:left').append(
-				$div("BottomLeft"),
-				$bottomBorder = $div("BottomCenter"),
-				$div("BottomRight")
-			)
-		).children().children().css({'float': 'left'});
-		
-		$loadingBay = $div(false, 'position:absolute; width:9999px; visibility:hidden; display:none');
-		
-		$('body').prepend($overlay, $box.append($wrap, $loadingBay));
-		
-		$content.children()
-		.hover(function () {
-			$(this).addClass('hover');
-		}, function () {
-			$(this).removeClass('hover');
-		}).addClass('hover');
-		
-		// Cache values needed for size calculations
-		interfaceHeight = $topBorder.height() + $bottomBorder.height() + $content.outerHeight(true) - $content.height();//Subtraction needed for IE6
-		interfaceWidth = $leftBorder.width() + $rightBorder.width() + $content.outerWidth(true) - $content.width();
-		loadedHeight = $loaded.outerHeight(true);
-		loadedWidth = $loaded.outerWidth(true);
-		
-		// Setting padding to remove the need to do size conversions during the animation step.
-		$box.css({"padding-bottom": interfaceHeight, "padding-right": interfaceWidth}).hide();
-		
-                // Setup button events.
-                $next.click(function () {
-                        publicMethod.next();
-                });
-                $prev.click(function () {
-                        publicMethod.prev();
-                });
-                $close.click(function () {
-                        publicMethod.close();
-                });
-		
-		$groupControls = $next.add($prev).add($current).add($slideshow);
-		
-		// Adding the 'hover' class allowed the browser to load the hover-state
-		// background graphics.  The class can now can be removed.
-		$content.children().removeClass('hover');
-		
-		$('.' + boxElement).live('click', function (e) {
-			// checks to see if it was a non-left mouse-click and for clicks modified with ctrl, shift, or alt.
-			if (!((e.button !== 0 && typeof e.button !== 'undefined') || e.ctrlKey || e.shiftKey || e.altKey)) {
-				e.preventDefault();
-				launch(this);
-			}
-		});
-		
-		$overlay.click(function () {
-			if (settings.overlayClose) {
-				publicMethod.close();
-			}
-		});
-		
-		// Set Navigation Key Bindings
-		$(document).bind('keydown.' + prefix, function (e) {
-                        var key = e.keyCode;
-			if (open && settings.escKey && key === 27) {
-				e.preventDefault();
-				publicMethod.close();
-			}
-			if (open && settings.arrowKey && $related[1]) {
-				if (key === 37) {
-					e.preventDefault();
-					$prev.click();
-				} else if (key === 39) {
-					e.preventDefault();
-					$next.click();
-				}
-			}
-		});
-	};
-	
-	publicMethod.remove = function () {
-		$box.add($overlay).remove();
-		$('.' + boxElement).die('click').removeData(colorbox).removeClass(boxElement);
-	};
-
-	publicMethod.position = function (speed, loadedCallback) {
-		var
-		animate_speed,
-		// keeps the top and left positions within the browser's viewport.
-		posTop = Math.max(document.documentElement.clientHeight - settings.h - loadedHeight - interfaceHeight, 0) / 2 + $window.scrollTop(),
-		posLeft = Math.max($window.width() - settings.w - loadedWidth - interfaceWidth, 0) / 2 + $window.scrollLeft();
-		
-		// setting the speed to 0 to reduce the delay between same-sized content.
-		animate_speed = ($box.width() === settings.w + loadedWidth && $box.height() === settings.h + loadedHeight) ? 0 : speed;
-		
-		// this gives the wrapper plenty of breathing room so it's floated contents can move around smoothly,
-		// but it has to be shrank down around the size of div#colorbox when it's done.  If not,
-		// it can invoke an obscure IE bug when using iframes.
-		$wrap[0].style.width = $wrap[0].style.height = "9999px";
-		
-		function modalDimensions(that) {
-			// loading overlay height has to be explicitly set for IE6.
-			$topBorder[0].style.width = $bottomBorder[0].style.width = $content[0].style.width = that.style.width;
-			$loadingOverlay[0].style.height = $loadingOverlay[1].style.height = $content[0].style.height = $leftBorder[0].style.height = $rightBorder[0].style.height = that.style.height;
-		}
-		
-		$box.dequeue().animate({width: settings.w + loadedWidth, height: settings.h + loadedHeight, top: posTop, left: posLeft}, {
-			duration: animate_speed,
-			complete: function () {
-				modalDimensions(this);
-				
-				active = false;
-				
-				// shrink the wrapper down to exactly the size of colorbox to avoid a bug in IE's iframe implementation.
-				$wrap[0].style.width = (settings.w + loadedWidth + interfaceWidth) + "px";
-				$wrap[0].style.height = (settings.h + loadedHeight + interfaceHeight) + "px";
-				
-				if (loadedCallback) {
-					loadedCallback();
-				}
-			},
-			step: function () {
-				modalDimensions(this);
-			}
-		});
-	};
-
-	publicMethod.resize = function (options) {
-		if (open) {
-			options = options || {};
-			
-			if (options.width) {
-				settings.w = setSize(options.width, 'x') - loadedWidth - interfaceWidth;
-			}
-			if (options.innerWidth) {
-				settings.w = setSize(options.innerWidth, 'x');
-			}
-			$loaded.css({width: settings.w});
-			
-			if (options.height) {
-				settings.h = setSize(options.height, 'y') - loadedHeight - interfaceHeight;
-			}
-			if (options.innerHeight) {
-				settings.h = setSize(options.innerHeight, 'y');
-			}
-			if (!options.innerHeight && !options.height) {				
-				var $child = $loaded.wrapInner("<div style='overflow:auto'></div>").children(); // temporary wrapper to get an accurate estimate of just how high the total content should be.
-				settings.h = $child.height();
-				$child.replaceWith($child.children()); // ditch the temporary wrapper div used in height calculation
-			}
-			$loaded.css({height: settings.h});
-			
-			publicMethod.position(settings.transition === "none" ? 0 : settings.speed);
-		}
-	};
-
-	publicMethod.prep = function (object) {
-		if (!open) {
-			return;
-		}
-		
-		var speed = settings.transition === "none" ? 0 : settings.speed;
-		
-		$window.unbind('resize.' + prefix);
-		$loaded.remove();
-		$loaded = $div('LoadedContent').html(object);
-		
-		function getWidth() {
-			settings.w = settings.w || $loaded.width();
-			settings.w = settings.mw && settings.mw < settings.w ? settings.mw : settings.w;
-			return settings.w;
-		}
-		function getHeight() {
-			settings.h = settings.h || $loaded.height();
-			settings.h = settings.mh && settings.mh < settings.h ? settings.mh : settings.h;
-			return settings.h;
-		}
-		
-		$loaded.hide()
-		.appendTo($loadingBay.show())// content has to be appended to the DOM for accurate size calculations.
-		.css({width: getWidth(), overflow: settings.scrolling ? 'auto' : 'hidden'})
-		.css({height: getHeight()})// sets the height independently from the width in case the new width influences the value of height.
-		.prependTo($content);
-		
-		$loadingBay.hide();
-		
-		// floating the IMG removes the bottom line-height and fixed a problem where IE miscalculates the width of the parent element as 100% of the document width.
-		//$(photo).css({'float': 'none', marginLeft: 'auto', marginRight: 'auto'});
-		
-                $(photo).css({'float': 'none'});
-                
-		// Hides SELECT elements in IE6 because they would otherwise sit on top of the overlay.
-		if (isIE6) {
-			$('select').not($box.find('select')).filter(function () {
-				return this.style.visibility !== 'hidden';
-			}).css({'visibility': 'hidden'}).one(event_cleanup, function () {
-				this.style.visibility = 'inherit';
-			});
-		}
-		
-		function setPosition(s) {
-			publicMethod.position(s, function () {
-				var prev, prevSrc, next, nextSrc, total = $related.length, iframe, complete;
-				
-				if (!open) {
-					return;
-				}
-				
-				complete = function () {
-					$loadingOverlay.hide();
-					trigger(event_complete, settings.onComplete);
-				};
-				
-				if (isIE) {
-					//This fadeIn helps the bicubic resampling to kick-in.
-					if (photo) {
-						$loaded.fadeIn(100);
-					}
-				}
-				
-				$title.html(settings.title).add($loaded).show();
-				
-				if (total > 1) { // handle grouping
-					if (typeof settings.current === "string") {
-						$current.html(settings.current.replace(/\{current\}/, index + 1).replace(/\{total\}/, total)).show();
-					}
-					
-					$next[(settings.loop || index < total - 1) ? "show" : "hide"]().html(settings.next);
-					$prev[(settings.loop || index) ? "show" : "hide"]().html(settings.previous);
-					
-					prev = index ? $related[index - 1] : $related[total - 1];
-					next = index < total - 1 ? $related[index + 1] : $related[0];
-					
-					if (settings.slideshow) {
-						$slideshow.show();
-					}
-					
-					// Preloads images within a rel group
-					if (settings.preloading) {
-						nextSrc = $.data(next, colorbox).href || next.href;
-						prevSrc = $.data(prev, colorbox).href || prev.href;
-						
-						nextSrc = $.isFunction(nextSrc) ? nextSrc.call(next) : nextSrc;
-						prevSrc = $.isFunction(prevSrc) ? prevSrc.call(prev) : prevSrc;
-						
-						if (isImage(nextSrc)) {
-							$('<img/>')[0].src = nextSrc;
-						}
-						
-						if (isImage(prevSrc)) {
-							$('<img/>')[0].src = prevSrc;
-						}
-					}
-				} else {
-					$groupControls.hide();
-				}
-				
-				if (settings.iframe) {
-					iframe = $('<iframe/>').addClass(prefix + 'Iframe')[0];
-					
-					if (settings.fastIframe) {
-						complete();
-					} else {
-						$(iframe).load(complete);
-					}
-					iframe.name = prefix + (+new Date());
-					iframe.src = settings.href;
-					
-					if (!settings.scrolling) {
-						iframe.scrolling = "no";
-					}
-					
-					if (isIE) {
-                        iframe.frameBorder=0;
-						iframe.allowTransparency = "true";
-					}
-					
-					$(iframe).appendTo($loaded).one(event_purge, function () {
-						iframe.src = "//about:blank";
-					});
-				} else {
-					complete();
-				}
-				
-				if (settings.transition === 'fade') {
-					$box.fadeTo(speed, 1, function () {
-						$box[0].style.filter = "";
-					});
-				} else {
-                     $box[0].style.filter = "";
-				}
-				
-				$window.bind('resize.' + prefix, function () {
-					publicMethod.position(0);
-				});
-			});
-		}
-		
-		if (settings.transition === 'fade') {
-			$box.fadeTo(speed, 0, function () {
-				setPosition(0);
-			});
-		} else {
-			setPosition(speed);
-		}
-	};
-
-	publicMethod.load = function (launched) {
-		var href, setResize, prep = publicMethod.prep;
-		
-		active = true;
-		
-		photo = false;
-		
-		element = $related[index];
-		
-		if (!launched) {
-			process($.extend(settings, $.data(element, colorbox)));
-		}
-		
-		trigger(event_purge);
-		
-		trigger(event_load, settings.onLoad);
-		
-		settings.h = settings.height ?
-				setSize(settings.height, 'y') - loadedHeight - interfaceHeight :
-				settings.innerHeight && setSize(settings.innerHeight, 'y');
-		
-		settings.w = settings.width ?
-				setSize(settings.width, 'x') - loadedWidth - interfaceWidth :
-				settings.innerWidth && setSize(settings.innerWidth, 'x');
-		
-		// Sets the minimum dimensions for use in image scaling
-		settings.mw = settings.w;
-		settings.mh = settings.h;
-		
-		// Re-evaluate the minimum width and height based on maxWidth and maxHeight values.
-		// If the width or height exceed the maxWidth or maxHeight, use the maximum values instead.
-		if (settings.maxWidth) {
-			settings.mw = setSize(settings.maxWidth, 'x') - loadedWidth - interfaceWidth;
-			settings.mw = settings.w && settings.w < settings.mw ? settings.w : settings.mw;
-		}
-		if (settings.maxHeight) {
-			settings.mh = setSize(settings.maxHeight, 'y') - loadedHeight - interfaceHeight;
-			settings.mh = settings.h && settings.h < settings.mh ? settings.h : settings.mh;
-		}
-		
-		href = settings.href;
-		
-		$loadingOverlay.show();
-
-		if (settings.inline) {
-			// Inserts an empty placeholder where inline content is being pulled from.
-			// An event is bound to put inline content back when ColorBox closes or loads new content.
-			$div().hide().insertBefore($(href)[0]).one(event_purge, function () {
-				$(this).replaceWith($loaded.children());
-			});
-			prep($(href));
-		} else if (settings.iframe) {
-			// IFrame element won't be added to the DOM until it is ready to be displayed,
-			// to avoid problems with DOM-ready JS that might be trying to run in that iframe.
-			prep(" ");
-		} else if (settings.html) {
-			prep(settings.html);
-		} else if (isImage(href)) {
-			$(photo = new Image())
-			.addClass(prefix + 'Photo')
-			.error(function () {
-				settings.title = false;
-				prep($div('Error').text('This image could not be loaded'));
-			})
-			.load(function () {
-				var percent;
-				photo.onload = null; //stops animated gifs from firing the onload repeatedly.
-				
-				if (settings.scalePhotos) {
-					setResize = function () {
-						photo.height -= photo.height * percent;
-						photo.width -= photo.width * percent;	
-					};
-					if (settings.mw && photo.width > settings.mw) {
-						percent = (photo.width - settings.mw) / photo.width;
-						setResize();
-					}
-					if (settings.mh && photo.height > settings.mh) {
-						percent = (photo.height - settings.mh) / photo.height;
-						setResize();
-					}
-				}
-				
-				if (settings.h) {
-					photo.style.marginTop = Math.max(settings.h - photo.height, 0) / 2 + 'px';
-				}
-				
-				if ($related[1] && (index < $related.length - 1 || settings.loop)) {
-					photo.style.cursor = 'pointer';
-					photo.onclick = function () {
-                                                publicMethod.next();
-                                        };
-				}
-				
-				if (isIE) {
-					photo.style.msInterpolationMode = 'bicubic';
-				}
-				
-				setTimeout(function () { // A pause because Chrome will sometimes report a 0 by 0 size otherwise.
-					prep(photo);
-				}, 1);
-			});
-			
-			setTimeout(function () { // A pause because Opera 10.6+ will sometimes not run the onload function otherwise.
-				photo.src = href;
-			}, 1);
-		} else if (href) {
-			$loadingBay.load(href, function (data, status, xhr) {
-				prep(status === 'error' ? $div('Error').text('Request unsuccessful: ' + xhr.statusText) : $(this).contents());
-			});
-		}
-	};
-        
-	// Navigates to the next page/image in a set.
-	publicMethod.next = function () {
-		if (!active && $related[1] && (index < $related.length - 1 || settings.loop)) {
-			index = index < $related.length - 1 ? index + 1 : 0;
-			publicMethod.load();
-		}
-	};
-	
-	publicMethod.prev = function () {
-		if (!active && $related[1] && (index || settings.loop)) {
-			index = index ? index - 1 : $related.length - 1;
-			publicMethod.load();
-		}
-	};
-
-	// Note: to use this within an iframe use the following format: parent.$.fn.colorbox.close();
-	publicMethod.close = function () {
-		if (open && !closing) {
-			
-			closing = true;
-			
-			open = false;
-			
-			trigger(event_cleanup, settings.onCleanup);
-			
-			$window.unbind('.' + prefix + ' .' + event_ie6);
-			
-			$overlay.fadeTo(200, 0);
-			
-			$box.stop().fadeTo(300, 0, function () {
-                                
-				$box.add($overlay).css({'opacity': 1, cursor: 'auto'}).hide();
-				
-				trigger(event_purge);
-				
-				$loaded.remove();
-				
-				setTimeout(function () {
-					closing = false;
-					trigger(event_closed, settings.onClosed);
-				}, 1);
-			});
-		}
-	};
-
-	// A method for fetching the current element ColorBox is referencing.
-	// returns a jQuery object.
-	publicMethod.element = function () {
-		return $(element);
-	};
-
-	publicMethod.settings = defaults;
-
-	// Initializes ColorBox when the DOM has loaded
-	$(publicMethod.init);
-
-}(jQuery, document, this));
 \ No newline at end of file
@@ -53,7 +53,7 @@ function save_comment(button) {
       //Comment of reply
       $('#'+ data.render_target).replaceWith(data.html);
       $('#' + data.render_target).effect("highlight", {}, 3000);
-      $.colorbox.close();
+      noosfero.modal.close();
       increment_comment_count(comment_div);
     } else {
       //New comment of article
@@ -64,7 +64,7 @@ function save_comment(button) {
       });
  
       page_comment_form.find('.errorExplanation').remove();
-      $.colorbox.close();
+      noosfero.modal.close();
       increment_comment_count(comment_div);
     }
  
@@ -0,0 +1,7 @@
+/*!
+	Colorbox v1.4.36 - 2014-02-01
+	jQuery lightbox and modal window plugin
+	(c) 2014 Jack Moore - http://www.jacklmoore.com/colorbox
+	license: http://www.opensource.org/licenses/mit-license.php
+*/
+(function(e,t,i){function o(i,o,n){var r=t.createElement(i);return o&&(r.id=Z+o),n&&(r.style.cssText=n),e(r)}function n(){return i.innerHeight?i.innerHeight:e(i).height()}function r(e){var t=k.length,i=(z+e)%t;return 0>i?t+i:i}function h(e,t){return Math.round((/%/.test(e)?("x"===t?E.width():n())/100:1)*parseInt(e,10))}function l(e,t){return e.photo||e.photoRegex.test(t)}function s(e,t){return e.retinaUrl&&i.devicePixelRatio>1?t.replace(e.photoRegex,e.retinaSuffix):t}function a(e){"contains"in g[0]&&!g[0].contains(e.target)&&(e.stopPropagation(),g.focus())}function d(){var t,i=e.data(N,Y);null==i?(B=e.extend({},X),console&&console.log&&console.log("Error: cboxElement missing settings object")):B=e.extend({},i);for(t in B)e.isFunction(B[t])&&"on"!==t.slice(0,2)&&(B[t]=B[t].call(N));B.rel=B.rel||N.rel||e(N).data("rel")||"nofollow",B.href=B.href||e(N).attr("href"),B.title=B.title||N.title,"string"==typeof B.href&&(B.href=e.trim(B.href))}function c(i,o){e(t).trigger(i),lt.triggerHandler(i),e.isFunction(o)&&o.call(N)}function u(i){q||(N=i,d(),k=e(N),z=0,"nofollow"!==B.rel&&(k=e("."+et).filter(function(){var t,i=e.data(this,Y);return i&&(t=e(this).data("rel")||i.rel||this.rel),t===B.rel}),z=k.index(N),-1===z&&(k=k.add(N),z=k.length-1)),w.css({opacity:parseFloat(B.opacity),cursor:B.overlayClose?"pointer":"auto",visibility:"visible"}).show(),J&&g.add(w).removeClass(J),B.className&&g.add(w).addClass(B.className),J=B.className,B.closeButton?K.html(B.close).appendTo(y):K.appendTo("<div/>"),U||(U=$=!0,g.css({visibility:"hidden",display:"block"}),H=o(st,"LoadedContent","width:0; height:0; overflow:hidden"),y.css({width:"",height:""}).append(H),O=x.height()+C.height()+y.outerHeight(!0)-y.height(),_=b.width()+T.width()+y.outerWidth(!0)-y.width(),D=H.outerHeight(!0),A=H.outerWidth(!0),B.w=h(B.initialWidth,"x"),B.h=h(B.initialHeight,"y"),H.css({width:"",height:B.h}),Q.position(),c(tt,B.onOpen),P.add(L).hide(),g.focus(),B.trapFocus&&t.addEventListener&&(t.addEventListener("focus",a,!0),lt.one(rt,function(){t.removeEventListener("focus",a,!0)})),B.returnFocus&&lt.one(rt,function(){e(N).focus()})),m())}function f(){!g&&t.body&&(V=!1,E=e(i),g=o(st).attr({id:Y,"class":e.support.opacity===!1?Z+"IE":"",role:"dialog",tabindex:"-1"}).hide(),w=o(st,"Overlay").hide(),F=e([o(st,"LoadingOverlay")[0],o(st,"LoadingGraphic")[0]]),v=o(st,"Wrapper"),y=o(st,"Content").append(L=o(st,"Title"),S=o(st,"Current"),I=e('<button type="button"/>').attr({id:Z+"Previous"}),R=e('<button type="button"/>').attr({id:Z+"Next"}),M=o("button","Slideshow"),F),K=e('<button type="button"/>').attr({id:Z+"Close"}),v.append(o(st).append(o(st,"TopLeft"),x=o(st,"TopCenter"),o(st,"TopRight")),o(st,!1,"clear:left").append(b=o(st,"MiddleLeft"),y,T=o(st,"MiddleRight")),o(st,!1,"clear:left").append(o(st,"BottomLeft"),C=o(st,"BottomCenter"),o(st,"BottomRight"))).find("div div").css({"float":"left"}),W=o(st,!1,"position:absolute; width:9999px; visibility:hidden; display:none; max-width:none;"),P=R.add(I).add(S).add(M),e(t.body).append(w,g.append(v,W)))}function p(){function i(e){e.which>1||e.shiftKey||e.altKey||e.metaKey||e.ctrlKey||(e.preventDefault(),u(this))}return g?(V||(V=!0,R.click(function(){Q.next()}),I.click(function(){Q.prev()}),K.click(function(){Q.close()}),w.click(function(){B.overlayClose&&Q.close()}),e(t).bind("keydown."+Z,function(e){var t=e.keyCode;U&&B.escKey&&27===t&&(e.preventDefault(),Q.close()),U&&B.arrowKey&&k[1]&&!e.altKey&&(37===t?(e.preventDefault(),I.click()):39===t&&(e.preventDefault(),R.click()))}),e.isFunction(e.fn.on)?e(t).on("click."+Z,"."+et,i):e("."+et).live("click."+Z,i)),!0):!1}function m(){var n,r,a,u=Q.prep,f=++at;$=!0,j=!1,N=k[z],d(),c(ht),c(it,B.onLoad),B.h=B.height?h(B.height,"y")-D-O:B.innerHeight&&h(B.innerHeight,"y"),B.w=B.width?h(B.width,"x")-A-_:B.innerWidth&&h(B.innerWidth,"x"),B.mw=B.w,B.mh=B.h,B.maxWidth&&(B.mw=h(B.maxWidth,"x")-A-_,B.mw=B.w&&B.w<B.mw?B.w:B.mw),B.maxHeight&&(B.mh=h(B.maxHeight,"y")-D-O,B.mh=B.h&&B.h<B.mh?B.h:B.mh),n=B.href,G=setTimeout(function(){F.show()},100),B.inline?(a=o(st).hide().insertBefore(e(n)[0]),lt.one(ht,function(){a.replaceWith(H.children())}),u(e(n))):B.iframe?u(" "):B.html?u(B.html):l(B,n)?(n=s(B,n),j=t.createElement("img"),e(j).addClass(Z+"Photo").bind("error",function(){B.title=!1,u(o(st,"Error").html(B.imgError))}).one("load",function(){var t;f===at&&(e.each(["alt","longdesc","aria-describedby"],function(t,i){var o=e(N).attr(i)||e(N).attr("data-"+i);o&&j.setAttribute(i,o)}),B.retinaImage&&i.devicePixelRatio>1&&(j.height=j.height/i.devicePixelRatio,j.width=j.width/i.devicePixelRatio),B.scalePhotos&&(r=function(){j.height-=j.height*t,j.width-=j.width*t},B.mw&&j.width>B.mw&&(t=(j.width-B.mw)/j.width,r()),B.mh&&j.height>B.mh&&(t=(j.height-B.mh)/j.height,r())),B.h&&(j.style.marginTop=Math.max(B.mh-j.height,0)/2+"px"),k[1]&&(B.loop||k[z+1])&&(j.style.cursor="pointer",j.onclick=function(){Q.next()}),j.style.width=j.width+"px",j.style.height=j.height+"px",setTimeout(function(){u(j)},1))}),setTimeout(function(){j.src=n},1)):n&&W.load(n,B.data,function(t,i){f===at&&u("error"===i?o(st,"Error").html(B.xhrError):e(this).contents())})}var w,g,v,y,x,b,T,C,k,E,H,W,F,L,S,M,R,I,K,P,B,O,_,D,A,N,z,j,U,$,q,G,Q,J,V,X={html:!1,photo:!1,iframe:!1,inline:!1,transition:"elastic",speed:300,fadeOut:300,width:!1,initialWidth:"600",innerWidth:!1,maxWidth:!1,height:!1,initialHeight:"450",innerHeight:!1,maxHeight:!1,scalePhotos:!0,scrolling:!0,href:!1,title:!1,rel:!1,opacity:.9,preloading:!0,className:!1,overlayClose:!0,escKey:!0,arrowKey:!0,top:!1,bottom:!1,left:!1,right:!1,fixed:!1,data:void 0,closeButton:!0,fastIframe:!0,open:!1,reposition:!0,loop:!0,slideshow:!1,slideshowAuto:!0,slideshowSpeed:2500,slideshowStart:"start slideshow",slideshowStop:"stop slideshow",photoRegex:/\.(gif|png|jp(e|g|eg)|bmp|ico|webp)((#|\?).*)?$/i,retinaImage:!1,retinaUrl:!1,retinaSuffix:"@2x.$1",current:"image {current} of {total}",previous:"previous",next:"next",close:"close",xhrError:"This content failed to load.",imgError:"This image failed to load.",returnFocus:!0,trapFocus:!0,onOpen:!1,onLoad:!1,onComplete:!1,onCleanup:!1,onClosed:!1},Y="colorbox",Z="cbox",et=Z+"Element",tt=Z+"_open",it=Z+"_load",ot=Z+"_complete",nt=Z+"_cleanup",rt=Z+"_closed",ht=Z+"_purge",lt=e("<a/>"),st="div",at=0,dt={},ct=function(){function e(){clearTimeout(h)}function t(){(B.loop||k[z+1])&&(e(),h=setTimeout(Q.next,B.slideshowSpeed))}function i(){M.html(B.slideshowStop).unbind(s).one(s,o),lt.bind(ot,t).bind(it,e),g.removeClass(l+"off").addClass(l+"on")}function o(){e(),lt.unbind(ot,t).unbind(it,e),M.html(B.slideshowStart).unbind(s).one(s,function(){Q.next(),i()}),g.removeClass(l+"on").addClass(l+"off")}function n(){r=!1,M.hide(),e(),lt.unbind(ot,t).unbind(it,e),g.removeClass(l+"off "+l+"on")}var r,h,l=Z+"Slideshow_",s="click."+Z;return function(){r?B.slideshow||(lt.unbind(nt,n),n()):B.slideshow&&k[1]&&(r=!0,lt.one(nt,n),B.slideshowAuto?i():o(),M.show())}}();e.colorbox||(e(f),Q=e.fn[Y]=e[Y]=function(t,i){var o=this;if(t=t||{},f(),p()){if(e.isFunction(o))o=e("<a/>"),t.open=!0;else if(!o[0])return o;i&&(t.onComplete=i),o.each(function(){e.data(this,Y,e.extend({},e.data(this,Y)||X,t))}).addClass(et),(e.isFunction(t.open)&&t.open.call(o)||t.open)&&u(o[0])}return o},Q.position=function(t,i){function o(){x[0].style.width=C[0].style.width=y[0].style.width=parseInt(g[0].style.width,10)-_+"px",y[0].style.height=b[0].style.height=T[0].style.height=parseInt(g[0].style.height,10)-O+"px"}var r,l,s,a=0,d=0,c=g.offset();if(E.unbind("resize."+Z),g.css({top:-9e4,left:-9e4}),l=E.scrollTop(),s=E.scrollLeft(),B.fixed?(c.top-=l,c.left-=s,g.css({position:"fixed"})):(a=l,d=s,g.css({position:"absolute"})),d+=B.right!==!1?Math.max(E.width()-B.w-A-_-h(B.right,"x"),0):B.left!==!1?h(B.left,"x"):Math.round(Math.max(E.width()-B.w-A-_,0)/2),a+=B.bottom!==!1?Math.max(n()-B.h-D-O-h(B.bottom,"y"),0):B.top!==!1?h(B.top,"y"):Math.round(Math.max(n()-B.h-D-O,0)/2),g.css({top:c.top,left:c.left,visibility:"visible"}),v[0].style.width=v[0].style.height="9999px",r={width:B.w+A+_,height:B.h+D+O,top:a,left:d},t){var u=0;e.each(r,function(e){return r[e]!==dt[e]?(u=t,void 0):void 0}),t=u}dt=r,t||g.css(r),g.dequeue().animate(r,{duration:t||0,complete:function(){o(),$=!1,v[0].style.width=B.w+A+_+"px",v[0].style.height=B.h+D+O+"px",B.reposition&&setTimeout(function(){E.bind("resize."+Z,Q.position)},1),i&&i()},step:o})},Q.resize=function(e){var t;U&&(e=e||{},e.width&&(B.w=h(e.width,"x")-A-_),e.innerWidth&&(B.w=h(e.innerWidth,"x")),H.css({width:B.w}),e.height&&(B.h=h(e.height,"y")-D-O),e.innerHeight&&(B.h=h(e.innerHeight,"y")),e.innerHeight||e.height||(t=H.scrollTop(),H.css({height:"auto"}),B.h=H.height()),H.css({height:B.h}),t&&H.scrollTop(t),Q.position("none"===B.transition?0:B.speed))},Q.prep=function(i){function n(){return B.w=B.w||H.width(),B.w=B.mw&&B.mw<B.w?B.mw:B.w,B.w}function h(){return B.h=B.h||H.height(),B.h=B.mh&&B.mh<B.h?B.mh:B.h,B.h}if(U){var a,d="none"===B.transition?0:B.speed;H.empty().remove(),H=o(st,"LoadedContent").append(i),H.hide().appendTo(W.show()).css({width:n(),overflow:B.scrolling?"auto":"hidden"}).css({height:h()}).prependTo(y),W.hide(),e(j).css({"float":"none"}),a=function(){function i(){e.support.opacity===!1&&g[0].style.removeAttribute("filter")}var n,h,a=k.length,u="frameBorder",f="allowTransparency";U&&(h=function(){clearTimeout(G),F.hide(),c(ot,B.onComplete)},L.html(B.title).add(H).show(),a>1?("string"==typeof B.current&&S.html(B.current.replace("{current}",z+1).replace("{total}",a)).show(),R[B.loop||a-1>z?"show":"hide"]().html(B.next),I[B.loop||z?"show":"hide"]().html(B.previous),ct(),B.preloading&&e.each([r(-1),r(1)],function(){var i,o,n=k[this],r=e.data(n,Y);r&&r.href?(i=r.href,e.isFunction(i)&&(i=i.call(n))):i=e(n).attr("href"),i&&l(r,i)&&(i=s(r,i),o=t.createElement("img"),o.src=i)})):P.hide(),B.iframe?(n=o("iframe")[0],u in n&&(n[u]=0),f in n&&(n[f]="true"),B.scrolling||(n.scrolling="no"),e(n).attr({src:B.href,name:(new Date).getTime(),"class":Z+"Iframe",allowFullScreen:!0,webkitAllowFullScreen:!0,mozallowfullscreen:!0}).one("load",h).appendTo(H),lt.one(ht,function(){n.src="//about:blank"}),B.fastIframe&&e(n).trigger("load")):h(),"fade"===B.transition?g.fadeTo(d,1,i):i())},"fade"===B.transition?g.fadeTo(d,0,function(){Q.position(0,a)}):Q.position(d,a)}},Q.next=function(){!$&&k[1]&&(B.loop||k[z+1])&&(z=r(1),u(k[z]))},Q.prev=function(){!$&&k[1]&&(B.loop||z)&&(z=r(-1),u(k[z]))},Q.close=function(){U&&!q&&(q=!0,U=!1,c(nt,B.onCleanup),E.unbind("."+Z),w.fadeTo(B.fadeOut||0,0),g.stop().fadeTo(B.fadeOut||0,0,function(){g.add(w).css({opacity:1,cursor:"auto"}).hide(),c(ht),H.empty().remove(),setTimeout(function(){q=!1,c(rt,B.onClosed)},1)}))},Q.remove=function(){g&&(g.stop(),e.colorbox.close(),g.stop().remove(),w.remove(),q=!1,g=null,e("."+et).removeData(Y).removeClass(et),e(t).unbind("click."+Z))},Q.element=function(){return e(N)},Q.settings=X)})(jQuery,document,window);
 \ No newline at end of file
@@ -1,232 +0,0 @@
-/*
-Created By: Chris Campbell
-Website: http://particletree.com
-Date: 2/1/2006
-
-Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
-*/
-
-/*-------------------------------GLOBAL VARIABLES------------------------------------*/
-
-var detect = navigator.userAgent.toLowerCase();
-var OS,browser,version,total,thestring;
-
-/*-----------------------------------------------------------------------------------------------*/
-
-//Browser detect script origionally created by Peter Paul Koch at http://www.quirksmode.org/
-
-function getBrowserInfo() {
-	if (checkIt('konqueror')) {
-		browser = "Konqueror";
-		OS = "Linux";
-	}
-	else if (checkIt('safari')) browser 	= "Safari"
-	else if (checkIt('omniweb')) browser 	= "OmniWeb"
-	else if (checkIt('opera')) browser 		= "Opera"
-	else if (checkIt('webtv')) browser 		= "WebTV";
-	else if (checkIt('icab')) browser 		= "iCab"
-	else if (checkIt('msie')) browser 		= "Internet Explorer"
-	else if (!checkIt('compatible')) {
-		browser = "Netscape Navigator"
-		version = detect.charAt(8);
-	}
-	else browser = "An unknown browser";
-
-	if (!version) version = detect.charAt(place + thestring.length);
-
-	if (!OS) {
-		if (checkIt('linux')) OS 		= "Linux";
-		else if (checkIt('x11')) OS 	= "Unix";
-		else if (checkIt('mac')) OS 	= "Mac"
-		else if (checkIt('win')) OS 	= "Windows"
-		else OS 								= "an unknown operating system";
-	}
-}
-
-function checkIt(string) {
-	place = detect.indexOf(string) + 1;
-	thestring = string;
-	return place;
-}
-
-/*-----------------------------------------------------------------------------------------------*/
-
-Event.observe(window, 'load', getBrowserInfo, false);
-
-var lightbox = Class.create();
-
-lightbox.prototype = {
-
-	yPos : 0,
-	xPos : 0,
-
-	initialize: function(ctrl) {
-		this.content = ctrl.href;
-		if (ctrl.id != '') {
-		    this.lightbox_className = ctrl.id;
-		}
-		ctrl.onclick = function(){return false;};
-                ctrl.lightbox = this;
-	},
-	
-	// Turn everything on - mainly the IE fixes
-	activate: function(){
-		if (browser == 'Internet Explorer'){
-			this.getScroll();
-			this.prepareIE('100%', 'hidden');
-			this.setScroll(0,0);
-			this.hideSelects('hidden');
-		}
-		this.hideObjectsAndEmbeds('hidden');
-		this.displayLightbox("block");
-	},
-	
-	// Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox
-	prepareIE: function(height, overflow){
-		bod = document.getElementsByTagName('body')[0];
-		bod.style.height = height;
-		bod.style.overflow = overflow;
-
-		htm = document.getElementsByTagName('html')[0];
-		htm.style.height = height;
-		htm.style.overflow = overflow; 
-	},
-	
-	// In IE, select elements hover on top of the lightbox
-	hideSelects: function(visibility){
-		selects = document.getElementsByTagName('select');
-		for(i = 0; i < selects.length; i++) {
-			selects[i].style.visibility = visibility;
-		}
-	},
-
-	// In FF, objects and embeds elements hover on top of the lightbox
-	hideObjectsAndEmbeds: function(visibility){
-		var f = function(collection) {
-		  for(i = 0; i < collection.length; i++) {
-			if (collection[i].style) {
-				collection[i].style.visibility = visibility;
-			}
-		  }
-		};
-		f(document.getElementsByTagName('object'));
-		f(document.getElementsByTagName('embed'));
-	},
-
-	// Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
-	getScroll: function(){
-		if (self.pageYOffset) {
-			this.yPos = self.pageYOffset;
-		} else if (document.documentElement && document.documentElement.scrollTop){
-			this.yPos = document.documentElement.scrollTop; 
-		} else if (document.body) {
-			this.yPos = document.body.scrollTop;
-		}
-	},
-	
-	setScroll: function(x, y){
-		window.scrollTo(x, y); 
-	},
-	
-	displayLightbox: function(display){
-		$('overlay').style.display = display;
-		$('lightbox').style.display = display;
-		if(display != 'none') this.loadInfo();
-	},
-	
-	// Begin Ajax request based off of the href of the clicked linked
-	loadInfo: function() {
-		var myAjax = new Ajax.Request(
-	this.content,
-	{method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
-		);
-		
-	},
-	
-	// Display Ajax response
-	processInfo: function(response){
-		info = "<div id='lbContent'><div id='lbBottomBG'><div id='lbTopBG'>" + response.responseText + "</div></div></div>";
-		new Insertion.Before($('lbLoadMessage'), info)
-		if (this.lightbox_className) {
-			$('lightbox').className = "done " + this.lightbox_className;
-		} else {
-			$('lightbox').className = "done";
-		}
-		this.actions();			
-	},
-	
-	// Search through new links within the lightbox, and attach click event
-	actions: function(){
-		lbActions = document.getElementsByClassName('lbAction');
-
-		for(i = 0; i < lbActions.length; i++) {
-			Event.observe(lbActions[i], 'click', this[lbActions[i].rel].bindAsEventListener(this), false);
-			lbActions[i].onclick = function(){return false;};
-		}
-
-	},
-	
-	// Example of creating your own functionality once lightbox is initiated
-	insert: function(e){
-	   link = Event.element(e).parentNode;
-	   Element.remove($('lbContent'));
-	 
-	   var myAjax = new Ajax.Request(
-			  link.href,
-			  {method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
-	   );
-	 
-	},
-	
-	// Example of creating your own functionality once lightbox is initiated
-	deactivate: function(){
-		Element.remove($('lbContent'));
-		
-		if (browser == "Internet Explorer"){
-			this.setScroll(0,this.yPos);
-			this.prepareIE("auto", "auto");
-			this.hideSelects("visible");
-		}
-		this.hideObjectsAndEmbeds("visible");
-		this.displayLightbox("none");
-	}
-}
-
-/*-----------------------------------------------------------------------------------------------*/
-
-jQuery('.lbOn').live('click', function(event) {
-  if (jQuery('#lbLoadMessage').length == 0)
-    addLightboxMarkup();
-  if (this.lightbox == undefined)
-    valid = new lightbox(this);
-  else {
-    removeLightboxMarkup();
-    addLightboxMarkup();
-  }
-
-  this.lightbox.activate();
-
-  event.preventDefault();
-  return false;
-});
-
-// Add in markup necessary to make this work. Basically two divs:
-// Overlay holds the shadow
-// Lightbox is the centered square that the content is put into.
-function addLightboxMarkup() {
-	bod 				= document.getElementsByTagName('body')[0];
-	overlay 			= document.createElement('div');
-	overlay.id		= 'overlay';
-	lb					= document.createElement('div');
-	lb.id				= 'lightbox';
-	lb.className 	= 'loading';
-	lb.innerHTML	= '<div id="lbLoadMessage">' +
-						  '<img src="' + noosfero_root() + '/images/2loading.gif"/>' +
-						  '</div>';
-	bod.appendChild(overlay);
-	bod.appendChild(lb);
-}
-function removeLightboxMarkup() {
-    Element.remove($('overlay'));
-    Element.remove($('lightbox'));
-}
@@ -0,0 +1,58 @@
+noosfero.modal = {
+
+  watchClass: function() {
+    jQuery(function($) {
+      $(document).delegate('.modal-toggle', 'click', function() {
+        $.colorbox({
+          href:       $(this).attr('href'),
+          maxWidth:   $(window).width()-50,
+          height:     $(window).height()-50,
+          open:       true,
+          close:      'Cancel',
+          class:      'modal',
+          onComplete: function(bt) {
+            var opt = {}, maxH = $(window).height()-50;
+            if ($('#cboxLoadedContent *:first').height() > maxH) opt.height = maxH;
+            $.colorbox.resize(opt);
+          }
+        });
+        return false;
+      });
+
+      $(document).delegate('.modal-close', 'click', function() {
+        $.colorbox.close();
+        return false;
+      });
+
+    });
+  },
+
+  inline: function(href, options) {
+    href = jQuery(href);
+    options = jQuery.extend({
+      inline: true, href: href,
+      onLoad: function(){ href.show(); },
+      onCleanup: function(){ href.hide(); },
+    }, options)
+
+    jQuery.colorbox(options);
+
+    return false;
+  },
+
+  html: function(html, options) {
+    options = jQuery.extend({
+      html: html,
+    }, options);
+
+    jQuery.colorbox(options);
+  },
+
+  close: function() {
+    jQuery.colorbox.close();
+  },
+
+};
+
+noosfero.modal.watchClass();
+
 jQuery(function($) {
   $('.report-abuse-action').live('click', function() {
     if($(this).attr('href')){
-      $.fn.colorbox({
-        href: $(this).attr('href'),
+      noosfero.modal.inline($(this).attr('href'), {
         innerHeight: '300px',
         innerWidth: '445px'
       });
@@ -1,319 +0,0 @@
-/*
- * Thickbox 3.1 - One Box To Rule Them All.
- * By Cody Lindley (http://www.codylindley.com)
- * Copyright (c) 2007 cody lindley
- * Licensed under the MIT License: http://www.opensource.org/licenses/mit-license.php
-*/
-		  
-var tb_pathToImage = "/images/loading.gif";
-
-/*!!!!!!!!!!!!!!!!! edit below this line at your own risk !!!!!!!!!!!!!!!!!!!!!!!*/
-
-//on page load call tb_init
-jQuery(document).ready(function(){   
-	tb_init('a.thickbox, area.thickbox, input.thickbox');//pass where to apply thickbox
-	imgLoader = new Image();// preload image
-	imgLoader.src = noosfero_root() + tb_pathToImage;
-});
-
-//add thickbox to href & area elements that have a class of .thickbox
-function tb_init(domChunk){
-	jQuery(domChunk).click(function(){
-	var t = this.title || this.name || null;
-	var a = this.href || this.alt;
-	var g = this.rel || false;
-	tb_show(t,a,g);
-	this.blur();
-	return false;
-	});
-}
-
-function tb_show(caption, url, imageGroup) {//function called when the user clicks on a thickbox link
-
-	try {
-		if (typeof document.body.style.maxHeight === "undefined") {//if IE 6
-			jQuery("body","html").css({height: "100%", width: "100%"});
-			jQuery("html").css("overflow","hidden");
-			if (document.getElementById("TB_HideSelect") === null) {//iframe to hide select elements in ie6
-				jQuery("body").append("<iframe id='TB_HideSelect'></iframe><div id='TB_overlay'></div><div id='TB_window'></div>");
-				jQuery("#TB_overlay").click(tb_remove);
-			}
-		}else{//all others
-			if(document.getElementById("TB_overlay") === null){
-				jQuery("body").append("<div id='TB_overlay'></div><div id='TB_window'></div>");
-				jQuery("#TB_overlay").click(tb_remove);
-			}
-		}
-		
-		if(tb_detectMacXFF()){
-			jQuery("#TB_overlay").addClass("TB_overlayMacFFBGHack");//use png overlay so hide flash
-		}else{
-			jQuery("#TB_overlay").addClass("TB_overlayBG");//use background and opacity
-		}
-		
-		if(caption===null){caption="";}
-		jQuery("body").append("<div id='TB_load'><img src='"+imgLoader.src+"' /></div>");//add loader to the page
-		jQuery('#TB_load').show();//show loader
-		
-		var baseURL;
-	   if(url.indexOf("?")!==-1){ //ff there is a query string involved
-			baseURL = url.substr(0, url.indexOf("?"));
-	   }else{ 
-	   		baseURL = url;
-	   }
-	   
-	   var urlString = /\.jpg$|\.jpeg$|\.png$|\.gif$|\.bmp$/;
-	   var urlType = baseURL.toLowerCase().match(urlString);
-
-		if(urlType == '.jpg' || urlType == '.jpeg' || urlType == '.png' || urlType == '.gif' || urlType == '.bmp'){//code to show images
-				
-			TB_PrevCaption = "";
-			TB_PrevURL = "";
-			TB_PrevHTML = "";
-			TB_NextCaption = "";
-			TB_NextURL = "";
-			TB_NextHTML = "";
-			TB_imageCount = "";
-			TB_FoundURL = false;
-			if(imageGroup){
-				TB_TempArray = jQuery("a[@rel="+imageGroup+"]").get();
-				for (TB_Counter = 0; ((TB_Counter < TB_TempArray.length) && (TB_NextHTML === "")); TB_Counter++) {
-					var urlTypeTemp = TB_TempArray[TB_Counter].href.toLowerCase().match(urlString);
-						if (!(TB_TempArray[TB_Counter].href == url)) {						
-							if (TB_FoundURL) {
-								TB_NextCaption = TB_TempArray[TB_Counter].title;
-								TB_NextURL = TB_TempArray[TB_Counter].href;
-								TB_NextHTML = "<span id='TB_next'>&nbsp;&nbsp;<a href='#'>Next &gt;</a></span>";
-							} else {
-								TB_PrevCaption = TB_TempArray[TB_Counter].title;
-								TB_PrevURL = TB_TempArray[TB_Counter].href;
-								TB_PrevHTML = "<span id='TB_prev'>&nbsp;&nbsp;<a href='#'>&lt; Prev</a></span>";
-							}
-						} else {
-							TB_FoundURL = true;
-							TB_imageCount = "Image " + (TB_Counter + 1) +" of "+ (TB_TempArray.length);											
-						}
-				}
-			}
-
-			imgPreloader = new Image();
-			imgPreloader.onload = function(){		
-			imgPreloader.onload = null;
-				
-			// Resizing large images - orginal by Christian Montoya edited by me.
-			var pagesize = tb_getPageSize();
-			var x = pagesize[0] - 150;
-			var y = pagesize[1] - 150;
-			var imageWidth = imgPreloader.width;
-			var imageHeight = imgPreloader.height;
-			if (imageWidth > x) {
-				imageHeight = imageHeight * (x / imageWidth); 
-				imageWidth = x; 
-				if (imageHeight > y) { 
-					imageWidth = imageWidth * (y / imageHeight); 
-					imageHeight = y; 
-				}
-			} else if (imageHeight > y) { 
-				imageWidth = imageWidth * (y / imageHeight); 
-				imageHeight = y; 
-				if (imageWidth > x) { 
-					imageHeight = imageHeight * (x / imageWidth); 
-					imageWidth = x;
-				}
-			}
-			// End Resizing
-			
-			TB_WIDTH = imageWidth + 30;
-			TB_HEIGHT = imageHeight + 60;
-			jQuery("#TB_window").append("<a href='' id='TB_ImageOff' title='Close'><img id='TB_Image' src='"+url+"' width='"+imageWidth+"' height='"+imageHeight+"' alt='"+caption+"'/></a>" + "<div id='TB_caption'>"+caption+"<div id='TB_secondLine'>" + TB_imageCount + TB_PrevHTML + TB_NextHTML + "</div></div><div id='TB_closeWindow'><a href='#' id='TB_closeWindowButton' title='Close'>close</a> or Esc Key</div>"); 		
-			
-			jQuery("#TB_closeWindowButton").click(tb_remove);
-			
-			if (!(TB_PrevHTML === "")) {
-				function goPrev(){
-					if(jQuery(document).unbind("click",goPrev)){jQuery(document).unbind("click",goPrev);}
-					jQuery("#TB_window").remove();
-					jQuery("body").append("<div id='TB_window'></div>");
-					tb_show(TB_PrevCaption, TB_PrevURL, imageGroup);
-					return false;	
-				}
-				jQuery("#TB_prev").click(goPrev);
-			}
-			
-			if (!(TB_NextHTML === "")) {		
-				function goNext(){
-					jQuery("#TB_window").remove();
-					jQuery("body").append("<div id='TB_window'></div>");
-					tb_show(TB_NextCaption, TB_NextURL, imageGroup);				
-					return false;	
-				}
-				jQuery("#TB_next").click(goNext);
-				
-			}
-
-			document.onkeydown = function(e){ 	
-				if (e == null) { // ie
-					keycode = event.keyCode;
-				} else { // mozilla
-					keycode = e.which;
-				}
-				if(keycode == 27){ // close
-					tb_remove();
-				} else if(keycode == 190){ // display previous image
-					if(!(TB_NextHTML == "")){
-						document.onkeydown = "";
-						goNext();
-					}
-				} else if(keycode == 188){ // display next image
-					if(!(TB_PrevHTML == "")){
-						document.onkeydown = "";
-						goPrev();
-					}
-				}	
-			};
-			
-			tb_position();
-			jQuery("#TB_load").remove();
-			jQuery("#TB_ImageOff").click(tb_remove);
-			jQuery("#TB_window").css({display:"block"}); //for safari using css instead of show
-			};
-			
-			imgPreloader.src = url;
-		}else{//code to show html
-			
-			var queryString = url.replace(/^[^\?]+\??/,'');
-			var params = tb_parseQuery( queryString );
-
-			TB_WIDTH = (params['width']*1) + 30 || 630; //defaults to 630 if no paramaters were added to URL
-			TB_HEIGHT = (params['height']*1) + 40 || 440; //defaults to 440 if no paramaters were added to URL
-			ajaxContentW = TB_WIDTH - 30;
-			ajaxContentH = TB_HEIGHT - 45;
-			
-			if(url.indexOf('TB_iframe') != -1){// either iframe or ajax window		
-					urlNoQuery = url.split('TB_');
-					jQuery("#TB_iframeContent").remove();
-					if(params['modal'] != "true"){//iframe no modal
-						jQuery("#TB_window").append("<div id='TB_title'><div id='TB_ajaxWindowTitle'>"+caption+"</div><div id='TB_closeAjaxWindow'><a href='#' id='TB_closeWindowButton' title='Close'>close</a> or Esc Key</div></div><iframe frameborder='0' hspace='0' src='"+urlNoQuery[0]+"' id='TB_iframeContent' name='TB_iframeContent"+Math.round(Math.random()*1000)+"' onload='tb_showIframe()' style='width:"+(ajaxContentW + 29)+"px;height:"+(ajaxContentH + 17)+"px;' > </iframe>");
-					}else{//iframe modal
-					jQuery("#TB_overlay").unbind();
-						jQuery("#TB_window").append("<iframe frameborder='0' hspace='0' src='"+urlNoQuery[0]+"' id='TB_iframeContent' name='TB_iframeContent"+Math.round(Math.random()*1000)+"' onload='tb_showIframe()' style='width:"+(ajaxContentW + 29)+"px;height:"+(ajaxContentH + 17)+"px;'> </iframe>");
-					}
-			}else{// not an iframe, ajax
-					if(jQuery("#TB_window").css("display") != "block"){
-						if(params['modal'] != "true"){//ajax no modal
-						jQuery("#TB_window").append("<div id='TB_title'><div id='TB_ajaxWindowTitle'>"+caption+"</div><div id='TB_closeAjaxWindow'><a href='#' id='TB_closeWindowButton'>close</a> or Esc Key</div></div><div id='TB_ajaxContent' style='width:"+ajaxContentW+"px;height:"+ajaxContentH+"px'></div>");
-						}else{//ajax modal
-						jQuery("#TB_overlay").unbind();
-						jQuery("#TB_window").append("<div id='TB_ajaxContent' class='TB_modal' style='width:"+ajaxContentW+"px;height:"+ajaxContentH+"px;'></div>");	
-						}
-					}else{//this means the window is already up, we are just loading new content via ajax
-						jQuery("#TB_ajaxContent")[0].style.width = ajaxContentW +"px";
-						jQuery("#TB_ajaxContent")[0].style.height = ajaxContentH +"px";
-						jQuery("#TB_ajaxContent")[0].scrollTop = 0;
-						jQuery("#TB_ajaxWindowTitle").html(caption);
-					}
-			}
-					
-			jQuery("#TB_closeWindowButton").click(tb_remove);
-			
-				if(url.indexOf('TB_inline') != -1){	
-					jQuery("#TB_ajaxContent").append(jQuery('#' + params['inlineId']).children());
-					jQuery("#TB_window").unload(function () {
-						jQuery('#' + params['inlineId']).append( jQuery("#TB_ajaxContent").children() ); // move elements back when you're finished
-					});
-					tb_position();
-					jQuery("#TB_load").remove();
-					jQuery("#TB_window").css({display:"block"}); 
-				}else if(url.indexOf('TB_iframe') != -1){
-					tb_position();
-					if(jQuery.browser.safari){//safari needs help because it will not fire iframe onload
-						jQuery("#TB_load").remove();
-						jQuery("#TB_window").css({display:"block"});
-					}
-				}else{
-					jQuery("#TB_ajaxContent").load(url += "&random=" + (new Date().getTime()),function(){//to do a post change this load method
-						tb_position();
-						jQuery("#TB_load").remove();
-						tb_init("#TB_ajaxContent a.thickbox");
-						jQuery("#TB_window").css({display:"block"});
-					});
-				}
-			
-		}
-
-		if(!params['modal']){
-			document.onkeyup = function(e){ 	
-				if (e == null) { // ie
-					keycode = event.keyCode;
-				} else { // mozilla
-					keycode = e.which;
-				}
-				if(keycode == 27){ // close
-					tb_remove();
-				}	
-			};
-		}
-		
-	} catch(e) {
-		//nothing here
-	}
-}
-
-//helper functions below
-function tb_showIframe(){
-	jQuery("#TB_load").remove();
-	jQuery("#TB_window").css({display:"block"});
-}
-
-function tb_remove() {
- 	jQuery("#TB_imageOff").unbind("click");
-	jQuery("#TB_closeWindowButton").unbind("click");
-	jQuery("#TB_window").fadeOut("fast",function(){jQuery('#TB_window,#TB_overlay,#TB_HideSelect').trigger("unload").unbind().remove();});
-	jQuery("#TB_load").remove();
-	if (typeof document.body.style.maxHeight == "undefined") {//if IE 6
-		jQuery("body","html").css({height: "auto", width: "auto"});
-		jQuery("html").css("overflow","");
-	}
-	document.onkeydown = "";
-	document.onkeyup = "";
-	return false;
-}
-
-function tb_position() {
-jQuery("#TB_window").css({marginLeft: '-' + parseInt((TB_WIDTH / 2),10) + 'px', width: TB_WIDTH + 'px'});
-	if ( !(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away IE6
-		jQuery("#TB_window").css({marginTop: '-' + parseInt((TB_HEIGHT / 2),10) + 'px'});
-	}
-}
-
-function tb_parseQuery ( query ) {
-   var Params = {};
-   if ( ! query ) {return Params;}// return empty object
-   var Pairs = query.split(/[;&]/);
-   for ( var i = 0; i < Pairs.length; i++ ) {
-      var KeyVal = Pairs[i].split('=');
-      if ( ! KeyVal || KeyVal.length != 2 ) {continue;}
-      var key = unescape( KeyVal[0] );
-      var val = unescape( KeyVal[1] );
-      val = val.replace(/\+/g, ' ');
-      Params[key] = val;
-   }
-   return Params;
-}
-
-function tb_getPageSize(){
-	var de = document.documentElement;
-	var w = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
-	var h = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
-	arrayPageSize = [w,h];
-	return arrayPageSize;
-}
-
-function tb_detectMacXFF() {
-  var userAgent = navigator.userAgent.toLowerCase();
-  if (userAgent.indexOf('mac') != -1 && userAgent.indexOf('firefox')!=-1) {
-    return true;
-  }
-}
-
-
@@ -1901,17 +1901,6 @@ a.button.disabled, input.disabled {
  * Block options editor floating window *
  ****************************************/
  
-/* FIXME This changes broke colorboxes all over the place.
- * Therefore I'm canceling them until they are properly treateda. */
-#cboxLoadedContent {
-  background: #FFF;
-/*  box-shadow: 0 0 15px #888 inset;
-    border-radius: 5px;
-    border: 1px solid #777;
-    border-left: none;
-    border-right: none; */
-}
-
 .block-config-options {
   padding: 0px 10px 0px 30px;
 }
 /*
-    ColorBox Core Style:
+    Colorbox Core Style:
     The following CSS is consistent between example themes and should not be altered.
 */
 #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
+#cboxWrapper {max-width:none;}
 #cboxOverlay{position:fixed; width:100%; height:100%;}
 #cboxMiddleLeft, #cboxBottomLeft{clear:left;}
 #cboxContent{position:relative;}
-#cboxLoadedContent{overflow:auto;}
+#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
 #cboxTitle{margin:0;}
-#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
+#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
 #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
-.cboxPhoto{float:left; margin:auto; border:0; display:block;}
+.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
 .cboxIframe{width:100%; height:100%; display:block; border:0;}
+#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
  
-/* 
+/*
     User Style:
-    Change the following styles to modify the appearance of ColorBox.  They are
+    Change the following styles to modify the appearance of Colorbox.  They are
     ordered & tabbed in a way that represents the nesting of the generated HTML.
 */
 #cboxOverlay{background:url(../images/colorbox/overlay.png) repeat 0 0;}
-#colorbox{}
-    #cboxTopLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -100px 0;}
-    #cboxTopRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -129px 0;}
-    #cboxBottomLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -100px -29px;}
-    #cboxBottomRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -129px -29px;}
+#colorbox{outline:0;}
+    #cboxTopLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -101px 0;}
+    #cboxTopRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -130px 0;}
+    #cboxBottomLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -101px -29px;}
+    #cboxBottomRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) no-repeat -130px -29px;}
     #cboxMiddleLeft{width:21px; background:url(../images/colorbox/controls.png) left top repeat-y;}
     #cboxMiddleRight{width:21px; background:url(../images/colorbox/controls.png) right top repeat-y;}
     #cboxTopCenter{height:21px; background:url(../images/colorbox/border.png) 0 0 repeat-x;}
     #cboxBottomCenter{height:21px; background:url(../images/colorbox/border.png) 0 -29px repeat-x;}
     #cboxContent{background:#fff; overflow:hidden;}
+        .cboxIframe{background:#fff;}
         #cboxError{padding:50px; border:1px solid #ccc;}
         #cboxLoadedContent{margin-bottom:28px;}
         #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
         #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
+        #cboxLoadingOverlay{background:url(../images/colorbox/loading_background.png) no-repeat center center;}
+        #cboxLoadingGraphic{background:url(../images/colorbox/loading.gif) no-repeat center center;}
+
+        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
+        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
+
+        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
+        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
+
         #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
         #cboxPrevious{position:absolute; bottom:0; left:0; background:url(../images/colorbox/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
-        #cboxPrevious.hover{background-position:-75px -25px;}
+        #cboxPrevious:hover{background-position:-75px -25px;}
         #cboxNext{position:absolute; bottom:0; left:27px; background:url(../images/colorbox/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
-        #cboxNext.hover{background-position:-50px -25px;}
-        #cboxLoadingOverlay{background:url(../images/colorbox/loading_background.png) no-repeat center center;}
-        #cboxLoadingGraphic{background:url(../images/colorbox/loading.gif) no-repeat center center;}
+        #cboxNext:hover{background-position:-50px -25px;}
         #cboxClose{position:absolute; bottom:0; right:0; background:url(../images/colorbox/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
-        #cboxClose.hover{background-position:-25px -25px;}
+        #cboxClose:hover{background-position:-25px -25px;}
  
 /*
-  The following fixes a problem where IE7+ replaces a PNG's alpha transparency with a black fill
-  when an alpha filter (opacity change) is set on the element or ancestor element.
+  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
+  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
+  See: http://jacklmoore.com/notes/ie-transparency-problems/
 */
 .cboxIE #cboxTopLeft,
 .cboxIE #cboxTopCenter,
@@ -57,26 +68,3 @@
 .cboxIE #cboxMiddleRight {
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
 }
-
-/*
-  The following provides PNG transparency support for IE6
-*/
-.cboxIE6 #cboxTopLeft{background:url(../images/colorbox/ie6/borderTopLeft.png);}
-.cboxIE6 #cboxTopCenter{background:url(../images/colorbox/ie6/borderTopCenter.png);}
-.cboxIE6 #cboxTopRight{background:url(../images/colorbox/ie6/borderTopRight.png);}
-.cboxIE6 #cboxBottomLeft{background:url(../images/colorbox/ie6/borderBottomLeft.png);}
-.cboxIE6 #cboxBottomCenter{background:url(../images/colorbox/ie6/borderBottomCenter.png);}
-.cboxIE6 #cboxBottomRight{background:url(../images/colorbox/ie6/borderBottomRight.png);}
-.cboxIE6 #cboxMiddleLeft{background:url(../images/colorbox/ie6/borderMiddleLeft.png);}
-.cboxIE6 #cboxMiddleRight{background:url(../images/colorbox/ie6/borderMiddleRight.png);}
-
-.cboxIE6 #cboxTopLeft,
-.cboxIE6 #cboxTopCenter,
-.cboxIE6 #cboxTopRight,
-.cboxIE6 #cboxBottomLeft,
-.cboxIE6 #cboxBottomCenter,
-.cboxIE6 #cboxBottomRight,
-.cboxIE6 #cboxMiddleLeft,
-.cboxIE6 #cboxMiddleRight {
-    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
-}
@@ -1,63 +0,0 @@
-/* - - - - - - - - - - - - - - - - - - - - -
-
-Title : Lightbox CSS
-Author : Kevin Hale
-URL : http://particletree.com/features/lightbox-gone-wild/
-
-Created : January 13, 2006
-Modified : February 1, 2006
-
-- - - - - - - - - - - - - - - - - - - - - */
-
-#lightbox {
-  display: none;
-  position: absolute;
-  top: 150px;
-  left: 50%;
-  z-index: 300;
-  width: 500px;
-  margin-left: -265px;
-  border: 1px solid #000;
-  text-align: left;
-  padding: 1em;
-  background: #FFF;
-}
-
-#overlay{
-	display:none;
-	position:absolute;
-	top:0;
-	left:0;
-	width:100%;
-	height:100%;
-	z-index:200;
-	background-color:#000;
-	-moz-opacity: 0.75;
-	opacity:.75;
-	filter: alpha(opacity=75);
-}
-#overlay[id]{
-	position:fixed;
-}
-
-#lightbox.done #lbLoadMessage{
-	display:none;
-}
-#lightbox.done #lbContent{
-	display:block;
-}
-#lightbox.loading #lbContent{
-	display:none;
-}
-#lightbox.loading #lbLoadMessage{
-	display:block;
-}
-
-#lightbox.done img{
-	width:100%;
-	height:100%;
-}
-
-#lightbox select {
-  max-width: 100%;
-}
@@ -1,163 +0,0 @@
-/* ----------------------------------------------------------------------------------------------------------------*/
-/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
-/* ----------------------------------------------------------------------------------------------------------------*/
-/**{padding: 0; margin: 0;}*/
-
-/* ----------------------------------------------------------------------------------------------------------------*/
-/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
-/* ----------------------------------------------------------------------------------------------------------------*/
-#TB_window {
-	font: 12px Arial, Helvetica, sans-serif;
-	color: #333333;
-}
-
-#TB_secondLine {
-	font: 10px Arial, Helvetica, sans-serif;
-	color:#666666;
-}
-
-#TB_window a:link {color: #666666;}
-#TB_window a:visited {color: #666666;}
-#TB_window a:hover {color: #000;}
-#TB_window a:active {color: #666666;}
-#TB_window a:focus{color: #666666;}
-
-/* ----------------------------------------------------------------------------------------------------------------*/
-/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
-/* ----------------------------------------------------------------------------------------------------------------*/
-#TB_overlay {
-	position: fixed;
-	z-index:200;
-	top: 0px;
-	left: 0px;
-	height:100%;
-	width:100%;
-}
-
-.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
-.TB_overlayBG {
-	background-color:#000;
-	filter:alpha(opacity=75);
-	-moz-opacity: 0.75;
-	opacity: 0.75;
-}
-
-* html #TB_overlay { /* ie6 hack */
-     position: absolute;
-     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
-}
-
-#TB_window {
-	position: fixed;
-	background: white;
-	z-index: 202;
-	color:#000000;
-	display:none;
-	border: 1px solid #000;
-	text-align:left;
-	top:50%;
-	left:50%;
-}
-
-* html #TB_window { /* ie6 hack */
-position: absolute;
-margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
-}
-
-#TB_window img#TB_Image {
-	display:block;
-	margin: 15px 0 0 15px;
-	border-right: 1px solid #ccc;
-	border-bottom: 1px solid #ccc;
-	border-top: 1px solid #666;
-	border-left: 1px solid #666;
-}
-
-#TB_caption{
-	height:25px;
-	padding:7px 30px 10px 25px;
-	float:left;
-}
-
-#TB_closeWindow{
-	height:25px;
-	padding:11px 25px 10px 0;
-	float:right;
-}
-
-#TB_closeAjaxWindow{
-	padding:7px 10px 5px 0;
-	margin-bottom:1px;
-	text-align:right;
-	float:right;
-}
-
-#TB_ajaxWindowTitle{
-	float:left;
-	padding:7px 0 5px 10px;
-	margin-bottom:1px;
-}
-
-#TB_title{
-	background-color:#e8e8e8;
-	height:27px;
-}
-
-#TB_ajaxContent{
-	clear:both;
-	padding:2px 15px 15px 15px;
-	overflow:auto;
-	text-align:left;
-	line-height:1.4em;
-}
-
-#TB_ajaxContent.TB_modal{
-	padding:15px;
-}
-
-#TB_ajaxContent p{
-	padding:5px 0px 5px 0px;
-}
-
-#TB_load{
-	position: fixed;
-	display:none;
-	height:13px;
-	width:208px;
-	z-index:203;
-	top: 50%;
-	left: 50%;
-	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
-}
-
-* html #TB_load { /* ie6 hack */
-position: absolute;
-margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
-}
-
-#TB_HideSelect{
-	z-index:199;
-	position:fixed;
-	top: 0;
-	left: 0;
-	background-color:#fff;
-	border:none;
-	filter:alpha(opacity=0);
-	-moz-opacity: 0;
-	opacity: 0;
-	height:100%;
-	width:100%;
-}
-
-* html #TB_HideSelect { /* ie6 hack */
-     position: absolute;
-     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
-}
-
-#TB_iframeContent{
-	clear:both;
-	border:none;
-	margin-bottom:-1px;
-	margin-top:1px;
-	_margin-bottom:1px;
-}
@@ -638,7 +638,7 @@ class CmsControllerTest &lt; ActionController::TestCase
  
   should 'display OK button on why_categorize popup' do
     get :why_categorize, :profile => profile.identifier
-    assert_tag :tag => 'a', :attributes => { :rel => 'deactivate'} # lightbox close button
+    assert_tag :tag => 'a', :attributes => { :rel => 'deactivate'} # modal close button
   end
  
   should 'display published option' do
@@ -1,36 +0,0 @@
-require_relative "../test_helper"
-
-class ColorboxHelperTest < ActiveSupport::TestCase
-
-  include ColorboxHelper
-
-  should 'provide the needed files' do
-    assert File.exists?(Rails.root.join('public', 'stylesheets', 'colorbox.css')), 'colorbox.css expected to be in public/stylesheets, but not found'
-    assert File.exists?(Rails.root.join('public', 'javascripts', 'colorbox.js')), 'colorbox.js expected to be in public/javascripts, but not found'
-  end
-
-  should 'provide link to close colorbox' do
-    expects(:button).with(:close, 'text', '#', has_entries({ :class => 'colorbox-close', :id => 'my-id' })).returns('[close-colorbox]')
-
-    assert_equal '[close-colorbox]', colorbox_close_button('text', :id => 'my-id')
-  end
-
-  should 'merge existing :class option in colorbox_close_button' do
-    expects(:button).with(:close, 'text', '#', has_entries({ :class => 'colorbox-close my-class', :id => 'my-id' })).returns('[close-colorbox]')
-
-    assert_equal '[close-colorbox]', colorbox_close_button('text', :class => 'my-class', :id => 'my-id' )
-  end
-
-  should 'provide colorbox_button' do
-    expects(:button).with('type', 'label', { :action => 'popup'}, has_entries({ :class => 'colorbox' })).returns('[button]')
-
-    assert_equal '[button]', colorbox_button('type', 'label', { :action => 'popup'})
-  end
-
-  should 'provide colorbox_icon_button' do
-    expects(:icon_button).with('type', 'label', { :action => 'popup'}, has_entries({ :class => 'colorbox' })).returns('[button]')
-
-    assert_equal '[button]', colorbox_icon_button('type', 'label', { :action => 'popup'})
-  end
-
-end
@@ -1,65 +0,0 @@
-require_relative "../test_helper"
-
-class LightboxHelperTest < ActiveSupport::TestCase
-
-  include LightboxHelper
-
-  def setup
-    stubs(:_).with(anything).returns('TEXT')
-  end
-
-  should 'provide the needed files' do
-    assert File.exists?(Rails.root.join('public', 'stylesheets', 'lightbox.css')), 'lightbox.css expected to be in public/stylesheets, but not found'
-    assert File.exists?(Rails.root.join('public', 'javascripts', 'lightbox.js')), 'lightbox.js expected to be in public/javascripts, but not found'
-  end
-
-  should 'provide lightbox_link_to helper' do
-    expects(:link_to).with('text', { :action => 'view', :id => '1' }, has_entries({ :class => 'lbOn', :id => 'my-link' })).returns('[link]')
-    assert_equal '[link]', lightbox_link_to('text', { :action => 'view', :id => '1'}, { :id => 'my-link' })
-  end
-
-  should 'merge existing :class option in lightbox_link_to' do
-    expects(:link_to).with('text', { :action => 'view', :id => '1' }, has_entries({ :class => 'lbOn my-button', :id => 'my-link' })).returns('[link]')
-    assert_equal '[link]', lightbox_link_to('text', { :action => 'view', :id => '1'}, { :class => 'my-button',  :id => 'my-link' })
-
-  end
-
-  should 'provide link to close lightbox' do
-    expects(:button).with(:close, 'text', '#', has_entries({ :class => 'lbAction', :rel => 'deactivate', :id => 'my-id' })).returns('[close-lightbox]')
-
-    assert_equal '[close-lightbox]', lightbox_close_button('text', :id => 'my-id')
-  end
-
-  should 'merge existing :class option in lightbox_close_button' do
-    expects(:button).with(:close, 'text', '#', has_entries({ :class => 'lbAction my-class', :rel => 'deactivate', :id => 'my-id' })).returns('[close-lightbox]')
-
-    assert_equal '[close-lightbox]', lightbox_close_button('text', :class => 'my-class', :id => 'my-id' )
-  end
-
-  should 'provide lightbox_button' do
-    expects(:button).with('type', 'label', { :action => 'popup'}, has_entries({ :class => 'lbOn' })).returns('[button]')
-
-    assert_equal '[button]', lightbox_button('type', 'label', { :action => 'popup'})
-  end
-
-  should 'provide lightbox_icon_button' do
-    expects(:icon_button).with('type', 'label', { :action => 'popup'}, has_entries({ :class => 'lbOn' })).returns('[button]')
-
-    assert_equal '[button]', lightbox_icon_button('type', 'label', { :action => 'popup'})
-  end
-
-  should 'tell if rendering inside lightbox' do
-    request = mock
-    expects(:request).returns(request)
-    request.expects(:xhr?).returns(true)
-
-    assert lightbox?
-  end
-
-  should 'provide lightbox_remote_button' do
-    expects(:button).with('type', 'label', { :action => 'popup'}, has_entries({ :class => 'remote-lbOn' })).returns('[button]')
-
-    assert_equal '[button]', lightbox_remote_button('type', 'label', { :action => 'popup'})
-  end
-
-end
@@ -0,0 +1,36 @@
+require_relative '../test_helper'
+
+class ModalHelperTest < ActiveSupport::TestCase
+
+  include ModalHelper
+
+  should 'provide the needed files' do
+    assert File.exists?(Rails.root.join('public', 'stylesheets', 'colorbox.css')), 'colorbox.css expected to be in public/stylesheets, but not found'
+    assert File.exists?(Rails.root.join('public', 'javascripts', 'jquery.colorbox-min.js')), 'jquery.colorbox-min.js expected to be in public/javascripts, but not found'
+  end
+
+  should 'provide link to close modal' do
+    expects(:button).with(:close, 'text', '#', has_entries({ :class => 'modal-toggle modal-close', :id => 'my-id' })).returns('[close-modal]')
+
+    assert_equal '[close-modal]', modal_close_button('text', :id => 'my-id')
+  end
+
+  should 'merge existing :class option in modal_close_button' do
+    expects(:button).with(:close, 'text', '#', has_entries({ :class => 'modal-toggle modal-close my-class', :id => 'my-id' })).returns('[close-modal]')
+
+    assert_equal '[close-modal]', modal_close_button('text', :class => 'my-class', :id => 'my-id' )
+  end
+
+  should 'provide modal_button' do
+    expects(:button).with('type', 'label', { :action => 'popup'}, has_entries({ :class => 'modal-toggle' })).returns('[button]')
+
+    assert_equal '[button]', modal_button('type', 'label', { :action => 'popup'})
+  end
+
+  should 'provide modal_icon_button' do
+    expects(:icon_button).with('type', 'label', { :action => 'popup'}, has_entries({ :class => 'modal-toggle' })).returns('[button]')
+
+    assert_equal '[button]', modal_icon_button('type', 'label', { :action => 'popup'})
+  end
+
+end
@@ -1,25 +0,0 @@
-require_relative "../test_helper"
-
-class ThickboxHelperTest < ActiveSupport::TestCase
-  include ThickboxHelper
-
-  def url_for(url)
-    url
-  end
-
-  should 'create thickbox links correcly' do
-    expects(:link_to).with('Title', '/url#TB_inline?height=300&width=500&inlineId=inlineLoginBox&modal=true', :class => 'thickbox')
-    thickbox_inline_popup_link('Title', '/url', 'inlineLoginBox')
-  end
-
-  should 'pass along extra options' do
-    expects(:link_to).with('Title', anything, :class => 'thickbox', :id => 'lalala', :title => 'lelele')
-    thickbox_inline_popup_link('Title', '/url', 'inlineLoginBox', :id => 'lalala', :title => 'lelele')
-  end
-
-  should 'generate close button' do
-    expects(:button_to_function).with(:close, 'Title', 'tb_remove();').returns('[close-button]')
-    assert_equal '[close-button]', thickbox_close_button('Title')
-  end
-
-end
...	...	@@ -8,11 +8,7 @@ module ApplicationHelper
8	8
9	9	include PermissionNameHelper
10	10
11		- include LightboxHelper
12		-
13		- include ThickboxHelper
14		-
15		- include ColorboxHelper
	11	+ include ModalHelper
16	12
17	13	include BoxesHelper
18	14
...	...	@@ -651,8 +647,8 @@ module ApplicationHelper
651	647	' onfocus="if(this.value==\''+s+'\'){this.value=\'\'} this.form.className=\'focus-in\'"'+
652	648	' onblur="if(/^\s*$/.test(this.value)){this.value=\''+s+'\'} this.form.className=\'focus-out\'">'+
653	649	'</form>'
654		- else #opt == 'lightbox_link' is default
655		- lightbox_link_to '<span class="icon-menu-search"></span>'+ _('Search'), {
	650	+ else
	651	+ modal_link_to '<span class="icon-menu-search"></span>'+ _('Search'), {
656	652	:controller => 'search',
657	653	:action => 'popup',
658	654	:category_path => (@category ? @category.explode_path : nil)},
...	...	@@ -1050,7 +1046,7 @@ module ApplicationHelper
1050	1046	{s_('contents\|Most commented') => {:href => url_for({:controller => 'search', :action => 'contents', :filter => 'more_comments'})}}
1051	1047	]
1052	1048	if logged_in?
1053		- links.push(_('New content') => colorbox_options({:href => url_for({:controller => 'cms', :action => 'new', :profile => current_user.login, :cms => true})}))
	1049	+ links.push(_('New content') => modal_options({:href => url_for({:controller => 'cms', :action => 'new', :profile => current_user.login, :cms => true})}))
1054	1050	end
1055	1051
1056	1052	link_to(content_tag(:span, _('Contents'), :class => 'icon-menu-articles'), {:controller => "search", :action => 'contents', :category_path => nil}, :id => 'submenu-contents') +
...	...
...	...	@@ -231,7 +231,7 @@ module BoxesHelper
231	231	end
232	232
233	233	if block.editable?
234		- buttons << colorbox_icon_button(:edit, _('Edit'), { :action => 'edit', :id => block.id })
	234	+ buttons << modal_icon_button(:edit, _('Edit'), { :action => 'edit', :id => block.id })
235	235	end
236	236
237	237	if !block.main?
...	...	@@ -241,7 +241,7 @@ module BoxesHelper
241	241	end
242	242
243	243	if block.respond_to?(:help)
244		- buttons << thickbox_inline_popup_icon(:help, _('Help on this block'), {}, "help-on-box-#{block.id}") << content_tag('div', content_tag('h2', _('Help')) + content_tag('div', block.help, :style => 'margin-bottom: 1em;') + thickbox_close_button(_('Close')), :style => 'display: none;', :id => "help-on-box-#{block.id}")
	244	+ buttons << modal_inline_icon(:help, _('Help on this block'), {}, "#help-on-box-#{block.id}") << content_tag('div', content_tag('h2', _('Help')) + content_tag('div', block.help, :style => 'margin-bottom: 1em;') + modal_close_button(_('Close')), :style => 'display: none;', :id => "help-on-box-#{block.id}")
245	245	end
246	246
247	247	if block.embedable?
...	...
...	...	@@ -1,25 +0,0 @@
1		-module ColorboxHelper
2		-
3		- def colorbox_close_button(text, options = {})
4		- button(:close, text, '#', colorbox_options(options, :close))
5		- end
6		-
7		- def colorbox_button(type, label, url, options = {})
8		- button(type, label, url, colorbox_options(options))
9		- end
10		-
11		- def colorbox_icon_button(type, label, url, options = {})
12		- icon_button(type, label, url, colorbox_options(options))
13		- end
14		-
15		- # options must be an HTML options hash as passed to link_to etc.
16		- #
17		- # returns a new hash with colorbox class added. Keeps existing classes.
18		- def colorbox_options(options, type=nil)
19		- the_class = 'colorbox'
20		- the_class += "-#{type.to_s}" unless type.nil?
21		- the_class << " #{options[:class]}" if options.has_key?(:class)
22		- options.merge(:class => the_class)
23		- end
24		-
25		-end
...	...	@@ -65,7 +65,7 @@ module CommentHelper
65	65
66	66	def link_for_edit(comment)
67	67	if comment.can_be_updated_by?(user)
68		- {:link => expirable_comment_link(comment, :edit, _('Edit'), url_for(:profile => profile.identifier, :controller => :comment, :action => :edit, :id => comment.id),:class => 'colorbox')}
	68	+ {:link => expirable_comment_link(comment, :edit, _('Edit'), url_for(:profile => profile.identifier, :controller => :comment, :action => :edit, :id => comment.id),:class => 'modal')}
69	69	end
70	70	end
71	71
...	...
...	...	@@ -1,36 +0,0 @@
1		-module LightboxHelper
2		-
3		- def lightbox_link_to(text, url, options = {})
4		- link_to(text, url, lightbox_options(options))
5		- end
6		-
7		- def lightbox_close_button(text, options = {})
8		- button(:close, text, '#', lightbox_options(options, 'lbAction').merge(:rel => 'deactivate'))
9		- end
10		-
11		- def lightbox_button(type, label, url, options = {})
12		- button(type, label, url, lightbox_options(options))
13		- end
14		-
15		- def lightbox_icon_button(type, label, url, options = {})
16		- icon_button(type, label, url, lightbox_options(options))
17		- end
18		-
19		- # options must be an HTML options hash as passed to link_to etc.
20		- #
21		- # returns a new hash with lightbox class added. Keeps existing classes.
22		- def lightbox_options(options, lightbox_type = 'lbOn')
23		- the_class = lightbox_type
24		- the_class << " #{options[:class]}" if options.has_key?(:class)
25		- options.merge(:class => the_class)
26		- end
27		-
28		- def lightbox?
29		- request.xhr?
30		- end
31		-
32		- def lightbox_remote_button(type, label, url, options = {})
33		- button(type, label, url, lightbox_options(options, 'remote-lbOn'))
34		- end
35		-
36		-end
...	...	@@ -0,0 +1,46 @@
	1	+module ModalHelper
	2	+
	3	+ def modal_inline_link_to title, url, selector, options = {}
	4	+ link_to title, url, modal_options(options.merge(:inline => selector))
	5	+ end
	6	+
	7	+ def modal_inline_icon type, title, url, selector, options = {}
	8	+ icon_button type, title, url, modal_options(options.merge(:inline => selector))
	9	+ end
	10	+
	11	+ def modal_link_to title, url, options = {}
	12	+ link_to title, url, modal_options(options)
	13	+ end
	14	+
	15	+ def modal_close_link text, options = {}
	16	+ link_to text, '#', modal_options(options, :close)
	17	+ end
	18	+
	19	+ def modal_close_button(text, options = {})
	20	+ button :close, text, '#', modal_options(options, :close).merge(:rel => 'deactivate')
	21	+ end
	22	+
	23	+ def modal_button(type, label, url, options = {})
	24	+ button type, label, url, modal_options(options)
	25	+ end
	26	+
	27	+ def modal_icon_button(type, label, url, options = {})
	28	+ icon_button type, label, url, modal_options(options)
	29	+ end
	30	+
	31	+ # options must be an HTML options hash as passed to link_to etc.
	32	+ #
	33	+ # returns a new hash with modal class added. Keeps existing classes.
	34	+ def modal_options(options, type=nil)
	35	+ inline_selector = options.delete :inline
	36	+ options[:onclick] = "return noosfero.modal.inline('#{inline_selector}')" if inline_selector
	37	+
	38	+ classes = if inline_selector then '' else 'modal-toggle' end
	39	+ classes += " modal-#{type.to_s}" if type.present?
	40	+ classes << " #{options[:class]}" if options.has_key? :class
	41	+ options.merge!(:class => classes)
	42	+
	43	+ options
	44	+ end
	45	+
	46	+end
...	...
...	...	@@ -1,11 +0,0 @@
1		-module ThickboxHelper
2		- def thickbox_inline_popup_link(title, url, id, options = {})
3		- link_to(title, url_for(url) + "#TB_inline?height=300&width=500&inlineId=#{id}&modal=true", {:class => 'thickbox'}.merge(options))
4		- end
5		- def thickbox_inline_popup_icon(type, title, url, id, options = {})
6		- icon_button(type, title, url_for(url) + "#TB_inline?height=300&width=500&inlineId=#{id}&modal=true", {:class => "thickbox"}.merge(options))
7		- end
8		- def thickbox_close_button(title)
9		- button_to_function(:close, title, 'tb_remove();')
10		- end
11		-end
1	1	<%= labelled_form_for :user,
2	2	:url => { :controller => 'account', :action => (params[:enterprise_code] ? 'activate_enterprise' : 'login') } do \|f\| %>
3	3
4		-<%= f.text_field :login,
5		- :id => ( lightbox? ? 'lightbox_' : '' ) + 'user_login',
6		- :onchange => 'this.value = convToValidLogin( this.value )' %>
	4	+<%= f.text_field :login, :id => 'user_login', :onchange => 'this.value = convToValidLogin( this.value )' %>
7	5
8		-<%= f.password_field :password,
9		- :id => ( lightbox? ? 'lightbox_' : '' ) + 'user_password' %>
	6	+<%= f.password_field :password, :id => 'user_password' %>
10	7
11	8	<% if params[:enterprise_code] %>
12	9	<%= hidden_field_tag :enterprise_code, params[:enterprise_code] %>
...	...	@@ -16,7 +13,7 @@
16	13
17	14	<% button_bar do %>
18	15	<%= submit_button( 'login', _('Log in') )%>
19		- <%= lightbox_close_button(_('Cancel')) if lightbox? %>
	16	+ <%= modal_close_button _('Cancel') if request.xhr? %>
20	17	<% end %>
21	18
22	19	<% end %>
...	...
1	1	<h1><%= _('Identify yourself') %></h1>
2	2
3	3	<p>
4		-<%= lightbox_link_to _('Login.'), { :controller => 'account', :action => 'login_popup' } %>
	4	+<%= modal_link_to _('Login.'), { :controller => 'account', :action => 'login_popup' } %>
5	5
6	6	<%= _('You need to login to be able to use all the features in this environment.') %>
7	7	</p>
...	...
...	...	@@ -3,7 +3,7 @@
3	3	<h2><%= _('Login') %></h2>
4	4
5	5	<% @user \|\|= User.new %>
6		-<% is_thickbox \|\|= false %>
	6	+<% is_popin \|\|= false %>
7	7
8	8	<%= @message %>
9	9
...	...	@@ -17,8 +17,8 @@
17	17
18	18	<% button_bar do %>
19	19	<%= submit_button( 'login', _('Log in') )%>
20		- <% if is_thickbox %>
21		- <%= thickbox_close_button(_('Cancel')) %>
	20	+ <% if is_popin %>
	21	+ <%= modal_close_button(_('Cancel')) %>
22	22	<% end %>
23	23	<% end %>
24	24
...	...