page_specific_js 0.0.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (18) hide show
  1. data/.gitignore +4 -0
  2. data/.rvmrc +1 -0
  3. data/Gemfile +4 -0
  4. data/README.md +85 -0
  5. data/Rakefile +10 -0
  6. data/lib/page_specific_js.rb +8 -0
  7. data/lib/page_specific_js/helper.rb +5 -0
  8. data/lib/page_specific_js/version.rb +3 -0
  9. data/page_specific_js.gemspec +31 -0
  10. data/spec/javascripts/fixtures/.gitkeep +0 -0
  11. data/spec/javascripts/helpers/jasmine-jquery-1.3.1.js +288 -0
  12. data/spec/javascripts/helpers/jquery.js +9266 -0
  13. data/spec/javascripts/page_specific_spec.js +160 -0
  14. data/spec/javascripts/support/jasmine.yml +76 -0
  15. data/spec/javascripts/support/jasmine_config.rb +23 -0
  16. data/spec/javascripts/support/jasmine_runner.rb +32 -0
  17. data/vendor/assets/javascripts/page_specific.js +72 -0
  18. metadata +94 -0
data/.gitignore ADDED
@@ -0,0 +1,4 @@
1
+ .bundle
2
+ Gemfile.lock
3
+ /pkg/*
4
+ /.idea
data/.rvmrc ADDED
@@ -0,0 +1 @@
1
+ rvm use --create 1.9.2@page_specific_js
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source "http://rubygems.org"
2
+
3
+ # Specify your gem's dependencies in page_specific_js.gemspec
4
+ gemspec
data/README.md ADDED
@@ -0,0 +1,85 @@
1
+ Page Specific JavaScript Framework
2
+ ==================================
3
+
4
+ This is a page-specific JavaScript framework (primarily for Rails).
5
+
6
+ It allows you to target JS to run on all pages, for a specific action on all pages (e.g. index),
7
+ for all actions for a specific controller, or for one page (specific controller/action).
8
+
9
+ Dependencies
10
+ ------------
11
+ * Rails 3.1+
12
+ * JQuery
13
+
14
+ Installation
15
+ ------------
16
+
17
+ 1. Require the gem. Add the following to your Gemfile, then run 'bundle install':
18
+
19
+ gem 'page_specific_js'
20
+
21
+ 2. Cause the page-specific JS framework to be loaded. For Rails 3.1: in your
22
+ app/assets/javascripts/application.css.scss:
23
+
24
+ //= require page_specific
25
+
26
+ 3. Create a JS namespace for your page-specific code, and call PageSpecific.init() on page load.
27
+ This system assumes you follow the best-practise of namespacing all of your application JavaScript.
28
+ For example let's assume you are namespacing all your JS under class "MyApplication".
29
+ Put this in an appropriate spot in your JavaScript:
30
+
31
+ MyApplication.PageSpecific = {};
32
+
33
+ $(document).ready(function() {
34
+ PageSpecific.init(MyApplication);
35
+ });
36
+
37
+ 4. Set data-controller_name and data-action_name attributes on your document body, e.g. if you are using ERB,
38
+ in application.html.erb:
39
+
40
+ <body data-controller_name="<%= underscored_controller_name %>",
41
+ data-action_name="<%= action_name %>">
42
+
43
+ or if you are using HAML, in application.html.haml:
44
+
45
+ %body{ :'data-controller_name' => underscored_controller_name, :'data-action_name' => action_name }
46
+
47
+ Usage
48
+ -----
49
+
50
+ Write controller or page specific JavaScript as follows:
51
+
52
+ MyApplication.PageSpecific['AllControllers'] = {
53
+
54
+ allActions: function() {
55
+ // JS to be executed on every page
56
+ },
57
+
58
+ indexAction: function() {
59
+ // code to be executed on all index pages
60
+ }
61
+ };
62
+
63
+ MyApplication.PageSpecific['FooController'] = {
64
+
65
+ allActions: function() {
66
+ // code to be executed on all pages of FooController
67
+ },
68
+
69
+ barAction: function() {
70
+ // code to be executed on FooController#bar page
71
+ }
72
+ }
73
+
74
+ Notes
75
+ -----
76
+
77
+ * This is not an original teqhnique. I learned it from others while developing at Pivotal Labs and have
78
+ implemented it several times over the years. This just my cleaned up and organized version.
79
+
80
+ * All you JavaScript is still going to get loaded on every page; this only impacts what is executed.
81
+ In practice this is not an issue as your javascript should be aggregated, minified, compressed and cached.
82
+
83
+ License
84
+ -------
85
+ MIT. See LICENSE.txt
data/Rakefile ADDED
@@ -0,0 +1,10 @@
1
+ require "bundler/gem_tasks"
2
+
3
+ begin
4
+ require 'jasmine'
5
+ load 'jasmine/tasks/jasmine.rake'
6
+ rescue LoadError
7
+ task :jasmine do
8
+ abort "Jasmine is not available. In order to run jasmine, you must: (sudo) gem install jasmine"
9
+ end
10
+ end
data/lib/page_specific_js.rb ADDED
@@ -0,0 +1,8 @@
1
+ require "page_specific_js/version"
2
+ require "page_specific_js/helper"
3
+
4
+ module PageSpecificJs
5
+ class Engine < ::Rails::Engine
6
+ # This causes Rails to search for assets in our vendor/assets folder
7
+ end
8
+ end
data/lib/page_specific_js/helper.rb ADDED
@@ -0,0 +1,5 @@
1
+ module ::ApplicationHelper
2
+ def underscored_controller_name
3
+ controller.class.name.underscore.gsub('/', '_')
4
+ end
5
+ end
data/lib/page_specific_js/version.rb ADDED
@@ -0,0 +1,3 @@
1
+ module PageSpecificJs
2
+ VERSION = "0.0.2"
3
+ end
data/page_specific_js.gemspec ADDED
@@ -0,0 +1,31 @@
1
+ # -*- encoding: utf-8 -*-
2
+ $:.push File.expand_path("../lib", __FILE__)
3
+ require "page_specific_js/version"
4
+
5
+ Gem::Specification.new do |s|
6
+ s.name = "page_specific_js"
7
+ s.version = PageSpecificJs::VERSION
8
+ s.authors = ["Sam Pierson"]
9
+ s.email = ["sam@sampierson.com"]
10
+ s.homepage = ""
11
+ s.summary = %q{ Page-specific JavaScript framework for Rails }
12
+ s.description = %q{ It allows you to target JS to run on all pages,
13
+ for a particular action on all pages (e.g. index),
14
+ for all actions for a specific controller,
15
+ or for one specific controller/action (i.e. a single page).
16
+ }
17
+
18
+ s.rubyforge_project = "page_specific_js"
19
+
20
+ s.files = `git ls-files`.split("\n")
21
+ s.test_files = `git ls-files -- {test,spec,features}/*`.split("\n")
22
+ s.executables = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
23
+ s.require_paths = ["lib"]
24
+
25
+ # specify any dependencies here; for example:
26
+ s.add_development_dependency "rake"
27
+ s.add_development_dependency "jasmine"
28
+
29
+ # jQuery is a dependency, but I'm leaving this commented for those folks not using jquery-rails.
30
+ # s.add_runtime_dependency "jquery-rails"
31
+ end
data/spec/javascripts/fixtures/.gitkeep ADDED
File without changes
data/spec/javascripts/helpers/jasmine-jquery-1.3.1.js ADDED
@@ -0,0 +1,288 @@
1
+ var readFixtures = function() {
2
+ return jasmine.getFixtures().proxyCallTo_('read', arguments);
3
+ };
4
+
5
+ var preloadFixtures = function() {
6
+ jasmine.getFixtures().proxyCallTo_('preload', arguments);
7
+ };
8
+
9
+ var loadFixtures = function() {
10
+ jasmine.getFixtures().proxyCallTo_('load', arguments);
11
+ };
12
+
13
+ var setFixtures = function(html) {
14
+ jasmine.getFixtures().set(html);
15
+ };
16
+
17
+ var sandbox = function(attributes) {
18
+ return jasmine.getFixtures().sandbox(attributes);
19
+ };
20
+
21
+ var spyOnEvent = function(selector, eventName) {
22
+ jasmine.JQuery.events.spyOn(selector, eventName);
23
+ }
24
+
25
+ jasmine.getFixtures = function() {
26
+ return jasmine.currentFixtures_ = jasmine.currentFixtures_ || new jasmine.Fixtures();
27
+ };
28
+
29
+ jasmine.Fixtures = function() {
30
+ this.containerId = 'jasmine-fixtures';
31
+ this.fixturesCache_ = {};
32
+ this.fixturesPath = 'spec/javascripts/fixtures';
33
+ };
34
+
35
+ jasmine.Fixtures.prototype.set = function(html) {
36
+ this.cleanUp();
37
+ this.createContainer_(html);
38
+ };
39
+
40
+ jasmine.Fixtures.prototype.preload = function() {
41
+ this.read.apply(this, arguments);
42
+ };
43
+
44
+ jasmine.Fixtures.prototype.load = function() {
45
+ this.cleanUp();
46
+ this.createContainer_(this.read.apply(this, arguments));
47
+ };
48
+
49
+ jasmine.Fixtures.prototype.read = function() {
50
+ var htmlChunks = [];
51
+
52
+ var fixtureUrls = arguments;
53
+ for(var urlCount = fixtureUrls.length, urlIndex = 0; urlIndex < urlCount; urlIndex++) {
54
+ htmlChunks.push(this.getFixtureHtml_(fixtureUrls[urlIndex]));
55
+ }
56
+
57
+ return htmlChunks.join('');
58
+ };
59
+
60
+ jasmine.Fixtures.prototype.clearCache = function() {
61
+ this.fixturesCache_ = {};
62
+ };
63
+
64
+ jasmine.Fixtures.prototype.cleanUp = function() {
65
+ jQuery('#' + this.containerId).remove();
66
+ };
67
+
68
+ jasmine.Fixtures.prototype.sandbox = function(attributes) {
69
+ var attributesToSet = attributes || {};
70
+ return jQuery('<div id="sandbox" />').attr(attributesToSet);
71
+ };
72
+
73
+ jasmine.Fixtures.prototype.createContainer_ = function(html) {
74
+ var container;
75
+ if(html instanceof jQuery) {
76
+ container = jQuery('<div id="' + this.containerId + '" />');
77
+ container.html(html);
78
+ } else {
79
+ container = '<div id="' + this.containerId + '">' + html + '</div>'
80
+ }
81
+ jQuery('body').append(container);
82
+ };
83
+
84
+ jasmine.Fixtures.prototype.getFixtureHtml_ = function(url) {
85
+ if (typeof this.fixturesCache_[url] == 'undefined') {
86
+ this.loadFixtureIntoCache_(url);
87
+ }
88
+ return this.fixturesCache_[url];
89
+ };
90
+
91
+ jasmine.Fixtures.prototype.loadFixtureIntoCache_ = function(relativeUrl) {
92
+ var self = this;
93
+ var url = this.fixturesPath.match('/$') ? this.fixturesPath + relativeUrl : this.fixturesPath + '/' + relativeUrl;
94
+ jQuery.ajax({
95
+ async: false, // must be synchronous to guarantee that no tests are run before fixture is loaded
96
+ cache: false,
97
+ dataType: 'html',
98
+ url: url,
99
+ success: function(data) {
100
+ self.fixturesCache_[relativeUrl] = data;
101
+ },
102
+ error: function(jqXHR, status, errorThrown) {
103
+ throw Error('Fixture could not be loaded: ' + url + ' (status: ' + status + ', message: ' + errorThrown.message + ')');
104
+ }
105
+ });
106
+ };
107
+
108
+ jasmine.Fixtures.prototype.proxyCallTo_ = function(methodName, passedArguments) {
109
+ return this[methodName].apply(this, passedArguments);
110
+ };
111
+
112
+
113
+ jasmine.JQuery = function() {};
114
+
115
+ jasmine.JQuery.browserTagCaseIndependentHtml = function(html) {
116
+ return jQuery('<div/>').append(html).html();
117
+ };
118
+
119
+ jasmine.JQuery.elementToString = function(element) {
120
+ return jQuery('<div />').append(element.clone()).html();
121
+ };
122
+
123
+ jasmine.JQuery.matchersClass = {};
124
+
125
+ (function(namespace) {
126
+ var data = {
127
+ spiedEvents: {},
128
+ handlers: []
129
+ };
130
+
131
+ namespace.events = {
132
+ spyOn: function(selector, eventName) {
133
+ var handler = function(e) {
134
+ data.spiedEvents[[selector, eventName]] = e;
135
+ };
136
+ jQuery(selector).bind(eventName, handler);
137
+ data.handlers.push(handler);
138
+ },
139
+
140
+ wasTriggered: function(selector, eventName) {
141
+ return !!(data.spiedEvents[[selector, eventName]]);
142
+ },
143
+
144
+ cleanUp: function() {
145
+ data.spiedEvents = {};
146
+ data.handlers = [];
147
+ }
148
+ }
149
+ })(jasmine.JQuery);
150
+
151
+ (function(){
152
+ var jQueryMatchers = {
153
+ toHaveClass: function(className) {
154
+ return this.actual.hasClass(className);
155
+ },
156
+
157
+ toBeVisible: function() {
158
+ return this.actual.is(':visible');
159
+ },
160
+
161
+ toBeHidden: function() {
162
+ return this.actual.is(':hidden');
163
+ },
164
+
165
+ toBeSelected: function() {
166
+ return this.actual.is(':selected');
167
+ },
168
+
169
+ toBeChecked: function() {
170
+ return this.actual.is(':checked');
171
+ },
172
+
173
+ toBeEmpty: function() {
174
+ return this.actual.is(':empty');
175
+ },
176
+
177
+ toExist: function() {
178
+ return this.actual.size() > 0;
179
+ },
180
+
181
+ toHaveAttr: function(attributeName, expectedAttributeValue) {
182
+ return hasProperty(this.actual.attr(attributeName), expectedAttributeValue);
183
+ },
184
+
185
+ toHaveId: function(id) {
186
+ return this.actual.attr('id') == id;
187
+ },
188
+
189
+ toHaveHtml: function(html) {
190
+ return this.actual.html() == jasmine.JQuery.browserTagCaseIndependentHtml(html);
191
+ },
192
+
193
+ toHaveText: function(text) {
194
+ if (text && jQuery.isFunction(text.test)) {
195
+ return text.test(this.actual.text());
196
+ } else {
197
+ return this.actual.text() == text;
198
+ }
199
+ },
200
+
201
+ toHaveValue: function(value) {
202
+ return this.actual.val() == value;
203
+ },
204
+
205
+ toHaveData: function(key, expectedValue) {
206
+ return hasProperty(this.actual.data(key), expectedValue);
207
+ },
208
+
209
+ toBe: function(selector) {
210
+ return this.actual.is(selector);
211
+ },
212
+
213
+ toContain: function(selector) {
214
+ return this.actual.find(selector).size() > 0;
215
+ },
216
+
217
+ toBeDisabled: function(selector){
218
+ return this.actual.is(':disabled');
219
+ },
220
+
221
+ // tests the existence of a specific event binding
222
+ toHandle: function(eventName) {
223
+ var events = this.actual.data("events");
224
+ return events && events[eventName].length > 0;
225
+ },
226
+
227
+ // tests the existence of a specific event binding + handler
228
+ toHandleWith: function(eventName, eventHandler) {
229
+ var stack = this.actual.data("events")[eventName];
230
+ var i;
231
+ for (i = 0; i < stack.length; i++) {
232
+ if (stack[i].handler == eventHandler) {
233
+ return true;
234
+ }
235
+ }
236
+ return false;
237
+ }
238
+ };
239
+
240
+ var hasProperty = function(actualValue, expectedValue) {
241
+ if (expectedValue === undefined) {
242
+ return actualValue !== undefined;
243
+ }
244
+ return actualValue == expectedValue;
245
+ };
246
+
247
+ var bindMatcher = function(methodName) {
248
+ var builtInMatcher = jasmine.Matchers.prototype[methodName];
249
+
250
+ jasmine.JQuery.matchersClass[methodName] = function() {
251
+ if (this.actual instanceof jQuery) {
252
+ var result = jQueryMatchers[methodName].apply(this, arguments);
253
+ this.actual = jasmine.JQuery.elementToString(this.actual);
254
+ return result;
255
+ }
256
+
257
+ if (builtInMatcher) {
258
+ return builtInMatcher.apply(this, arguments);
259
+ }
260
+
261
+ return false;
262
+ };
263
+ };
264
+
265
+ for(var methodName in jQueryMatchers) {
266
+ bindMatcher(methodName);
267
+ }
268
+ })();
269
+
270
+ beforeEach(function() {
271
+ this.addMatchers(jasmine.JQuery.matchersClass);
272
+ this.addMatchers({
273
+ toHaveBeenTriggeredOn: function(selector) {
274
+ this.message = function() {
275
+ return [
276
+ "Expected event " + this.actual + " to have been triggered on" + selector,
277
+ "Expected event " + this.actual + " not to have been triggered on" + selector
278
+ ];
279
+ };
280
+ return jasmine.JQuery.events.wasTriggered(selector, this.actual);
281
+ }
282
+ })
283
+ });
284
+
285
+ afterEach(function() {
286
+ jasmine.getFixtures().cleanUp();
287
+ jasmine.JQuery.events.cleanUp();
288
+ });