KnockoutJS is kewler
Sorry David
by shelbyz
HTML
<script src="https://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0rc.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.js"></script>
<title>Clarity Con Twitter Feed</title>
<!-- meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Twitter Feed for Narrative Science">
<meta name="author" content="David Johnson">
<script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.5.3/modernizr.min.js"></script>
<link rel="stylesheet" href="http://dl.dropbox.com/u/10021156/NsLayout/css/bootstrap.min.css" media="screen, projection " />
<link rel="stylesheet" href="http://dl.dropbox.com/u/10021156/NsLayout/css/main.css" />
<header>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<a class="brand" href="#"> </a>
<div class="nav-collapse collapse">
</div>
</div>
</div>
</div>
</header>
<div class="container-fluid">
<div>
<div class="hero-unit">
<div id="loader">
<p>Loading....</p>
</div>
<div id="message">
<p>Clarity Consulting Twitter Feed</p>
</div>
<div id="tweetContainer">
<nav>
<button class="refresh btn btn-success btn-large" data-bind="click: refresh">
<i class="icon-white icon-refresh"></i>Refresh
</button>
<button class="reverse btn btn-warning btn-large">
<i class="icon-white icon-resize-vertical"></i>Reverse
</button>
</nav>
<section id="content">
<ul id="tweetList" data-bind="foreach: tweet">
<li class="tweet">
<span>
<div class="head">
<img class="pic" data-bind="attr: { src:...
JavaScript
var viewModel = function() {
var _self = this;
this.tweet = ko.observableArray();
this.callback = function(result) {
alert(result);
_self.tweet(ko.mapping.fromJS(result));
};
this.refresh = function() {
$.ajax({
type: "GET",
dataType: "jsonp",
url: "http://search.twitter.com/search.json?q=claritycon",
success: this.callback,
error: function(XHR, textStatus, errorThrown) {
alert(textStatus + ":" + errorThrown);
}
});
};
};
ko.applyBindings(new viewModel());