Skip to content

Manual Installation (gem less)

Tortue Torche edited this page Mar 14, 2015 · 3 revisions

NOTE: You will not be able to use Utility.RailsVars without including the gem.

Create base.js.coffee

# app/assets/javascripts/base.js.coffee
window.App ||= {}
class App.Base

  constructor: ->
    if (window.jQuery) then @setClearEventHandlers() # clearing application event handlers only possible with jQuery
    return this


  ###
  Run the new action for the create action.  Generally the create action will 'render :new' if there was a problem.
  This prevents doubling the code for each action.
  ###
  create: ->
    if typeof $this.new == 'function'
      return $this.new()


  ###
  Run the edit action for the update action.  Generally the update action will 'render :edit' if there was a problem.
  This prevents doubling the code for each action.
  ###
  update: ->
    if typeof $this.edit == 'function'
      return $this.edit()


  ###
  Clear event handlers with a blank namespace.  This will prevent window and document event handlers from stacking
  when each new page is fetched.  Adding a namespace to your events will prevent them from being removed between page
  loads, i.e. "$(window).on 'scroll.app', myHandler"
  ###
  setClearEventHandlers: ->
    jQuery(document).on 'page:before-change', ->
      for element in [window, document]
        for event, handlers of (jQuery._data(element, 'events') || {})
          for handler in handlers
            if handler? && handler.namespace == ''
              jQuery(element).off event, handler.handler

Create global.js.coffee

# app/assets/javascripts/global.js.coffee
window.App ||= {}

Include base before the javascripts tree

// app/assets/javascripts/application.js
.
.
.
//= require jquery
.
.
.
//= require base
//= require tree.

Initialize and call the current controller action's matching class and function from the application layout. Add the following just before the closing body tag.

For ERB:

<script>
  (function() {
    window.$this = new (App.#{ controller_path.split(/\/|_/).map(&:capitalize).join('') } || App.Base)();
    if (typeof $this.beforeAction === 'function') {
      $this.beforeAction("#{action_name}");
    }
    if (typeof $this.#{ action_name } === 'function') {
      $this.#{ action_name }();
    }
    if (typeof $this.afterAction === 'function') {
      $this.afterAction("#{action_name}");
    }
  })();
</script>

For HAML:

:javascript
  (function() {
    window.$this = new (App.#{ controller_path.split(/\/|_/).map(&:capitalize).join('') } || App.Base)();
    if (typeof $this.beforeAction === 'function') {
      $this.beforeAction("#{action_name}");
    }
    if (typeof $this.#{ action_name } === 'function') {
      $this.#{ action_name }();
    }
    if (typeof $this.afterAction === 'function') {
      $this.afterAction("#{action_name}");
    }
  })();
Clone this wiki locally