Coding – it's been a long time

We've spent a lot of time examining this proposed application and thinking about the techniques we can use to create it in an elegant way. Now, it's time to start building it.

We mentioned that the data layer for this application is very straightforward with lots of boilerplate code and nothing that is unexpected based on the knowledge we've gained in previous chapters. Let's jump straight in:

// app/model/BaseModel.js
Ext.define('Postcard.model.BaseModel', {
    extend: 'Ext.data.Model',
    schema: {
        namespace: 'Postcard.model',
        urlPrefix: 'http://localhost:3000',
        proxy: {
            type: 'rest',
            url: '{prefix}/{entityName:uncapitalize}'
        }
    },
});

// app/model/Contact.js
Ext.define('Postcard.model.Contact', {
    extend: 'Postcard.model.BaseModel',
    fields: [
        { name: 'e-mail' }
    ]
});

// app/model/Message.js
Ext.define('Postcard.model.Message', {
    extend: 'Postcard.model.BaseModel',
    fields: [
        { name: 'id' },
        { name: 'people' },
        { name: 'subject' },
        { name: 'body' },
        { name: 'date', type: 'date' },
        { name: 'tag' }
    ]
});

// app/model/Tag.js
Ext.define('Postcard.model.Tag', {
    extend: 'Postcard.model.BaseModel',
    fields: [
        { name: 'name' }
    ]
});

// app/model/Thread.js
Ext.define('Postcard.model.Thread', {
    extend: 'Postcard.model.BaseModel',
    fields: [
        { name: 'id' },
        { name: 'people' },
        { name: 'subject' },
        { name: 'lastMessageOn', type: 'date' },
        { name: 'lastMessageSnippet' }
    ]
});

Four models: Contact, Tag, Message, and Thread, all extend a BaseModel class that contains our data schema. Note that the BaseModel class specifies a rest proxy, so we know what to expect from the load and save behavior on our models. This is completely standard and very familiar from our previous example applications. The stores are correspondingly straightforward:

// app/store/Contacts.js
Ext.define('Postcard.store.Contacts', {
    extend: 'Ext.data.Store',
    model: 'Postcard.model.Contact',
    alias: 'store.contacts',
    autoLoad: true
});

// app/store/Tags.js
Ext.define('Postcard.store.Tags', {
    extend: 'Ext.data.Store',
    model: 'Postcard.model.Tag',
    alias: 'store.tags',
    autoLoad: true
});

// app/store/Messages.js
Ext.define('Postcard.store.Messages', {
    extend: 'Ext.data.Store',
    model: 'Postcard.model.Message',
    alias: 'store.messages'
});

// app/store/Threads.js
Ext.define('Postcard.store.Threads', {
    extend: 'Ext.data.Store',
    autoLoad: true,
    model: 'Postcard.model.Thread',
    alias: 'store.threads'
});

There is one store for each model class; everything apart from messages will load automatically because we need them across the application and they don't require any parameters to be passed to them.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset