Skip to content

Commit df131f8

Browse files
committed
Use Controller.all() in place of Controller constructor.
1 parent 63fb6cf commit df131f8

File tree

4 files changed

+53
-48
lines changed

4 files changed

+53
-48
lines changed

README.md

+46-43
Original file line numberDiff line numberDiff line change
@@ -24,61 +24,35 @@ After the generator finishes, you will be prompted to add helper call to your ap
2424

2525
## Usage
2626

27-
### Global Functions
28-
29-
Any functions that need to be accessible in the global scope should be defined in ```global.js.coffee``` using the ```App``` namespace. Below is an example of one of our favorite functions that we use to submit a form using AJAX as a JSON request.
30-
31-
```
32-
# app/assets/javascripts/global.js.coffee
33-
window.App ||= {}
34-
35-
App.remoteSubmission = ($form, onCompleteCallBack) ->
36-
$.ajax
37-
url: $form.attr('action')
38-
type: $form.attr('method')
39-
data: $form.serialize()
40-
dataType: 'json'
41-
complete: (result) ->
42-
onCompleteCallBack(result)
43-
44-
return
45-
```
46-
47-
Now you can access this function from anywhere in the application by just calling ```App.remoteSubmission($('#myForm'), alert('Hello'))```
48-
27+
### Page (Action) Specific JavaScript
4928

50-
### Page Specific JavaScript
51-
52-
This is where things get even easier, your JavaScript class is named after your Controller and there is a method for each Controller action. Whenever you generate a Controller, the CoffeeScript file that is generated will define the new JavaScript class and the basic REST actions. This means on ```Users#show``` we can submit that 'follow' request in the background like so:
29+
Your JavaScript class is named after your Controller and there is a method for each Controller action. Whenever you generate a Controller, the CoffeeScript file that is generated will define the new JavaScript class and the basic REST actions. The example below would print 'users#show' in the console for the ```Users#show``` action.
5330

5431
```
5532
# app/assets/javascripts/users.js.coffee
5633
5734
window.App ||= {}
5835
class App.Users extends App.Base
5936
60-
show: ->
61-
App.remoteSubmission($('#follow-user-form'), alert('You are now following them!'))
37+
show: =>
38+
console.log 'users#show'
6239
```
6340

6441

42+
6543
### Controller Specific JavaScript
6644

67-
Executing some JavaScript to run on all controller actions is just a matter of adding it to the class constructor. In the below example we will change the background color of the page for all actions in ```UsersController```.
45+
Executing some JavaScript to run on all controller actions is just a matter of adding it to the ```all``` function. This is run before the action specific method. The example below would print 'users' for each ```Users``` controller action.
6846

6947
```
7048
# app/assets/javascripts/users.js.coffee
7149
window.App ||= {}
72-
class App.Example extends App.Base
50+
class App.Users extends App.Base
7351
74-
constructor: ->
75-
super
76-
$('body').css('background-color', 'yellow')
77-
return this
52+
all: =>
53+
console.log 'users'
7854
```
7955

80-
Note the call to ```super``` and the ```return this```, it is very important to keep these. If you wanted your Controller specific JavaScript to run before Application wide JavaScript, then you would call ```super``` just before ```return this```. Returning ```this``` allows the Application layout JavaScript to call the action specific functions.
81-
8256

8357
### Application Wide JavaScript
8458

@@ -105,6 +79,29 @@ class App.Base
10579
In this example we extracted the rollover action into a new function. Doing so will make the class cleaner and easier to maintain as the application grows. Once again note the ```return this``` in the constructor.
10680

10781

82+
83+
### Global Functions
84+
85+
Any functions that need to be accessible in the global scope should be defined in ```global.js.coffee``` using the ```App``` namespace. Below is an example of one of our favorite functions that we use to submit a form using AJAX as a JSON request.
86+
87+
```
88+
# app/assets/javascripts/global.js.coffee
89+
window.App ||= {}
90+
91+
App.remoteSubmission = ($form) ->
92+
$.ajax
93+
url: $form.attr('action')
94+
type: $form.attr('method')
95+
data: $form.serialize()
96+
dataType: 'json'
97+
98+
return
99+
```
100+
101+
Now you can access this function from anywhere in the application by just calling ```App.remoteSubmission($('#myForm'))```
102+
103+
104+
108105
### Utilities
109106

110107
A ```Utility``` is a class that will be used to create similar functionality in many areas of the application. A good example of this is a Modal, which could appear multiple times on the same page. So, let's encapsulate this functionality in a highly reusable class.
@@ -168,6 +165,7 @@ class App.Users extends App.Base
168165
```
169166

170167

168+
171169
### Elements
172170

173171
An ```Element``` is a class that describes the functionality of a one off element in the application. A Main Menu is a good example of this since there is usually only a single Main Menu.
@@ -202,6 +200,7 @@ class App.Base
202200
```
203201

204202

203+
205204
#### Element Inheritance
206205

207206
Inheritance is another key tool for reusability. Let's say our ```Element.MainMenu``` opens and closes in the same way as the ```Utility.Modal```. Well then MainMenu should just extend Modal, this can be accomplished from the generator:
@@ -223,6 +222,7 @@ class Element.MainMenu extends Utility.Modal
223222
Inheritance from the generator can only come from a Utility class. Any class you wish to extend should be created as a Utility. The installer adds the line ```//= require_tree ./utilities``` before loading tree to handle this. If you have a utility that extends a utility, then make sure the extended utility is loaded first by explicitly requiring it before ```//= require_tree ./utilities```.
224223

225224

225+
226226
### Custom Controllers
227227

228228
When a new controller is generated, the JavaScript asset file will be generated with RailsScript. However, if you need to manually generate a RailsScript controller you can use:
@@ -237,28 +237,28 @@ Since the above example includes a namespace, it would generate:
237237
window.App ||= {}
238238
class App.SomeNewController extends App.Base
239239
240-
constructor: ->
241-
super
242-
return this
240+
all: =>
241+
return
243242
244243
245-
index: ->
244+
index: =>
246245
return
247246
248247
249-
show: ->
248+
show: =>
250249
return
251250
252251
253-
new: ->
252+
new: =>
254253
return
255254
256255
257-
edit: ->
256+
edit: =>
258257
return
259258
```
260259

261-
None of the pre-defined functions are necessary, you can remove the ones you don't want.
260+
None of the pre-defined functions are necessary, you can remove the ones you don't need.
261+
262262

263263

264264
### Generic Classes
@@ -280,6 +280,8 @@ class App.MyClassName
280280
281281
```
282282

283+
284+
283285
### Passing Rails Variables
284286

285287
To pass data from Rails to JavaScript, just call ```to_javascript``` along with a hash of your data. This is then converted to a JSON object with ```to_javascript.to_json``` and can be accessed with ```Utility.RailsVars```. The ```to_javascript``` helper may be called from multiple points in the application, all data is merged together.
@@ -315,6 +317,7 @@ class App.Users extends App.Base
315317
```
316318

317319

320+
318321
### Events
319322

320323
Since Turbolinks doesn't refresh the page and only replaces the body, event listeners defined on ```window``` and ```document``` carry between page loads. To avoid these event listeners stacking, RailsScript will destroy all event listeners on ```window``` and ```document``` that have a blank namespace, i.e. ```$(window).on 'scroll', myHandler```. If you need an event handler to persist between page changes, then define a namespace, i.e. ```$(window).on 'scroll.namespace', myHandler```.

lib/generators/rails_script/controller/templates/javascript.js.coffee

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
window.App ||= {}
22
class App.<%= controller.gsub('::', '') %> extends App.Base
33

4-
constructor: ->
5-
super
6-
return this
4+
all: =>
5+
return
76

87

98
index: =>

lib/rails_script/loader_helper.rb

+4-1
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,11 @@ def include_rails_script
88
99
(function() {
1010
window.$this = new (App.#{ controller_path.split(/\/|_/).map(&:capitalize).join('') } || App.Base)();
11+
if (typeof $this.all === 'function') {
12+
$this.all.call();
13+
}
1114
if (typeof $this.#{ action_name } === 'function') {
12-
return $this.#{ action_name }.call();
15+
$this.#{ action_name }.call();
1316
}
1417
})();
1518
RUBY

lib/rails_script/version.rb

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
module RailsScript
2-
VERSION = '0.4.1'
2+
VERSION = '0.5.0'
33
end

0 commit comments

Comments
 (0)