Ext.ux.PlaylistGridPanel = Ext.extend(Ext.ux.TracksGridPanelBase, {

    // internal fields
    m_playlistId: g_default_xPOPropertyId,

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

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

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


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

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

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

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

    onRowDblClick: function() {  
        if (g_showStreamingMenuItems) {
            var selections = this.getSelectionModel().getSelections();
            var oneOrMoreTracksStreamable = this.isOneOrMoreTracksStreamable(selections);
            var fileHashIdArray = this.createIdArray(g_extJsGrid_dataTypeTrack, selections);

            if (oneOrMoreTracksStreamable) {
                tracksGrid_handlePlayClicked(fileHashIdArray);
            }
        }
    },

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

        var dropTarget = new Ext.ux.PlaylistDropTarget(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 PlaylistDropTarget below for other functions
        });
    },

    // handle the dropping of some records
    handleDrop: function(positionQualifierEnum, targetEntryId, data) {

        // extract the type from the first item
        var type = data.selections[0].data.type;

        // build up array of ids
        var idArray = this.createIdArray(type, data.selections);

        // process items
        if (type == g_extJsGrid_dataTypePlaylistEntry) {
            // reorder in playlist
            ajax_reorderPlaylist(this.getCurrentId(), positionQualifierEnum, targetEntryId, idArray, delegate(this, this.reload));
        }
        else {
            // add to playlist
            var sourceDeviceId = data.selections[0].data.deviceid;
            ajax_addToPlaylist(this.getCurrentId(), sourceDeviceId, type, positionQualifierEnum, targetEntryId, idArray, delegate(this, this.reload));
        }
    },

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

    // create a 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() { playlistGrid_handleRemoveSelectedPlaylistEntriesClicked(); }
        }));

        contextMenu.add(new Ext.menu.Item({
            text: g_resourceStrings['Js_Grid_PopupMenu_SelectAll'],
            handler: function() { grid.getSelectionModel().selectAll(); }
        }));

        return contextMenu;
    }
});

Ext.ux.PlaylistGridView = Ext.extend(Ext.ux.TracksGridViewBase, {

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

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

Ext.ux.PlaylistDropTarget = Ext.extend(Ext.ux.TracksDropTargetBase, {
});