var menuGroupName = '',
	listofusers = [],
	listofusers2 = [];

var myBuildUrl = function(datatable,record) {
    var url = '';
    var cols = datatable.getColumnSet().keys;
    for (var i = 0; i < cols.length; i++) {
        if (cols[i].isPrimaryKey) {
            url += '&' + cols[i].key + '=' + escape(record.getData(cols[i].key));
        }
    }
    return url;
};


var myLangEditor = new YAHOO.widget.DropdownCellEditor();

var requestLangs = YAHOO.util.Connect.asyncRequest('POST','<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php',
		{
			success:
			function(o){
				var r = YAHOO.lang.JSON.parse(o.responseText);
				myLangEditor.dropdownOptions = r.data;
				myLangEditor.asyncSubmitter = function (callback, newValue) {
					var record = this.getRecord(),
						column = this.getColumn(),
						oldValue = this.value,
						datatable = this.getDataTable();
					YAHOO.util.Connect.asyncRequest(
						'POST',
						'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
						{
							success:function(o) {
								var r = YAHOO.lang.JSON.parse(o.responseText);
								if (r.replyCode == 201) {
									callback(true, r.data);
								} else {
									alert(r.replyText);
									callback();
								}
							},
							failure:function(o) {
								alert(o.statusText);
								callback();
							},
							scope:this
						},
						'action=groupCellEdit&column=' + column.key + '&newValue=' + 
							escape(newValue) + '&oldValue=' + escape(oldValue) + 
							myBuildUrl(datatable,record)
					);                                             
				};
				myLangEditor.render();
			}
		},
		'action=getLangs'
);


var GroupUsergroupsEditor = new YAHOO.widget.DropdownCellEditor();

var requestGroupUsergroups = YAHOO.util.Connect.asyncRequest('POST','<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php',
		{
			success:
			function(o){
				var r = YAHOO.lang.JSON.parse(o.responseText);
				listofusers = r.data;
				listofusers.unshift({label:'Everybody',value:0});
				GroupUsergroupsEditor.dropdownOptions = listofusers;
				GroupUsergroupsEditor.asyncSubmitter = function (callback, newValue) {
					var record = this.getRecord(),
						column = this.getColumn(),
						oldValue = this.value,
						datatable = this.getDataTable();
					YAHOO.util.Connect.asyncRequest(
						'POST',
						'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
						{
							success:function(o) {
								var r = YAHOO.lang.JSON.parse(o.responseText);
								if (r.replyCode == 201) {
									callback(true, r.data);
								} else {
									alert(r.replyText);
									callback();
								}
							},
							failure:function(o) {
								alert(o.statusText);
								callback();
							},
							scope:this
						},
						'action=groupCellEdit&column=' + column.key + '&newValue=' + 
							escape(newValue) + '&oldValue=' + escape(oldValue) + 
							myBuildUrl(datatable,record)
					);                                             
				};
				GroupUsergroupsEditor.render();
			}
		},
		'action=getUsergroups'
);


var MenuUsergroupsEditor = new YAHOO.widget.DropdownCellEditor();

var requestMenuUsergroups = YAHOO.util.Connect.asyncRequest('POST','<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php',
		{
			success:
			function(o){
				var r = YAHOO.lang.JSON.parse(o.responseText);
				listofusers2 = r.data;
				listofusers2.unshift({label:'Everybody',value:0});
				MenuUsergroupsEditor.dropdownOptions = listofusers2;
				MenuUsergroupsEditor.asyncSubmitter = function (callback, newValue) {
					var record = this.getRecord(),
						column = this.getColumn(),
						oldValue = this.value,
						datatable = this.getDataTable();
					YAHOO.util.Connect.asyncRequest(
						'POST',
						'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
						{
							success:function(o) {
								var r = YAHOO.lang.JSON.parse(o.responseText);
								if (r.replyCode == 201) {
									callback(true, r.data);
								} else {
									alert(r.replyText);
									callback();
								}
							},
							failure:function(o) {
								alert(o.statusText);
								callback();
							},
							scope:this
						},
						'action=menuCellEdit&column=' + column.key + '&newValue=' + 
							escape(newValue) + '&oldValue=' + escape(oldValue) + 
							myBuildUrl(datatable,record)
					);                                             
				};
				MenuUsergroupsEditor.render();
			}
		},
		'action=getUsergroups'
);

/////////////////////////////////////////////////////////////////////////////////////////////////////




YAHOO.namespace("example.container");




var formatPublished = function(elCell, oRecord, col , data){
	var cellContent;
	cellContent = '<a href="javascript:void(0);" style="color:#009900; text-decoration:underline;">Yes</a>';
	if (oRecord.getData('published') < 1) { 
	       cellContent = '<a href="javascript:void(0);" style="color:#990000; text-decoration:underline;">No</a>';
	    } 
	    elCell.innerHTML = cellContent; 
};




var formatOrientation = function(elCell, oRecord, col, data){
	var cellContent;
	if (oRecord.getData('orientation') =='V') { 
	       cellContent = '<a href="javascript:void(0);" style="color:#06C; text-decoration:underline;">Vertical</a>';
	    } 
	if (oRecord.getData('orientation') =='H') { 
	       cellContent = '<a href="javascript:void(0);" style="color:#06C; text-decoration:underline;">Horizontal</a>';
	    } 
	    elCell.innerHTML = cellContent; 
};

function changeMenuRank(pos,id,direction){
	//alert('pos: ' + pos +' id:' + id + ' up: '+direction);
	YAHOO.util.Connect.asyncRequest(
		'POST',
		'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
		{
			success:function(o) {
				var r = YAHOO.lang.JSON.parse(o.responseText);
				var data = r.data;
				if (r.replyCode == 201) {
					//alert('CALLBACK\nsource: datatable.php\ngroupid: ' +data[0] + '\nid:' + data[1] + '\ncurrank: ' + data[2] + '\nnewrank: ' + data[3] );
					loadMenuTable(data[0]);
					
					var handlehide = function(){
						YAHOO.example.container.simpledialog1.hide();
						
					};
					
					YAHOO.example.container.simpledialog1 =  
						new YAHOO.widget.SimpleDialog("simpledialog1",  
								 { width: "300px", 
								   fixedcenter: true, 
								   visible: false, 
								   draggable: false, 
								   close: true, 
								   text: "Table reordered", 
								   icon: YAHOO.widget.SimpleDialog.ICON_INFO, 
								   constraintoviewport: true, 
								   buttons: [ { text:"OK",  handler:handlehide } ] 
								 } );
					
					YAHOO.example.container.simpledialog1.setHeader("Table reordering");
					YAHOO.example.container.simpledialog1.render("container");
					YAHOO.example.container.simpledialog1.show();
					//alert(r.data);
					
				} else {
					alert(r.replyText);
				}
			},
			failure:function(o) {
				alert(o.statusText);
			},
			scope:this
		},
		'action=menuRank&newpos=' + pos + '&id=' + id + '&goingup=' + direction
	);
}



//////////////////////////////////////////////////////////////////////////////
//
// BUTTONS
//
//////////////////////////////////////////////////////////////////////////////


function loadMenuTable(groupid){
//YAHOO.util.Event.addListener(window, "load", function() {
    YAHOO.example.ReorderRows = function() {

		var groupname='';
		
		var Dom = YAHOO.util.Dom,
            Event = YAHOO.util.Event,
            DDM = YAHOO.util.DragDropMgr,
			
			myColumnDefs = [
				{key:'id', isPrimaryKey:true, hidden:true},
				{key:'delete', label:'', className:'delete-button'},
				{key:"rank", className:'centered', label:''},
				{
					key:'groupid', className:'centered',formatter: function (cell, rec, col, data) {
						cell.innerHTML = data;
					}
				},
                {key:"caption", className:'fat', label:"Caption", editor: new YAHOO.widget.TextboxCellEditor()},
				{key:'usergroupid', label:'Usergroup', className:'centered',editor:MenuUsergroupsEditor},
                {key:"link", className:'clink', label:"Link"},
				{key:"alt", className:'calt', label:"Alt", editor: new YAHOO.widget.TextboxCellEditor()},
				{
					key:"published",
					className:'centeredpub',
					formatter:formatPublished,
					label:"Published",
					editor: new YAHOO.widget.RadioCellEditor({
						radioOptions:[{label:"Yes", value:1}, {label:"No", value:0}],
						asyncSubmitter: function (callback, newValue) {
							var record = this.getRecord(),
								column = this.getColumn(),
								oldValue = this.value,
								datatable = this.getDataTable();
							YAHOO.util.Connect.asyncRequest(
								'POST',
								'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
								{
									success:function(o) {
										var r = YAHOO.lang.JSON.parse(o.responseText);
										if (r.replyCode == 201) {
											callback(true, r.data);
										} else {
											alert(r.replyText);
											callback();
										}
									},
									failure:function(o) {
										alert(o.statusText);
										callback();
									},
									scope:this
								},
								'action=menuCellEdit&column=' + column.key + '&newValue=' + 
									escape(newValue) + '&oldValue=' + escape(oldValue) + 
									myBuildUrl(datatable,record)
							);                                             
				}})}
		   ];

		var myDataSource = new YAHOO.util.XHRDataSource(
				"<?php echo ROOT_URL.DS; ?>system/lib/menus/getmenubuttons.php?groupid="+groupid,
				{responseSchema: {resultNode: "button" ,fields: ["id","groupid","usergroupid",{key:"rank",parser:'number'},"caption","link","alt","published"]}}
			);
			
		var myDataTable = new YAHOO.widget.DataTable("datatable2", myColumnDefs, myDataSource, {caption: 'Menu buttons'+menuGroupName}); //
        var myDTDrags = {};
		
		

        //////////////////////////////////////////////////////////////////////////////
        // Custom drag and drop class
        //////////////////////////////////////////////////////////////////////////////
        YAHOO.example.DDRows = function(id, sGroup, config) {
            YAHOO.example.DDRows.superclass.constructor.call(this, id, sGroup, config);
            Dom.addClass(this.getDragEl(),"custom-class");
            this.goingUp = false;
            this.lastY = 0;
        };

        //////////////////////////////////////////////////////////////////////////////
        // DDRows extends DDProxy
        //////////////////////////////////////////////////////////////////////////////
        YAHOO.extend(YAHOO.example.DDRows, YAHOO.util.DDProxy, {
            proxyEl: null,
            srcEl:null,
            srcData:null,
            srcIndex: null,
            tmpIndex:null,

            startDrag: function(x, y) {
                var    proxyEl = this.proxyEl = this.getDragEl(),
                    srcEl = this.srcEl = this.getEl();

                this.srcData = myDataTable.getRecord(this.srcEl).getData();
                this.srcIndex = srcEl.sectionRowIndex;
                // Make the proxy look like the source element
                Dom.setStyle(srcEl, "visibility", "hidden");
                proxyEl.innerHTML = "<table><tbody>"+srcEl.innerHTML+"</tbody></table>";
            },

            endDrag: function(x,y) {
                var position,
                    srcEl = this.srcEl;

                Dom.setStyle(this.proxyEl, "visibility", "hidden");
                Dom.setStyle(srcEl, "visibility", "");
				
				// ***********************************************************
				//
				// Function that does the ordering of the menu buttons table
				//
				// ***********************************************************
				var direction = this.goingUp;
				var id = myDataTable.getRecord(this.tmpIndex).getData('id');
				var pos = this.tmpIndex;
				var funcChange = changeMenuRank(pos,id,direction);
				
		   },

             onDrag: function(e) {
                // Keep track of the direction of the drag for use during onDragOver
                var y = Event.getPageY(e);

                if (y < this.lastY) {
                    this.goingUp = true;
                } else if (y > this.lastY) {
                    this.goingUp = false;
                }

                this.lastY = y;
           },

            onDragOver: function(e, id) {
                // Reorder rows as user drags
                var srcIndex = this.srcIndex,
                    destEl = Dom.get(id),
                    destIndex = destEl.sectionRowIndex,
                    tmpIndex = this.tmpIndex;

                if (destEl.nodeName.toLowerCase() === "tr") {
                    if(tmpIndex !== null) {
                        myDataTable.deleteRow(tmpIndex);
                    }
                    else {
                        myDataTable.deleteRow(this.srcIndex);
                    }

                    myDataTable.addRow(this.srcData, destIndex);
                    this.tmpIndex = destIndex;

                    DDM.refreshCache();
                }
            }
        });

        //////////////////////////////////////////////////////////////////////////////
        // Create DDRows instances when DataTable is initialized
        //////////////////////////////////////////////////////////////////////////////
        myDataTable.subscribe("initEvent", function() {
            var i, id,
                allRows = this.getTbodyEl().rows;

            for(i=0; i<allRows.length; i++) {
                id = allRows[i].id;
                // Clean up any existing Drag instances
                if (myDTDrags[id]) {
                     myDTDrags[id].unreg();
                     delete myDTDrags[id];
                }
                // Create a Drag instance for each row
                myDTDrags[id] = new YAHOO.example.DDRows(id);
            }
        });

        //////////////////////////////////////////////////////////////////////////////
        // Create DDRows instances when new row is added
        //////////////////////////////////////////////////////////////////////////////
        myDataTable.subscribe("rowAddEvent",function(e){
            var id = e.record.getId();
            myDTDrags[id] = new YAHOO.example.DDRows(id);
        });
		
		myDataTable.subscribe("cellClickEvent", myDataTable.onEventShowCellEditor);
		
		var oButtonMenu = new YAHOO.widget.Button( 
				"addButton",  // Source element id 
				{  
					checked: false, // Attribute override  
					label: "Add Button" 
				} 
			);
		
    }();
//});
}



//////////////////////////////////////////////////////////////////////////////
//
// GROUPS
//
//////////////////////////////////////////////////////////////////////////////



YAHOO.util.Event.addListener(window, "load", function() {
    YAHOO.example.ReorderRows = function() {
		

		var Dom = YAHOO.util.Dom,
            Event = YAHOO.util.Event,
            DDM = YAHOO.util.DragDropMgr,
			
			myColumnDefs = [
				{
					key: 'id', label:'', isPrimaryKey:true, className:'view-buttons', 
					formatter: function (cell, rec, col, data) {
						cell.innerHTML = '<a href="javascript:void(0);" onClick="javascript:loadMenuTable('+data+');"><img src="<?php echo ROOT_URL.DS; ?>system/gfx/menubtn.png" border="0" /></a>';
					}
				},
				{key:"rank", label:'', className:'centered'},
				{key:"name", label:"Groupname", className:'fat'},
				{key:'grouptitle', label:'Grouptitle', editor: new YAHOO.widget.TextboxCellEditor({
					asyncSubmitter: function (callback, newValue) {
						var record = this.getRecord(),
							column = this.getColumn(),
							oldValue = this.value,
							datatable = this.getDataTable();
						YAHOO.util.Connect.asyncRequest(
							'POST',
							'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
							{
								success:function(o) {
									var r = YAHOO.lang.JSON.parse(o.responseText);
									if (r.replyCode == 201) {
										callback(true, r.data);
									} else {
										alert(r.replyText);
										callback();
									}
								},
								failure:function(o) {
									alert(o.statusText);
									callback();
								},
								scope:this
							},
							'action=groupCellEdit&column=' + column.key + '&newValue=' + 
								escape(newValue) + '&oldValue=' + escape(oldValue) + 
								myBuildUrl(datatable,record)
						);                                             
					}
				})},
				{key:"lang", label:'Language', className:'centered', editor: myLangEditor},
				{
					key:"orientation", label:'Orientation',
					className:'centered',
					formatter:formatOrientation,
					editor: new YAHOO.widget.RadioCellEditor({
						radioOptions:[{label:"Horizontal", value:'H'}, {label:"Vertical", value:'V'}],
						asyncSubmitter: function (callback, newValue) {
							var record = this.getRecord(),
								column = this.getColumn(),
								oldValue = this.value,
								datatable = this.getDataTable();
							YAHOO.util.Connect.asyncRequest(
								'POST',
								'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
								{
									success:function(o) {
										var r = YAHOO.lang.JSON.parse(o.responseText);
										if (r.replyCode == 201) {
											callback(true, r.data);
										} else {
											alert(r.replyText);
											callback();
										}
									},
									failure:function(o) {
										alert(o.statusText);
										callback();
									},
									scope:this
								},
								'action=groupCellEdit&column=' + column.key + '&newValue=' + 
									escape(newValue) + '&oldValue=' + escape(oldValue) + 
									myBuildUrl(datatable,record)
							);                                             
						}})
				},
				{key:"space", label:'Space', className:'centered'},
				{
					key:'usergroupid', label:'Usergroup',
					/*formatter: function(cell, rec, col, data){
						var posnum = rec.getData('usergroupid');
						cell.innerHTML = listofusers[posnum].label;
					},*/
					editor:GroupUsergroupsEditor, className:'centered'
				},
				{
					key:"published",
					className:'centeredpub',
					formatter:formatPublished,
					label:"Published",
					editor: new YAHOO.widget.RadioCellEditor({
						radioOptions:[{label:"Yes", value:1}, {label:"No", value:0}],
						asyncSubmitter: function (callback, newValue) {
							var record = this.getRecord(),
								column = this.getColumn(),
								oldValue = this.value,
								datatable = this.getDataTable();
							YAHOO.util.Connect.asyncRequest(
								'POST',
								'<?php echo ROOT_URL.DS; ?>system/lib/menus/datatable.php', 
								{
									success:function(o) {
										var r = YAHOO.lang.JSON.parse(o.responseText);
										if (r.replyCode == 201) {
											callback(true, r.data);
										} else {
											alert(r.replyText);
											callback();
										}
									},
									failure:function(o) {
										alert(o.statusText);
										callback();
									},
									scope:this
								},
								'action=groupCellEdit&column=' + column.key + '&newValue=' + 
									escape(newValue) + '&oldValue=' + escape(oldValue) + 
									myBuildUrl(datatable,record)
							);                                             
						}
					})}
			];

		var myDataSource = new YAHOO.util.XHRDataSource(
				"<?php echo ROOT_URL.DS; ?>system/lib/menus/getmenugroups.php",
				{responseSchema: {resultNode: "group" ,fields: ["id","usergroup","usergroupid","name","grouptitle",{key:"rank",parser:'number'},"lang","orientation","published"]}}
			);
			
		var myDataTable = new YAHOO.widget.DataTable("datatable", myColumnDefs, myDataSource, {caption: 'Menu groups'});
        var myDTDrags = {};

        //////////////////////////////////////////////////////////////////////////////
        // Custom drag and drop class
        //////////////////////////////////////////////////////////////////////////////
        YAHOO.example.DDRows = function(id, sGroup, config) {
            YAHOO.example.DDRows.superclass.constructor.call(this, id, sGroup, config);
            Dom.addClass(this.getDragEl(),"custom-class");
            this.goingUp = false;
            this.lastY = 0;
        };

        //////////////////////////////////////////////////////////////////////////////
        // DDRows extends DDProxy
        //////////////////////////////////////////////////////////////////////////////
        YAHOO.extend(YAHOO.example.DDRows, YAHOO.util.DDProxy, {
            proxyEl: null,
            srcEl:null,
            srcData:null,
            srcIndex: null,
            tmpIndex:null,

            startDrag: function(x, y) {
                var    proxyEl = this.proxyEl = this.getDragEl(),
                    srcEl = this.srcEl = this.getEl();

                this.srcData = myDataTable.getRecord(this.srcEl).getData();
                this.srcIndex = srcEl.sectionRowIndex;
                // Make the proxy look like the source element
                Dom.setStyle(srcEl, "visibility", "hidden");
                proxyEl.innerHTML = "<table><tbody>"+srcEl.innerHTML+"</tbody></table>";
            },

            endDrag: function(x,y) {
                var position,
                    srcEl = this.srcEl;

                Dom.setStyle(this.proxyEl, "visibility", "hidden");
                Dom.setStyle(srcEl, "visibility", "");
            },

             onDrag: function(e) {
                // Keep track of the direction of the drag for use during onDragOver
                var y = Event.getPageY(e);

                if (y < this.lastY) {
                    this.goingUp = true;
                } else if (y > this.lastY) {
                    this.goingUp = false;
                }

                this.lastY = y;
           },

            onDragOver: function(e, id) {
                // Reorder rows as user drags
                var srcIndex = this.srcIndex,
                    destEl = Dom.get(id),
                    destIndex = destEl.sectionRowIndex,
                    tmpIndex = this.tmpIndex;

                if (destEl.nodeName.toLowerCase() === "tr") {
                    if(tmpIndex !== null) {
                        myDataTable.deleteRow(tmpIndex);
                    }
                    else {
                        myDataTable.deleteRow(this.srcIndex);
                    }

                    myDataTable.addRow(this.srcData, destIndex);
                    this.tmpIndex = destIndex;

                    DDM.refreshCache();
                }
            }
        });

        //////////////////////////////////////////////////////////////////////////////
        // Create DDRows instances when DataTable is initialized
        //////////////////////////////////////////////////////////////////////////////
        myDataTable.subscribe("initEvent", function() {
            var i, id,
                allRows = this.getTbodyEl().rows;

            for(i=0; i<allRows.length; i++) {
                id = allRows[i].id;
                // Clean up any existing Drag instances
                if (myDTDrags[id]) {
                     myDTDrags[id].unreg();
                     delete myDTDrags[id];
                }
                // Create a Drag instance for each row
                myDTDrags[id] = new YAHOO.example.DDRows(id);
            }
        });

        //////////////////////////////////////////////////////////////////////////////
        // Create DDRows instances when new row is added
        //////////////////////////////////////////////////////////////////////////////
        myDataTable.subscribe("rowAddEvent",function(e){
            var id = e.record.getId();
            myDTDrags[id] = new YAHOO.example.DDRows(id);
        });
		
		myDataTable.subscribe("cellClickEvent", myDataTable.onEventShowCellEditor);
		
		
		
		var oButtonGroup = new YAHOO.widget.Button( 
				"addGroup",  // Source element id 
				{  
					checked: false, // Attribute override  
					label: "Add Group"
				} 
			);
		
		var onButtonClick = function (e) { 
	 
	        alert("doSomething"); 
	 
	    }; 
	    
	     
	    oButtonGroup.on("click", onButtonClick);
		
		
    }();
});