Ext.ux.ClientTrackGridPanel = Ext.extend(Ext.ux.GenericDeviceGridPanel, {

    // standard initializer
    initComponent: function() {
        Ext.ux.ClientTrackGridPanel.superclass.initComponent.apply(this, arguments);

        // args have to go here as base class initComponent doesn't get called for some reason
        var config = {
            view: new Ext.ux.ClientTrackGridView({ scrollOffset: g_gridScrollOffset })
        };

        Ext.apply(this, config);
        Ext.apply(this.initialConfig, config);

        this.on('contextmenu', this.onContextMenu, this);
    },


    // ------ event handler functions ------ //

    // row double-click
    onRowDblClick: function() {
        Ext.ux.ClientTrackGridPanel.superclass.onRowDblClick.call(this);
    },

    // context menu
    onContextMenu: function(e) {
        var rowIndex = this.getRowIndexFromEvent(e);

        this.updateSelections(rowIndex);
        this.contextMenu = this.createActionsContextMenu(this, rowIndex);

        Ext.ux.ClientTrackGridPanel.superclass.onContextMenu.call(this, e);
    },

    // render a play button
    renderPlayButton: function(value, metadata, record, rowIndex, colIndex, store) {
        var columnText = "";

        columnText = Ext.ux.ClientTrackGridPanel.superclass.renderPlayButton.call(this, value, metadata, record, rowIndex, colIndex, store);

        return columnText;
    },


    // ------ context menu creation helper functions ------ //

    // create the context menu
    createActionsContextMenu: function(grid, rowIndex) {
        var contextMenu = this.createEmptyActionsContextMenu();
        var selections = this.getSelectionModel().getSelections();

        contextMenu = this.addStreamingMenuItems(contextMenu, rowIndex);
        contextMenu = this.addSharingMenuItems(contextMenu, rowIndex);

        if (selections.length > 0) {
            contextMenu.add(new Ext.menu.Item({
                text: g_resourceStrings['Js_ClientTracksGrid_PopupMenu_DeleteFromCloud'],
                handler: function() { clientTrackGridPanel_handleDeleteFromCloudClicked(); }
            }));
        }

        // add any generic menu items
        contextMenu = this.addGenericMenuItems(grid, contextMenu, rowIndex);

        return contextMenu;
    }
});

Ext.ux.ClientTrackGridView = Ext.extend(Ext.ux.GenericDeviceGridView, { 
});

Ext.ux.ClientTrackGridDragZone = Ext.extend(Ext.ux.GenericDeviceGridDragZone, {
});


// ------ event handler functions ------ //

// 'Delete from cloud' button / menu item clicked
function clientTrackGridPanel_handleDeleteFromCloudClicked() {
    music_showDeleteSelectedTracksFromCloudModalForm();
}