Ext.ux.PlaylistEntryGridPanel = Ext.extend(Ext.ux.TrackGridPanel, {

    // internal fields
    m_playlistId: g_default_xPOPropertyId,

    // standard initializer
    initComponent: function() {
        Ext.ux.PlaylistEntryGridPanel.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.PlaylistEntryGridView({ scrollOffset: g_gridScrollOffset })
        };

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

        this.on('rowcontextmenu', this.onRowContextMenu, this);
    },


    setCurrentId: function(playlistId) {
        this.m_playlistId = playlistId;
    },

    getCurrentId: function() {
        return this.m_playlistId;
    },


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

    // row context menu
    onRowContextMenu: function(grid, rowIndex, e) {
        this.contextMenu = this.createActionsContextMenu(grid, rowIndex);

        Ext.ux.PlaylistEntryGridPanel.superclass.onRowContextMenu.call(this, grid, rowIndex, e);
    },


    // configure drop target
    configureDragDrop: function(ddGroup) {
        var dropTargetEl = this.body;
        var grid = this;

        var dropTarget = new Ext.ux.PlaylistEntryDropTarget(dropTargetEl, {
            ddGroup: ddGroup,
            grid: grid,

            // called when data is dropped
            notifyDrop: function(ddSource, e, data) {
                var positionInfo = this.getPositionInfo(e);
                grid.handleDrop(positionInfo.positionQualifierEnum, positionInfo.targetElementId, data);

                // don't call base class
            }

            // see PlaylistEntryDropTarget below for other functions
        });
    },

    // handle the dropping of some records
    handleDrop: function(positionQualifierEnum, targetEntryId, data) {
        var type            = data.selections[0].data.type;
        var sourceDeviceId  = data.selections[0].data.deviceid;

        if (type == g_extJsGrid_dataTypePlaylistEntry) {
            this.handleReorderPlaylist(positionQualifierEnum, targetEntryId, data);
        }
        else {
            this.handleAddToPlaylist(positionQualifierEnum, targetEntryId, data);
        }
    },

    // reorder in playlist
    handleReorderPlaylist: function(positionQualifierEnum, targetEntryId, data) {
        var idArray = idHelper_createIdArray(data.selections);

        ajax_reorderPlaylist(this.getCurrentId(), positionQualifierEnum, targetEntryId, idArray, delegate(this, this.reload));
    },

    // add to playlist
    handleAddToPlaylist: function(positionQualifierEnum, targetEntryId, data) {
        var type            = data.selections[0].data.type;
        var sourceDeviceId  = data.selections[0].data.deviceid;
        var idArray         = [];
        
        // create idarray of correct type
        if ((type === g_extJsGrid_dataTypeClientFile) || (type === g_extJsGrid_dataTypeClientDeviceFile)) {
            idArray = trackHelper_createTrackIdArray(data.selections);
            type = g_extJsGrid_dataTypeTrack;
        }
        else { // type == g_extJsGrid_dataTypeTrack
            idArray = idHelper_createIdArray(data.selections);
        }

        ajax_addToPlaylist(this.getCurrentId(), sourceDeviceId, positionQualifierEnum, targetEntryId, type, idArray, delegate(this, this.reload));
    },


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

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

        contextMenu = this.addStreamingMenuItems(contextMenu, rowIndex);

        contextMenu.add(new Ext.menu.Item({
            text: g_resourceStrings['Js_PlaylistGrid_PopupMenu_RemoveFromPlaylist'],
            handler: function() { playlistGridPanel_handleRemoveSelectedPlaylistEntriesClicked(); }
        }));

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

        return contextMenu;
    }
});

Ext.ux.PlaylistEntryGridView = Ext.extend(Ext.ux.TrackGridView, {

    afterRender: function() {
        Ext.ux.PlaylistEntryGridView.superclass.afterRender.call(this, arguments);
        this.dragZone = new Ext.ux.PlaylistEntryGridDragZone(this.grid, { ddGroup: "" });
    }
});

// configure drag & drop
Ext.ux.PlaylistEntryGridDragZone = Ext.extend(Ext.ux.TrackGridDragZone, {
});

Ext.ux.PlaylistEntryDropTarget = Ext.extend(Ext.ux.TrackDropTarget, {
});


// ------ context menu handler functions ------ //

function playlistGridPanel_handleRemoveSelectedPlaylistEntriesClicked() {
    showRemoveSelectedPlaylistEntriesModalForm();
}