Awesome
PhoenixRoutesJs
Phoenix routes helpers in javascript code
Installation
If available in Hex, the package can be installed
by adding phoenix_routes_js
to your list of dependencies in mix.exs
:
def deps do
[{:phoenix_routes_js, "~> 0.1.1"}]
end
Usage
Two steps configuration:
- Add possibility to use view helper by adding
use PhoenixRoutesJs.View
in template**_web/views/layout_view.ex
file:
defmodule Project.LayoutView do
...
import PhoenixRoutesJs.View
...
end
- Add helper
render_routes_script
to you layout in**_web/templates/layout/app.html.eex
before main javascript file:
...
<%= render_routes_script(@conn) %>
<script src="<%= static_path(@conn, "/js/app.js") %>"></script>
...
Examples
render_routes_script(@conn)
render_routes_script(Project.Router)
Now you can use phoenix routes helpers in browser console and javascript code.
Helpers
user_path GET /users UserController :index Routes.user_path('index')
user_path GET /users/:id/edit UserController :edit Routes.user_path('edit', ':id')
user_path GET /users/new UserController :new Routes.user_path('new')
user_path GET /users/:id UserController :show Routes.user_path('show', ':id')
user_path POST /users UserController :create Routes.user_path('create')
user_path PATCH /users/:id UserController :update Routes.user_path('update', ':id')
PUT /users/:id UserController :update
user_path DELETE /users/:id UserController :delete Routes.user_path('delete', ':id')
JavaScript
Routes object is kept in window
.
Browser
Now you can access to you helpers in console:
// browser console
Routes.user_path('edit', 1)
//=> /users/1/edit
JavaScript assets
// Somewhere in javascript modules
window.Routes.user_path('edit', 1)
//=> /users/1/edit
JavaScript options:
Routes options:
format
- Add '.format' to request path string.params
- Add query string to request path.
Routes.user_path('index', {format: 'json', params: {filter: 'query', sort: 'acs'}})
//=> "/users.json?filter=query&sort=acs"
License
The library is available as open source under the terms of the MIT License.