opal-jquery 0.0.13 → 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +7 -0
- data/Gemfile +0 -3
- data/README.md +227 -0
- data/Rakefile +47 -1
- data/config.ru +1 -0
- data/lib/opal/jquery.rb +1 -1
- data/lib/opal/jquery/version.rb +1 -1
- data/opal-jquery.gemspec +2 -2
- data/opal/opal-jquery.rb +1 -0
- data/opal/opal-jquery/element.rb +71 -119
- data/opal/opal-jquery/event.rb +47 -33
- data/opal/opal-jquery/kernel.rb +1 -0
- data/opal/opal-jquery/window.rb +4 -0
- data/spec/element/iterable_spec.rb +2 -2
- data/spec/{data → fixtures}/simple.txt +0 -0
- data/spec/{data → fixtures}/user.json +0 -0
- data/spec/http_spec.rb +7 -7
- data/spec/jquery/index.html +9 -0
- data/spec/{jquery.js → jquery/jquery.js} +0 -0
- data/spec/kernel_spec.rb +7 -0
- data/spec/spec_helper.rb +28 -27
- data/spec/zepto/index.html +9 -0
- data/spec/{zepto.js → zepto/zepto.js} +0 -0
- metadata +28 -27
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: 10a59c85f98bfc9492071646b6bfb475fa901bc9
|
4
|
+
data.tar.gz: 482d3c0bdc6c64a56e785909f111af4c2ff2abf9
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 4532a13456f025938b72ca671bd9bba3921f47fc78992e74172763f0559e254a418bbd5f261024b30fbf6222600ed54a724a34d5b114d8290350df4a47b71634
|
7
|
+
data.tar.gz: 8608e4673b228258dec7a972fc3257f9be3cb6dc5af1f190b76c7811eef3fbe200757b11b2dd38a9ca23e3012d4bdfdea4000fee8ddc9921cfcfb7b169c59da4
|
data/Gemfile
CHANGED
data/README.md
CHANGED
@@ -10,6 +10,227 @@ See the [website for documentation](http://opalrb.org/jquery).
|
|
10
10
|
|
11
11
|
## Documentation
|
12
12
|
|
13
|
+
```ruby
|
14
|
+
elements = Element.find('.foo')
|
15
|
+
# => [<div class="foo">, ...]
|
16
|
+
|
17
|
+
elements.class
|
18
|
+
# => JQuery
|
19
|
+
|
20
|
+
elements.on(:click) do
|
21
|
+
alert "element was clicked"
|
22
|
+
end
|
23
|
+
```
|
24
|
+
|
25
|
+
### Getting Started
|
26
|
+
|
27
|
+
#### Installation
|
28
|
+
|
29
|
+
Install opal-jquery from RubyGems:
|
30
|
+
|
31
|
+
```
|
32
|
+
$ gem install opal-jquery
|
33
|
+
```
|
34
|
+
|
35
|
+
Or include it in your Gemfile for Bundler:
|
36
|
+
|
37
|
+
```ruby
|
38
|
+
gem 'opal-jquery'
|
39
|
+
```
|
40
|
+
|
41
|
+
### Interacting with the DOM
|
42
|
+
|
43
|
+
#### Finding elements
|
44
|
+
|
45
|
+
opal-jquery provides the `Element` class, which can be used to find elements in
|
46
|
+
the current document:
|
47
|
+
|
48
|
+
```ruby
|
49
|
+
Element.find('#header')
|
50
|
+
```
|
51
|
+
|
52
|
+
`Element.find` is aliased to `Element[]`:
|
53
|
+
|
54
|
+
```ruby
|
55
|
+
Element['.my-class']
|
56
|
+
```
|
57
|
+
|
58
|
+
These methods acts just like `$('selector')`, and can use any jQuery
|
59
|
+
compatible selector:
|
60
|
+
|
61
|
+
```ruby
|
62
|
+
Element.find('#navigation li:last')
|
63
|
+
```
|
64
|
+
|
65
|
+
The result is just a jQuery instance, which is toll-free bridged to
|
66
|
+
instances of the `Element` class in ruby:
|
67
|
+
|
68
|
+
```ruby
|
69
|
+
Element.find('.foo').class
|
70
|
+
# => Element
|
71
|
+
```
|
72
|
+
|
73
|
+
Instances of `Element` also have the `#find` method available for
|
74
|
+
finding elements within the scope of each DOM node represented by
|
75
|
+
the instance:
|
76
|
+
|
77
|
+
```ruby
|
78
|
+
el = Element.find('#header')
|
79
|
+
el.find '.foo'
|
80
|
+
# => #<Element .... >
|
81
|
+
```
|
82
|
+
|
83
|
+
#### Running code on document ready
|
84
|
+
|
85
|
+
Just like jQuery, opal-jquery requires the document to be ready to
|
86
|
+
be able to fully interact with the page. Any top level access should
|
87
|
+
use the `ready?` method:
|
88
|
+
|
89
|
+
```ruby
|
90
|
+
Document.ready? do
|
91
|
+
alert "document is ready to go!"
|
92
|
+
end
|
93
|
+
```
|
94
|
+
|
95
|
+
The `Kernel#alert` method is shown above too.
|
96
|
+
|
97
|
+
#### Event handling
|
98
|
+
|
99
|
+
The `Element#on` method is used to attach event handlers to elements:
|
100
|
+
|
101
|
+
```ruby
|
102
|
+
Element.find('#header').on :click do
|
103
|
+
puts "The header was clicked!"
|
104
|
+
end
|
105
|
+
```
|
106
|
+
|
107
|
+
Selectors can also be passed as a second argument to handle events
|
108
|
+
on certain children:
|
109
|
+
|
110
|
+
```ruby
|
111
|
+
Element.find('#header').on(:click, '.foo') do
|
112
|
+
puts "An element with a 'foo' class was clicked"
|
113
|
+
end
|
114
|
+
```
|
115
|
+
|
116
|
+
An `Event` instance is optionally passed to block handlers as well,
|
117
|
+
which is toll-free bridged to jquery events:
|
118
|
+
|
119
|
+
```ruby
|
120
|
+
Element.find('#my_link').on(:click) do |evt|
|
121
|
+
evt.stop_propagation
|
122
|
+
puts "stopped the event!"
|
123
|
+
end
|
124
|
+
```
|
125
|
+
|
126
|
+
#### CSS styles and classnames
|
127
|
+
|
128
|
+
The various jQuery methods are available on `Element` instances:
|
129
|
+
|
130
|
+
```ruby
|
131
|
+
foo = Element.find('.foo')
|
132
|
+
|
133
|
+
foo.add_class 'blue'
|
134
|
+
foo.remove_class 'foo'
|
135
|
+
foo.toggle_class 'selected'
|
136
|
+
```
|
137
|
+
|
138
|
+
There are also added convenience methods for opal-jquery:
|
139
|
+
|
140
|
+
```ruby
|
141
|
+
foo = Element.find('#header')
|
142
|
+
|
143
|
+
foo.class_name
|
144
|
+
# => 'red lorry'
|
145
|
+
|
146
|
+
foo.class_name = 'yellow house'
|
147
|
+
|
148
|
+
foo.class_name
|
149
|
+
# => 'yellow house'
|
150
|
+
```
|
151
|
+
|
152
|
+
`Element#css` also exists for getting/setting css styles:
|
153
|
+
|
154
|
+
```ruby
|
155
|
+
el = Element.find('#container')
|
156
|
+
el.css 'color', 'blue'
|
157
|
+
el.css 'color'
|
158
|
+
# => 'blue'
|
159
|
+
```
|
160
|
+
|
161
|
+
### HTTP/AJAX requests
|
162
|
+
|
163
|
+
jQuery's Ajax implementation is also wrapped in the top level HTTP
|
164
|
+
class.
|
165
|
+
|
166
|
+
```ruby
|
167
|
+
HTTP.get("/users/1.json") do |response|
|
168
|
+
puts response.body
|
169
|
+
# => "{\"name\": \"Adam Beynon\"}"
|
170
|
+
end
|
171
|
+
```
|
172
|
+
|
173
|
+
The block passed to this method is used as the handler when the request
|
174
|
+
succeeds, as well as when it fails. To determine whether the request
|
175
|
+
was successful, use the `ok?` method:
|
176
|
+
|
177
|
+
```ruby
|
178
|
+
HTTP.get("/users/2.json") do |response|
|
179
|
+
if response.ok?
|
180
|
+
alert "successful!"
|
181
|
+
else
|
182
|
+
alert "request failed :("
|
183
|
+
end
|
184
|
+
end
|
185
|
+
```
|
186
|
+
|
187
|
+
It is also possible to use a different handler for each case:
|
188
|
+
|
189
|
+
```ruby
|
190
|
+
request = HTTP.get("/users/3.json")
|
191
|
+
|
192
|
+
request.callback {
|
193
|
+
puts "Request worked!"
|
194
|
+
}
|
195
|
+
|
196
|
+
request.errback {
|
197
|
+
puts "Request didn't work :("
|
198
|
+
}
|
199
|
+
```
|
200
|
+
|
201
|
+
The request is actually triggered inside the `HTTP.get` method, but due
|
202
|
+
to the async nature of the request, the callback and errback handlers can
|
203
|
+
be added anytime before the request returns.
|
204
|
+
|
205
|
+
#### Handling responses
|
206
|
+
|
207
|
+
Web apps deal with JSON responses quite frequently, so there is a useful
|
208
|
+
`#json` helper method to get the JSON content from a request:
|
209
|
+
|
210
|
+
```ruby
|
211
|
+
HTTP.get("/users.json") do |response|
|
212
|
+
puts response.body
|
213
|
+
puts response.json
|
214
|
+
end
|
215
|
+
|
216
|
+
# => "[{\"name\": \"Adam\"},{\"name\": \"Ben\"}]"
|
217
|
+
# => [{"name" => "Adam"}, {"name" => "Ben"}]
|
218
|
+
```
|
219
|
+
|
220
|
+
The `#body` method will always return the raw response string.
|
221
|
+
|
222
|
+
If an error is encountered, then the `#status_code` method will hold the
|
223
|
+
specific error code from the underlying request:
|
224
|
+
|
225
|
+
```ruby
|
226
|
+
request = HTTP.get("/users/3.json")
|
227
|
+
|
228
|
+
request.callback { puts "it worked!" }
|
229
|
+
|
230
|
+
request.errback { |response|
|
231
|
+
puts "failed with status #{response.status_code}"
|
232
|
+
}
|
233
|
+
```
|
13
234
|
### HTTP
|
14
235
|
|
15
236
|
The `HTTP` class wraps jQuery's ajax request into a ruby class.
|
@@ -47,6 +268,12 @@ Run the tests inside a phantom.js runner:
|
|
47
268
|
|
48
269
|
$ bundle exec rake
|
49
270
|
|
271
|
+
### Zepto
|
272
|
+
|
273
|
+
opal-jquery also supports zepto. To run specs for zepto use the rake task:
|
274
|
+
|
275
|
+
$ bundle exec rake zepto
|
276
|
+
|
50
277
|
## License
|
51
278
|
|
52
279
|
(The MIT License)
|
data/Rakefile
CHANGED
@@ -3,4 +3,50 @@ Bundler.require
|
|
3
3
|
Bundler::GemHelper.install_tasks
|
4
4
|
|
5
5
|
require 'opal/spec/rake_task'
|
6
|
-
Opal::Spec::RakeTask.new(:default)
|
6
|
+
Opal::Spec::RakeTask.new(:default) do |s|
|
7
|
+
s.index_path = 'spec/jquery/index.html'
|
8
|
+
end
|
9
|
+
|
10
|
+
Opal::Spec::RakeTask.new(:zepto) do |s|
|
11
|
+
s.index_path = 'spec/zepto/index.html'
|
12
|
+
end
|
13
|
+
|
14
|
+
desc "Build build/opal-jquery.js"
|
15
|
+
task :dist do
|
16
|
+
require 'fileutils'
|
17
|
+
FileUtils.mkdir_p 'build'
|
18
|
+
|
19
|
+
src = Opal::Builder.build('opal-jquery')
|
20
|
+
min = uglify src
|
21
|
+
gzp = gzip min
|
22
|
+
|
23
|
+
File.open('build/opal-jquery.js', 'w+') do |out|
|
24
|
+
out << src
|
25
|
+
end
|
26
|
+
|
27
|
+
puts "development: #{src.size}, minified: #{min.size}, gzipped: #{gzp.size}"
|
28
|
+
end
|
29
|
+
|
30
|
+
# Used for uglifying source to minify
|
31
|
+
def uglify(str)
|
32
|
+
IO.popen('uglifyjs', 'r+') do |i|
|
33
|
+
i.puts str
|
34
|
+
i.close_write
|
35
|
+
return i.read
|
36
|
+
end
|
37
|
+
rescue Errno::ENOENT
|
38
|
+
$stderr.puts '"uglifyjs" command not found (install with: "npm install -g uglify-js")'
|
39
|
+
nil
|
40
|
+
end
|
41
|
+
|
42
|
+
# Gzip code to check file size
|
43
|
+
def gzip(str)
|
44
|
+
IO.popen('gzip -f', 'r+') do |i|
|
45
|
+
i.puts str
|
46
|
+
i.close_write
|
47
|
+
return i.read
|
48
|
+
end
|
49
|
+
rescue Errno::ENOENT
|
50
|
+
$stderr.puts '"gzip" command not found, it is required to produce the .gz version'
|
51
|
+
nil
|
52
|
+
end
|
data/config.ru
CHANGED
data/lib/opal/jquery.rb
CHANGED
data/lib/opal/jquery/version.rb
CHANGED
data/opal-jquery.gemspec
CHANGED
@@ -15,6 +15,6 @@ Gem::Specification.new do |s|
|
|
15
15
|
s.test_files = `git ls-files -- {test,spec,features}/*`.split("\n")
|
16
16
|
s.require_paths = ['lib']
|
17
17
|
|
18
|
-
s.add_runtime_dependency 'opal', '
|
19
|
-
s.add_development_dependency 'opal-spec', '
|
18
|
+
s.add_runtime_dependency 'opal', '~> 0.5.0'
|
19
|
+
s.add_development_dependency 'opal-spec', '~> 0.3.0'
|
20
20
|
end
|
data/opal/opal-jquery.rb
CHANGED
data/opal/opal-jquery/element.rb
CHANGED
@@ -8,9 +8,12 @@ class Element
|
|
8
8
|
else if (root.Zepto) {
|
9
9
|
dom_class = Zepto.zepto.Z;
|
10
10
|
}
|
11
|
+
else {
|
12
|
+
throw new Error("jQuery must be included before opal-jquery");
|
13
|
+
}
|
11
14
|
|
12
|
-
|
13
|
-
dom_class.prototype._klass =
|
15
|
+
self._proto = dom_class.prototype, def = self._proto;
|
16
|
+
dom_class.prototype._klass = self;
|
14
17
|
}
|
15
18
|
|
16
19
|
include Kernel
|
@@ -48,7 +51,7 @@ class Element
|
|
48
51
|
%x{
|
49
52
|
for (var i = 0, length = methods.length, method; i < length; i++) {
|
50
53
|
method = methods[i];
|
51
|
-
|
54
|
+
self._proto['$' + method] = self._proto[method];
|
52
55
|
}
|
53
56
|
|
54
57
|
return nil;
|
@@ -63,7 +66,7 @@ class Element
|
|
63
66
|
expose :hide, :show, :toggle, :children, :blur, :closest, :data
|
64
67
|
expose :focus, :find, :next, :siblings, :text, :trigger, :append
|
65
68
|
expose :height, :width, :serialize, :is, :filter, :last, :first
|
66
|
-
expose :wrap, :stop, :clone
|
69
|
+
expose :wrap, :stop, :clone, :empty
|
67
70
|
|
68
71
|
# We alias some jquery methods to common ruby method names.
|
69
72
|
alias succ next
|
@@ -94,7 +97,7 @@ class Element
|
|
94
97
|
end
|
95
98
|
|
96
99
|
def [](name)
|
97
|
-
|
100
|
+
`self.attr(name) || ""`
|
98
101
|
end
|
99
102
|
|
100
103
|
def add_attribute name
|
@@ -102,32 +105,23 @@ class Element
|
|
102
105
|
end
|
103
106
|
|
104
107
|
def has_attribute? name
|
105
|
-
|
108
|
+
`!!self.attr(name)`
|
106
109
|
end
|
107
110
|
|
108
111
|
def append_to_body
|
109
|
-
|
112
|
+
`self.appendTo(document.body)`
|
110
113
|
end
|
111
114
|
|
112
115
|
def append_to_head
|
113
|
-
|
116
|
+
`self.appendTo(document.head)`
|
114
117
|
end
|
115
118
|
|
116
119
|
# Returns the element at the given index as a new `DOM` instance.
|
117
120
|
# Negative indexes can be used and are counted from the end. If the
|
118
121
|
# given index is outside the range then `nil` is returned.
|
119
|
-
#
|
120
|
-
# @example
|
121
|
-
#
|
122
|
-
# DOM('.foo')[0] # => first element in collection
|
123
|
-
# DOM('.foo')[-1] # => last element from collection
|
124
|
-
# DOM('.foo')[100] # => returns nil if index outside range
|
125
|
-
#
|
126
|
-
# @param [Numeric] index the index to get
|
127
|
-
# @return [DOM, nil] returns new collection with returned element
|
128
122
|
def at(index)
|
129
123
|
%x{
|
130
|
-
var length =
|
124
|
+
var length = self.length;
|
131
125
|
|
132
126
|
if (index < 0) {
|
133
127
|
index += length;
|
@@ -137,70 +131,43 @@ class Element
|
|
137
131
|
return nil;
|
138
132
|
}
|
139
133
|
|
140
|
-
return $(
|
134
|
+
return $(self[index]);
|
141
135
|
}
|
142
136
|
end
|
143
137
|
|
144
|
-
# Returns the CSS class name of the firt element in
|
138
|
+
# Returns the CSS class name of the firt element in self collection.
|
145
139
|
# If the collection is empty then an empty string is returned. Only
|
146
140
|
# the class name of the first element will ever be returned.
|
147
|
-
#
|
148
|
-
# @example
|
149
|
-
#
|
150
|
-
# DOM('<p class="foo"></p>').class_name
|
151
|
-
# # => "foo"
|
152
|
-
#
|
153
|
-
# @return [String] the class name
|
154
141
|
def class_name
|
155
142
|
%x{
|
156
|
-
var first =
|
143
|
+
var first = self[0];
|
157
144
|
return (first && first.className) || "";
|
158
145
|
}
|
159
146
|
end
|
160
147
|
|
161
|
-
# Sets the CSS class name of every element in
|
162
|
-
# given string.
|
148
|
+
# Sets the CSS class name of every element in self collection to the
|
149
|
+
# given string. self does not append the class names, it replaces
|
163
150
|
# the entire current class name.
|
164
|
-
#
|
165
|
-
# @example
|
166
|
-
#
|
167
|
-
# DOM('#foo').class_name = "title"
|
168
|
-
#
|
169
|
-
# @param [String] name the class name to set on each element
|
170
|
-
# @return [DOM] returns the receiver
|
171
151
|
def class_name=(name)
|
172
152
|
%x{
|
173
|
-
for (var i = 0, length =
|
174
|
-
|
153
|
+
for (var i = 0, length = self.length; i < length; i++) {
|
154
|
+
self[i].className = name;
|
175
155
|
}
|
176
156
|
}
|
177
157
|
self
|
178
158
|
end
|
179
159
|
|
180
|
-
# Get or set css properties on each element in
|
160
|
+
# Get or set css properties on each element in self collection. If
|
181
161
|
# only the `name` is given, then that css property name is read from
|
182
162
|
# the first element in the collection and returned. If the `value`
|
183
163
|
# property is also given then the given css property is set to the
|
184
|
-
# given value for each of the elements in
|
164
|
+
# given value for each of the elements in self collection. The
|
185
165
|
# property can also be a hash of properties and values.
|
186
|
-
#
|
187
|
-
# @example
|
188
|
-
#
|
189
|
-
# foo = DOM '#foo'
|
190
|
-
# foo.css 'background-color' # => "red"
|
191
|
-
# foo.css 'background-color', 'green'
|
192
|
-
# foo.css 'background-color' # => "green"
|
193
|
-
# foo.css :width => '200px'
|
194
|
-
#
|
195
|
-
# @param [String] name the css property to get/set
|
196
|
-
# @param [String] value optional value to set
|
197
|
-
# @param [Hash] set of css properties and values
|
198
|
-
# @return [String, DOM] returns css value or the receiver
|
199
166
|
def css(name, value=nil)
|
200
167
|
if value.nil? && name.is_a?(String)
|
201
|
-
return
|
168
|
+
return `self.css(name)`
|
202
169
|
else
|
203
|
-
name.is_a?(Hash) ?
|
170
|
+
name.is_a?(Hash) ? `self.css(#{name.to_n})` : `self.css(name, value)`
|
204
171
|
end
|
205
172
|
self
|
206
173
|
end
|
@@ -209,21 +176,10 @@ class Element
|
|
209
176
|
# set of css properties and values to animate to. The first parameter
|
210
177
|
# also accepts a special :speed value to set animation speed. If a block
|
211
178
|
# is given, the block is run as a callback when the animation finishes.
|
212
|
-
#
|
213
|
-
# @example
|
214
|
-
#
|
215
|
-
# foo = DOM "#foo"
|
216
|
-
# foo.animate :height => "200px", "margin-left" => "10px"
|
217
|
-
# bar.animate :top => "30px", :speed => 100 do
|
218
|
-
# bar.add_class "finished"
|
219
|
-
# end
|
220
|
-
#
|
221
|
-
# @param [Hash] css properties and and values. Also accepts speed param.
|
222
|
-
# @return [DOM] receiver
|
223
179
|
def animate(params, &block)
|
224
180
|
speed = params.has_key?(:speed) ? params.delete(:speed) : 400
|
225
181
|
%x{
|
226
|
-
|
182
|
+
self.animate(#{params.to_n}, #{speed}, function() {
|
227
183
|
#{block.call if block_given?}
|
228
184
|
})
|
229
185
|
}
|
@@ -236,93 +192,61 @@ class Element
|
|
236
192
|
name = name.gsub(/_\w/) { |match| match[1].upcase }
|
237
193
|
args = args.map { |a| a.to_n if a.respond_to? :to_n }.compact
|
238
194
|
args << `function() { #{block.call if block_given?} }`
|
239
|
-
|
195
|
+
`self[#{name}].apply(self, #{args})`
|
240
196
|
end
|
241
197
|
|
242
198
|
def visible?
|
243
|
-
|
199
|
+
`self.is(':visible')`
|
244
200
|
end
|
245
201
|
|
246
202
|
def offset
|
247
|
-
Hash.from_native(
|
203
|
+
Hash.from_native(`self.offset()`)
|
248
204
|
end
|
249
205
|
|
250
|
-
# Yields each element in #{self} collection in turn. The yielded element
|
251
|
-
# is wrapped as a `DOM` instance.
|
252
|
-
#
|
253
|
-
# @example
|
254
|
-
#
|
255
|
-
# DOM('.foo').each { |e| puts "The element id: #{e.id}" }
|
256
|
-
#
|
257
|
-
# @return returns the receiver
|
258
206
|
def each
|
259
|
-
`for (var i = 0, length =
|
260
|
-
yield `$(
|
207
|
+
`for (var i = 0, length = self.length; i < length; i++) {`
|
208
|
+
yield `$(self[i])`
|
261
209
|
`}`
|
262
210
|
self
|
263
211
|
end
|
264
212
|
|
265
|
-
# return an opal array mapped with block yielded for any element
|
266
|
-
#
|
267
|
-
# @example
|
268
|
-
#
|
269
|
-
# list = Document.find('table.players td.surname').map {|el| el.html }
|
270
|
-
#
|
271
|
-
# @return an Array
|
272
|
-
def map
|
273
|
-
list = []
|
274
|
-
each {|el| list << yield(el) }
|
275
|
-
list
|
276
|
-
end
|
277
|
-
|
278
|
-
# return an opal Array of elements
|
279
|
-
#
|
280
|
-
# @example
|
281
|
-
#
|
282
|
-
# Document.find('table.players td.surname').to_a.last
|
283
|
-
#
|
284
|
-
# @return an Array
|
285
|
-
def to_a
|
286
|
-
map {|el| el }
|
287
|
-
end
|
288
|
-
|
289
213
|
def first
|
290
|
-
|
214
|
+
`self.length ? self.first() : nil`
|
291
215
|
end
|
292
216
|
|
293
217
|
def html
|
294
|
-
|
218
|
+
`self.html() || ""`
|
295
219
|
end
|
296
220
|
|
297
221
|
def id
|
298
222
|
%x{
|
299
|
-
var first =
|
223
|
+
var first = self[0];
|
300
224
|
return (first && first.id) || "";
|
301
225
|
}
|
302
226
|
end
|
303
227
|
|
304
228
|
def id=(id)
|
305
229
|
%x{
|
306
|
-
var first =
|
230
|
+
var first = self[0];
|
307
231
|
|
308
232
|
if (first) {
|
309
233
|
first.id = id;
|
310
234
|
}
|
311
235
|
|
312
|
-
return
|
236
|
+
return self;
|
313
237
|
}
|
314
238
|
end
|
315
239
|
|
316
240
|
def tag_name
|
317
|
-
|
241
|
+
`self.length > 0 ? self[0].tagName.toLowerCase() : #{nil}`
|
318
242
|
end
|
319
243
|
|
320
244
|
def inspect
|
321
245
|
%x{
|
322
246
|
var val, el, str, result = [];
|
323
247
|
|
324
|
-
for (var i = 0, length =
|
325
|
-
el =
|
248
|
+
for (var i = 0, length = self.length; i < length; i++) {
|
249
|
+
el = self[i];
|
326
250
|
str = "<" + el.tagName.toLowerCase();
|
327
251
|
|
328
252
|
if (val = el.id) str += (' id="' + val + '"');
|
@@ -336,31 +260,59 @@ class Element
|
|
336
260
|
end
|
337
261
|
|
338
262
|
def length
|
339
|
-
|
263
|
+
`self.length`
|
340
264
|
end
|
341
265
|
|
342
266
|
def any?
|
343
|
-
|
267
|
+
`self.length > 0`
|
344
268
|
end
|
345
269
|
|
346
270
|
def empty?
|
347
|
-
|
271
|
+
`self.length === 0`
|
348
272
|
end
|
349
273
|
|
350
274
|
alias empty? none?
|
351
275
|
|
352
276
|
def on(name, sel = nil, &block)
|
353
|
-
|
277
|
+
%x{
|
278
|
+
var wrapper = function(evt) {
|
279
|
+
if (evt.preventDefault) {
|
280
|
+
evt = #{Event.new `evt`};
|
281
|
+
}
|
282
|
+
|
283
|
+
return block.apply(null, arguments);
|
284
|
+
};
|
285
|
+
|
286
|
+
block._jq_wrap = wrapper;
|
287
|
+
|
288
|
+
if (sel == nil) {
|
289
|
+
self.on(name, wrapper);
|
290
|
+
}
|
291
|
+
else {
|
292
|
+
self.on(name, sel, wrapper);
|
293
|
+
}
|
294
|
+
}
|
295
|
+
|
354
296
|
block
|
355
297
|
end
|
356
298
|
|
357
299
|
def off(name, sel, block = nil)
|
358
|
-
|
300
|
+
%x{
|
301
|
+
if (sel == null) {
|
302
|
+
return self.off(name);
|
303
|
+
}
|
304
|
+
else if (block === nil) {
|
305
|
+
return self.off(name, sel._jq_wrap);
|
306
|
+
}
|
307
|
+
else {
|
308
|
+
return self.off(name, sel, block._jq_wrap);
|
309
|
+
}
|
310
|
+
}
|
359
311
|
end
|
360
312
|
|
361
313
|
alias size length
|
362
314
|
|
363
315
|
def value
|
364
|
-
|
316
|
+
`self.val() || ""`
|
365
317
|
end
|
366
318
|
end
|
data/opal/opal-jquery/event.rb
CHANGED
@@ -1,30 +1,49 @@
|
|
1
|
-
#Class.bridge_class 'Event', `$.Event`
|
2
|
-
|
3
1
|
# Wraps native jQuery event objects.
|
4
2
|
class Event
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
#{self}._proto = bridge_class.prototype, def = #{self}._proto;
|
9
|
-
bridge_class.prototype._klass = #{self};
|
10
|
-
}
|
11
|
-
|
12
|
-
include Kernel
|
3
|
+
def initialize(native)
|
4
|
+
@native = native
|
5
|
+
end
|
13
6
|
|
14
7
|
def [](name)
|
15
|
-
|
8
|
+
`#@native[name]`
|
16
9
|
end
|
17
10
|
|
18
|
-
def
|
19
|
-
|
11
|
+
def type
|
12
|
+
`#@native.type`
|
20
13
|
end
|
21
14
|
|
15
|
+
##
|
16
|
+
# Element
|
17
|
+
|
22
18
|
def current_target
|
23
|
-
`$(
|
19
|
+
`$(#@native.currentTarget)`
|
24
20
|
end
|
25
21
|
|
22
|
+
def target
|
23
|
+
`$(#@native.target)`
|
24
|
+
end
|
25
|
+
|
26
|
+
##
|
27
|
+
# Propagation
|
28
|
+
|
26
29
|
def default_prevented?
|
27
|
-
|
30
|
+
`#@native.isDefaultPrevented()`
|
31
|
+
end
|
32
|
+
|
33
|
+
def prevent_default
|
34
|
+
`#@native.preventDefault()`
|
35
|
+
end
|
36
|
+
|
37
|
+
def propagation_stopped?
|
38
|
+
`#@native.propagationStopped()`
|
39
|
+
end
|
40
|
+
|
41
|
+
def stop_propagation
|
42
|
+
`#@native.stopPropagation()`
|
43
|
+
end
|
44
|
+
|
45
|
+
def stop_immediate_propagation
|
46
|
+
`#@native.stopImmediatePropagation()`
|
28
47
|
end
|
29
48
|
|
30
49
|
# Stops propagation and prevents default action.
|
@@ -33,39 +52,34 @@ class Event
|
|
33
52
|
prevent_default
|
34
53
|
end
|
35
54
|
|
36
|
-
|
55
|
+
##
|
56
|
+
# Keyboard/Mouse/Touch
|
37
57
|
|
38
58
|
def page_x
|
39
|
-
|
59
|
+
`#@native.pageX`
|
40
60
|
end
|
41
61
|
|
42
62
|
def page_y
|
43
|
-
|
44
|
-
end
|
45
|
-
|
46
|
-
alias_native :propagation_stopped?, :propagationStopped
|
47
|
-
|
48
|
-
alias_native :stop_propagation, :stopPropagation
|
49
|
-
|
50
|
-
alias_native :stop_immediate_propagation, :stopImmediatePropagation
|
51
|
-
|
52
|
-
def target
|
53
|
-
`$(#{self}.target)`
|
63
|
+
`#@native.pageY`
|
54
64
|
end
|
55
65
|
|
56
66
|
def touch_x
|
57
|
-
|
67
|
+
`#@native.originalEvent.touches[0].pageX`
|
58
68
|
end
|
59
69
|
|
60
70
|
def touch_y
|
61
|
-
|
71
|
+
`#@native.originalEvent.touches[0].pageY`
|
62
72
|
end
|
63
73
|
|
64
|
-
def
|
65
|
-
|
74
|
+
def ctrl_key
|
75
|
+
`#@native.ctrlKey`
|
76
|
+
end
|
77
|
+
|
78
|
+
def key_code
|
79
|
+
`#@native.keyCode`
|
66
80
|
end
|
67
81
|
|
68
82
|
def which
|
69
|
-
|
83
|
+
`#@native.which`
|
70
84
|
end
|
71
85
|
end
|
data/opal/opal-jquery/kernel.rb
CHANGED
@@ -37,12 +37,12 @@ describe Element do
|
|
37
37
|
it "should return a list of class Array" do
|
38
38
|
Element.find('table.players td.surname').to_a.class.should == Array
|
39
39
|
end
|
40
|
-
|
40
|
+
|
41
41
|
it "should check first and last element" do
|
42
42
|
Element.find('table.players td.surname').to_a.first.html == "rossi"
|
43
43
|
Element.find('table.players td.surname').to_a.last.html == "bianchi"
|
44
44
|
end
|
45
|
-
|
45
|
+
|
46
46
|
it "should get only element with class surname" do
|
47
47
|
Element.find('table.players td').to_a.select {|el| el.has_class?('surname') }.
|
48
48
|
map {|el| el.class }.uniq == ['surname']
|
File without changes
|
File without changes
|
data/spec/http_spec.rb
CHANGED
@@ -3,7 +3,7 @@ require "spec_helper"
|
|
3
3
|
describe HTTP do
|
4
4
|
describe '#body' do
|
5
5
|
async 'returns the response body as a string' do
|
6
|
-
HTTP.get('spec/
|
6
|
+
HTTP.get('spec/fixtures/simple.txt') do |response|
|
7
7
|
run_async { response.body.should == "hey" }
|
8
8
|
end
|
9
9
|
end
|
@@ -11,7 +11,7 @@ describe HTTP do
|
|
11
11
|
|
12
12
|
describe '#callback' do
|
13
13
|
async 'can add a success callback after the request is sent' do
|
14
|
-
http = HTTP.get('spec/
|
14
|
+
http = HTTP.get('spec/fixtures/simple.txt')
|
15
15
|
http.callback do |response|
|
16
16
|
run_async { response.ok?.should be_true }
|
17
17
|
end
|
@@ -20,7 +20,7 @@ describe HTTP do
|
|
20
20
|
|
21
21
|
describe '#callback' do
|
22
22
|
async 'can add a failure callback after the request is sent' do
|
23
|
-
http = HTTP.get('spec/
|
23
|
+
http = HTTP.get('spec/fixtures/bad_url.txt')
|
24
24
|
http.errback do |response|
|
25
25
|
run_async { response.ok?.should be_false }
|
26
26
|
end
|
@@ -29,7 +29,7 @@ describe HTTP do
|
|
29
29
|
|
30
30
|
describe '#json' do
|
31
31
|
async 'returns the json converted into native ruby objects' do
|
32
|
-
HTTP.get('spec/
|
32
|
+
HTTP.get('spec/fixtures/user.json') do |response|
|
33
33
|
run_async { response.json.should == { 'name' => 'Adam', 'age' => 26 } }
|
34
34
|
end
|
35
35
|
end
|
@@ -37,13 +37,13 @@ describe HTTP do
|
|
37
37
|
|
38
38
|
describe '#ok?' do
|
39
39
|
async 'returns true when the request was a sucess' do
|
40
|
-
HTTP.get('spec/
|
40
|
+
HTTP.get('spec/fixtures/simple.txt') do |response|
|
41
41
|
run_async { response.ok?.should be_true }
|
42
42
|
end
|
43
43
|
end
|
44
|
-
|
44
|
+
|
45
45
|
async 'returns false when the request failed' do
|
46
|
-
HTTP.get('spec/
|
46
|
+
HTTP.get('spec/fixtures/non_existant.txt') do |response|
|
47
47
|
run_async { response.ok?.should be_false }
|
48
48
|
end
|
49
49
|
end
|
File without changes
|
data/spec/kernel_spec.rb
ADDED
data/spec/spec_helper.rb
CHANGED
@@ -1,34 +1,35 @@
|
|
1
|
-
require 'jquery'
|
2
1
|
require 'opal-spec'
|
3
2
|
require 'opal-jquery'
|
4
3
|
|
5
|
-
module
|
6
|
-
|
4
|
+
module JqueryHelpers
|
5
|
+
# Add some html code to the body tag ready for testing. This will
|
6
|
+
# be added before each test, then removed after each test. It is
|
7
|
+
# convenient for adding html setup quickly. The code is wrapped
|
8
|
+
# inside a div, which is directly inside the body element.
|
9
|
+
#
|
10
|
+
# describe "DOM feature" do
|
11
|
+
# html <<-HTML
|
12
|
+
# <div id="foo"></div>
|
13
|
+
# HTML
|
14
|
+
#
|
15
|
+
# it "foo should exist" do
|
16
|
+
# Document["#foo"]
|
17
|
+
# end
|
18
|
+
# end
|
19
|
+
#
|
20
|
+
# @param [String] html_string html content to add
|
21
|
+
def html(html_string='')
|
22
|
+
html = %Q{<div id="opal-jquery-test-div">#{html_string}</div>}
|
7
23
|
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
# inside a div, which is directly inside the body element.
|
12
|
-
#
|
13
|
-
# describe "DOM feature" do
|
14
|
-
# html <<-HTML
|
15
|
-
# <div id="foo"></div>
|
16
|
-
# HTML
|
17
|
-
#
|
18
|
-
# it "foo should exist" do
|
19
|
-
# Document["#foo"]
|
20
|
-
# end
|
21
|
-
# end
|
22
|
-
#
|
23
|
-
# @param [String] html_string html content to add
|
24
|
-
def self.html(html_string='')
|
25
|
-
html = '<div id="opal-jquery-test-div">' + html_string + '</div>'
|
26
|
-
before do
|
27
|
-
@_spec_html = Element.parse(html)
|
28
|
-
@_spec_html.append_to_body
|
29
|
-
end
|
30
|
-
|
31
|
-
after { @_spec_html.remove }
|
24
|
+
before do
|
25
|
+
@_spec_html = Element.parse(html)
|
26
|
+
@_spec_html.append_to_body
|
32
27
|
end
|
28
|
+
|
29
|
+
after { @_spec_html.remove }
|
33
30
|
end
|
34
31
|
end
|
32
|
+
|
33
|
+
class OpalSpec::Example
|
34
|
+
extend JqueryHelpers
|
35
|
+
end
|
File without changes
|
metadata
CHANGED
@@ -1,46 +1,41 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: opal-jquery
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0
|
5
|
-
prerelease:
|
4
|
+
version: 0.1.0
|
6
5
|
platform: ruby
|
7
6
|
authors:
|
8
7
|
- Adam Beynon
|
9
8
|
autorequire:
|
10
9
|
bindir: bin
|
11
10
|
cert_chain: []
|
12
|
-
date: 2013-
|
11
|
+
date: 2013-11-03 00:00:00.000000000 Z
|
13
12
|
dependencies:
|
14
13
|
- !ruby/object:Gem::Dependency
|
15
14
|
name: opal
|
16
15
|
requirement: !ruby/object:Gem::Requirement
|
17
|
-
none: false
|
18
16
|
requirements:
|
19
|
-
- -
|
17
|
+
- - ~>
|
20
18
|
- !ruby/object:Gem::Version
|
21
|
-
version: 0.
|
19
|
+
version: 0.5.0
|
22
20
|
type: :runtime
|
23
21
|
prerelease: false
|
24
22
|
version_requirements: !ruby/object:Gem::Requirement
|
25
|
-
none: false
|
26
23
|
requirements:
|
27
|
-
- -
|
24
|
+
- - ~>
|
28
25
|
- !ruby/object:Gem::Version
|
29
|
-
version: 0.
|
26
|
+
version: 0.5.0
|
30
27
|
- !ruby/object:Gem::Dependency
|
31
28
|
name: opal-spec
|
32
29
|
requirement: !ruby/object:Gem::Requirement
|
33
|
-
none: false
|
34
30
|
requirements:
|
35
|
-
- -
|
31
|
+
- - ~>
|
36
32
|
- !ruby/object:Gem::Version
|
37
33
|
version: 0.3.0
|
38
34
|
type: :development
|
39
35
|
prerelease: false
|
40
36
|
version_requirements: !ruby/object:Gem::Requirement
|
41
|
-
none: false
|
42
37
|
requirements:
|
43
|
-
- -
|
38
|
+
- - ~>
|
44
39
|
- !ruby/object:Gem::Version
|
45
40
|
version: 0.3.0
|
46
41
|
description: Opal DOM library for jquery
|
@@ -73,8 +68,7 @@ files:
|
|
73
68
|
- opal/opal-jquery/event.rb
|
74
69
|
- opal/opal-jquery/http.rb
|
75
70
|
- opal/opal-jquery/kernel.rb
|
76
|
-
-
|
77
|
-
- spec/data/user.json
|
71
|
+
- opal/opal-jquery/window.rb
|
78
72
|
- spec/document_spec.rb
|
79
73
|
- spec/element/after_spec.rb
|
80
74
|
- spec/element/animations_spec.rb
|
@@ -93,37 +87,39 @@ files:
|
|
93
87
|
- spec/element/traversing_spec.rb
|
94
88
|
- spec/element_spec.rb
|
95
89
|
- spec/event_spec.rb
|
90
|
+
- spec/fixtures/simple.txt
|
91
|
+
- spec/fixtures/user.json
|
96
92
|
- spec/http_spec.rb
|
97
|
-
- spec/jquery.
|
93
|
+
- spec/jquery/index.html
|
94
|
+
- spec/jquery/jquery.js
|
95
|
+
- spec/kernel_spec.rb
|
98
96
|
- spec/spec_helper.rb
|
99
|
-
- spec/zepto.
|
97
|
+
- spec/zepto/index.html
|
98
|
+
- spec/zepto/zepto.js
|
100
99
|
homepage: http://opalrb.org
|
101
100
|
licenses: []
|
101
|
+
metadata: {}
|
102
102
|
post_install_message:
|
103
103
|
rdoc_options: []
|
104
104
|
require_paths:
|
105
105
|
- lib
|
106
106
|
required_ruby_version: !ruby/object:Gem::Requirement
|
107
|
-
none: false
|
108
107
|
requirements:
|
109
|
-
- -
|
108
|
+
- - '>='
|
110
109
|
- !ruby/object:Gem::Version
|
111
110
|
version: '0'
|
112
111
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
113
|
-
none: false
|
114
112
|
requirements:
|
115
|
-
- -
|
113
|
+
- - '>='
|
116
114
|
- !ruby/object:Gem::Version
|
117
115
|
version: '0'
|
118
116
|
requirements: []
|
119
117
|
rubyforge_project:
|
120
|
-
rubygems_version: 1.
|
118
|
+
rubygems_version: 2.1.9
|
121
119
|
signing_key:
|
122
|
-
specification_version:
|
120
|
+
specification_version: 4
|
123
121
|
summary: Opal access to jquery
|
124
122
|
test_files:
|
125
|
-
- spec/data/simple.txt
|
126
|
-
- spec/data/user.json
|
127
123
|
- spec/document_spec.rb
|
128
124
|
- spec/element/after_spec.rb
|
129
125
|
- spec/element/animations_spec.rb
|
@@ -142,7 +138,12 @@ test_files:
|
|
142
138
|
- spec/element/traversing_spec.rb
|
143
139
|
- spec/element_spec.rb
|
144
140
|
- spec/event_spec.rb
|
141
|
+
- spec/fixtures/simple.txt
|
142
|
+
- spec/fixtures/user.json
|
145
143
|
- spec/http_spec.rb
|
146
|
-
- spec/jquery.
|
144
|
+
- spec/jquery/index.html
|
145
|
+
- spec/jquery/jquery.js
|
146
|
+
- spec/kernel_spec.rb
|
147
147
|
- spec/spec_helper.rb
|
148
|
-
- spec/zepto.
|
148
|
+
- spec/zepto/index.html
|
149
|
+
- spec/zepto/zepto.js
|