/*
    Copyright (C) 2008  Ivo Toby, Internet Voor Ondernemers, http://www.i-v-o.nl / http://syntacticsugar.nl 

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program.  If not, see <http://www.gnu.org/licenses/>.

	Crudder Version : 0.50b
 */


	crudderField.m2mlinked = Class.create(crudderField, {
		initialize:function($super, field, data, pob){
			$super(field, data,pob);
			this.instID = 'crudderField_m2mlinked.' + parseInt(Math.random()*1000000);
			this.shouldStore = false;
		},
		
		drawEditor : function(container,record){
			if (!record[this.pKey]){
				container.update(this.controller.lang.get('multiSelectNotOnAddMessage'));
				return;
			} 
			this.controller.waiter();
			this.container = container;
			this.record = record;

			var RPCObj = new crudderRPC(this.controller.config, this.controller.rpcPath);
//			RPCObj.debug = true;

			RPCObj.createCall();
			RPCObj.setCallback(this._drawEditor.bind(this));
			RPCObj.setMethod('getLinked');
			RPCObj.addArgument('field', this.field.name);
			RPCObj.addArgument('pKey', record[this.pKey]);
			RPCObj.call();
		},
		
		_drawEditor : function(req){
			// editor has 2 multi-selectors with add and remove-buttons inbetween:
			// first the header of the tabel:
			var tbody = new Element('tbody');
			var table = new Element('table', {id:this.instID+"_multiSelectContainer"}).insert(tbody);
			this.container.insert(table);
			
			var tr = new Element('tr', {className:'crudderMultiSelectHead'});
			tbody.insert(tr);
			var td = new Element('td').update(this.controller.lang.get('multiSelectSrcTableHead'));
			tr.insert(td);
			
			if (this.field.reftable.editable){
				var addBttn = new Element('button', {className:'crudderMultiSelectButton'}).update(this.controller.lang.get('multiSelectButtonAddNewItem'));
				var td = new Element('td').update(addBttn)
				tr.insert(td);
				addBttn.observe('click', this.openEditable.bindAsEventListener(this));
			}else{
				tr.insert(new Element('td'));
			}
			
			
			var td = new Element('td').update(this.controller.lang.get('multiSelectDestTableHead'));
			tr.insert(td);
			
			var tr = new Element('tr');
			tbody.insert(tr);
			var td = new Element('td',{className:'crudderMultiSelectCell', valign:'top'});
			this.srcSelect = new Element('select', {multiple:true, size:10, id:this.instID + "_src"});
			this.destSelect = new Element('select', {multiple:true, size:10, id:this.instID + "_dest"});

			td.insert(this.srcSelect);
			tr.insert(td);
			req.responseJSON.src.each(
				(function(row){
					var value = row.value;
					if (value.length > 50)  value = value.substring(0,47) + '...';
					var option = new Element('option', {value:row.id}).update(value);
					
					if (req.responseJSON.selected.indexOf(row.id) > -1  ){
						this.destSelect.insert(option);
//						option.setAttribbute('selected', true);
					}else{
						this.srcSelect.insert(option);
					}
				}).bind(this)
			)
			
			// buttons:
			var td = new Element('td');
			tr.insert(td);
			var buttonAdd = new Element('button', {className:'crudderMultiSelectButton'}).update(this.controller.lang.get('multiSelectButtonAdd'));
			td.insert(buttonAdd);
			buttonAdd.observe('click', this.addSelected.bindAsEventListener(this));
			td.insert('<br/>');
			var buttonRemove = new Element('button', {className:'crudderMultiSelectButton'}).update(this.controller.lang.get('multiSelectButtonRemove'));
			td.insert(buttonRemove);
			buttonRemove.observe('click', this.removeSelected.bindAsEventListener(this));

			// dest selector:
			var td = new Element('td',{className:'crudderMultiSelectCell', valign:'top'});
			
			td.insert(this.destSelect );
			tr.insert(td);
			
			this.controller.unWaiter();
		},
		
		addToDestSelector : function(element, index){
			this.destSelect.options[this.destSelect.options.length] = new Option(element.childNodes.item(0).nodeValue, element.value);
			$(element).remove();	
					
		},
		
		addSelected : function(event){
			var keys = '';
			var RPCObj = new crudderRPC(this.controller.config, this.controller.rpcPath);
//			RPCObj.debug = true;

			RPCObj.createCall();
			RPCObj.setCallback(this.dummy.bind(this));
			RPCObj.setMethod('addLinked');
			RPCObj.addArgument('field', this.field.name);
			RPCObj.addArgument('pKey', this.record[this.pKey]);
			$A(this.srcSelect.options).each(
				(function(option){
					if (option.selected){
						this.addToDestSelector(option);
						keys+=option.value+',';
					}
				}).bind(this)
			)
			keys = keys.substring(0, (keys.length-1) )
			RPCObj.addArgument('destKeys', keys);
			RPCObj.call();
		},
		
		addToSrcSelector : function(element){
			this.srcSelect.options[this.srcSelect.options.length] = new Option(element.childNodes.item(0).nodeValue, element.value);
			$(element).remove();
			
		},
		
		removeSelected : function(event){
			var keys = '';
			var RPCObj = new crudderRPC(this.controller.config, this.controller.rpcPath);
//			RPCObj.debug = true;

			RPCObj.createCall();
			RPCObj.setCallback(this.dummy.bind(this));
			RPCObj.setMethod('removeLinked');
			RPCObj.addArgument('field', this.field.name);
			RPCObj.addArgument('pKey', this.record[this.pKey]);
			
			$A(this.destSelect.options).each(
				(function(option){
					if (option.selected){
						this.addToSrcSelector(option);
						keys+=option.value+',';
					}
				}).bind(this)
			)
			keys = keys.substring(0, (keys.length-1) )
			RPCObj.addArgument('destKeys', keys);
			RPCObj.call();
		},
		
		createOptions : function(arr, select){
		},

		getRPCValue: function(){
			return '<![CDATA[' + encodeURIComponent(this.select.getValue()) + "]]>";
		},
		
		openEditable : function(){
			var editableConfig = this.field.reftable.editable;
			var container = new Element('div', {className:'inlineRecordAdd'});
			this.container.appendChild(container);
			var controller = new crudderController(container, editableConfig, this.controller.rpcPath, true);
			this.drawAddEditableTable(controller);
		},
		
		drawAddEditableTable : function(controllerInstance){
			if (!controllerInstance.booted){
				setTimeout(
							(function(){this.drawAddEditableTable(controllerInstance)}).bind(this)
							,500
				)
				return;
			}
			controllerInstance.addRecord();
			controllerInstance.record.onUpdate = this.refreshSrc.bind(this)
		},
		
		refreshSrc : function(){
			this.container.update('');
			this.drawEditor(this.container, this.record)
		},
		
		dummy: function(){}
	})