Ember 1.9.1.beta and pouchDB

by amindunited

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/pouchdb/3.2.0/pouchdb.min.js"></script>
<script src="https://rawgit.com/nolanlawson/relational-pouch/master/dist/pouchdb.relational-pouch.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0/handlebars.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ember.js/1.9.0-beta.4/ember.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ember-data.js/1.0.0-beta.12/ember-data.min.js"></script>
<script src="https://rawgit.com/nolanlawson/ember-pouch/master/dist/globals/main.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    <div class="newUserForm">
        <h3>Create New User</h3>
        {{user-creation createUser="createUser"}}
    </div>
    <hr/>
    <ul>
    {{#each user in content}}
        <li>{{user-list-item  user=user}} {{log user}} |{{user.id}}|<button {{action 'deleteUser' user.id}}>X</button></li>
    {{/each}}
    </ul>
</script>
<script type="text/x-handlebars" data-template-name="components/user-list-item">
    __{{user.userName}}__
</script>
<script type="text/x-handlebars" data-template-name="components/user-creation">
    {{input value=userName placeholder="User Name"}}
    {{input value=firstName placeholder="First Name"}}
    {{input value=lastName placeholder="Last Name"}}
    <button {{action 'save'}} >Save</button>
</script>

JavaScript

App = window.App = Em.Application.create();

var db = new PouchDB('mydb');
App.ApplicationAdapter = EmberPouch.Adapter.extend({
    db: db//new PouchDB('mydb2')
});

App.User = DS.Model.extend({
    firstName: "",
    lastName: "",
    userName: "",
    rev: DS.attr('string')
});
App.ApplicationRoute = Em.Route.extend({
    model: function() {
        return this.store.all('user');
    },
    actions: {
        createUser: function(userData){
            console.log("createUser called", userData);
            var user = this.store.createRecord('user', userData);
            user.save();
        },
        deleteUser: function(id){
            var that = this;
            this.store.find('user', id).then(function(user){
                console.log("going to destroy ", user);
                user.deleteRecord();
                console.log("confirm delete ", user.get('isDeleted'));
                user.save();
                var alls = that.store.all('user');
                console.log("alls ", alls);
                alls.get('content').forEach(function(obj, index, arr){
                    console.log("in each ", index , obj);
                    console.log(obj.get('isDeleted'));
                    
                });
                //user.destroyRecord();
            });
        }
    }
})
App.ApplicationView = Em.View.extend();

App.UserCreationComponent = Em.Component.extend({
    actions : {
        save: function () {
            console.log("store", App);
            this.sendAction('createUser', {
                firstName: this.get('firstName'),
                lastName: this.get('lastName'),
                userName: this.get('userName')
            })
        }
    },
    firstName: "",
    lastName: "",
    userName: ""
});