ajaxify_rails 0.0.2 → 0.0.4

data/README.md

@@ -4,7 +4,8 @@ No more full page reloads for your Rails app! Yay!
 
 Automatically makes your app loading content in the background via ajax.
 
-Works by turning all internal links into ajax links that trigger an update of the page's content area.
+Works by turning all internal links into ajax links that trigger an update of the page's content area. 
+Also form submission are automatically turned into ajax requests.
 
 Features: 
 
@@ -35,37 +36,46 @@ In your application.js file add:
 
 ## Usage
 
+Call `Ajaxify.init()` in your layout's javascript.
+Do this as early as possible to ensure Ajaxify's interchangeable url schemes (history api vs. hash based urls)
+work most effectively. 
+
+The later you call `init()`, the later potential redirects from one scheme to another are performed,
+which means the more unnecessary work the browser has to do.
+
+
 ### Content Area
 
-Ajaxify Rails assumes that your app has a content container html tag with the id 'main'.
+Ajaxify assumes that your app has a content container html tag with the id `main`.
 This tag is the container wrapping the yield statement in your layout.
 If yield doesn't have a wrapper in your app yet, you need to supply one to get ajaxification working:
 
     #main
       = yield
 
-You can change the content wrapper by setting
+You can change the content wrapper in your javascript by setting
 
     Ajaxify.content_container = 'content_container_id'
     
+    
 ### Loader Animation
 
 You probably like to have a loader image to be displayed to the user while content loads via ajax.
-This is simple. Ajaxify Rails automatically inserts a loader div with the class ajaxify_loader into
-the content wrapper before starting an ajax request. So just supply styles for .ajaxify_loader in your css, with an
+This is simple. Ajaxify automatically inserts a loader div with the class `ajaxify_loader` into
+the content wrapper before starting an ajax request. So just supply styles for `.ajaxify_loader` in your css, with an
 animated gif as a background.
     
 
 ### Page Title
 
-If you define a method called 'page_title' in your application controller, Ajaxify Rails will automatically
+If you define a method called `page_title` in your application controller, Ajaxify will automatically
 update the page's title tag after the main content has changed.
 
 ### Navigation and other Layout Updates
 
 It's a common use case to have a navigation that needs to change its appearence and possibly functioning when the user navigates
-to a different section of the page. Ajaxify Rails provides a success callback that is triggered after successful
-updates of he page's main content. Just hook into it and make your layout changes:
+to a different section of the page. Ajaxify provides a success callback that is triggered after successful
+updates of he page's main content. Just hook into it in your javascript and make your layout changes:
 
     Ajaxify.success ->
       # update navigation and/or other layout elements
@@ -74,7 +84,7 @@ updates of he page's main content. Just hook into it and make your layout change
 ### Flash Messages
 
 Ajaxify Rails correctly displays your flash messages after ajaxified requests. To do so it stores them in cookies.
-By default, only flash[:notice] is supported. If you are using for example flash[:warning] as well you have to set:
+By default, only `flash[:notice]` is supported. If you are using for example `flash[:warning]` as well you have to set:
 
     Ajaxify.flash_types = ['notice', 'warning']
     
@@ -86,8 +96,11 @@ Also make sure that you supply invisible wrapper tags in your layout with the fl
 ### Links that need to trigger full Page Reloads
 
 We all know them. Those big requests changing the layout of the page so significantly that 
-simply loading ajax into a content area and doing some minor layout tweaks here and there simply doesn't cut it. Sigh.
-Well, okay here is how to turn Ajaxify Rails off for certain links. Simply add the class no_ajaxify directly to the link:
+loading ajax into a content area and doing some minor layout tweaks here and there simply doesn't cut it. Sigh.
+
+There might also be links and forms that have already their own ajax functionality.
+
+To turn Ajaxify off for certain links and forms, simply add the class `no_ajaxify` directly to the link or form:
 
     = link_to 'Change everything!', re_render_it_all_path, class: 'no_ajaxify'
 
@@ -97,22 +110,25 @@ Well, okay here is how to turn Ajaxify Rails off for certain links. Simply add t
 Sometimes you need to redirect on the root url. 
 
 For example you might have a localized application with the locale inside the url.
-When a user navigates to your_domain.com he/she gets redirected to e.g. your_domain.com/en/. This works fine in browsers supporting
-the html 5 history api. However, for browsers without the history api like Internet Explorer before version 10, Ajaxify Rails needs hints
-about your url structure to not get confused (it creates endless redirects otherwise!). You need to explicitly supply some regex.
+When a user navigates to `your_domain.com` he/she gets redirected to e.g. `your_domain.com/en/`. This works fine in browsers supporting
+the html 5 history api. However, for browsers without the history api like Internet Explorer before version 10, Ajaxify needs hints
+about your url structure to not get confused (it creates endless redirects otherwise!). You need to explicitly supply all possible root
+paths.
 
-Example: if your app's root url potentially redirects to your_domain.com/en/ and your_domain.com/de/
+Example: if your app's root url potentially redirects to `your_domain.com/en/` and `your_domain.com/de/`
 you need to hint Ajaxyfiy like this:
 
-    Ajaxify.base_path_regexp = /^(\/en|\/de)/i
+    Ajaxify.base_paths = ['de', 'en']
+
+Important: `Ajaxify.base_paths` need to be set before `Ajaxify.init()` is called!
 
 
 ### Extra Content
 
 Sometimes you need to do non trivial modifications of the layout whenever the content in the main content area of your site changes.
-Ajaxify Rails allows you to attach arbitrary html to ajaxified requests. This extra html is then stripped from the main content
+Ajaxify allows you to attach arbitrary html to ajaxified requests. This extra html is then stripped from the main content
 that is inserted in the content area. But before that a callback is triggered which can be used to grab the extra content and do something with it.
-To use this feature you need to provide a method ajaxify_extra_content in your ApplicationController:
+To use this feature you need to provide a method `ajaxify_extra_content` in your ApplicationController:
 
     def ajaxify_extra_content
       ... your extra html ...
@@ -124,30 +140,30 @@ For example you could provide url for a widget in the layout like this:
       "<div id='my_fancy_widget_html'> some html </div>"
     end
 
-And then, on the client side hook into Ajaxify via the handle_extra_content callback and select the widget html via #ajaxify_content:
+And then, on the client side hook into Ajaxify using the `handle_extra_content` callback and select the widget html via `#ajaxify_content`:
 
     Ajaxify.handle_extra_content = ->
       $('#my_fancy_widget').html $('#ajaxify_content #my_fancy_widget_html').html()
 
 
-### Reference: All Options and Callbacks
+### Reference: All Javascript Options and Callbacks
 
-Here is a reference of all options and callbacks you can set on the client side via Ajaxify.<i>option_or_callback</i> = :
+Here is a reference of all options and callbacks you can set on the client side via `Ajaxify.<i>option_or_callback</i> =` :
 
-    Option/Callback          Default       Description
+    Option/Callback        Default      Description
 
-    active                   true          Toggles link ajaxification.
-    content_container       'main'         Id of the container to insert the main content into ("yield wrapper").
-    base_path_regexp         null          Regex hint for applications with root url redirects.
+    active                 true         Toggles link ajaxification.
+    content_container     'main'        Id of the container to insert the main content into ("yield wrapper").
+    base_paths             null         Base path segments for applications with root url redirects.
 
-    on_before_load           null          Callback: Called before the ajaxify request is started.
-    on_success               null          Callback: Called when an ajaxify requests finished successfully.
-    on_success_once          null          Callback: Like on_success but only called once.
-    handle_extra_content     null          Callback: Called before extra content is stripped from the ajax request's response.
+    on_before_load         null         Callback: Called before the ajaxify request is started.
+    on_success             null         Callback: Called when an ajaxify requests finished successfully.
+    on_success_once        null         Callback: Like on_success but only called once.
+    handle_extra_content   null         Callback: Called before extra content is stripped from the ajax request's response.
 
-    flash_types              ['notice']    Flash types your Rails app uses. E.g. ['notice', 'warning', 'error']
-    flash_effect             null          Callback: Called for each flash type after flash is set.
-    clear_flash_effect       null          Callback: Called for each flash type whenever flash message is not present
+    flash_types            ['notice']   Flash types your Rails app uses. E.g. ['notice', 'warning', 'error']
+    flash_effect           null         Callback: Called for each flash type after flash is set.
+    clear_flash_effect     null         Callback: Called for each flash type whenever flash message is not present
 
 Also check the example app source code for usage: https://github.com/ncri/ajaxify_rails_demo_app
 

data/lib/ajaxify_rails.rb

@@ -36,6 +36,7 @@ module AjaxifyRails
             end
 
             extra_content = (respond_to?(:ajaxify_extra_content) ? ajaxify_extra_content : '')
+
             super args
 
             # Store current path for redirect url changes. Also used to remove the ajaxify parameter that gets added to some auto generated urls

data/lib/ajaxify_rails/version.rb

@@ -1,3 +1,3 @@
 module AjaxifyRails
-  VERSION = "0.0.2"
+  VERSION = "0.0.4"
 end

data/vendor/assets/javascripts/ajaxify_rails/ajaxify_rails.js.coffee

@@ -5,13 +5,14 @@
   active: true
   content_container: 'main'
   handle_extra_content: null
-  base_path_regexp: null
+  base_paths: null
 
   # callbacks
   #
   on_before_load: null
   on_success: null
   on_success_once: null
+  on_before_correct_url: null
 
   # flash
   #
@@ -31,7 +32,7 @@
       ajaxified: true
 
 
-  init: ->
+  ajaxify: ->
 
     if this.active
 
@@ -55,14 +56,17 @@
 
       exclude_selector = ":not(.no_ajaxify):not([enctype='multipart/form-data'])"
       $('body').on 'submit', "form[action^='/']#{exclude_selector},
-                              form[action^='#{protocol_and_hostname}']#{exclude_selector}", ->
+                              form[action^='#{protocol_and_hostname}']#{exclude_selector},
+                              form[action='']#{exclude_selector}", ->
 
         $this = $(this)
         form_params = $(this).serialize()
         form_params += '&ajaxified=true'
 
+        action = $this.attr('action')
+
         self.load
-          url: $this.attr('action')
+          url: if action != '' then action else '/'
           data: form_params
           type: $this.attr('method')
           confirm: $this.data('confirm')
@@ -203,10 +207,27 @@
       else
         this.ignore_hash_change = true  # avoids loading the page for hash changes caused by link clicks
         hash = "#{options.url.replace(new RegExp(this.protocol_with_host()), '')}"
-        if this.base_path_regexp
-          hash = hash.replace(this.base_path_regexp, '')
+        base_path_regexp = this.base_path_regexp()
+        if base_path_regexp
+          hash = hash.replace(base_path_regexp, '')
+          hash = "/#{hash}" unless hash == '' or hash.indexOf('/') == 0
         window.location.hash = hash
+        this.ignore_hash_change = false
+
+
+  base_path_regexp: ->
+    return null unless this.base_paths
+    # match starting and ending with base path, e.g. "^\/en$" (i.e. we are at the base path root) or
+    # starting with base path and continuing with '/', e.g. "^\/en\/" (i.e. we are NOT at the base path root)
+    self = this
+    new RegExp("^\/(#{ $.map(this.base_paths, (el) ->
+      el = self.regexp_escape el
+      "#{el}$|#{el}\/|#{el}\\?"
+    ).join('|')})", 'i')
+
 
+  regexp_escape: (str) ->
+    str.replace new RegExp('[.\\\\+*?\\[\\^\\]$(){}=!<>|:\\-]', 'g'), '\\$&'
 
 
   protocol_with_host: ->
@@ -215,28 +236,40 @@
 
 
   correct_url: ->
-    if window.location.hash.indexOf('#/') == 0
-      if !window.history.pushState
-        Ajaxify.load_page_from_hash = true   # notify Ajaxify that a hash will be loaded and ignore all other calls to load until hash url is loaded
-      else
-        path = window.location.pathname + window.location.hash.replace(/#\//, "")       # load proper url in case url contains #/ and browser supports history api
-        window.location.href = "#{this.protocol_with_host()}#{path}"
-
-    else if !window.history.pushState and window.location.pathname != '/'
-      if this.base_path_regexp and (match = window.location.pathname.match(this.base_path_regexp))
-        path = "#{match[0]}/##{window.location.pathname}"
-        if match[0] == window.location.pathname then return
-      else
-        path = "/##{window.location.pathname}"
-
-      window.location.href = "#{this.protocol_with_host()}#{path}#{window.location.search}"  # move path behind # for browsers without history api if not at site root
+    if this.active
+      if window.location.hash.indexOf('#/') == 0
+        if !window.history.pushState
+          Ajaxify.load_page_from_hash = true   # notify Ajaxify that a hash will be loaded and ignore all other calls to load until hash url is loaded
+        else
+          path = window.location.pathname + window.location.hash.replace(/#\//, "")       # load proper url in case url contains #/ and browser supports history api
+          window.location.href = "#{this.protocol_with_host()}#{path}"
+
+      else if !window.history.pushState
+        # move path behind # for browsers without history api
+        if window.location.pathname != '/'
+          base_path_regexp = this.base_path_regexp()
+          if base_path_regexp and (match = window.location.pathname.match(base_path_regexp))
+            if match[0] == window.location.pathname
+              if window.location.search == ''
+                return
+              else
+                path = match[0].replace(/\?/,'') + '#'
+            else
+              path = "#{match[0]}##{window.location.pathname}"
+          else
+            path = "/##{window.location.pathname}"
+
+          window.location.href = "#{this.protocol_with_host()}#{path}#{window.location.search}"
+        else
+          if window.location.search != ''
+            window.location.href = "#{this.protocol_with_host()}/##{window.location.search}" # move search behind #
 
+  init: ->
+    this.correct_url()
 
   is_string: (variable) ->
     Object.prototype.toString.call(variable) == '[object String]'
 
 
-Ajaxify.correct_url()
-
 jQuery ->
-  Ajaxify.init()
+  Ajaxify.ajaxify()

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: ajaxify_rails
 version: !ruby/object:Gem::Version
-  version: 0.0.2
+  version: 0.0.4
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2012-09-27 00:00:00.000000000 Z
+date: 2012-09-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -65,7 +65,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -4267286342306051079
+      hash: -1092049062637497690
 required_rubygems_version: !ruby/object:Gem::Requirement
   none: false
   requirements:
@@ -74,7 +74,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: -4267286342306051079
+      hash: -1092049062637497690
 requirements: []
 rubyforge_project: 
 rubygems_version: 1.8.24