TD Tasks

by el_chief

HTML

<link rel="stylesheet" href="//extjs.cachefly.net/ext-4.1.0-gpl/resources/css/ext-all-gray-debug.css">
<script src="//extjs.cachefly.net/ext-4.1.0-gpl/ext-all-dev.js"></script>
<!-- got some weird 4.1.1 issues re dom -->

JavaScript

/* this is a function to simulate ajax requests in jsfiddle */

function sim(proxy, data, delay) {
    if (typeof data !== 'string') {
        data = Ext.JSON.encode(data);
    }

    proxy.url = '/echo/json/';
    proxy.actionMethods.read = "POST";
    proxy.extraParams.json = data;
    proxy.extraParams.delay = typeof delay == 'undefined' ? 0 : delay;
}

Ext.QuickTips.init();

Ext.define('Tasks', {
    extend: 'Ext.data.Store',
    fields: [
        'subject',
            'start',
            'reminderTime',
            'due',
            'folder',
            'categories',
            'hasReminder',
            'flag'

        ],
    groupField: 'flag',
    data: [
        {
        subject: 'test',
        start: '2012-01-01',
        reminderTime: '2012-01-01 12:12:12',
        due: '2012-12-12',
        folder: 'Tasks',
        categories: '|||',
        hasReminder: true,
        flag: 'Today'},
    {
        subject: 'test',
        start: '2012-01-30',
        reminderTime: '2012-01-01 12:12:12',
        due: '2012-12-12',
        folder: 'Tasks',
        categories: '||',
        hasReminder: true,
        flag: 'Tomorrow'}
    ]
});

Ext.define('HeaderMenu', {
    extend: 'Ext.menu.Menu',

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                xtype: 'menuitem',
                text: 'Categories'},
            {
                xtype: 'menuitem',
                text: 'Start Date'},
            {
                xtype: 'menuitem',
                text: 'Show In Groups'}
            ]
        });

        me.callParent(arguments);
    }
});

Ext.define('ItemContextMenu', {
    extend: 'Ext.menu.Menu',

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                xtype: 'menuitem',
                text: 'Copy'},
            {
                xtype: 'menuitem',
                text: 'Quick Print'},
 ...