Hobo 2.0 Changes
{: .document-title}
Documents the changes made in Hobo 2.0 and the changes required to
migrate applications to Hobo 2.0
Contents
{: .contents-heading}
- contents
{:toc}
# Installation
Meta tags: note for collaborators. A meta-tag looks like this {.done}. It's added after a paragraph with no blank spaces. The tags that we support are: {.ruby} {.javascript} {.dryml} and {.diff} for code highlighting. {.todo}, {.done}, {.check}, {.part} and {.nomove} indicate documentation progress moving into the Hobo manuals. {.check} means that it's probably done. {.part} means that it's partly done. {.nomove} means that this section only needs to exist in this CHANGES document. Finally, {.hidden} is used for paragraphs like this one that shouldn't show up on the website.
{.hidden}
## Creating a new application
{.part}
Final hobo 2.0 gems have not yet been released, so the standard instructions
of "gem install hobo; hobo new foo" do not yet work.
If you're on Linux you'll have to install a javascript runtime.
On Ubuntu 11.10 you can get one by typing `apt-get install
nodejs-dev`. Other Linuxes should be similar. Windows & OS X users
should already have a javascript scripting host installed. The list
of compatible javascript runtimes is
[here](https://github.com/sstephenson/execjs).
To install prerelease versions of Hobo, you have three options: gems
from rubygems, gems from source or pointing your Gemfile at hobo
source.
### Via gems from rubygems.org
gem install hobo --pre
hobo new foo
### Via gems from source
git clone git://github.com/tablatom/hobo
cd hobo
rake gems[install]
cd wherever-you-want-to-generate-your-app
hobo new foo
Once you've generated an app, you may wish to go in and replace the
version strings for the hobo_* gems with `:git => "git://github.com/tablatom/hobo"`
### Via source path
(This won't work on Windows)
git clone git://github.com/tablatom/hobo
export HOBODEV=`pwd`/hobo
cd wherever-you-want-to-generate-your-app
$HOBODEV/hobo/bin/hobo new foo
## Updating a Hobo 1.3 application
{.nomove}
Many of the changes required in upgrading a Hobo 1.3 application are necessitated by the switch from Rails 3.0 to 3.2. [Railscasts has a good guide to upgrading to Rails 3.1](railscasts.com/episodes/282-upgrading-to-rails-3-1).
There are several changes that need to be made to your application to
upgrade from Hobo 1.3 to Hobo 2.0. Most of these changes are
required by the addition of the asset pipeline which was introduced in
Rails 3.1.
Follow the asset pipeline upgrade steps outlined here:
http://guides.rubyonrails.org/asset_pipeline.html#upgrading-from-old-versions-of-rails
The easiest way to upgrade an existing Hobo 1.3 application is to
generate a new Hobo 2.0 application and copy differences from the new
app into your existing app.
### Gemfile
You'll need to add the gems required for the asset pipeline, add the
jquery-rails and jquery-ui-themes gem, and adjust the version numbers
for rails, hobo and perhaps others.
Hobo has also gained several additional gems, so you will have to add
dependencies for those. hobo_rapid is the Hobo tag library,
hobo_jquery is the javascript for hobo_rapid, and hobo_clean is the
default theme. Instead of or as well as hobo_clean you can use
hobo_clean_admin or hobo_clean_sidemenu or hobo_bootstrap.
You will also have to ensure that you are using Hobo's fork of will_paginate:
gem "will_paginate", :git => "git://github.com/Hobo/will_paginate.git"
### config/
Most the changes in config/ are due to the assets pipeline. See
http://guides.rubyonrails.org/asset_pipeline.html#upgrading-from-old-versions-of-rails
In addition, you will probably want to add:
config.hobo.dont_emit_deprecated_routes = true
to your config/application.rb. See the [named routes section in this document](#named_routes_names_changed_to_use_standard_rails_names) for more details.
You will also want to add
config.watchable_dirs[File.join(config.root, 'app/view')] = ['dryml']
to your config/environments/development.rb
### application.dryml or front_site.dryml
Replace
{.dryml}
with
{.dryml}
Note that the default Hobo generation now always creates both a
front_site.dryml and an application.dryml, even if you don't create
any subsites.
Also be aware that application.dryml is no longer loaded automatically
if you have a front_site.dryml. Add
{.dryml}
to your front_site.dryml, your admin_site.dryml, et cetera.
### move public/ to app/assets/
{.todo}
In Rails 3.1, images, javascripts and stylesheets are loaded from
app/assets/ rather than from public/ so you'll have to move them.
Note that the following are Rails and/or Hobo assets that are now
included via the pipeline and can be deleted rather than moved:
images/rails.png
hobothemes/**
javascripts/controls.js,dryml-support.js,hobo-rapid.js,ie7-recalc.js,prototype.js,blank.gif,dragdrop.js,effects.js,IE7.js,lowpro.js,rails.js
stylesheets/reset.css,hobo-rapid.css
You can organize your app/assets directory however you like, but you
probably should arrange it the way Hobo does, the install_plugin
generator expects it.
If you generate a new Hobo 2.0 application with the front site named "front" and an additional admin subsite named admin, it will put these in app/assets/javascripts:
application.js
application/
front.js
front/
admin.js
admin/
Application.js loads any rails plugins and then everything in the
application/ directory. Front.js loads application.js, then any hobo
plugins you've installed and then everything in the front/ directory.
Admin.js behaves similarly. Hobo views in the front subsite load
front.js and Hobo views in the admin subsite load admin.js.
app/assets/stylesheets is organized in a similar manner.
# Changes from Hobo 1.3 & hobo-jquery 1.3
## Javascript framework changed to jQuery
{.nomove}
Hobo 1.3 and earlier versions used prototype.js for its Ajax support.
In Hobo 2.0 all of our javascript code has been rewritten to use
jQuery instead of prototype.js.
In the process of rewriting the code many tags have been updated to
add AJAX support, and tags that used non-standard AJAX mechanisms have
been updated to use standard Hobo form AJAX. The most visible of
these changes have been to the editors.
## The Asset Pipeline
{.todo}
we should create a (small) chapter on the Hobo asset pipeline layout. see above (move public/ to app/assets/)
{.hidden}
Hobo 2.0 uses the asset pipeline features introduced in Rails 3.1.
Hobo 2.0 does not work out of the box with the asset pipeline turned
off. It'd certainly be possible to copy all Hobo assets into public/,
but you would have to do so manually, there are no longer any rake
tasks to do this for you.
## application.dryml is no longer loaded automatically
{.todo}
Hobo 1.3 loaded application.dryml and then X_site.dryml, where X was
front or admin or the name of the current subsite. Hobo 2.0 only
loads X_site.dryml. If that fails, it loads application.dryml
instead.
A new application generated by Hobo 2.0 will have `` in X_site.dryml so that application.dryml is
still loaded. When it is loaded is now controlled by the the author
rather than always loading first.
## :inverse_of recommended
{.todo}
For correct behaviour, please ensure that all accessible associations
have their :inverse_of option set in both directions.
## set-theme deprecated
{.nomove}
The old Hobo theme support has never worked well, and has been
replaced. Themes are now Hobo plugins and work like every other Hobo
2.0 plugin.
Replace:
{.dryml}
with
{.dryml}
and add
*= require hobo_clean
to your app/assets/stylesheets/front.css. Some themes may also
include javascript which would require them to be added to front.js as
well.
## default doctype changed
{.nomove}
The default doctype has been changed from `XHTML 1.0 TRANSITIONAL` to
`html`, also known as "standards mode" in Internet Explorer 8 and 9
and "html5" in other browsers.
## named routes' names changed to use standard Rails names
{.nomove}
The names of named routes generated by Hobo have changed to more
closely match the default names generated by the Rails REST route
generator. The standard 7 REST routes have not changed, but some
additional routes such as nested routes and lifecycle routes have been
renamed.
For the moment you can ask Hobo to emit both the new style and old
style routes by not defining
`config.hobo.dont_emit_deprecated_routes`.
Note that paths and method names have not changed, only the named
route has changed, so this change should not be visible to the user or
impact controller code.
The route name is leftmost column in `rake routes`.
Here are some example changes:
create_task_path => create_tasks_path # tasks#create
create_task_for_story_path => create_story_tasks_path # tasks#create_for_story
foo_transition_path => transition_foo_path # foos lifecycle transition
foo_show2_path => show2_foo_path # show_action :show2 in foos_controller
Note that in the second example, create_story_tasks_path, the
controller method name is `create_for_story`. This is the same method
name that Hobo 1.0 and 1.3 use; the default Rails method name would be
just plain `create`.
There are several named routes used in the user_mailer views generated
in a new application. These must be fixed up when upgrading an old
application. For instance, user_activate_url must be changed to
activate_user_url in activation.erb.
In exchange for the pain of updating some of your named routes, we
receive the following benefits:
- polymorphic_url works with nested routes and in more situations
- url_for will work in more situations
- the `` tag and the many tags which use it now accept all the
`url_for` options, such as host and port.
- hobo_routes.rb is easier to read and understand
- code reduction in Hobo
## `remote-method-button` and `update-button` broken
{.nomove}
`remote-method-button`, `update-button` and similar buttons such as
`delete-button` were written early in the history of Hobo, before
standard form/part ajax was supported. These tags are easy to replace
with the much more flexible forms.
For backwards compatibility, most of these buttons have been updated
to 2.0. However, the little used `remote-method-button` and
`update-button` have not been converted to the 2.0 form.
## default field-list changed
{.nomove}
The default for `` has changed to ``.
The old behaviour is still available in ``. Please
provide feedback: we are open to reversion before final release.
## Helper rearrangement
{.todo}
In previous versions of Hobo, all Hobo helpers were available in both
the controllers and the views. In this version, some helpers are
only available in the views. If there is a helper function that you
need to access in your controller, you can call in your controller:
HoboTypeHelper.add_to_controller(self)
Other Helper classes not included in the controller by default are
HoboDebugHelper, HoboDeprecatedHelper and HoboViewHintHelper.
Several helpers have been moved into
app/helpers/hobo_deprecated_helper.rb
If your application depends on any of these, you can set
config.hobo.include_deprecated_helper.
## Rails 3.2 required
Hobo 2.0 currently requires Rails 3.2 for operation.
## Enhancements
### Nested caching
{.todo}
See the docs for `` and the blog post I'm going to
eventually write...
### push-state
{.todo}
AJAX now supports a new AJAX option 'push-state' if you have
History.js installed. It was inspired by [this
post](http://37signals.com/svn/posts/3112-how-basecamp-next-got-to-be-so-damn-fast-without-using-much-client-side-ui)
which uses push-state and fragment caching to create a very responsive
rails application. Hobo has always supported fragment caching
through Rails, but push-state support is new.
The easiest way to install History.js is to use the [jquery-historyjs](https://github.com/wweidendorf/jquery-historyjs)
gem. Follow the instructions in the [README at the
link](https://github.com/wweidendorf/jquery-historyjs).
push-state blurs the line between AJAX and non-AJAX techniques,
bringing the advantages of both to the table. It's considerably more
responsive than a page refresh, yet provides allows browser bookmarks
and history navigation to work correctly.
For example, if the foos and the bars pages have exactly the same
headers but different content, you can speed up links between the
pages by only refreshing the content:
<%# foos/index.dryml %>
Bars
...
Note to Hobo 1.3 users: We're using the new `ajax` attribute instead of
`update="content"` because the link is inside the part. Outside of the
part we'd use `update="content"` instead of `ajax`.
The `new-title` attribute may be used with push state to update the
title. If you want to update any other section in your headers, you
can put that into a part and list it in the update list as well.
However the new page cannot have new javascript or stylesheets.
Avoiding the refresh of these assets is one of the major reasons to
use push-state!
push-state is well suited for tasks that refreshed the current page
with new query parameters in Hobo 1.3, like `filter-menu`, pagination and
sorting on a `table-plus`. Thus these tags have been updated to
support all of the standard ajax attributes.
Of course, ajax requests that update only a small portion of the page
will update faster than those that update most of the page. However,
a small update may mean that a change to the URL is warranted, so you
may want to use standard Ajax rather than push-state in those cases.
Also, push-state generally should not be used for requests that modify
state
push-state works best in an HTML5 browser. It works in older browsers
such as IE8, IE9 or Firefox 3, but results in strange looking URL's. See
the README for History.js for more details on that behaviour.
### plugin generators
{.part}
Hobo has gained two new generators.
`hobo generate install_plugin` may be used from inside a Hobo
application to install a Hobo plugin. It modifies the Gemfile,
application.dryml or X_site.dryml and adds the plugin to
app/assets/javascripts and app/assets/stylesheets.
`hobo plugin` is used from outside of a Hobo application to create the
skeleton for a new plugin. See [the plugin manual page](FIXME) for
more details.
### multiple parts
{.todo}
I've updated DRYML so that it emits a different DOM ID if you
re-instantiate a part. (The first use of a part retains the DOM
ID=partname convention for backwards compatibility) "update=" requires
a DOM ID, so I've also added 2 new AJAX attributes that can be used
instead of "update=".
The first one is "updates=". Instead of a comma separated list of DOM
ID's, it takes a CSS selector.
The other one is "ajax". If used inside of a part, it indicates that
the containing part should be updated. If used outside of a part,
AJAX will be used but no parts will be updated.
These three Ajax attributes may be used simultaneously.
Example:
### Bottom-loading Javascript
{.todo}
The `` tag has a new attribute: `bottom-load-javascript`. If
set, Javascript is loaded via a deferred load at the bottom of the
body rather than being loaded conventionally in the head.
You probably want to enable this globally in your application by
adding this to your application.dryml:
Note that if this option is set, the custom-scripts parameter is no
longer available. There is a new parameter called custom-javascript
that can be used instead, though.
Replace:
with:
alert('hi');
If you wish to be compatible with both top & bottom loading use:
$(document).read(function() {
alert('hi');
})
If you were previously loading files via custom-scripts, use the asset
pipeline instead.
Turning on bottom-load will prevent Rails from splitting front.js into
multiple files even if you enable config.assets.debug in your
environment.
### allowing errors in parts
{.todo}
Older versions of Hobo did not render a part update if the update did
not pass validation.
This behaviour may now be overridden by using the 'errors-ok'
attribute on your form. (or formlet or whatever other tag initiates
the Ajax call).
The 'errors-ok' attribute is processed in update_response. If you've
supplied a block to hobo_update you will be responsible for
implementing this functionality yourself.
### AJAX file uploads
{.todo}
If you have malsup's form plugin installed, Ajax file uploads should
"just work", as long as you don't have debug_rjs turned on in your
config/initializers/development.rb.
Make sure you're form uses multipart encoding:
### AJAX events
{.todo}
The standard 'before', 'success', 'done' and 'error' callbacks may
still be used. Additionally, the AJAX code now triggers
'rapid:ajax:before', 'rapid:ajax:success', 'rapid:ajax:done' and
'rapid:ajax:error' events to enable you to code more unobtrusively.
If your form is inside of a part, it's quite likely that the form will
be replaced before the rapid:ajax:success and rapid:ajax:done events
fire. To prevent memory leaks, jQuery removes event handlers from all
removed elements, making it impossible to catch these events.
If this is the case, hobo-jquery triggers these events on the document
itself, and passes the element as an argument.
$(document).ready(function() {
jQuery(document).on("rapid:ajax:success", function(event, el) {
// `this` is the document and `el` is the form
alert('success');
});
});
### remove-class
`remove-class` is a new attribute that can be used if you're extending or parameterizing a part to remove a class or several classes from the element you're extending or parameterizing.
### before callback
{.todo}
A new callback has been added to the list of Ajax Callbacks: before.
This callback fires before any Ajax is done. If you return false
from this, the Ajax is cancelled. So you should probably ensure you
explicitly return true if you use it and don't want your ajax
cancelled.
### callbacks
{.todo}
Normally in HTML you can attach either a snippet of javascript or a
function to a callback.