Ative elementos HTML como um chefe em Ruby com IU ativada

active_link_to é uma pequena joia agradável para adicionar uma classe ativa aos seus links com base na url atual. Os problemas que tive com isso foram que eu precisava especificar manualmente quais elementos eu queria ativar e precisava ativar os elementos que não eram links.

Tive que resolver esse problema em três bases de código diferentes agora, então achei que era hora de movê-lo para sua própria joia, minha primeira na verdade:

ActivatedUI

ActivatedUI, é uma coleção de auxiliares para definir e gerenciar o estado ativo dos elementos da IU. É semelhante a active_link_to no sentido de que foi projetado para ajudar a controlar o estado ativo dos elementos da IU para você. No entanto, onde active_link_to infere o estado ativo do url atual, ActivatedUI permite que você o declare explicitamente.

Instalação

Ao instalar para aplicativos Rails 3, adicione isso ao Gemfile: gem 'activated_ui'e execute bundle install.

O ActivatedUI deve funcionar sem rails, mas tenho que admitir que não o usei realmente neste ambiente.

Uso

Configurando o estado ativo

Você pode definir o estado ativo com:

activate_ui_marked :my_key # active state is [:my_key]

Você pode dar quantas chaves quiser por vez:

activate_ui_marked :my_key, :another_key # active state is [:my_key, :another_key]

activate_ui_marked constrói sobre si mesmo assim:

activate_ui_marked :my_key # active state is [:my_key]
activate_ui_marked :another_key # active state is now [:my_key, :another_key]

Obtendo o estado ativo

Depois de definir o estado ativo, existem várias maneiras de usá-lo:

Descubra se uma chave está ativa:

ui_activated? :my_key # will return true if :my_key is in the active state
ui_activated :my_key # ui_activated? is aliased to ui_activated if you so prefer

Descubra se várias chaves estão ativas:

ui_activated? :my_key, :another_key # will return true if all of the arguments are in the active state

Obtenha um valor de classe ativa em html:

<li class='<%= activated_class :my_key %>'>My Item</li> <!-- will produce class='active' if :my_key is in the active state otherwise class='' -->

Por padrão, a classe retornada é ‘ativa’, mas você pode alterar isso:

self.class.activated_class 'my_active_class'
activated_class :key # will now return 'my_active_class'

Com Rails

ActivatedUI não depende do Rails, mas se você estiver usando com Rails, veja como:

class ApplicationController < ActionController::Base
  include ActivatedUI
end

class PostsController < ApplicationController

  activate_ui_marked :posts # Adds :key to the active state using a call to before_filter
  activate_ui_marked :posts, :only => [:show] # It will pass on any options, so you can use before_filter's :only and :except options

  activated_class 'my_custom_active_class' # Change the return value of activated_class :key

  def show
    activate_ui_marked :show
    # show.html.erb
  end

end

A IU ativada adicionará enabled_class, activate_ui_marked, stored_activated_ui, ui_activated? e ui_activated como auxiliares de visualização:

<% if ui_activated? :posts %>
  <ul>
     <li class='<%= activated_class :show %>'><%= activated_link_to :show, "Show Posts", post_path(@post), class: 'btn' %></li>
  </ul>
<% end %>

Ele também adicionará um ajudante para embrulhar os link_to:

<%= activated_link_to :show, "Show Posts", post_path(@post), class: 'btn' %>

Ele se comporta da mesma maneira, link_toexceto que há um primeiro argumento adicional que leva uma única chave ou uma matriz de chaves para verificar o estado ativo com o uso . A classe ativa é adicionada a quaisquer classes que você passar por meio do argumento options.ui_activated?