Breeze KO basic

A super basic fiddle that talks to todo.breezejs.com. Basis for later fiddle experiments.

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js"></script>
<script src="http://sampleservice.breezejs.com/scripts/q.min.js"></script>
<script src="http://sampleservice.breezejs.com/scripts/breeze.min.js"></script>
<script src="http://sampleservice.breezejs.com/scripts/fiddleHelpers.js"></script>
<div id="view">
    <h2>Todos </h2>
    <ul data-bind="foreach: items">
        <li>
            <input type="checkbox" data-bind="checked: IsDone" />
            <label data-bind="text: Description, css: { done: IsDone, archived: IsArchived }"></label>
         </li>
    </ul>
     <div data-bind="visible: errorMessage().length"> 
        <label class="error" data-bind="text: errorMessage"></label>
    </div>  

    <h2>Log:</h2>
    <ol id="log" type="1"></ol>
    <button data-bind="click: reset">Reset Db</button> 
    <p>
        <a href="http://todo.breezejs.com" target="_blank">Todos Sample</a>&nbsp;
        <a href="http://www.breezejs.com" target="_blank">Breeze Home</a>
    </p>
</div>

CSS

body {
    margin-left: 1em;
    margin-top: 1em;
    font-family: arial;
}
h2 {
    margin-top: 1em;
    margin-bottom: 8px;
    font-weight: bold;
    font-size: 1.2em;
}
button, p {
    margin-top: 1em;
}

.done {
      /*Hack for IE9 repaint bug*/
    padding: 1px;
    text-decoration: line-through;
}
.archived {
    color: tan;
}

.error {
    color: red;
}

ul {
    margin-left: 1em;
}
ol {
    margin-left: 2em;
    list-style-type: decimal;
}

JavaScript

// ViewModel
var viewModel =  {
    items: ko.observableArray(),
    errorMessage: ko.observable(""),
    reset: reset
};

// Datacontext
var serviceName = "https://jsonplaceholder.typicode.com/todos";
var manager = new breeze.EntityManager(serviceName);

fiddleHelpers.isCorsCapable();
getAllTodos();

ko.applyBindings(viewModel, document.getElementById('view'));

/***  supporting functions ***/
function getAllTodos() {
    var query = breeze.EntityQuery.from("Todos");    
    log("Getting Todos");
    return manager.executeQuery(query)
    .then(succeeded).fail(failed);
}

function succeeded(data) {
    var count = data.results.length;
    log("Retrieved " + count);
    if (!count) {
        log("No Todos"); return;
    }
    viewModel.items(data.results);
}

function failed(error) {viewModel.errorMessage(error);}

function reset() {
    viewModel.items([]);
    manager.clear();        
    $.post(serviceName + '/reset', afterReset);

    function afterReset() {
        log("Database reset");
        getAllTodos();
    }
}
function log(text) {
    console.log(text);
    document.getElementById('log').innerHTML += '<li>' + text + '</li>';
}