From: Jan Provaznik jprovazn@redhat.com
--- src/app/views/templates/_selected_packages.haml | 3 +- src/app/views/templates/software.haml | 19 ++++++++++++++++++ src/public/stylesheets/components.css | 24 ++++++++++++++++++++++- 3 files changed, 44 insertions(+), 2 deletions(-)
diff --git a/src/app/views/templates/_selected_packages.haml b/src/app/views/templates/_selected_packages.haml index d6e744e..b0f8efe 100644 --- a/src/app/views/templates/_selected_packages.haml +++ b/src/app/views/templates/_selected_packages.haml @@ -1,7 +1,8 @@ %ul{:id => "selected_packages", :class => "selection_list"} - @image_descriptor.xml.all_packages_by_group.each do |group| %li{:class => 'group'} - = group[:name] + %span{:class => "groupname"} + = group[:name] %a{:class => 'remove_group action_link', :href => url_for(:action => 'remove_group', :id => @image_descriptor, :group => group[:name])} Remove %ul{:class => 'groupkgs'} diff --git a/src/app/views/templates/software.haml b/src/app/views/templates/software.haml index 258944a..dee8eeb 100644 --- a/src/app/views/templates/software.haml +++ b/src/app/views/templates/software.haml @@ -28,6 +28,25 @@ $("#selected_packages").load($(ev.target).attr('href'), loadCallback); return false; }); + createTree(); + }; + function createTree() { + $("li.group").each(function() { + var group = $(this); + group.addClass("closed_folder"); + $(".groupname", group).toggle( + function() { + group.removeClass("closed_folder"); + group.addClass("opened_folder"); + $("ul > li", group).removeClass("hidden"); + }, function() { + group.removeClass("opened_folder"); + group.addClass("closed_folder"); + $("ul > li", group).addClass("hidden"); + } + ); + }) + $("li.group > ul > li").addClass("hidden"); }; function get_repository(ev) { var rep = $(ev.target).val(); diff --git a/src/public/stylesheets/components.css b/src/public/stylesheets/components.css index 874d8bc..64df832 100644 --- a/src/public/stylesheets/components.css +++ b/src/public/stylesheets/components.css @@ -446,10 +446,32 @@ ul.nav li:hover { color: blue; }
+#image_descriptor_form .closed_folder { + background-image: url(/images/dir_closed.png); + background-repeat: no-repeat; +} + +#image_descriptor_form .opened_folder { + background-image: url(/images/dir_open.png); + background-repeat: no-repeat; +} + +#image_descriptor_form .groupname { + cursor: pointer; +} + +#image_descriptor_form .hidden { + display: none; +} + #image_descriptor_form .selection_list > li { padding-bottom: 10px; }
+#image_descriptor_form .group { + padding-left: 20px; +} + #image_descriptor_form .groupkgs { padding-left: 20px; } @@ -482,7 +504,7 @@ ul.nav li:hover { width:150px; }
-#image_descriptor_form #selected_packages { +#image_descriptor_form .selection_list { padding: 10px; }