dry up your views
DESCRIPTION
My presentation at RORO sydney september meetup.TRANSCRIPT
smartbomb
o or r
DRY your views!Lachie Cox
smartbombsmartbomb
DRY‣ don’t repeat yourself, mmkay?
smartbombsmartbomb
M V C‣v is for vexing
smartbombsmartbomb
DRYing models is
easy
smartbombsmartbomb
DRYing ctrllrs is
OK
smartbombsmartbomb
DRYing views is
vexatious
smartbombsmartbomb
WET views
sca!olding
smartbombsmartbomb
smartbombsmartbomb
WET views
erb
layouts
partials
smartbombsmartbomb
smartbombsmartbomb
<% labeled_form_for :thing, things_path do |f| %> <%= f.text_field :name %> <%= f.text_field :aspect %> <%= f.check_box :existing %> <%= submit_tag 'Save' %><% end %>
smartbombsmartbomb
<% labeled_form_for :thing, things_path do |f| %>
<%= f.text_field :name %>
<%= f.text_field :aspect %>
<%= f.check_box :existing %>
<%= submit_tag 'Save' %>
<% end %>
WASTE
smartbombsmartbomb
waste baaaad
smartbombsmartbomb
components
engines
smartbombsmartbomb
smartbombsmartbomb
‣ http://codefluency.com/2007/5/18/when-v-is-for-vexing
‣ Bruce Williams
smartbombsmartbomb
Don’t Fear Helpers
Make them APIs
smartbombsmartbomb
Make them semantic
smartbombsmartbomb
helpers as api
<%= describe person,:blank_message => "Nobody" %>
smartbombsmartbomb
helpers as api
<% rounded_box do %> <h2>Products</h2><% end %>
smartbombsmartbomb
stencil
‣ http://stencil.rubyforge.org
smartbombsmartbomb
semantic helpers
as objects
smartbombsmartbomb
a cart stencil
class CartStencil < Stencil ... def to_s render(:partial => 'shared/cart', :object => @cart) end def summary if @cart.blank? "Your cart is empty. Buy stuff!" else "You have #{@cart.size} items in your cart." end endend
smartbombsmartbomb
a cart stencil
<% cart = cart() %> <!-- CartStencil.new -->
<%= cart.summary %>
<%= cart %> <!-- cart.to_s -->
smartbombsmartbomb
more than a stencil
module CartControllerHelper ...end
class UserController include CartControllerHelper load_cart :only => [:show]end
smartbombsmartbomb
Vcart
(stencil)
Ccart
(mixin)
smartbombsmartbomb
Stencil+
Mixin
CSS
+javascript
+
&c.
smartbombsmartbomb
lightweight
widgetty
thingo
smartbombsmartbomb
smartbombsmartbomb
DRY
javascript
smartbombsmartbomb
RJS
smartbombsmartbomb
smartbombsmartbomb
document.getElementById("foobar")
$("foobar")
smartbombsmartbomb
use prototype‣ until optimisation
smartbombsmartbomb
<%= link_to_function 'declaim', 'alert("yay for smarties!")' %>
<%= link_to 'delete', smarty_path(42), :method => :delete %>
smartbombsmartbomb
smartbombsmartbomb
srsly, wtf?
<a onclick="var f = document.createElement('form'); f.style.display = 'none'; this.parentNode.appendChild(f); f.method = 'POST'; f.action = this.href;var m = document.createElement('input'); m.setAttribute('type', 'hidden'); m.setAttribute('name', '_method'); m.setAttribute('value', 'delete'); f.appendChild(m);f.submit();return false;" href="/smarties/1">delete</a>
smartbombsmartbomb
smartbombsmartbomb
be
less
obtrusive
smartbombsmartbomb
use
less
code
smartbombsmartbomb
OMG
javascript
has classes
too!
smartbombsmartbomb
use
&
reuse
smartbombsmartbomb
lowpro‣ http://danwebb.net/lowpro
smartbombsmartbomb
reusable
behaviours
smartbombsmartbomb
smartbombsmartbomb
smartbombsmartbomb
<a class="forgotten" href="/accounts/forgotten">I've forgotten my password.</a>
HTML
smartbombsmartbomb
Event.addBehavior({ '.forgotten': Toggler('forgotten_password','cancel')})
<a class="forgotten" href="/accounts/forgotten">I've forgotten my password.</a>
javascript
HTML
smartbombsmartbomb
smartbombsmartbomb
DRY
its good for the soul