ng_on_rails 0.0.2 → 0.0.3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +63 -51
- data/app/assets/javascripts/directives/shared.js.erb +0 -1
- data/app/helpers/ng_on_rails_helper.rb +0 -2
- data/lib/generators/ng_on_rails/controller_generator.rb +14 -0
- data/lib/generators/ng_on_rails/resource_generator.rb +14 -0
- data/lib/generators/ng_on_rails/templates/controller_template.js.erb +113 -0
- data/lib/generators/ng_on_rails/templates/resource_template.js.erb +6 -0
- data/lib/ng_on_rails/version.rb +1 -1
- metadata +6 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 4f212d2b4cb8e37f88d4c87d993abfaeadafc60e
|
4
|
+
data.tar.gz: 0703fa143da3d32eabfcafdfddba2651b4bd746a
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: c7e067cfaf1f72ae1e6dba5a1c8962051641c54970517ec4d18c644e184902333648f05a18f05212b17e6ba07c9ce706dc33b49b467e92bbbc4271ed82ba6ad6
|
7
|
+
data.tar.gz: a74e9a03945024bc090581f3ed9e7a00f571447f9d78bc55c7294fd5e287c4a3c1f2fda190b3ffe537af8dbc883d25abbf8b690ca169714a9fcc611126aceddc
|
data/README.md
CHANGED
@@ -10,7 +10,7 @@ The main motivations behind this gem is to standardize and simplify how AngularJ
|
|
10
10
|
|
11
11
|
I am just getting started but this does function *as-is*. Some things left to do:
|
12
12
|
* Write more specs!!!
|
13
|
-
* Create generators for
|
13
|
+
* (Create generators for views?)
|
14
14
|
* (ViewHelper functions via shared service?)
|
15
15
|
|
16
16
|
### Install it!
|
@@ -36,7 +36,7 @@ Finally, in your layout below the `javascript_include_tag "application"` load th
|
|
36
36
|
</script>
|
37
37
|
```
|
38
38
|
|
39
|
-
Here, ng_data is a rails varible
|
39
|
+
Here, ng_data is a rails varible discussed [below](#locals_to_json). A typical application layout (in Slim) might look like...
|
40
40
|
```slim
|
41
41
|
- ng_data = {}
|
42
42
|
- ng_data['BUILD'] = true
|
@@ -61,21 +61,28 @@ html
|
|
61
61
|
== yield :javascripts
|
62
62
|
```
|
63
63
|
|
64
|
+
You are now up and running! To generate controllers and resource-services use NgOnRails generators:
|
65
|
+
```
|
66
|
+
# Assuming the Rails app has a "Page" model:
|
67
|
+
$ bundle exec rails g ng_on_rails:controller Page
|
68
|
+
$ bundle exec rails g ng_on_rails:resource Page
|
69
|
+
```
|
70
|
+
|
64
71
|
##### Service: Rails
|
65
|
-
As will be discussed in detail [below](#locals_to_json) NgOnRails
|
72
|
+
As will be discussed in detail [below](#locals_to_json), NgOnRails provides a Rails-service that can be injected into your Angular Controllers. This service has all your rails variables contained in json. So @page and @pages will get mapped to Rails.page and Rails.pages to be used by your angular app.
|
66
73
|
|
67
74
|
##### Directives: render and render\_view
|
68
75
|
NgOnRails provides you with two directives, `render` for displapying angular partials and `render_view` for displaying angular views. More details [here](#render_directives).
|
69
76
|
|
70
77
|
##### Note: NgOnRailsApp
|
71
|
-
|
78
|
+
An angular-app, NgOnRailsApp, is automatically created if it doesn't already exsit
|
72
79
|
```javascript
|
73
80
|
# ng_on_rails/app/assets/javascripts/app.js
|
74
81
|
if (!window.NgOnRailsApp){
|
75
82
|
window.NgOnRailsApp = angular.module("NgOnRailsApp", ["ngResource","ngAnimate","ngSanitize"])
|
76
83
|
}
|
77
84
|
```
|
78
|
-
If you want to overide NgOnRailsApp
|
85
|
+
If you want to overide NgOnRailsApp, so you can inject your own providers,
|
79
86
|
Just incldue a app.js file that defines NgOnRailsApp in your own app and load it **before** ng\_on\_rails
|
80
87
|
```javascript
|
81
88
|
# your_app/app/assets/javascripts/angular_app/app.js
|
@@ -127,7 +134,7 @@ Now you can then use the ng\_on\_rails directives 'render' and 'render\_view' to
|
|
127
134
|
|
128
135
|
#### Conventions
|
129
136
|
|
130
|
-
The test_app serves as an example of the conventions discussed below, but before looking it over read [this](#test_app).
|
137
|
+
The [test_app](https://github.com/brookisme/ng_on_rails/tree/master/spec/test_app) serves as an example of the conventions discussed below, but before looking it over read [this](#test_app).
|
131
138
|
|
132
139
|
* Put Angular controllers/directives/... in a folder "angular\_app" in the assets directory. Similarly, as discussed above, the angular views(partials) are placed in a folder "angular\_app" in the views directory
|
133
140
|
```
|
@@ -188,10 +195,13 @@ Note that using distinguishing characterisic of loading the controller via `ng_c
|
|
188
195
|
|
189
196
|
|
190
197
|
#### Angular Services for Rails Models
|
191
|
-
You are going to have a service for each rails model.
|
192
|
-
|
198
|
+
You are going to have a resource-service for each rails model. You can create these with the NgOnRails generator
|
199
|
+
```
|
200
|
+
$ bundle exec rails g ng_on_rails:resource Page
|
201
|
+
```
|
202
|
+
Which creates the following file:
|
193
203
|
```coffeescript
|
194
|
-
# app/assets/javascripts/angular_app/services/page.js.coffee
|
204
|
+
# your_app/app/assets/javascripts/angular_app/services/page.js.coffee
|
195
205
|
NgOnRailsApp.factory "Page", ($resource) ->
|
196
206
|
PageResource = $resource "/questions/:id.json", {id: "@id"}, {
|
197
207
|
update:{method: "PUT"}
|
@@ -202,37 +212,48 @@ NgOnRailsApp.factory "Page", ($resource) ->
|
|
202
212
|
|
203
213
|
|
204
214
|
#### Angular Controllers for Rails Models
|
205
|
-
Simalarly you are going to have an angular controller for each rails model.
|
215
|
+
Simalarly you are going to have an angular controller for each rails model. A controller that uses the Rails-service and pre-defined REST methods can be generated with
|
216
|
+
```
|
217
|
+
$ bundle exec rails g ng_on_rails:controller Page
|
218
|
+
```
|
219
|
+
The output is below (*Note that I place all the REST methods in a rest object*):
|
206
220
|
|
207
221
|
```coffeescript
|
208
|
-
|
209
|
-
|
222
|
+
# your_app/app/assets/javascripts/angular_app/controllers/pages_controller.js.coffee
|
223
|
+
NgOnRailsApp.controller 'PagesController', ($scope,Page,Rails) ->
|
224
|
+
#
|
225
|
+
# CONTROLLER SETUP
|
226
|
+
#
|
210
227
|
ctrl = this
|
211
|
-
ctrl.
|
228
|
+
ctrl.rails = Rails
|
212
229
|
ctrl.data = {}
|
213
230
|
|
214
|
-
|
231
|
+
|
232
|
+
#
|
233
|
+
# INITIALIZERS
|
234
|
+
#
|
215
235
|
ctrl.setPage = (page)->
|
216
|
-
ctrl.
|
236
|
+
ctrl.data.page = page
|
217
237
|
ctrl.setPages = (pages)->
|
218
|
-
ctrl.
|
238
|
+
ctrl.data.pages = pages
|
239
|
+
|
219
240
|
|
220
|
-
#
|
241
|
+
#
|
242
|
+
# REST METHODS
|
243
|
+
#
|
221
244
|
ctrl.rest =
|
222
245
|
index: ->
|
223
246
|
params = {}
|
224
247
|
Page.query(params).$promise.then (pages) ->
|
225
|
-
ctrl.
|
248
|
+
ctrl.data.pages = pages
|
226
249
|
|
227
250
|
show: (page_id)->
|
228
251
|
Page.get({id: page_id}).$promise.then (page) ->
|
229
|
-
ctrl.
|
230
|
-
|
231
|
-
|
232
|
-
new: (doc_id)->
|
252
|
+
ctrl.data.page = page
|
253
|
+
|
254
|
+
new: ()->
|
233
255
|
ctrl.clear()
|
234
256
|
ctrl.data.activePage = {}
|
235
|
-
ctrl.data.activePage.doc_id = doc_id
|
236
257
|
ctrl.data.creating_new_page = true
|
237
258
|
|
238
259
|
create: ->
|
@@ -242,8 +263,8 @@ NgOnRailsApp.controller 'PagesController', ($scope,Page,Bridge) ->
|
|
242
263
|
Page.save(
|
243
264
|
working_page,
|
244
265
|
(page)->
|
245
|
-
ctrl.
|
246
|
-
ctrl.
|
266
|
+
ctrl.data.pages ||= []
|
267
|
+
ctrl.data.pages.push(page)
|
247
268
|
ctrl.clear()
|
248
269
|
ctrl.locked = false
|
249
270
|
,
|
@@ -253,11 +274,9 @@ NgOnRailsApp.controller 'PagesController', ($scope,Page,Bridge) ->
|
|
253
274
|
ctrl.locked = false
|
254
275
|
)
|
255
276
|
|
256
|
-
edit: (page
|
277
|
+
edit: (page) ->
|
257
278
|
ctrl.clear()
|
258
|
-
page.show_details = false
|
259
279
|
ctrl.data.activePage = page
|
260
|
-
ctrl.data.activePage.doc_id = doc_id
|
261
280
|
ctrl.data.editing_page = true
|
262
281
|
|
263
282
|
update: (page)->
|
@@ -281,7 +300,7 @@ NgOnRailsApp.controller 'PagesController', ($scope,Page,Bridge) ->
|
|
281
300
|
Page.delete(
|
282
301
|
page,
|
283
302
|
(page)->
|
284
|
-
pages ||= ctrl.
|
303
|
+
pages ||= ctrl.data.pages
|
285
304
|
pages.splice(index,1)
|
286
305
|
,
|
287
306
|
(error)->
|
@@ -290,22 +309,9 @@ NgOnRailsApp.controller 'PagesController', ($scope,Page,Bridge) ->
|
|
290
309
|
ctrl.clear()
|
291
310
|
|
292
311
|
|
293
|
-
#
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
ctrl.resort = (pages) ->
|
298
|
-
for page, index in pages
|
299
|
-
page.order_index = index + 1
|
300
|
-
Page.update(
|
301
|
-
page,
|
302
|
-
(page)->
|
303
|
-
# success handler
|
304
|
-
,
|
305
|
-
(error)->
|
306
|
-
console.log("update_error:",error)
|
307
|
-
)
|
308
|
-
|
312
|
+
#
|
313
|
+
# SCOPE METHODS
|
314
|
+
#
|
309
315
|
ctrl.clear = ->
|
310
316
|
ctrl.data.activePage = null
|
311
317
|
ctrl.data.creating_new_page = false
|
@@ -315,10 +321,17 @@ NgOnRailsApp.controller 'PagesController', ($scope,Page,Bridge) ->
|
|
315
321
|
(ctrl.data.editing_page && !!page && page.id == ctrl.data.activePage.id) ||
|
316
322
|
(ctrl.data.creating_new_page && !page)
|
317
323
|
|
318
|
-
|
319
|
-
|
320
|
-
|
321
|
-
|
324
|
+
|
325
|
+
#
|
326
|
+
# PRIVATE METHODS
|
327
|
+
#
|
328
|
+
# => add methods here, not attached to the ctrl object to be used internally
|
329
|
+
#
|
330
|
+
|
331
|
+
|
332
|
+
#
|
333
|
+
# END
|
334
|
+
#
|
322
335
|
return
|
323
336
|
```
|
324
337
|
<a name="locals_to_json"></a>
|
@@ -342,13 +355,12 @@ To understand it better look at [ng_on_rails_helper.rb](https://github.com/brook
|
|
342
355
|
|
343
356
|
<a name="test_app"></a>
|
344
357
|
#### Test App
|
345
|
-
The [test_app](https://github.com/brookisme/ng_on_rails/
|
358
|
+
The [test_app](https://github.com/brookisme/ng_on_rails/tree/master/spec/test_app) can be used as an example application. A some details to mention:
|
346
359
|
|
347
360
|
* The DB is Postgres
|
348
361
|
* The (Angular) Views use Slim
|
349
362
|
* The JS uses CoffeeScript (except for _rails_service.js.erb -- where I need access to Rails)
|
350
363
|
* Much of app/views/angular_app & app/assests/javascripts/angular_app has been cut and pasted in from a different project and the models have been generated with Rails scaffolding. This leads to a few oddities:
|
351
|
-
* There is a mixture of both erb and slim
|
352
364
|
* The full scaffolding has been left in but the Angular views are contained solely withing the docs-index and doc-show pages.
|
353
365
|
* Though there is limited CSS but I use both bootstrap and font-awesome
|
354
366
|
|
@@ -2,8 +2,6 @@ module NgOnRailsHelper
|
|
2
2
|
def locals_to_json ng_data
|
3
3
|
j = ActiveSupport::JSON
|
4
4
|
locals_hash = {}
|
5
|
-
puts "***********"
|
6
|
-
puts "#{instance_variable_names}"
|
7
5
|
instance_variable_names.each do |var_name|
|
8
6
|
unless !!var_name.match(/^@_/)
|
9
7
|
unless ignorables.include? var_name
|
@@ -0,0 +1,14 @@
|
|
1
|
+
require 'rails/generators'
|
2
|
+
module NgOnRails
|
3
|
+
class ControllerGenerator < Rails::Generators::NamedBase
|
4
|
+
desc "Creates NgOnRails-style AngularJS Controller"
|
5
|
+
|
6
|
+
def self.source_root
|
7
|
+
@source_root ||= File.join(File.dirname(__FILE__), 'templates')
|
8
|
+
end
|
9
|
+
|
10
|
+
def generate_layout
|
11
|
+
template "#{ControllerGenerator.source_root}/controller_template.js.erb", "app/assets/javascripts/angular_app/controllers/#{plural_name}_controller.js.coffee"
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
@@ -0,0 +1,14 @@
|
|
1
|
+
require 'rails/generators'
|
2
|
+
module NgOnRails
|
3
|
+
class ResourceGenerator < Rails::Generators::NamedBase
|
4
|
+
desc "Creates NgOnRails-style AngularJS Resource Service"
|
5
|
+
|
6
|
+
def self.source_root
|
7
|
+
@source_root ||= File.join(File.dirname(__FILE__), 'templates')
|
8
|
+
end
|
9
|
+
|
10
|
+
def generate_layout
|
11
|
+
template "#{ResourceGenerator.source_root}/resource_template.js.erb", "app/assets/javascripts/angular_app/services/#{file_name}.js.coffee"
|
12
|
+
end
|
13
|
+
end
|
14
|
+
end
|
@@ -0,0 +1,113 @@
|
|
1
|
+
NgOnRailsApp.controller '<%="#{class_name.pluralize}"%>Controller', ($scope,<%="#{class_name}"%>,Rails) ->
|
2
|
+
#
|
3
|
+
# CONTROLLER SETUP
|
4
|
+
#
|
5
|
+
ctrl = this
|
6
|
+
ctrl.rails = Rails
|
7
|
+
ctrl.data = {}
|
8
|
+
|
9
|
+
|
10
|
+
#
|
11
|
+
# INITIALIZERS
|
12
|
+
#
|
13
|
+
ctrl.set<%="#{class_name}"%> = (<%="#{file_name}"%>)->
|
14
|
+
ctrl.data.<%="#{file_name}"%> = <%="#{file_name}"%>
|
15
|
+
ctrl.set<%="#{class_name.pluralize}"%> = (<%="#{plural_name}"%>)->
|
16
|
+
ctrl.data.<%="#{plural_name}"%> = <%="#{plural_name}"%>
|
17
|
+
|
18
|
+
|
19
|
+
#
|
20
|
+
# REST METHODS
|
21
|
+
#
|
22
|
+
ctrl.rest =
|
23
|
+
index: ->
|
24
|
+
params = {}
|
25
|
+
<%="#{class_name}"%>.query(params).$promise.then (<%="#{plural_name}"%>) ->
|
26
|
+
ctrl.data.<%="#{plural_name}"%> = <%="#{plural_name}"%>
|
27
|
+
|
28
|
+
show: (<%="#{file_name}"%>_id)->
|
29
|
+
<%="#{class_name}"%>.get({id: <%="#{file_name}"%>_id}).$promise.then (<%="#{file_name}"%>) ->
|
30
|
+
ctrl.data.<%="#{file_name}"%> = <%="#{file_name}"%>
|
31
|
+
|
32
|
+
new: ()->
|
33
|
+
ctrl.clear()
|
34
|
+
ctrl.data.active<%="#{class_name}"%> = {}
|
35
|
+
ctrl.data.creating_new_<%="#{file_name}"%> = true
|
36
|
+
|
37
|
+
create: ->
|
38
|
+
if !(ctrl.locked || ctrl.<%="#{file_name}"%>_form.$error.required)
|
39
|
+
ctrl.locked = true
|
40
|
+
working_<%="#{file_name}"%> = angular.copy(ctrl.data.active<%="#{class_name}"%>)
|
41
|
+
<%="#{class_name}"%>.save(
|
42
|
+
working_<%="#{file_name}"%>,
|
43
|
+
(<%="#{file_name}"%>)->
|
44
|
+
ctrl.data.<%="#{plural_name}"%> ||= []
|
45
|
+
ctrl.data.<%="#{plural_name}"%>.push(<%="#{file_name}"%>)
|
46
|
+
ctrl.clear()
|
47
|
+
ctrl.locked = false
|
48
|
+
,
|
49
|
+
(error)->
|
50
|
+
console.log("create_error:",error)
|
51
|
+
ctrl.clear()
|
52
|
+
ctrl.locked = false
|
53
|
+
)
|
54
|
+
|
55
|
+
edit: (<%="#{file_name}"%>) ->
|
56
|
+
ctrl.clear()
|
57
|
+
ctrl.data.active<%="#{class_name}"%> = <%="#{file_name}"%>
|
58
|
+
ctrl.data.editing_<%="#{file_name}"%> = true
|
59
|
+
|
60
|
+
update: (<%="#{file_name}"%>)->
|
61
|
+
if !(ctrl.locked || ctrl.<%="#{file_name}"%>_form.$error.required)
|
62
|
+
ctrl.locked = true
|
63
|
+
<%="#{file_name}"%> = ctrl.data.active<%="#{class_name}"%> unless !!<%="#{file_name}"%>
|
64
|
+
working_<%="#{file_name}"%> = angular.extend(angular.copy(<%="#{file_name}"%>),ctrl.data.active<%="#{class_name}"%>)
|
65
|
+
<%="#{class_name}"%>.update(
|
66
|
+
working_<%="#{file_name}"%>,
|
67
|
+
(<%="#{file_name}"%>)->
|
68
|
+
# success handler
|
69
|
+
ctrl.locked = false
|
70
|
+
,
|
71
|
+
(error)->
|
72
|
+
console.log("update_error:",error)
|
73
|
+
ctrl.locked = false
|
74
|
+
)
|
75
|
+
ctrl.clear()
|
76
|
+
|
77
|
+
delete: (index,<%="#{file_name}"%>,<%="#{plural_name}"%>)->
|
78
|
+
<%="#{class_name}"%>.delete(
|
79
|
+
<%="#{file_name}"%>,
|
80
|
+
(<%="#{file_name}"%>)->
|
81
|
+
<%="#{plural_name}"%> ||= ctrl.data.<%="#{plural_name}"%>
|
82
|
+
<%="#{plural_name}"%>.splice(index,1)
|
83
|
+
,
|
84
|
+
(error)->
|
85
|
+
console.log("delete_error:",error)
|
86
|
+
)
|
87
|
+
ctrl.clear()
|
88
|
+
|
89
|
+
|
90
|
+
#
|
91
|
+
# SCOPE METHODS
|
92
|
+
#
|
93
|
+
ctrl.clear = ->
|
94
|
+
ctrl.data.active<%="#{class_name}"%> = null
|
95
|
+
ctrl.data.creating_new_<%="#{file_name}"%> = false
|
96
|
+
ctrl.data.editing_<%="#{file_name}"%> = false
|
97
|
+
|
98
|
+
ctrl.is_editing = (<%="#{file_name}"%>)->
|
99
|
+
(ctrl.data.editing_<%="#{file_name}"%> && !!<%="#{file_name}"%> && <%="#{file_name}"%>.id == ctrl.data.active<%="#{class_name}"%>.id) ||
|
100
|
+
(ctrl.data.creating_new_<%="#{file_name}"%> && !<%="#{file_name}"%>)
|
101
|
+
|
102
|
+
|
103
|
+
#
|
104
|
+
# PRIVATE METHODS
|
105
|
+
#
|
106
|
+
# => add methods here, not attached to the ctrl object to be used internally
|
107
|
+
#
|
108
|
+
|
109
|
+
|
110
|
+
#
|
111
|
+
# END
|
112
|
+
#
|
113
|
+
return
|
@@ -0,0 +1,6 @@
|
|
1
|
+
NgOnRailsApp.factory '<%="#{class_name}"%>', ($resource) ->
|
2
|
+
<%="#{class_name}"%>Resource = $resource '/<%="#{plural_name}"%>/:id.json', {id: '@id'}, {
|
3
|
+
update:{method: "PUT"}
|
4
|
+
}
|
5
|
+
class <%="#{class_name}"%> extends <%="#{class_name}"%>Resource
|
6
|
+
# place class and instance methods here
|
data/lib/ng_on_rails/version.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: ng_on_rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.3
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Brookie Williams
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2014-10-
|
11
|
+
date: 2014-10-06 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: angularjs-rails
|
@@ -97,6 +97,10 @@ files:
|
|
97
97
|
- app/helpers/ng_on_rails_helper.rb
|
98
98
|
- app/views/angular_app/_rails_service.js.erb
|
99
99
|
- config/routes.rb
|
100
|
+
- lib/generators/ng_on_rails/controller_generator.rb
|
101
|
+
- lib/generators/ng_on_rails/resource_generator.rb
|
102
|
+
- lib/generators/ng_on_rails/templates/controller_template.js.erb
|
103
|
+
- lib/generators/ng_on_rails/templates/resource_template.js.erb
|
100
104
|
- lib/ng_on_rails.rb
|
101
105
|
- lib/ng_on_rails/engine.rb
|
102
106
|
- lib/ng_on_rails/version.rb
|