upjs-rails 0.9.1 → 0.10.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (42) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +142 -0
  3. data/README.md +4 -1
  4. data/design/ghost-debugging.txt +118 -0
  5. data/design/homepage.txt +236 -0
  6. data/dist/up-bootstrap.js +7 -3
  7. data/dist/up-bootstrap.min.js +1 -1
  8. data/dist/up.js +1611 -1222
  9. data/dist/up.min.js +2 -2
  10. data/lib/assets/javascripts/up/bus.js.coffee +1 -1
  11. data/lib/assets/javascripts/up/flow.js.coffee +21 -20
  12. data/lib/assets/javascripts/up/form.js.coffee +11 -12
  13. data/lib/assets/javascripts/up/history.js.coffee +137 -20
  14. data/lib/assets/javascripts/up/layout.js.coffee +134 -21
  15. data/lib/assets/javascripts/up/link.js.coffee +40 -17
  16. data/lib/assets/javascripts/up/modal.js.coffee +2 -2
  17. data/lib/assets/javascripts/up/motion.js.coffee +3 -1
  18. data/lib/assets/javascripts/up/navigation.js.coffee +5 -5
  19. data/lib/assets/javascripts/up/popup.js.coffee +2 -2
  20. data/lib/assets/javascripts/up/proxy.js.coffee +43 -82
  21. data/lib/assets/javascripts/up/tooltip.js.coffee +1 -1
  22. data/lib/assets/javascripts/up/util.js.coffee +145 -14
  23. data/lib/assets/javascripts/up-bootstrap/layout-ext.js.coffee +2 -2
  24. data/lib/assets/javascripts/up-bootstrap/navigation-ext.js.coffee +3 -1
  25. data/lib/assets/javascripts/up.js.coffee +2 -2
  26. data/lib/upjs/rails/version.rb +1 -1
  27. data/spec_app/Gemfile.lock +1 -1
  28. data/spec_app/config/routes.rb +1 -2
  29. data/spec_app/spec/javascripts/helpers/knife.js.coffee +1 -1
  30. data/spec_app/spec/javascripts/helpers/last_request.js.coffee +4 -0
  31. data/spec_app/spec/javascripts/helpers/set_timer.js.coffee +3 -3
  32. data/spec_app/spec/javascripts/helpers/to_end_with.js.coffee +5 -0
  33. data/spec_app/spec/javascripts/up/flow_spec.js.coffee +8 -6
  34. data/spec_app/spec/javascripts/up/form_spec.js.coffee +1 -1
  35. data/spec_app/spec/javascripts/up/history_spec.js.coffee +80 -1
  36. data/spec_app/spec/javascripts/up/link_spec.js.coffee +64 -4
  37. data/spec_app/spec/javascripts/up/modal_spec.js.coffee +2 -2
  38. data/spec_app/spec/javascripts/up/motion_spec.js.coffee +7 -7
  39. data/spec_app/spec/javascripts/up/navigation_spec.js.coffee +6 -6
  40. data/spec_app/spec/javascripts/up/proxy_spec.js.coffee +2 -2
  41. data/spec_app/spec/javascripts/up/util_spec.js.coffee +22 -4
  42. metadata +7 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: daa8399fa2cc832ee5539baa91ca77ffebf3d327
4
- data.tar.gz: 82206c9b5bf483b6bd9284cc6168ebd2a0f4fa6b
3
+ metadata.gz: b23765c17f70e68eb8a2d8be20055dc433205ee7
4
+ data.tar.gz: a7366a2ef69ecbb3f9a3284afb9b6ced51aeba5e
5
5
  SHA512:
6
- metadata.gz: aa9ad36a2f58172a7c4e9d10487c628e5a831935ec9465b5e3b0970c8b9827156e7d66ce0134e99e95940cdc8c679bf1fbf6d3ed6d53a2becba09bff2520f9d0
7
- data.tar.gz: 8f5eeba7bcd463dce586ac1a75d4140c214f21bc27f2a5709c0f196c476bf5c8ee0ad1a065343373e4c85de90eeda10d7acc0b08e4f8c42506ec13b7c8878eb2
6
+ metadata.gz: 37272df37fdc18afbfac2fb44aef31cf7f911ed366fa5863dba43134954620db233f721716cb86cf89f96b85e2725c4298e297ee4ee528491e49781b9e004a37
7
+ data.tar.gz: 0e0a659157585e436776a524ccedfae11d3b127d87c30ddb007849b194fd5683536bd51393aaf6c3737ddc240fb1be456149ce8dc2cc74f7d9f885232803d206
data/CHANGELOG.md ADDED
@@ -0,0 +1,142 @@
1
+ Changelog
2
+ =========
3
+
4
+ All notable changes to this project will be documented in this file.
5
+ This project adheres to [Semantic Versioning](http://semver.org/).
6
+
7
+
8
+ 0.10.0
9
+ -------
10
+
11
+ ### Compatible changes
12
+
13
+ - Viewport scroll positions are saved when the URL changes and restored when the user hits the back/forward button
14
+ - Allow to link to the previous page using [`[up-back]`](http://upjs.io/up.history#up-back)
15
+ - Allow to restore previous scroll state using [`[up-restore-scroll]`](http://upjs.io/up.link#a-up-target)
16
+ - Instead of saying `<tag up-something="true">` you can now simply say `<tag up-something>`.
17
+ - Create this Changelog.
18
+
19
+ ### Breaking changes
20
+
21
+ - The option `options.scroll` and attribute `up-scroll` have been removed. Instead you can use the
22
+ boolean option `options.reveal` or `up-reveal` to indicate whether an element should be revealed
23
+ within the viewport before replacement.
24
+ - The string `up.history.defaults('popTarget')` is now an array of selectors `up.history.defaults('popTargets')`
25
+
26
+
27
+ 0.9.1
28
+ -----
29
+
30
+ ### Compatible changes
31
+
32
+ - Change transition implementation so child elements with collapsing margins don't reposition within the animated element
33
+
34
+
35
+ 0.9.0
36
+ -----
37
+
38
+ ### Compatible changes
39
+
40
+ - Elements are now being [revealed](http://upjs.io/up.layout#up.reveal) within their viewport before they are updated
41
+ - Elements that are prepended or appended using `:before` or `:after` pseudo-selectors are now scrolled into view after insertion.
42
+ - New option `up.layout.defaults('snap')` lets you define a number of pixels under which Up.js will snap to the top edge of the viewport when revealing an element
43
+ - You can now make [`up.reveal`]((http://upjs.io/up.layout#up.reveal) aware of fixed navigation bars blocking the viewport by setting new options `up.layout.defaults('fixedTop')` and `up.layout.defaults('fixedBottom')`.
44
+
45
+
46
+ 0.8.2
47
+ -----
48
+
49
+ ### Compatible changes
50
+
51
+ - [`up.reveal`](http://upjs.io/up.layout#up.reveal) can now reveal content in modals and containers with `overflow-y: scroll`.
52
+ - Changing the default configuration of an Up.js module now raises an error if a config key is unknown.
53
+ - Links linking to `"#"` are now never marked as `.up-current`.
54
+
55
+
56
+ 0.8.1
57
+ -----
58
+
59
+ ### Compatible chanes
60
+
61
+ - You can now include `up-bootstrap.js` and `up-bootstrap.css` to configure Up.js to play nice with Bootstrap 3.
62
+
63
+
64
+ ### Breaking changes
65
+
66
+ - Like Bootstrap, the Up.js modal will now scroll the main document viewport instead of the modal dialog box.
67
+
68
+
69
+
70
+ 0.8.0
71
+ -----
72
+
73
+ ### Compatible changes
74
+
75
+ - Up.js will now emit [events](http://upjs.io/up.bus) `proxy:busy` and `proxy:idle` whenever it is loading or is done loading content over HTTP.
76
+ - Add an option `up.proxy.defaults('busyDelay')` to delay the `proxy:busy` event in order to prevent flickering of loading spinners.
77
+
78
+
79
+ 0.7.8
80
+ ------
81
+
82
+ ### Compatible changes
83
+
84
+ - Now longer throws an error if the current location does not match an `up-alias` wildcard (bugfix).
85
+
86
+
87
+ 0.7.7
88
+ -----
89
+
90
+ ### Compatible changes
91
+
92
+ - Allow `up-alias` to match URLs by prefix (`up-alias="prefix*"`).
93
+
94
+
95
+ 0.7.6
96
+ -----
97
+
98
+ ### Compatible changes
99
+
100
+ - Fix what Up.js considers the current URL of a modal or popup if multiple updates change different parts of the modal or popup.
101
+ - Don't replace elements within a container that matches `.up-destroying` or `.up-ghost` (which are cloned elements for animation purposes).
102
+
103
+
104
+ 0.7.5
105
+ -----
106
+
107
+ ### Compatible changes
108
+
109
+ - Make sure that an expanded link will be considered a link by adding an `up-follow` attribute if it doesn't already have an `up-target` attribute.
110
+
111
+
112
+ 0.7.4
113
+ -----
114
+
115
+ ### Compatible changes
116
+
117
+ - Correctly position tooltips when the user has scrolled the main document viewports.
118
+ - Allow popups within modal dialogs.
119
+
120
+
121
+ 0.7.3
122
+ -----
123
+
124
+ ### Compatible changes
125
+
126
+ - Use [up.proxy](http://upjs.io/up.proxy) when submitting a form.
127
+
128
+
129
+ 0.7.2
130
+ -----
131
+
132
+ ### Compatible changes
133
+
134
+ - When marking links as `.up-current`, allow to additionally match on a space-separated list of URLs in an `up-alias` attribute.
135
+
136
+
137
+ 0.7.1
138
+ -----
139
+
140
+ ### Compatible changes
141
+
142
+ - Bugfix: Don't consider forms with an `up-target` attribute to be a link.
data/README.md CHANGED
@@ -4,6 +4,8 @@ Up.js gives your traditional web application fast-responding views with minimal
4
4
 
5
5
  See [upjs.io](http://upjs.io) for more information and API documentation.
6
6
 
7
+ See [`CHANGELOG.md`](https://github.com/makandra/upjs/blob/master/CHANGELOG.md) for notable changes.
8
+
7
9
 
8
10
  ## Running tests
9
11
 
@@ -36,7 +38,8 @@ We are currently feeding three release channels:
36
38
  To make a new release:
37
39
 
38
40
  - Edit `lib/upjs/rails/version.rb` and bump the version number. Use [semantic versioning](http://semver.org/).
39
- - Commit and push the version bump
41
+ - Add an entry to `CHANGELOG.md`
42
+ - Commit and push the version bump and `CHANGELOG.md`
40
43
  - From the project root, type `rake assets:compile`. This will output minified JS and CSS files to the `dist` folder.
41
44
  - Commit and push the generated files
42
45
  - From the project root, type `rake release`. This will publish a new gem version to Rubygems.org.
@@ -0,0 +1,118 @@
1
+ https://jsbin.com/mehuyefuqi/6/edit?html,css,js,output
2
+
3
+
4
+ $(function() {
5
+ var $box = $('.box');
6
+
7
+ var $ghost = $box.clone();
8
+
9
+ var $wrapper = $('<div class="wrapper"></div>');
10
+
11
+ $ghost.appendTo($wrapper);
12
+
13
+ $wrapper.css({
14
+ backgroundColor: 'rgba(255,255,0,0.1)'
15
+ });
16
+
17
+ var offset = $box.position();
18
+ var height = $box.height();
19
+ var width = $box.width();
20
+
21
+
22
+ $wrapper.css({
23
+ position: 'absolute',
24
+ left: offset.left,
25
+ top: offset.top,
26
+ });
27
+
28
+ $ghost.css({
29
+ width: width,
30
+ height: height,
31
+ color: 'red',
32
+ backgroundColor: 'rgba(255,255,255,0.2)'
33
+ });
34
+
35
+ $wrapper.insertBefore($box);
36
+
37
+ var diff = $ghost.offset().top - $box.offset().top;
38
+
39
+ $('.output').text(
40
+ $wrapper.offset().top + " / " +
41
+ $ghost.offset().top + " / " +
42
+ $box.offset().top + " / " +
43
+ "D=" + diff
44
+ );
45
+
46
+ $wrapper.css({
47
+ top: parseInt($wrapper.css('top')) - diff
48
+ });
49
+
50
+ // alert($wrapper.css('top'));
51
+
52
+ });
53
+
54
+
55
+
56
+
57
+
58
+ Nochmal neu:
59
+ ------------
60
+
61
+
62
+ $(function() {
63
+
64
+ var $box = $('.box');
65
+
66
+ var $ghost = $box.clone();
67
+
68
+ var $wrapper = $('<div class="wrapper"></div>');
69
+
70
+ $ghost.appendTo($wrapper);
71
+
72
+ $wrapper.css({
73
+ backgroundColor: 'rgba(255,255,0,0.1)'
74
+ });
75
+
76
+ var offset = $box.position();
77
+ var height = $box.height();
78
+ var width = $box.width();
79
+
80
+ $wrapper.css({
81
+ position: 'absolute',
82
+ left: offset.left,
83
+ top: offset.top,
84
+ width: width,
85
+ height: height
86
+ });
87
+
88
+ $ghost.css({
89
+ position: 'static', // or relative if it was non-static before
90
+ width: '100%',
91
+ height: '100%',
92
+ left: '',
93
+ top: '',
94
+ right: '',
95
+ bottom: '',
96
+ color: 'red',
97
+ backgroundColor: 'rgba(255,255,255,0.4)'
98
+ });
99
+
100
+ $wrapper.insertBefore($box);
101
+
102
+ var diff = $ghost.offset().top - $box.offset().top;
103
+
104
+ $('.output').text(
105
+ $wrapper.offset().top + " / " +
106
+ $ghost.offset().top + " / " +
107
+ $box.offset().top + " / " +
108
+ "D=" + diff
109
+ );
110
+
111
+ $wrapper.css({
112
+ top: parseInt($wrapper.css('top')) - diff
113
+ });
114
+
115
+ // alert($wrapper.css('top'));
116
+
117
+ });
118
+
@@ -0,0 +1,236 @@
1
+
2
+
3
+
4
+ PROGRESSIVE ENHANCEMENT, RELOADED
5
+
6
+
7
+
8
+ Demo
9
+
10
+ Update a page fragment via AJAX
11
+
12
+
13
+
14
+ Animate a page transition
15
+
16
+
17
+
18
+ Open a link in a modal dialog
19
+
20
+
21
+
22
+ Custom HTML tags
23
+
24
+ Batteries included
25
+
26
+ We will ship a basic implementation for the most established
27
+ UI patterns like navigation bars, infinite scrolling,
28
+ drop-down menus, modals dialogs, etc.
29
+
30
+ Plays nice with existing Javascript
31
+
32
+ Convert to up.compiler directives.
33
+
34
+ Plays nice with existing styles
35
+
36
+ Unoppinionated about style
37
+ Bootstrap users can include `up-bootstrap`.
38
+
39
+ Plays nice with existing JS code
40
+
41
+ You can wire your existing JS code into the Up.js page flow.
42
+
43
+ URLs are important
44
+
45
+ In Up.js every page or screen state has a URL which you can
46
+ bookmark and share. This also means you get all the SEO love from Google.
47
+
48
+ Server-side code should stay the same
49
+
50
+ (Rewrite)
51
+
52
+ Lightweight
53
+
54
+ Up.js is 13 KB gzipped.
55
+ The only dependency is jQuery.
56
+
57
+ Both UJS and programmatic interfaces
58
+
59
+ All Up.js functionality is available as both unobtrusive behavior
60
+ (through HTML attributes like up-target) and Javascript functions
61
+ for programmatic access and integration with your code.
62
+
63
+
64
+
65
+
66
+
67
+
68
+
69
+
70
+
71
+
72
+
73
+ .example
74
+ .example__column
75
+ .example__title
76
+ page.html
77
+ .example__asset
78
+ <%= ... %>
79
+ .example__column
80
+ .example__title
81
+ Demo
82
+ iframe.example__demo
83
+
84
+
85
+
86
+
87
+
88
+
89
+ Update a page fragment via AJAX:
90
+
91
+ <div class="story">
92
+ Story summary.
93
+
94
+ <a href="full.html" up-target=".story">
95
+ Read full story
96
+ </a>
97
+ </div>
98
+
99
+ Animate a page transition:
100
+
101
+ <a href="/page/2" up-follow up-transition="move-right">Next page</a>
102
+
103
+ <div class="story">
104
+ Story summary.
105
+
106
+ <a href="/stories/443/full" up-target=".story" up-transition="cross-fade">
107
+ Read full story
108
+ </a>
109
+ </div>
110
+
111
+
112
+ Infinite pagination:
113
+
114
+ <div class="stories">
115
+ <a href="/stories/1">Foo</a>
116
+ <a href="/stories/2">Bar</a>
117
+ <a href="/stories/3">Baz</a>
118
+ </div>
119
+
120
+ <a href="/pages/2" class="load-more" up-target=".stories:after, .load-more">
121
+ Load more
122
+ </a>
123
+
124
+ Open a link in a modal dialog:
125
+
126
+ <a href="/login" up-modal=".content">
127
+ Log in to continue
128
+ </a>
129
+
130
+
131
+
132
+ Custom tag:
133
+
134
+
135
+
136
+ /examples/timestamp-tag/
137
+
138
+ page.html
139
+
140
+ <p>
141
+ The time is <timestamp />
142
+ </p>
143
+
144
+ scripts.js
145
+
146
+ up.compiler('timestamp', function($element) {
147
+ now = new Date();
148
+ $element.text(now);
149
+ });
150
+
151
+
152
+
153
+
154
+ /examples/clock-tag/
155
+
156
+ page.html
157
+
158
+ <clock />
159
+
160
+ scripts.js
161
+
162
+ up.compiler('clock', function($element) {
163
+
164
+ function update() {
165
+ var now = new Date();
166
+ $element.text(now);
167
+ }
168
+
169
+ setInterval(update, 1000);
170
+
171
+ return function() { clearInterval(update) };
172
+
173
+ });
174
+
175
+
176
+
177
+
178
+ /examples/transition
179
+
180
+ story1.html
181
+
182
+ <div class="story">
183
+
184
+ <h1>The first story</h1>
185
+
186
+ <a href="story2.html" up-transition="move-left">
187
+ Show next story
188
+ </a>
189
+ </div>
190
+
191
+ story2.html
192
+
193
+ <div class="story">
194
+
195
+ <h1>The second story</h1>
196
+
197
+ <a href="story1.html" up-transition="move-right">
198
+ Show previous story
199
+ </a>
200
+ </div>
201
+
202
+
203
+
204
+
205
+
206
+
207
+
208
+
209
+ /examples/transition
210
+
211
+ summary.html
212
+
213
+ <div class="story">
214
+ Story summary.
215
+
216
+ <a href="full" up-target=".story" up-transition="cross-fade">
217
+ Read full story
218
+ </a>
219
+ </div>
220
+
221
+ full.html
222
+
223
+ <div class="story">
224
+ Full story here
225
+
226
+ <a href="summary" up-target=".story" up-transition="cross-fade">
227
+ Show summary
228
+ </a>
229
+ </div>
230
+
231
+
232
+
233
+
234
+ Example:
235
+
236
+
data/dist/up-bootstrap.js CHANGED
@@ -4,8 +4,8 @@
4
4
  defaults = up.layout.defaults();
5
5
 
6
6
  up.layout.defaults({
7
- fixedTop: defaults.fixedTop + ", .navbar-fixed-top",
8
- fixedBottom: defaults.fixedBottom + ", .navbar-fixed-bottom"
7
+ fixedTop: defaults.fixedTop.concat(['.navbar-fixed-top']),
8
+ fixedBottom: defaults.fixedBottom.concat(['.navbar-fixed-bottom'])
9
9
  });
10
10
 
11
11
  }).call(this);
@@ -16,8 +16,12 @@
16
16
 
17
17
  }).call(this);
18
18
  (function() {
19
+ var defaults;
20
+
21
+ defaults = up.navigation.defaults();
22
+
19
23
  up.navigation.defaults({
20
- currentClass: 'active'
24
+ currentClasses: defaults.currentClasses.concat(['active'])
21
25
  });
22
26
 
23
27
  }).call(this);
@@ -1 +1 @@
1
- (function(){var a;a=up.layout.defaults(),up.layout.defaults({fixedTop:a.fixedTop+", .navbar-fixed-top",fixedBottom:a.fixedBottom+", .navbar-fixed-bottom"})}).call(this),function(){up.modal.defaults({template:'<div class="up-modal">\n <div class="up-modal-dialog modal-dialog">\n <div class="up-modal-content modal-content"></div>\n </div>\n</div>'})}.call(this),function(){up.navigation.defaults({currentClass:"active"})}.call(this),function(){}.call(this);
1
+ (function(){var a;a=up.layout.defaults(),up.layout.defaults({fixedTop:a.fixedTop.concat([".navbar-fixed-top"]),fixedBottom:a.fixedBottom.concat([".navbar-fixed-bottom"])})}).call(this),function(){up.modal.defaults({template:'<div class="up-modal">\n <div class="up-modal-dialog modal-dialog">\n <div class="up-modal-content modal-content"></div>\n </div>\n</div>'})}.call(this),function(){var a;a=up.navigation.defaults(),up.navigation.defaults({currentClasses:a.currentClasses.concat(["active"])})}.call(this),function(){}.call(this);