public
Last active

Working on Dart and polymer via http calls

  • Download Gist
iodputil.dart
Dart
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
library iodputil;
import 'dart:html';
import "dart:json";
 
class iodputil {
 
String encodeComponent(String component) {
if (component == null) return component;
return component.replaceAll(':', '%3A')
.replaceAll('/', '%2F')
.replaceAll('?', '%3F')
.replaceAll('=', '%3D')
.replaceAll('&', '%26')
.replaceAll(' ', '%20')
.replaceAll('}', '%7D')
.replaceAll('{', '%7B')
.replaceAll('#', '%23')
.replaceAll('(', '%28')
.replaceAll(')', '%29');
}
 
}
select.html
HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
<!DOCTYPE html>
 
<html>
<head>
<title>index</title>
<link rel="import" href="xjanusleg.html">
 
</head>
 
<body>
 
<h5>Test of facet call 2</h5>
 
<div class="container">
<template id="leg_template" bind>
<janus-leg id="janus_leg"></janus-leg>
</template>
</div>
 
 
<script type="application/dart" src="select_app.dart"></script>
<!-- for this next line to work, your pubspec.yaml file must have a dependency on 'browser' -->
<script src="packages/polymer/boot.js"></script>
 
</body>
</html>
select_app.dart
Dart
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
import 'dart:html';
import 'package:mdv/mdv.dart' as mdv;
import 'package:fancy_syntax/syntax.dart';
import 'package:observe/observe.dart';
 
 
main() {
 
// mdv.initialize();
//TemplateElement.syntax['fancy'] = new FancySyntax();
 
var template = query('#leg_template');
template.bindingDelegate = new FancySyntax();
//query("#leg_template").fruits = ['apples', 'oranges', 'pears'];
 
 
}
xjanusleg.dart
Dart
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61
import 'dart:html';
import 'dart:json' as json;
import 'package:polymer/polymer.dart';
import './iodputil.dart';
 
 
@CustomTag("janus-leg")
class JanusLegComponent extends PolymerElement with ObservableMixin {
 
@observable String serverResponse = 'Calling server';
@observable List legs = ['apples', 'oranges', 'pears'];
 
HttpRequest request;
 
// void init() {
// query('#fruitlist').model = fruits;
// List fruits = toObservable([]);
// query('#fruitlist').model = fruits;
// fruits = ['apples', 'oranges', 'pears'];
// }
 
void onUpdate() {
iodputil iou = new iodputil();
String k1 = null;
 
k1 = iou.encodeComponent("""
PREFIX qb: <http://purl.org/linked-data/cube#>
PREFIX iodp: <http://data.oceandrilling.org/core/1/>
PREFIX janus: <http://data.oceandrilling.org/janus/>
PREFIX sdmx-dimension: <http://purl.org/linked-data/sdmx/2009/dimension#>
SELECT DISTINCT ?leg count(?slice) as ?count
FROM <http://data.oceandrilling.org/janus/>
WHERE {
?slice qb:sliceStructure ?sliceKey .
?sliceKey iodp:leg ?leg .
}
""");
 
var callURl = "http://data.oceandrilling.org/sparql?default-graph-uri=&format=applicatiapplication%2Fsparql-results%2Bjson&should-sponge=&query=$k1";
 
request.onReadyStateChange.listen(onData);
 
request.open('GET', callURl);
request.send();
 
 
}
 
void onData(_) {
if (request.readyState == HttpRequest.DONE &&
request.status == 200) {
// Data saved OK.
serverResponse = 'Server Sez: ' + request.responseText;
} else if (request.readyState == HttpRequest.DONE &&
request.status == 0) {
// Status is 0...most likely the server isn't running.
serverResponse = 'No server';
}
}
 
}
xjanusleg.html
HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
<!DOCTYPE html>
<html>
<body>
<polymer-element name="janus-leg" attributes="legs">
<template>
<div>
<p>The facet: {{ serverResponse }}</p>
<select style="height:200px;width:200px" bind-value="legs" id="janusqueryitems" multiple="multiple">
<template id="leg" repeat>
<option>{{}}</option>
</template>
</select>
</div>
</template>
<script type="application/dart" src="xjanusleg.dart"></script>
</polymer-element>
</body>
</html>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.