JSFiddle - React, Tailwind, and code Playground

by rodneyjoyce

HTML

<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.mobile.all.min.css">

        <script src="viewmodels/games.js"></script>

        <div data-role="layout" data-id="tabstrip-layout">
            <div data-role="header">
                <div data-role="navbar">
                    <span data-role="view-title"></span>
                </div>
            </div>

            <div data-role="footer">
                <div data-role="tabstrip">
                    <a href="#games" data-icon="search">Games</a>
                </div>
            </div>
        </div>

        <div id="games"
             data-role="view"
             data-title="Games"
             data-model="app.gamesService.viewModel">

            <ul class="games-list"                
                 data-bind="source: gamesDataSource">
            </ul>

        </div>

        <script type="text/x-kendo-template" id="template">
            <div class="product">
                <h3>#:ProductName#</h3>
                <p>#:kendo.toString(UnitPrice, "c")#</p>
            </div>
        </script>

JavaScript

(function (global) {
    var GamesViewModel, app = global.app = global.app || {};

    GamesViewModel = kendo.data.ObservableObject.extend({
                                                            gamesDataSource: new kendo.data.DataSource({
                                                                                                           transport: {
                                                                    read: {
                                                                                                                   url: "http://demos.telerik.com/kendo-ui/service/Products",
                                                                                                                   dataType: "jsonp"
                                                                                                               }
                                                                }
                                                                                                       })
                                                            
                                                        });
    app.gamesService = {
        viewModel: new GamesViewModel()
    };
})(window);