On 12/16/2010 04:54 PM, [email protected] wrote:
> From: Tomas Sedovic<[email protected]>
>
> This adds helper code and partials to add the details tabs to every page. They
> work with and without JavaScript enabled (using jQuery UI tabs for JS-enabled
> browsers).
>
> Included is an example using the code for the Resource Management ->  Pools
> page.
> ---
>   src/app/controllers/resources/pools_controller.rb |   10 +++++++++
>   src/app/helpers/application_helper.rb             |    4 +++
>   src/app/views/layouts/_details_pane.haml          |    7 ++++++
>   src/app/views/layouts/newui.haml                  |    2 +-
>   src/app/views/resources/pools/_deployments.haml   |    3 ++
>   src/app/views/resources/pools/_history.haml       |    3 ++
>   src/app/views/resources/pools/_instances.haml     |    3 ++
>   src/app/views/resources/pools/_list.haml          |    2 +-
>   src/app/views/resources/pools/_permissions.haml   |    3 ++
>   src/app/views/resources/pools/_properties.haml    |    3 ++
>   src/app/views/resources/pools/show.haml           |   22 
> +--------------------
>   src/public/javascripts/application.js             |    9 ++++++++
>   12 files changed, 48 insertions(+), 23 deletions(-)
>   create mode 100644 src/app/views/layouts/_details_pane.haml
>   create mode 100644 src/app/views/resources/pools/_deployments.haml
>   create mode 100644 src/app/views/resources/pools/_history.haml
>   create mode 100644 src/app/views/resources/pools/_instances.haml
>   create mode 100644 src/app/views/resources/pools/_permissions.haml
>   create mode 100644 src/app/views/resources/pools/_properties.haml
>
> diff --git a/src/app/controllers/resources/pools_controller.rb 
> b/src/app/controllers/resources/pools_controller.rb
> index 426e016..b83d361 100644
> --- a/src/app/controllers/resources/pools_controller.rb
> +++ b/src/app/controllers/resources/pools_controller.rb
> @@ -7,6 +7,16 @@ class Resources::PoolsController<  ApplicationController
>
>     def show
>       @pool = Pool.find(params[:id])
> +    if params[:details_tab].blank?
> +      @details_tab = 'properties'
> +    else
> +      @details_tab = params[:details_tab]
> +    end
> +    if params[:ajax] == 'true'
> +      render :partial =>  @details_tab
> +      return
> +    end
> +    @url_params = params.clone
>     end
>
>     def edit
> diff --git a/src/app/helpers/application_helper.rb 
> b/src/app/helpers/application_helper.rb
> index 37330cb..0f71c29 100644
> --- a/src/app/helpers/application_helper.rb
> +++ b/src/app/helpers/application_helper.rb
> @@ -190,4 +190,8 @@ module ApplicationHelper
>       submit_tag(value, :name =>  "__rewrite[#{action}]")
>     end
>
> +  def slug(title)
> +    title.split(' ').join('_').downcase
> +  end
> +
>   end
> diff --git a/src/app/views/layouts/_details_pane.haml 
> b/src/app/views/layouts/_details_pane.haml
> new file mode 100644
> index 0000000..9bedc81
> --- /dev/null
> +++ b/src/app/views/layouts/_details_pane.haml
> @@ -0,0 +1,7 @@
> +- content_for :details do
> +  
> %ul.ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header.ui-corner-all
> +    - tabs.each do |tab|
> +      %li.ui-state-default.ui-corner-top{ :class =>  "#{'ui-tabs-selected 
> ui-state-active' if @url_params[:details_tab] == slug(tab)}"}
> +        = link_to tab, @url_params.merge(:details_tab =>  slug(tab))
> +  #static-content
> +    = render :partial =>  @details_tab
> diff --git a/src/app/views/layouts/newui.haml 
> b/src/app/views/layouts/newui.haml
> index 26a0a48..8bc2623 100644
> --- a/src/app/views/layouts/newui.haml
> +++ b/src/app/views/layouts/newui.haml
> @@ -45,7 +45,7 @@
>             = render :partial =>  '/layouts/notification'
>             = (yield :list or yield)
>           - if details
> -          #details-view
> +          #details-view.ui-tabs.ui-widget.ui-widget-content.ui-corner-all
>               = yield :details
>         %footer
>           = render :partial =>  "layouts/footer"
> diff --git a/src/app/views/resources/pools/_deployments.haml 
> b/src/app/views/resources/pools/_deployments.haml
> new file mode 100644
> index 0000000..497bf09
> --- /dev/null
> +++ b/src/app/views/resources/pools/_deployments.haml
> @@ -0,0 +1,3 @@
> +%h3
> +  Deployments for
> +  = @pool.name
> diff --git a/src/app/views/resources/pools/_history.haml 
> b/src/app/views/resources/pools/_history.haml
> new file mode 100644
> index 0000000..4769d92
> --- /dev/null
> +++ b/src/app/views/resources/pools/_history.haml
> @@ -0,0 +1,3 @@
> +%h3
> +  History for
> +  = @pool.name
> diff --git a/src/app/views/resources/pools/_instances.haml 
> b/src/app/views/resources/pools/_instances.haml
> new file mode 100644
> index 0000000..3498757
> --- /dev/null
> +++ b/src/app/views/resources/pools/_instances.haml
> @@ -0,0 +1,3 @@
> +%h3
> +  Instances for
> +  = @pool.name
> diff --git a/src/app/views/resources/pools/_list.haml 
> b/src/app/views/resources/pools/_list.haml
> index 6d1e4db..51791cd 100644
> --- a/src/app/views/resources/pools/_list.haml
> +++ b/src/app/views/resources/pools/_list.haml
> @@ -1,4 +1,4 @@
> -- form_tag do |f|
> +- form_tag do
>     = restful_submit_tag "New Pool", "new", new_resources_pool_path, 'GET'
>     = restful_submit_tag "Edit", "edit", 
> edit_resources_pool_path(@pools.first), 'GET'
>     %p
> diff --git a/src/app/views/resources/pools/_permissions.haml 
> b/src/app/views/resources/pools/_permissions.haml
> new file mode 100644
> index 0000000..fbd252e
> --- /dev/null
> +++ b/src/app/views/resources/pools/_permissions.haml
> @@ -0,0 +1,3 @@
> +%h3
> +  Permissions for
> +  = @pool.name
> diff --git a/src/app/views/resources/pools/_properties.haml 
> b/src/app/views/resources/pools/_properties.haml
> new file mode 100644
> index 0000000..f50055c
> --- /dev/null
> +++ b/src/app/views/resources/pools/_properties.haml
> @@ -0,0 +1,3 @@
> +%h3
> +  Properties for
> +  = @pool.name
> diff --git a/src/app/views/resources/pools/show.haml 
> b/src/app/views/resources/pools/show.haml
> index b28cc48..9ddfe61 100644
> --- a/src/app/views/resources/pools/show.haml
> +++ b/src/app/views/resources/pools/show.haml
> @@ -1,24 +1,4 @@
>   - content_for :list do
>     = render :partial =>  'list'
>
> -- content_for :details do
> -  %ul
> -    %li
> -      = link_to 'Properties', '#properties'
> -    %li
> -      = link_to 'Deployments', '#deployments'
> -    %li
> -      = link_to 'Instances', '#instances'
> -    %li
> -      = link_to 'History', '#history'
> -    %li
> -      = link_to 'Permissions', '#permissions'
> -  %h3
> -    Details for
> -    = @pool.name
> -
> -- content_for :scripts do
> -  :javascript
> -    $(document).ready(function() {
> -      $('#details-view').tabs();
> -    });
> += render :partial =>  'layouts/details_pane', :locals =>  { :tabs =>  
> ['Properties', 'Deployments', 'Instances', 'History', 'Permissions'] }
> diff --git a/src/public/javascripts/application.js 
> b/src/public/javascripts/application.js
> index 50edbe4..7c2c914 100644
> --- a/src/public/javascripts/application.js
> +++ b/src/public/javascripts/application.js
> @@ -141,7 +141,16 @@ var Aggregator = {
>
>   /* Aggregator JS */
>
> +function enhanceDetailsTabs() {
> +  $('#static-content').remove();
> +  $('#details-view ul li a').each(function(index, link) {
> +    $(link).attr('href', $(link).attr('href') + '&ajax=true');
> +  });
> +  $('#details-view').tabs();
> +}
> +

We shouldn't use global namespace, could be placed into Aggragator (is 
defined in the same file).

>   $(document).ready(function () {
>     
> $(window).scroll(Aggregator.positionFooter).resize(Aggregator.positionFooter).scroll();
>     $("#notification").enhanceInteraction();
> +  enhanceDetailsTabs();
>   });

When I click on a pool and this pool is displayed in details pane, 
'show' action is called twice (regular request and ajax request again 
when page is loaded). It would be nice to call details panel by ajax 
(clicking on a pool in list shows details panel and loads content by ajax).

Jan
_______________________________________________
deltacloud-devel mailing list
[email protected]
https://fedorahosted.org/mailman/listinfo/deltacloud-devel

Reply via email to