JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<div data-bind="foreach: selectedNews">
<div class="news-item">
<a data-bind="attr: { href: url, title: title }">
<div class="news-header-text" data-bind="text: title" /></div>
</a>
<div class="news-date" data-bind="text: date" /></div>
</div>
</div>
JavaScript
if(location.protocol != "data:")
{
$(window).bind('hashchange', function()
{
window.parent.handleChildIframeUrlChange(location.hash)
});
}
// Class to represent a row in the seat reservations grid
function cebesEnNewsIndex(title, date, url, catId, hits)
{
var self = this;
self.title = title;
self.date = date;
self.url = url;
self.catId = catId;
self.hits = hits;
}
// Overall viewmodel for this screen, along with initial state
function cebesEnNewsIndexViewModel()
{
var self = this;
// Non-editable catalog data - would come from the server
// Editable data
self.news = ko.observableArray([
new cebesEnNewsIndex("Welcome to Cebes Enterprise", "20 Mey 2012", "#", "3", "24"),
new cebesEnNewsIndex("Groove for Dummies", "20 Mey 2012", "#", "4", "21"),
new cebesEnNewsIndex("Welcome to Cebes Enterprise", "18 Mey 2012", "#", '4', '20'),
new cebesEnNewsIndex("New Features of Cebes Framework", "18 Mey 2012", "#", "3", "19"),
new...