2015-10-15 21:51:35 +00:00
|
|
|
|
Methods and annotations to specify interoperability with JavaScript APIs.
|
2015-10-13 20:15:28 +00:00
|
|
|
|
|
2015-11-18 23:34:54 +00:00
|
|
|
|
*This packages requires Dart SDK 1.13.0.*
|
2015-10-15 21:51:35 +00:00
|
|
|
|
|
2015-11-18 23:34:54 +00:00
|
|
|
|
*This is beta software. Please files [issues].*
|
2015-10-15 21:51:35 +00:00
|
|
|
|
|
|
|
|
|
### Adding the dependency
|
|
|
|
|
|
|
|
|
|
Add the following to your `pubspec.yaml`:
|
|
|
|
|
|
|
|
|
|
```yaml
|
|
|
|
|
dependencies:
|
2015-11-18 23:34:54 +00:00
|
|
|
|
js: ^0.6.0
|
2015-10-15 21:51:35 +00:00
|
|
|
|
```
|
|
|
|
|
|
2015-11-18 23:34:54 +00:00
|
|
|
|
### Example
|
2015-10-15 21:51:35 +00:00
|
|
|
|
|
2015-11-17 19:11:07 +00:00
|
|
|
|
See the [Chart.js Dart API](https://github.com/google/chartjs.dart/) for an
|
|
|
|
|
end-to-end example.
|
2015-10-15 23:33:05 +00:00
|
|
|
|
|
2015-11-18 23:34:54 +00:00
|
|
|
|
### Usage
|
|
|
|
|
|
2015-10-15 21:51:35 +00:00
|
|
|
|
#### Calling methods
|
|
|
|
|
|
|
|
|
|
```dart
|
|
|
|
|
// Calls invoke JavaScript `JSON.stringify(obj)`.
|
2015-11-11 20:19:43 +00:00
|
|
|
|
@JS("JSON.stringify")
|
2015-10-15 21:51:35 +00:00
|
|
|
|
external String stringify(obj);
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
#### Classes and Namespaces
|
|
|
|
|
|
|
|
|
|
```dart
|
2015-11-11 20:19:43 +00:00
|
|
|
|
@JS('google.maps')
|
2015-10-15 21:51:35 +00:00
|
|
|
|
library maps;
|
|
|
|
|
|
2016-08-22 16:20:06 +00:00
|
|
|
|
import "package:js/js.dart";
|
|
|
|
|
|
2015-10-15 21:51:35 +00:00
|
|
|
|
// Invokes the JavaScript getter `google.maps.map`.
|
|
|
|
|
external Map get map;
|
|
|
|
|
|
|
|
|
|
// `new Map` invokes JavaScript `new google.maps.Map(location)`
|
2015-11-11 20:19:43 +00:00
|
|
|
|
@JS()
|
2015-10-15 21:51:35 +00:00
|
|
|
|
class Map {
|
|
|
|
|
external Map(Location location);
|
|
|
|
|
external Location getLocation();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// `new Location(...)` invokes JavaScript `new google.maps.LatLng(...)`
|
|
|
|
|
//
|
|
|
|
|
// We recommend against using custom JavaScript names whenever
|
|
|
|
|
// possible. It is easier for users if the JavaScript names and Dart names
|
|
|
|
|
// are consistent.
|
2015-11-11 20:19:43 +00:00
|
|
|
|
@JS("LatLng")
|
2015-10-15 21:51:35 +00:00
|
|
|
|
class Location {
|
|
|
|
|
external Location(num lat, num lng);
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
2015-11-11 20:19:43 +00:00
|
|
|
|
#### JavaScript object literals
|
2015-10-15 21:51:35 +00:00
|
|
|
|
|
2015-11-11 20:19:43 +00:00
|
|
|
|
Many JavaScript APIs take an object literal as an argument. For example:
|
2015-10-15 21:51:35 +00:00
|
|
|
|
```js
|
|
|
|
|
// JavaScript
|
|
|
|
|
printOptions({responsive: true});
|
|
|
|
|
```
|
|
|
|
|
|
2015-11-11 20:19:43 +00:00
|
|
|
|
If you want to use `printOptions` from Dart, you cannot simply pass a Dart `Map`
|
2015-11-19 00:37:42 +00:00
|
|
|
|
object – they are "opaque" in JavaScript.
|
2015-11-11 20:19:43 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Instead, create a Dart class with both the `@JS()` and
|
|
|
|
|
`@anonymous` annotations.
|
|
|
|
|
|
2015-10-15 21:51:35 +00:00
|
|
|
|
```dart
|
|
|
|
|
// Dart
|
|
|
|
|
void main() {
|
|
|
|
|
printOptions(new Options(responsive: true));
|
|
|
|
|
}
|
|
|
|
|
|
2015-11-11 20:19:43 +00:00
|
|
|
|
@JS()
|
2015-10-15 21:51:35 +00:00
|
|
|
|
external printOptions(Options options);
|
|
|
|
|
|
2015-11-11 20:19:43 +00:00
|
|
|
|
@JS()
|
|
|
|
|
@anonymous
|
2015-10-15 21:51:35 +00:00
|
|
|
|
class Options {
|
|
|
|
|
external bool get responsive;
|
|
|
|
|
|
|
|
|
|
external factory Options({bool responsive});
|
|
|
|
|
}
|
|
|
|
|
```
|
2015-10-13 20:15:28 +00:00
|
|
|
|
|
2016-11-23 15:36:54 +00:00
|
|
|
|
NB: This _anonymous_ class must have an unnamed _factory constructor_.
|
|
|
|
|
|
2015-11-18 23:34:54 +00:00
|
|
|
|
#### Passing functions to JavaScript.
|
|
|
|
|
|
|
|
|
|
If you are passing a Dart function to a JavaScript API, you must wrap it using
|
|
|
|
|
`allowInterop` or `allowInteropCaptureThis`.
|
|
|
|
|
|
2015-10-15 17:46:58 +00:00
|
|
|
|
## Contributing and Filing Bugs
|
2015-10-13 20:15:28 +00:00
|
|
|
|
|
2015-11-18 23:34:54 +00:00
|
|
|
|
Please file bugs and features requests on the [Github issue tracker][issues].
|
2015-10-13 20:15:28 +00:00
|
|
|
|
|
2015-10-15 17:46:58 +00:00
|
|
|
|
We also love and accept community contributions, from API suggestions to pull requests.
|
|
|
|
|
Please file an issue before beginning work so we can discuss the design and implementation.
|
|
|
|
|
We are trying to create issues for all current and future work, so if something there intrigues you (or you need it!) join in on the discussion.
|
2015-10-13 20:15:28 +00:00
|
|
|
|
|
2015-10-15 21:51:35 +00:00
|
|
|
|
Code contributors must sign the
|
2015-10-15 17:46:58 +00:00
|
|
|
|
[Google Individual Contributor License Agreement](https://developers.google.com/open-source/cla/individual?csw=1).
|
2015-11-18 23:34:54 +00:00
|
|
|
|
|
|
|
|
|
[issues]: https://goo.gl/j3rzs0
|