diff options
| -rw-r--r-- | app/assets/javascripts/banners/banners.js | 25 | ||||
| -rw-r--r-- | app/assets/javascripts/banners/jquery.tristate.js | 94 | ||||
| -rw-r--r-- | app/views/refinery/banners/admin/banners/_form.html.erb | 153 | ||||
| -rw-r--r-- | app/views/refinery/banners/admin/banners/_page.html.erb | 19 |
4 files changed, 217 insertions, 74 deletions
diff --git a/app/assets/javascripts/banners/banners.js b/app/assets/javascripts/banners/banners.js new file mode 100644 index 0000000..9fcea06 --- /dev/null +++ b/app/assets/javascripts/banners/banners.js @@ -0,0 +1,25 @@ +$(function() { + $(document).ready(function() { + $(".tree ul:first > li:first").addClass("branch_start"); + $('.tree ul').find('li:last').addClass("branch_end"); + $('ul.tristate').tristate(); + + $('.tree').delegate('.toggle','click', function(e) { + e.preventDefault(); + + var $li = $(this).parents('li:first'); + var $icon = $li.find('.icon.toggle'); + var $nested = $li.find('.nested'); + + if ($icon.hasClass('expanded')) { + $icon.removeClass('expanded'); + $nested.slideUp(); + } + else { + $icon.addClass('expanded'); + $nested.slideDown(); + } + + }); + }); +}); diff --git a/app/assets/javascripts/banners/jquery.tristate.js b/app/assets/javascripts/banners/jquery.tristate.js new file mode 100644 index 0000000..2d2903d --- /dev/null +++ b/app/assets/javascripts/banners/jquery.tristate.js @@ -0,0 +1,94 @@ +/********************************************************************************** + ** + ** jQuery Tristate Checkbox Plugin + ** version: 1.0 + ** + ** Dual licensed under the MIT and GPL licenses: + ** http://www.opensource.org/licenses/mit-license.php + ** http://www.gnu.org/licenses/gpl.html + ** + ** author: Jeff Leombruno + ** creation date: 09.20.2011 + ** dependencies: jQuery v1.6 or higher + ** + ** This file contains the functionality for implementing 3 state checkboxes. + ** Inspired by: + ** http://code.google.com/p/jquery-tristate-checkbox/ + ** http://css-tricks.com/13467-indeterminate-checkboxes/ + ** + **********************************************************************************/ + +(function($){ + $.fn.tristate = function(options){ + + var config = { + selector: $(this).selector, + checked: null, + container: null, + siblings: null + }; + var opts = $.extend(config, options); + + return this.each(function(){ + var obj = $(this); + + var triState = function() { + + var pub = {}; + + pub.init = function(){ + $('input[type="checkbox"]', obj).change(function(e) { + config.checked = $(this).prop("checked") + config.container = $(this).parent() + config.siblings = config.container.siblings(); + + config.container.find('input[type="checkbox"]').prop({ + indeterminate: false, + checked: config.checked + }); + + pub.checkSiblings(config.container); + }); + // run checkSiblings for every checked checkbox when the page loads + $('input[type=checkbox]:checked', obj).each( function() { + pub.checkSiblings($(this).parent()); + }); + }; + + pub.checkSiblings = function(el) { + var parent = el.parent().parent(); + var all = true; + + el.siblings().each(function() { + return all = ($(this).children('input[type="checkbox"]').prop("checked") === config.checked); + }); + + if (all && config.checked) { + parent.children('input[type="checkbox"]').prop({ + indeterminate: false, + checked: config.checked + }); + pub.checkSiblings(parent); + } else if (all && !config.checked) { + parent.children('input[type="checkbox"]').prop("checked", config.checked); + parent.children('input[type="checkbox"]').prop("indeterminate", (parent.find('input[type="checkbox"]:checked').length > 0)); + pub.checkSiblings(parent); + } else { + el.parents("li").children('input[type="checkbox"]').prop({ + indeterminate: true, + checked: false + }); + } + }; + + return pub; + + }(); + + triState.init(); + triState.checkSiblings(obj); + + + }); + }; +})(jQuery); diff --git a/app/views/refinery/banners/admin/banners/_form.html.erb b/app/views/refinery/banners/admin/banners/_form.html.erb index 1403fc4..b249f09 100644 --- a/app/views/refinery/banners/admin/banners/_form.html.erb +++ b/app/views/refinery/banners/admin/banners/_form.html.erb @@ -1,76 +1,81 @@ +<%- content_for(:javascripts) do -%> + <%= javascript_include_tag "banners/jquery.tristate.js", "banners/banners.js" -%> +<%- end -%> + <%= form_for [refinery, :banners_admin, @banner] do |f| -%> - <%= render '/refinery/admin/error_messages', - :object => @banner, - :include_object_name => true %> - - <%= hidden_field_tag 'banner[page_ids][]' %> - - <div class='field'> - <%= f.label :name -%> - <%= f.text_field :name, :class => 'larger widest' -%> - - </div> - - <div class='field'> - <%= f.label :title -%> - <%= f.text_field :title -%> - - </div> - - <div class='field'> - <%= f.label :description -%> - <%= f.text_field :description -%> - - </div> - - <div class='field'> - <%= f.label :image -%> - <%= render '/refinery/admin/image_picker', - :f => f, - :field => :image_id, - :image => @banner.image, - :toggle_image_display => false, - :description => t('refinery.banners.admin.banner') - %> - - </div> - - <div class='field'> - <%= f.label :url -%> - <%= f.text_field :url -%> - - </div> - - <div class='field'> - <%= f.label :is_active -%> - <%= f.check_box :is_active, :checked => @banner[:is_active] -%> - - </div> - - <div class='field'> - <%= f.label :start_date -%> - <%= f.date_select :start_date -%> - - </div> - - <div class='field'> - <%= f.label :expiry_date -%> - <%= f.date_select :expiry_date -%> - - </div> - - <div class="field"> - <%= f.label :pages %> - <% Refinery::Page.all.each do |page| %> - <div> - <%= check_box_tag "banner[page_ids][]", page.id, @banner.pages.include?(page) %> - <%= page.title %> - </div> - <% end %> - </div> - - <%= render '/refinery/admin/form_actions', :f => f, - :continue_editing => false, - :delete_title => t('delete', :scope => 'refinery.banners.admin.banners.banner'), - :delete_confirmation => t('message', :scope => 'refinery.admin.delete', :title => @banner.name) %> + <%= render '/refinery/admin/error_messages', + :object => @banner, + :include_object_name => true %> + + <%= hidden_field_tag 'banner[page_ids][]' %> + + <div class='field'> + <%= f.label :name -%> + <%= f.text_field :name, :class => 'larger widest' -%> + + </div> + + <div class='field'> + <%= f.label :title -%> + <%= f.text_field :title -%> + + </div> + + <div class='field'> + <%= f.label :description -%> + <%= f.text_field :description -%> + + </div> + + <div class='field'> + <%= f.label :image -%> + <%= render '/refinery/admin/image_picker', + :f => f, + :field => :image_id, + :image => @banner.image, + :toggle_image_display => false, + :description => t('refinery.banners.admin.banner') + %> + + </div> + + <div class='field'> + <%= f.label :url -%> + <%= f.text_field :url -%> + + </div> + + <div class='field'> + <%= f.label :is_active -%> + <%= f.check_box :is_active, :checked => @banner[:is_active] -%> + + </div> + + <div class='field'> + <%= f.label :start_date -%> + <%= f.date_select :start_date -%> + + </div> + + <div class='field'> + <%= f.label :expiry_date -%> + <%= f.date_select :expiry_date -%> + + </div> + + <section id="records" class="tree"> + <%= f.label :pages %> + <ul class="tristate"> + <%= render :partial => 'refinery/banners/admin/banners/page', :collection => Refinery::Page.order("lft ASC").select{|p| p.parent_id.nil?} %> + </ul> + </section> + + + <div style="clear: both;"></div> + <%= render '/refinery/admin/form_actions', :f => f, + :continue_editing => false, + :delete_title => t('delete', :scope => 'refinery.banners.admin.banners.banner'), + :delete_confirmation => t('message', :scope => 'refinery.admin.delete', :title => @banner.name) %> <% end -%> + + diff --git a/app/views/refinery/banners/admin/banners/_page.html.erb b/app/views/refinery/banners/admin/banners/_page.html.erb new file mode 100644 index 0000000..640d378 --- /dev/null +++ b/app/views/refinery/banners/admin/banners/_page.html.erb @@ -0,0 +1,19 @@ +<li class='clearfix record icons' id="<%= dom_id(page) -%>" > + + <% if page.children.present? %> + <span class="icon toggle expanded" title="<%= t('expand_collapse', :scope => 'refinery.admin.pages') %>"></span> + <% else %> + <span class="icon"></span> + <% end %> + + <%= check_box_tag "banner[page_ids][]", page.id, @banner.pages.include?(page) %> + + <span class='title <%= 'toggle' if page.children.present? %>'> + <%= page.title %> + </span> + + + <ul class='nested' > + <%= render(:partial => 'refinery/banners/admin/banners/page', :collection => page.children) %> + </ul> +</li> |