Skip to content

Instantly share code, notes, and snippets.

@fils
Created April 17, 2013 14:49
Show Gist options
  • Save fils/5404918 to your computer and use it in GitHub Desktop.
Save fils/5404918 to your computer and use it in GitHub Desktop.
This HTML file has Dart code in it. I am trying to bind the datatable var to the table using webui binding. Can not resolve the issue with it. I can set the var statically but not update it as I change it. Would love the two binding to enable simple sorting and filtering later.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="./bootstrap/css/bootstrap.css">
<link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css"
rel="stylesheet">
<style>
body {
padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
<link rel="stylesheet" href="./css/webui.css">
<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#">Unity Search</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li><a href="./fedsearch.html">Simple Box</a></li>
<li><a href="./lithfacet.html">Lith Facets</a></li>
<li><a href="./visko.html">Visko</a></li>
<li><a href="./janus.html">Janus</a></li>
<li><a class="active" href="./janusmatrix.html">Janus Matrix</a></li>
</ul>
</div>
<!--/.nav-collapse -->
</div>
</div>
</div>
<div class="container-fluid">
<div class="row-fluid">
<div class="span2">
<!--Sidebar content-->
<p>Information on the matrix here</p>
</div>
<div class="span9">
<!--Body content-->
<div class="well">
<p>Janus Matrix</p>
</div>
<div class="row-fluid">
<div class="span9">
<h6>Results </h6>
<table class="table">
<tbody template iterate='row in datatable'>
<tr template iterate='cell in row'>
<td>{{cell}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<script type="application/dart">
import 'dart:html';
import 'dart:async';
import 'dart:uri';
import 'dart:json';
import 'dart:core';
import 'dart:isolate';
import 'package:json_object/json_object.dart';
import 'package:web_ui/web_ui.dart';
import 'package:js/js.dart' as js;
var datatable = [];
main() {
var url = "./data/janusMatrix.json";
HttpRequest.request(url).then(onDataLoaded);
}
void onDataLoaded(HttpRequest req) {
var sr = new JsonObject.fromJsonString(req.responseText);
sr.isExtendable = true;
for (JsonObject x in sr.results.bindings) {
datatable.add([x.leg.value, x.site.value, x.param.value]);
}
print(datatable.toString());
}
</script>
<!--
<script type="application/dart" src="src/janusindexdb/janusindexdb.dart"></script>
-->
<script src="packages/browser/dart.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment