<?php

include_once("_dirinfo.php");
include_once (PATH_TO_ROOT."init.php");
include_once(PATH_TO_ROOT."config.php");

$idField = "id";

$tableName = $_POST['tableName'];
$questionId = $_POST['questionId'];
$pluginDir = $_POST['pluginDir'];
$projectId = $_POST['projectId'];

$gridName = "settingsGrid_" . $tableName;

$ajax = $pluginDir . "/_forms/_ajax/ajax.settings.php";

//print_r($propertysNameArray);  

?>
var <?php echo $gridName;?> = new Ext.grid.EditorGridPanel({
                height: 200,
                id: '<?php echo $gridName; ?>',
                autoScroll: true,
                align: 'right',
                width: 200,
                clicksToEdit: 2,
                title:'Basic settings',
                border: 0,
                plugins:[
                    new Ext.ux.grid.Search({
                        searchText:'Search',  
                        minChars:3,
                        position:'top',
                        disableIndexes: ['option', 'type', 'value'],
                        paramNames:{
                            fields:'srcfields', 
                            query:'srcquery'
                        },
                        ref: 'searchField'
                    })
            ],
            tbar:[{
               iconCls:'icon-help-tab',
               handler: function()
               {
                    CallScript('webhelp/_forms/forms.helpGrid.php',{
                        id:  "206_1410337056_1",
                        tabTitle: "Slider plugin",
                        table: "_HelpMenu",
                    });                
               }
            }, '->'
            ],
          
                listeners: {
                    afteredit: function(e)
                    {
                        var jsonData = Ext.encode(Ext.pluck(<?php echo $gridName; ?>.getStore().data.items, 'data'));
                        CallScript('<?php echo $ajax; ?>', {
                            action: 'Save',
                            data: jsonData,
                            projectId: <?php echo $projectId; ?>,
                            questionId: <?php echo $questionId; ?>
                        }, function(){
                            e.record.commit();
                        });
                    },
                    beforeedit: function(e)
                    {
                        if(e.record.data.type == 'bool')
                        {
                            <?php echo $gridName; ?>.getColumnModel().getColumnAt(1).setEditor(new Ext.form.ComboBox({
                               allowBlank     : false,
                               store: [
                                    ['1','true'],
                                    ['0','false']
                                ],
                                renderer : function(a) {
                                    if (a == 1) return 'true';
                                    else if (a == 0) return 'false';
                                },
                               typeAhead    : true,
                                mode        : 'local',
                                triggerAction    : 'all',
                                emptyText    :'-- Select scale type--',
                                selectOnFocus    :true
                           }));
                        }
                        else if(e.record.data.option == 'valign')
                        {
                            <?php echo $gridName; ?>.getColumnModel().getColumnAt(1).setEditor(new Ext.form.ComboBox({
                                fieldLabel    : 'Scale type',
                                name        : 'scale',
                               allowBlank     : false,
                               store: [
                                    ['top','Top'],
                                    ['bottom','Bottom'],
                                    ['middle','Middle']
                                ],
                                renderer : function(a) {
                                    return a.charAt(0).toUpperCase() + a.slice(1);
                                },
                               typeAhead    : true,
                                mode        : 'local',
                                triggerAction    : 'all',
                                emptyText    :'-- Select scale type--',
                                selectOnFocus    :true
                           }));
                        }
                        else if(e.record.data.option == 'halign' ||e.record.data.option == 'itemsAlignHorizontal')
                        {
                            <?php echo $gridName; ?>.getColumnModel().getColumnAt(1).setEditor(new Ext.form.ComboBox({
                                fieldLabel    : 'Scale type',
                                name        : 'scale',
                                allowBlank     : false,
                                store: [
                                    ['left','Left'],
                                    ['center','Center'],
                                    ['right','Right']
                                ],
                                renderer : function(a) {
                                    return a.charAt(0).toUpperCase() + a.slice(1);
                                },
                                typeAhead    : true,
                                mode        : 'local',
                                triggerAction    : 'all',
                                emptyText    :'-- Select scale type--',
                                selectOnFocus    :true
                           })); 
                        }/*else if(e.record.data.option == 'bgColor')
                        {
                            <?php echo $gridName; ?>.getColumnModel().getColumnAt(1).setEditor(new Ext.ux.ColorField({
                                allowBlank: false,
                                fallback: true
                                }));
                        }*/
                        else
                        {
                             <?php echo $gridName; ?>.getColumnModel().getColumnAt(1).setEditor(new Ext.form.TextField({
                                   allowBlank     : true
                           }));
                        }
                    },
                },
                loadData: function() 
                {
                  <?php echo $gridName; ?>.getStore().reload();
                },
                /*saveData: function()
                {
                    var source = <?php echo $gridName; ?>.getSource();
                    
                    var jsonData = Ext.encode(source);
                    
                    CallScript('<?php echo $ajax; ?>', {
                        action: 'Save',
                        data: jsonData,
                        projectId: <?php echo $projectId; ?>,
                        questionId: <?php echo $questionId; ?>
                    }) 
                },*/
                store: new Ext.data.GroupingStore({
                        url : '<?php echo $ajax; ?>',
                  //      root : 'rows',
                  //      remoteSort: true,
                        autoLoad: true,
                        sortInfo:{field: 'group', direction: "ASC"},
                        groupField:'group',
                        baseParams: {
                            action: 'get',
                            projectId: '<?php echo $projectId; ?>',
                            questionId: '<?php echo $questionId; ?>'
                    
                        },
                        reader: new Ext.data.JsonReader({
                             root:'rows',
                             totalProperty : "results"
                       },   new Ext.data.Record.create([
                                 { name:"label", type: 'string'},
                                 { name:"option", type: 'string'},
                                 { name:"value", type: 'string'},
                                 { name:"group", type: 'string'},
                                 { name:"type", type: 'string'}
                        ]))
                }),
                view: new Ext.grid.GroupingView({
                    forceFit: true,
                    // custom grouping text template to display the number of items per group
                    groupTextTpl: '{group}'
                }),
               cm: new Ext.grid.ColumnModel({
                    columns: [{
                        header: 'Name',
                        dataIndex: 'label',
                        width: 200
                        
                    },{
                        header: 'Value',
                        dataIndex: 'value',
                        width: 175,
                        flex: 1,
                        editor:{
                            blank: false
                        },
                        renderer: function(value, metaData, record, rowIndex, colIndex, store) {
                            if(record.data.option == 'halign' 
                                || record.data.option == 'valign')
                            {
                                return value.charAt(0).toUpperCase() + value.slice(1)    
                            }
                            else if(record.data.type == "bool")
                            {
                                if(value == 1) return "true";
                                else if(value == 0) return "false";     
                            }
                            
                            return value;
                        }
                    },
                    {
                        header: 'Group',
                        dataIndex: 'group',
                        hidden: true,
                        width: 175,
                        menuDisabled: true,
                        flex: 1,
                    },
                     {
                        header: 'Option',
                        dataIndex: 'option',
                        hidden: true,
                        menuDisabled: true,
                        width: 175,
                        flex: 1
                    },
                     {
                        header: 'Type',
                        dataIndex: 'type',
                        hidden: true,
                        menuDisabled: true,
                        width: 175,
                        flex: 1
                    }
                    ]}
                ),
                    sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
                    frame: true,
                });

Ext.getCmp('pluginSettings_<?php echo $tableName; ?>').insert(0, <?php echo $gridName; ?>);
Ext.getCmp('pluginSettings_<?php echo $tableName; ?>').setActiveTab(<?php echo $gridName; ?>);
