backbone-support 0.2.0 → 0.3.0
Sign up to get free protection for your applications and to get access to all the features.
data/CHANGELOG
CHANGED
@@ -1,8 +1,14 @@
|
|
1
|
+
0.3.0
|
2
|
+
|
3
|
+
CompositeView provides this.bindTo(source, event, callback) to provide easy
|
4
|
+
unbinding with unbindFromAll(). It also invokes unbindFromAll from within
|
5
|
+
leave().
|
6
|
+
|
1
7
|
0.2.0
|
2
8
|
|
3
|
-
The version changes the order of
|
4
|
-
|
5
|
-
display a flash of unstyled content when performing certain actions in their
|
9
|
+
The version changes the order of when a view has render called on it when
|
10
|
+
being swapped by a SwappingRouter. This fixes an issue in some browsers which
|
11
|
+
would display a flash of unstyled content when performing certain actions in their
|
6
12
|
render, like changing the body class. It introduces the requirement that all
|
7
13
|
views return an instance of themselves when rendered (a fairly standard
|
8
14
|
backbone convention).
|
data/README.md
CHANGED
@@ -19,8 +19,8 @@ A Router subclass the provides a standard way to swap one view for another.
|
|
19
19
|
This introduces a convention that all views have a `leave()` function,
|
20
20
|
responsible for unbinding and cleaning up the view. And the convention that
|
21
21
|
all actions underneath the same `Router` share the same root element, and
|
22
|
-
define it as `el` on the router.
|
23
|
-
|
22
|
+
define it as `el` on the router. Additionally, the render method for every
|
23
|
+
view must return that view (a fairly standard backbone convention).
|
24
24
|
|
25
25
|
Now, a `SwappingRouter` can take advantage of the `leave()` function, and
|
26
26
|
clean up any existing views before swapping to a new one. It swaps into a new
|
@@ -45,7 +45,7 @@ An example SwappingRouter would look as follows:
|
|
45
45
|
"stories": "index",
|
46
46
|
"stories/new": "newStory"
|
47
47
|
}
|
48
|
-
index: function(
|
48
|
+
index: function() {
|
49
49
|
var view = new Trajectory.Views.StoriesIndex();
|
50
50
|
this.swap(view);
|
51
51
|
},
|
@@ -67,9 +67,9 @@ responsible for unbinding and cleaning up the view.
|
|
67
67
|
parent view.
|
68
68
|
|
69
69
|
`CompositeView` maintains an array of its immediate children as
|
70
|
-
`this.children`.
|
71
|
-
method
|
72
|
-
composed views is cleaned up properly.
|
70
|
+
`this.children`. Using this reference, a parent view's `leave()`
|
71
|
+
method will invoke `leave()` on all its children, ensuring that an entire
|
72
|
+
tree of composed views is cleaned up properly.
|
73
73
|
|
74
74
|
For child views that can dismiss themselves, such as dialog boxes, children
|
75
75
|
maintain a back-reference at `this.parent`. This is used to reach up and call
|
@@ -93,7 +93,7 @@ While TDD'ing:
|
|
93
93
|
|
94
94
|
bundle exec rake jasmine
|
95
95
|
|
96
|
-
To not open tests a browser window:
|
96
|
+
To not open tests in a browser window:
|
97
97
|
|
98
98
|
bundle exec rake jasmine:ci
|
99
99
|
|
@@ -177,4 +177,4 @@ require("/vendor/plugins/backbone-support/lib/assets/javascripts/backbone-suppor
|
|
177
177
|
|
178
178
|
## License
|
179
179
|
|
180
|
-
Copyright
|
180
|
+
Copyright 2012 thoughtbot. Please check LICENSE for more details.
|
@@ -1,30 +1,59 @@
|
|
1
1
|
Support.CompositeView = function(options) {
|
2
2
|
this.children = _([]);
|
3
|
+
this.bindings = _([]);
|
3
4
|
Backbone.View.apply(this, [options]);
|
4
5
|
};
|
5
6
|
|
6
7
|
_.extend(Support.CompositeView.prototype, Backbone.View.prototype, {
|
7
8
|
leave: function() {
|
8
9
|
this.unbind();
|
10
|
+
this.unbindFromAll();
|
9
11
|
this.remove();
|
10
12
|
this._leaveChildren();
|
11
13
|
this._removeFromParent();
|
12
14
|
},
|
13
15
|
|
16
|
+
bindTo: function(source, event, callback) {
|
17
|
+
source.bind(event, callback, this);
|
18
|
+
this.bindings.push({ source: source, event: event, callback: callback });
|
19
|
+
},
|
20
|
+
|
21
|
+
unbindFromAll: function() {
|
22
|
+
this.bindings.each(function(binding) {
|
23
|
+
binding.source.unbind(binding.event, binding.callback);
|
24
|
+
});
|
25
|
+
this.bindings = _([]);
|
26
|
+
},
|
27
|
+
|
14
28
|
renderChild: function(view) {
|
15
29
|
view.render();
|
16
30
|
this.children.push(view);
|
17
31
|
view.parent = this;
|
18
32
|
},
|
33
|
+
|
34
|
+
renderChildInto: function(view, container) {
|
35
|
+
this.renderChild(view);
|
36
|
+
$(container).empty().append(view.el);
|
37
|
+
},
|
19
38
|
|
20
39
|
appendChild: function(view) {
|
21
40
|
this.renderChild(view);
|
22
41
|
$(this.el).append(view.el);
|
23
42
|
},
|
24
|
-
|
25
|
-
|
43
|
+
|
44
|
+
appendChildTo: function (view, container) {
|
26
45
|
this.renderChild(view);
|
27
|
-
$(container).
|
46
|
+
$(container).append(view.el);
|
47
|
+
},
|
48
|
+
|
49
|
+
prependChild: function(view) {
|
50
|
+
this.renderChild(view);
|
51
|
+
$(this.el).prepend(view.el);
|
52
|
+
},
|
53
|
+
|
54
|
+
prependChildTo: function (view, container) {
|
55
|
+
this.renderChild(view);
|
56
|
+
$(container).prepend(view.el);
|
28
57
|
},
|
29
58
|
|
30
59
|
_leaveChildren: function() {
|
@@ -38,6 +38,18 @@ describe("Support.CompositeView", function() {
|
|
38
38
|
expect($("#test2").text()).toEqual("Orange!");
|
39
39
|
});
|
40
40
|
});
|
41
|
+
|
42
|
+
describe("#renderChildInto", function() {
|
43
|
+
it("renders child into the given element and replaces content there", function() {
|
44
|
+
$("#test1").text("Replace this!");
|
45
|
+
|
46
|
+
var view = new blankView({el: "#test"});
|
47
|
+
view.renderChildInto(new orangeView(), "#test1");
|
48
|
+
|
49
|
+
expect($("#test").text()).toEqual("");
|
50
|
+
expect($("#test1").text()).toEqual("Orange!");
|
51
|
+
});
|
52
|
+
});
|
41
53
|
|
42
54
|
describe("#appendChild", function() {
|
43
55
|
it("renders and appends children views", function() {
|
@@ -49,15 +61,37 @@ describe("Support.CompositeView", function() {
|
|
49
61
|
});
|
50
62
|
});
|
51
63
|
|
52
|
-
describe("#
|
53
|
-
it("
|
54
|
-
$("#test1").text("
|
55
|
-
|
64
|
+
describe("#appendChildTo", function() {
|
65
|
+
it("appends child into the given element", function() {
|
66
|
+
$("#test1").text("Append to this!");
|
67
|
+
|
56
68
|
var view = new blankView({el: "#test"});
|
57
|
-
view.
|
58
|
-
|
69
|
+
view.appendChildTo(new orangeView(), "#test1");
|
70
|
+
|
59
71
|
expect($("#test").text()).toEqual("");
|
60
|
-
expect($("#test1").text()).toEqual("Orange!");
|
72
|
+
expect($("#test1").text()).toEqual("Append to this!Orange!");
|
73
|
+
});
|
74
|
+
});
|
75
|
+
|
76
|
+
describe("#prependChild", function() {
|
77
|
+
it("renders and prepends children views", function() {
|
78
|
+
var view = new blankView({el: "#test"});
|
79
|
+
view.prependChild(new orangeView());
|
80
|
+
view.prependChild(new normalView());
|
81
|
+
|
82
|
+
expect($("#test").text()).toEqual("Normal!Orange!");
|
83
|
+
});
|
84
|
+
});
|
85
|
+
|
86
|
+
describe("#prependChildTo", function() {
|
87
|
+
it("prepends child into the given element", function() {
|
88
|
+
$("#test1").text("Prepend to this!");
|
89
|
+
|
90
|
+
var view = new blankView({el: "#test"});
|
91
|
+
view.prependChildTo(new orangeView(), "#test1");
|
92
|
+
|
93
|
+
expect($("#test").text()).toEqual("");
|
94
|
+
expect($("#test1").text()).toEqual("Orange!Prepend to this!");
|
61
95
|
});
|
62
96
|
});
|
63
97
|
|
@@ -129,5 +163,26 @@ describe("Support.CompositeView", function() {
|
|
129
163
|
expect($("#test2").size()).toEqual(1);
|
130
164
|
expect(view.children.size()).toEqual(1);
|
131
165
|
});
|
166
|
+
|
167
|
+
it("removes any bindings that were bound via bindTo", function() {
|
168
|
+
var model1 = new Backbone.Model({}),
|
169
|
+
model2 = new Backbone.Model({}),
|
170
|
+
eventListener = sinon.spy(),
|
171
|
+
bindToView = new (Support.CompositeView.extend({
|
172
|
+
initialize: function(options) {
|
173
|
+
this.bindTo(options.model1, 'change', eventListener);
|
174
|
+
this.bindTo(options.model2, 'change', eventListener);
|
175
|
+
}
|
176
|
+
}))({
|
177
|
+
model1: model1,
|
178
|
+
model2: model2
|
179
|
+
});
|
180
|
+
|
181
|
+
bindToView.leave();
|
182
|
+
model1.trigger('change');
|
183
|
+
model2.trigger('change');
|
184
|
+
|
185
|
+
expect(eventListener.called).toBeFalsy();
|
186
|
+
});
|
132
187
|
});
|
133
188
|
});
|
@@ -4,12 +4,14 @@ describe("Support.SwappingRouter", function() {
|
|
4
4
|
var redView = Backbone.View.extend({
|
5
5
|
render: function() {
|
6
6
|
$(this.el).text("Red!");
|
7
|
+
return this;
|
7
8
|
}
|
8
9
|
});
|
9
10
|
|
10
11
|
var blueView = Backbone.View.extend({
|
11
12
|
render: function() {
|
12
13
|
$(this.el).text("Blue!");
|
14
|
+
return this;
|
13
15
|
}
|
14
16
|
});
|
15
17
|
|
metadata
CHANGED
@@ -1,15 +1,10 @@
|
|
1
|
-
--- !ruby/object:Gem::Specification
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
2
|
name: backbone-support
|
3
|
-
version: !ruby/object:Gem::Version
|
4
|
-
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.3.0
|
5
5
|
prerelease:
|
6
|
-
segments:
|
7
|
-
- 0
|
8
|
-
- 2
|
9
|
-
- 0
|
10
|
-
version: 0.2.0
|
11
6
|
platform: ruby
|
12
|
-
authors:
|
7
|
+
authors:
|
13
8
|
- Chad Pytel
|
14
9
|
- Joe Ferris
|
15
10
|
- Jason Morrison
|
@@ -17,33 +12,31 @@ authors:
|
|
17
12
|
autorequire:
|
18
13
|
bindir: bin
|
19
14
|
cert_chain: []
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
- !ruby/object:Gem::Dependency
|
15
|
+
date: 2012-09-28 00:00:00.000000000 Z
|
16
|
+
dependencies:
|
17
|
+
- !ruby/object:Gem::Dependency
|
24
18
|
name: jasmine
|
25
|
-
|
26
|
-
requirement: &id001 !ruby/object:Gem::Requirement
|
19
|
+
requirement: !ruby/object:Gem::Requirement
|
27
20
|
none: false
|
28
|
-
requirements:
|
29
|
-
- -
|
30
|
-
- !ruby/object:Gem::Version
|
31
|
-
|
32
|
-
segments:
|
33
|
-
- 0
|
34
|
-
version: "0"
|
21
|
+
requirements:
|
22
|
+
- - ! '>='
|
23
|
+
- !ruby/object:Gem::Version
|
24
|
+
version: '0'
|
35
25
|
type: :development
|
36
|
-
|
26
|
+
prerelease: false
|
27
|
+
version_requirements: !ruby/object:Gem::Requirement
|
28
|
+
none: false
|
29
|
+
requirements:
|
30
|
+
- - ! '>='
|
31
|
+
- !ruby/object:Gem::Version
|
32
|
+
version: '0'
|
37
33
|
description: SwappingController and CompositeView for Backbone.js
|
38
|
-
email:
|
34
|
+
email:
|
39
35
|
- support@thoughtbot.com
|
40
36
|
executables: []
|
41
|
-
|
42
37
|
extensions: []
|
43
|
-
|
44
38
|
extra_rdoc_files: []
|
45
|
-
|
46
|
-
files:
|
39
|
+
files:
|
47
40
|
- .gitignore
|
48
41
|
- CHANGELOG
|
49
42
|
- Gemfile
|
@@ -71,38 +64,29 @@ files:
|
|
71
64
|
- vendor/underscore.js
|
72
65
|
homepage: http://github.com/thoughtbot/backbone-support
|
73
66
|
licenses: []
|
74
|
-
|
75
67
|
post_install_message:
|
76
68
|
rdoc_options: []
|
77
|
-
|
78
|
-
require_paths:
|
69
|
+
require_paths:
|
79
70
|
- lib
|
80
|
-
required_ruby_version: !ruby/object:Gem::Requirement
|
71
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
81
72
|
none: false
|
82
|
-
requirements:
|
83
|
-
- -
|
84
|
-
- !ruby/object:Gem::Version
|
85
|
-
|
86
|
-
|
87
|
-
- 0
|
88
|
-
version: "0"
|
89
|
-
required_rubygems_version: !ruby/object:Gem::Requirement
|
73
|
+
requirements:
|
74
|
+
- - ! '>='
|
75
|
+
- !ruby/object:Gem::Version
|
76
|
+
version: '0'
|
77
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
90
78
|
none: false
|
91
|
-
requirements:
|
92
|
-
- -
|
93
|
-
- !ruby/object:Gem::Version
|
94
|
-
|
95
|
-
segments:
|
96
|
-
- 0
|
97
|
-
version: "0"
|
79
|
+
requirements:
|
80
|
+
- - ! '>='
|
81
|
+
- !ruby/object:Gem::Version
|
82
|
+
version: '0'
|
98
83
|
requirements: []
|
99
|
-
|
100
84
|
rubyforge_project:
|
101
|
-
rubygems_version: 1.8.
|
85
|
+
rubygems_version: 1.8.24
|
102
86
|
signing_key:
|
103
87
|
specification_version: 3
|
104
88
|
summary: SwappingController and CompositeView for Backbone.js
|
105
|
-
test_files:
|
89
|
+
test_files:
|
106
90
|
- spec/javascripts/composite_view_spec.js
|
107
91
|
- spec/javascripts/helpers/helpers.js
|
108
92
|
- spec/javascripts/helpers/sinon-1.1.1.js
|
@@ -110,3 +94,4 @@ test_files:
|
|
110
94
|
- spec/javascripts/support/jasmine_config.rb
|
111
95
|
- spec/javascripts/support/jasmine_runner.rb
|
112
96
|
- spec/javascripts/swapping_router_spec.js
|
97
|
+
has_rdoc:
|