Skip to content
Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: opal/opal-jquery
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: f70f8e3ba95e
Choose a base ref
...
head repository: opal/opal-jquery
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: b0e2ce93d2c2
Choose a head ref
  • 9 commits
  • 8 files changed
  • 1 contributor

Commits on Jul 31, 2015

  1. Vertical whitespace

    To improve raw format readability.
    elia committed Jul 31, 2015
    Copy the full SHA
    f864a20 View commit details
  2. Update specs to use jQuery 1.8.3*

    * 1.8 released on 2012/08/09
    elia committed Jul 31, 2015
    Copy the full SHA
    a51eb24 View commit details
  3. Let Element.parse enforce parsing

    `Element.parse` now relies on `$.parseHTML` in conjunction with `$` enforcing actual HTML parsing.
    
    fixes #45
    elia committed Jul 31, 2015
    Copy the full SHA
    5f2b840 View commit details
  4. Copy the full SHA
    e6a4c18 View commit details
  5. #extend is a public method

    elia committed Jul 31, 2015
    Copy the full SHA
    5507ff9 View commit details
  6. Whitespace

    elia committed Jul 31, 2015
    Copy the full SHA
    1ca45bb View commit details
  7. Update to latest Zepto

    elia committed Jul 31, 2015
    Copy the full SHA
    0fa3113 View commit details
  8. Copy the full SHA
    09b03a6 View commit details
  9. Copy the full SHA
    b0e2ce9 View commit details
Showing with 68 additions and 22 deletions.
  1. +15 −2 .travis.yml
  2. +6 −0 CHANGELOG.md
  3. +30 −1 README.md
  4. +6 −6 lib/opal/jquery/constants.rb
  5. +6 −6 lib/opal/jquery/document.rb
  6. +1 −1 lib/opal/jquery/element.rb
  7. +2 −4 spec/jquery/jquery.js
  8. +2 −2 spec/zepto/zepto.js
17 changes: 15 additions & 2 deletions .travis.yml
Original file line number Diff line number Diff line change
@@ -1,6 +1,19 @@
language: ruby

rvm:
- 1.9.3
- 2.0.0
- 2.2
- 2.1
- 2.0
- 1.9.3

script: rake $RUN

fast_finish: true

include:
- env: RUN=default
- env: RUN=zepto

allow_failures:
- env: RUN=zepto

6 changes: 6 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,9 @@
## 0.5.0 (edge)

* Updated specs to use jQuery 1.8 (that was initially released in 2012)

* `Element.parse` now relies on `$.parseHTML` in conjunction with `$` enforcing actual HTML parsing.

## 0.4.0 2015-07-17

* `Element#[]=` now removes the attribute when the assigned value is nil.
31 changes: 30 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
# opal-jquery: jQuery Wrapper For Opal
# opal-jquery: jQuery wrapper for Opal

[![Build Status](http://img.shields.io/travis/opal/opal-jquery/master.svg)](http://travis-ci.org/opal/opal-jquery)

@@ -7,6 +7,9 @@ and providing a nice ruby syntax for dealing with jQuery instances.

See the Opal website for [documentation](http://opalrb.org/docs/jquery).




## Installation

Install opal-jquery from RubyGems:
@@ -20,12 +23,17 @@ Or include it in your Gemfile for Bundler:
```ruby
gem 'opal-jquery'
```




## Running Specs

Get the dependencies:

$ bundle install


### Browser

You can run the specs in any web browser, by running the `config.ru` rack file:
@@ -34,6 +42,7 @@ You can run the specs in any web browser, by running the `config.ru` rack file:

And then visiting `http://localhost:9292` in any web browser.


### Phantomjs

You will need phantomjs to run the specs outside the browser. It can
@@ -47,14 +56,19 @@ Run the tests inside a phantom.js runner:

$ bundle exec rake


### Zepto

opal-jquery also supports zepto. To run specs for zepto use the rake task:

$ bundle exec rake zepto




## Getting Started


### Usage

`opal-jquery` can now be easily added to your opal application sources using a
@@ -78,6 +92,7 @@ alert "Hello from jquery + opal"
The `#alert` method is provided by `opal-jquery`. If the message displays, then
`jquery` support should be working.


### How does opal-jquery work

`opal-jquery` provides an `Element` class, whose instances are toll-free
@@ -88,8 +103,12 @@ with jquery plugins much easier.
Also, `Element` will try to bridge with Zepto if it cannot find jQuery loaded,
making it ideal for mobile applications as well.




## Interacting with the DOM


### Finding Elements

opal-jquery provides the `Element` class, which can be used to find elements in
@@ -130,6 +149,7 @@ el.find '.foo'
# => #<Element .... >
```


### Running code on document ready

Just like jQuery, opal-jquery requires the document to be ready to
@@ -152,6 +172,7 @@ end

Notice the use of the `Kernel#alert` method.


### Event handling

The `Element#on` method is used to attach event handlers to elements:
@@ -189,6 +210,7 @@ Document.on :click do |evt|
end
```


### CSS styles and classnames

The various jQuery methods are available on `Element` instances:
@@ -224,6 +246,9 @@ el.css 'color'
# => 'blue'
```




## HTTP/AJAX requests

jQuery's Ajax implementation is also wrapped in the top level HTTP
@@ -268,6 +293,7 @@ The request is actually triggered inside the `HTTP.get` method, but due
to the async nature of the request, the callback and errback handlers can
be added anytime before the request returns.


### Handling responses

Web apps deal with JSON responses quite frequently, so there is a useful
@@ -298,6 +324,7 @@ request.errback { |response|
}
```


### Supplying an XHR method

To supply an XHR callback include a lambda with the `xhr` option:
@@ -316,6 +343,8 @@ cloud_xfer = HTTP.put "http://my.cloud.storage/location", xhr: update_progress,
```




## Usage of JQuery plugins
Extra plugins used for JQuery aren't available to ruby code by default, you will have to `expose` these functions to opal-jquery.

12 changes: 6 additions & 6 deletions lib/opal/jquery/constants.rb
Original file line number Diff line number Diff line change
@@ -2,12 +2,12 @@

unless defined?(JQUERY_CLASS)
case
when $$[:jQuery]
JQUERY_CLASS = JQUERY_SELECTOR = $$[:jQuery]
when $$[:Zepto] then
JQUERY_SELECTOR = $$[:Zepto]
JQUERY_CLASS = $$[:Zepto][:zepto][:Z]
when `!!Opal.global.jQuery`
JQUERY_CLASS = JQUERY_SELECTOR = `Opal.global.jQuery`
when `!!Opal.global.Zepto`
JQUERY_SELECTOR = `Opal.global.Zepto`
JQUERY_CLASS = `Opal.global.Zepto.zepto.Z`
else
raise NameError, 'Can\'t find jQuery or Zepto. jQuery must be included before opal-jquery'
raise NameError, "Can't find jQuery or Zepto. jQuery must be included before opal-jquery"
end
end
12 changes: 6 additions & 6 deletions lib/opal/jquery/document.rb
Original file line number Diff line number Diff line change
@@ -11,7 +11,7 @@ module Browser
#
# A useful method on {Document} is the {#ready?} method, which can be used to
# run a block once the document is ready. This is equivalent to passing a
# function to the `jQuery` constructor. Unlike jQuery it will work correctly
# function to the `jQuery` constructor. Unlike jQuery it will work correctly
# even if called *after* the document is already loaded.
#
# Document.ready? do
@@ -20,7 +20,7 @@ module Browser
#
# Just like jQuery, multiple blocks may be passed to {#ready?}.
#
# Document.ready (without the question mark) returns the equivilent promise.
# Document.ready (without the question mark) returns the equivilent promise.
# Like other promises it can be combined using the when and then methods.
#
# Document.ready.then do |ready|
@@ -63,7 +63,7 @@ module DocumentMethods
def ready?(&block)
@@__isReady ? block.call : `$(#{block})` if block_given?
end

# Return a promise that resolves when the document is ready.
#
# @example
@@ -76,9 +76,9 @@ def ready
Document.ready? { promise.resolve }
promise
end

module_function :ready?

ready? { @@__isReady = true }

# Returns document title.
@@ -113,7 +113,7 @@ def body

# Top level {Document} instance wrapping `window.document`.
Document = Element.find(`document`)
Document.send(:extend, Browser::DocumentMethods)
Document.extend Browser::DocumentMethods

# TODO: this will be removed soon (here for compatibility)
$document = Document
2 changes: 1 addition & 1 deletion lib/opal/jquery/element.rb
Original file line number Diff line number Diff line change
@@ -109,7 +109,7 @@ def self.new(tag = 'div')
# @param str [String] html content to parse
# @return [Element]
def self.parse(str)
`$(str)`
`$.parseHTML ? $($.parseHTML(str)) : $(str)`
end

# Expose jQuery plugins to become available in ruby code. By default,
Loading