var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
    clicksToEdit: 2
});


 var grid = Ext.create('Ext.grid.Panel', {
    title: 'Playlist',
    columnLines: true,
    bbar: [{
        text: 'Remover Vídeo',
        handler: function(){
            if(grid.getSelectionModel().hasSelection()){
                var selectedNode =
                grid.getSelectionModel().getSelection();
                        Ext.Ajax.request({
                            url: 'deletenodeexibidor.php', //?codPlaylist='+document.getElementById('playlist_cod').value+'&index='+ selectedNode[0].data.index,
                            params:{
                                    index : store2.indexOf(selectedNode[0])
                                },

                            success: function(response){
                                    var id = response.responseText;
                                    if(id > 0){
                                     grid.getStore().remove(selectedNode[0]);
                                }
                        }
                    });

                }
            }
    }],
    viewConfig: {
        loadMask:false,
        getRowClass: function(record) {
        return record.get('tocando') === 'true' ? 'greennode' : 'node';
    },
    listeners: {
        drop: function(node, data, dropRec, dropPosition) {
            // Do something here.
        }
    }
    },
    store: store2,
    invalidateScrollerOnRefresh: false,
    columns: [
    {
        header: 'Preview',
        dataIndex: 'preview',
        renderer: function(value){
          return '<img align=center style="width: 64px; height: 36px;" src="' + 'http://img1.wikia.nocookie.net/__cb20130804215834/angrybirdsfanon/images/b/b2/Movie.jpg' + '" />';
        }
    },
    plugins:
     {
        ptype: 'gridviewdragdrop',
        ddGroup: 'myDDGroup',
        dragText: 'Drag and drop to reorganize',

    },
    {
        header: 'Nome',
        dataIndex: 'name'
    }, {
        header: 'Hora de Execução',
        dataIndex: 'horaExec',
         editor: {
            xtype:'textfield',
            allowBlank:false
        },
        width: 120
    }, {
        header: 'Duração',
        dataIndex: 'duracao'
    }, {
        header: 'Tempo Entrada',
        dataIndex: 'tempoVideo',

    }, {
        header: 'Tempo Saida',
        dataIndex: 'tempoSaida'
    }, {
        header: 'Tempo Total',
        dataIndex: 'tempoTotal',
        flex: 1
    }, {
        header: 'Video',
        dataIndex: 'video'
    },{
        header: 'ID',
        dataIndex: 'idvideo',
        hidden: true
    },{
        header: 'tocando',
        dataIndex: 'tocando',
        hidden: true
    },{
        header: 'correndo',
        dataIndex: 'correndoRaw',
        hidden: true
    },
    {
        header: 'total',
        dataIndex: 'totalRaw',
        hidden: true
    }],
        selModel: {
        selType: 'cellmodel'
    },
    frame: true,
    plugins: [cellEditing],
     listeners: {
      edit: function(editor, e) {
            }
      },
    tbar: [
     {
         text: 'Salvar',
         handler: function ()
         {
               for (var i = 0; i <grid.store.data.items.length; i++) {
                 var record = grid.store.data.items [i];
                 if (record.dirty) {// there was a change, it is necessary to record data
                     // Looks at the changes to record.modified
                      window.alert(record);
                 }
             }
         }
     }
     ],
    height: 500,
    width: 850,
    renderTo: 'progress'
});