/**********************************************************\
Edit Inplace Form
\**********************************************************/
TT_EditInplaceForm = Class.create();
TT_EditInplaceForm.prototype = {
  	initialize: function(divContent, page_type) {
  	    this.id = divContent.id;
  	    this.editor = new Object;
  	    this.page_type = page_type;
  	    this.divContent = divContent;
  	    this.textContent = divContent.innerHTML;
  	    this.textContent = this.textContent.strip(' ');
  	    this.type = divContent.id.split('_')[0];
        this.tt_bindFunctions();
        this.tt_buildGUI();
        this.tt_registerEvents();
  	},

    tt_bindFunctions: function () {		
		this.tt_GalleryLayout   = this.tt_GalleryLayout.bind(this);
		this.tt_addGalleryImage = this.tt_addGalleryImage.bind(this);
		this.tt_handleAddImg_tt13 = this.tt_handleAddImg_tt13.bind(this);
		this.tt_handleYesClick  = this.tt_handleYesClick.bindAsEventListener(this);
        this.tt_handleNoClick   = this.tt_handleNoClick.bindAsEventListener(this);
    },

	tt_buildGUI: function () {
	    var html = '', _id = this.id.split('_'), id = _id[1];
        if($("up_" + id) != null) $("up_" + id).style["display"] = 'none';
        if($("down_" + id) != null) $("down_" + id).style["display"] = 'none';
        html += '<div id="'+this.id+'_editinplace_container">';
        html += '<div id="'+this.id+'_editinplace_field"></div>';
        html += '<div class="tt_buttons" style="width: 100%;">';
        html +=     '<input id="'+this.id+'_btnyes" type="button" value="Save" />';
        html +=     '<input id="'+this.id+'_btnno" type="button" value="Cancel" />';
        html += '</div>';
        html += '</div>';
        html += '<div id="editinplaceWait" style="display: none;">';
        html +=     '<img src="'+ANTIKGUIDE_PATH+'img/spinner.gif">';
        html += '</div>';
        this.divContent.style['height'] = 'auto';
        this.divContent.innerHTML = html;
        var fieldContainer = $(this.id+'_editinplace_field');
        switch (this.type) {
            case 'page'     : this.tt_inputTitle(fieldContainer); break;
            case 'text'     : this.tt_inputText(fieldContainer); break;
            case 'textarea' : this.tt_textArea(fieldContainer); break;
            case 'paragraph': this.tt_textArea(fieldContainer); break;
            case 'img'      : this.tt_inputFile(fieldContainer); break;
            case 'gallery'  : this.tt_imgGallery(fieldContainer); break;
            default         : this.tt_handleNoClick(); return; 
        }
    },

    tt_registerEvents: function () {
        Event.observe($(this.id+'_btnyes'), 'click', this.tt_handleYesClick, false);
        Event.observe($(this.id+'_btnno'), 'click', this.tt_handleNoClick, false);
    },

    tt_handleYesClick: function () {
        this.divContent.onclick = new Function;
        switch (this.type) {
            case 'page'     : this.tt_saveText(); break;
            case 'text'     : this.tt_saveText(); break;
            case 'img'      : this.tt_saveImg(); return;
            case 'gallery'  : this.tt_saveGallery(); break;
            default         : this.tt_saveTextarea(); break; 
        }
        if (this.divTemp) this.divTemp.remove();
        var _id = this.id.split('_');
        var id = _id[1];        
        if($("up_" + id) != null)
        	$("up_" + id).style["display"] = '';
        if($("down_" + id) != null)	
        	$("down_" + id).style["display"] = '';   
        TT_Event.notify(this, 'ok', this.divContent);
    },
    
    tt_handleNoClick: function (e) {
        try {
            this.divContent.innerHTML = this.textContent;
            if (this.divTemp) this.divTemp.remove();
            this.divContent.onclick = new Function;
	        var _id = this.id.split('_');
	        var id = _id[1];            
	        if($("up_" + id) != null)
	        	$("up_" + id).style["display"] = '';
	        if($("down_" + id) != null)	
	        	$("down_" + id).style["display"] = '';          
            TT_Event.notify(this, 'cancel', this.divContent);
        } catch (e) {alert('test: ' + e.toString());}
    },

    tt_handleAddImg0: function () {
        var v = this.ImgField.tt_getValue();
        if (v=='') return;
        $('imgGallery').value += v + '\n';
    },

    tt_inputText: function (fieldContainer) {
    	var size=15;
    	if(fieldContainer.id=='text_ImageListItem_editinplace_field')
        	size=66;
        var html = '';
        html += '<input id="'+this.id+'_text" ';       
        html +=     'value="'+this.textContent+'" size="'+size+'" />';
        fieldContainer.innerHTML = html;
        return html;
    },

    tt_inputTitle: function (fieldContainer) {
        var html = '';
        var TmpDiv = new Element('div',{});
        TmpDiv.innerHTML = this.textContent;
        if (TmpDiv.childNodes[0]) {
            var divTitle1 = TmpDiv.childNodes[0];
            var textContent = divTitle1.innerHTML;
        } 
        if (TmpDiv.childNodes[1]) {
            var divTitle2 = TmpDiv.childNodes[1];
            textContent += '\n' + divTitle2.innerHTML;
        }
        if (typeof textContent == 'undefined')
             var textContent = this.textContent;
        html += 'New Title:&nbsp;&nbsp;';
        html += '<textarea id="'+this.id+'_text" ';
        html +=     'style="width:70%;">';
        html +=     textContent+'</textarea><br />';
        if (this.page_type=='childpage') {
            html += 'New URL:&nbsp;';
            html += '<input id="'+this.id+'_url" ';
            html +=     'type="text" value="" style="width:70%;" />';
        }
        fieldContainer.innerHTML = html;
        return html;
    },

    tt_saveText: function () {
        var newURL = $(this.id+'_url');
        var newTitle = $(this.id+'_text').value;
        var titleArr = newTitle.split('\n');
        if (titleArr.length == 2) {
            var html = '';
            html += '<div class="tt_templatePresse_title">';
            html +=     titleArr[0] + '</div>';
            html += '<div class="tt_templatePresse_header">';
            html +=     titleArr[1] + '</div>';
            this.divContent.innerHTML = html;
        } else this.divContent.innerHTML = titleArr[0];
        if (newURL) this.divContent.newURL = newURL.value;
    },

    tt_textArea: function (fieldContainer) {
        var html = '<div id="'+this.id+'_editor_container"></div>';
        fieldContainer.innerHTML = html;
        var divEditor = $(this.id+'_editor_container');
        this.editor[this.id] = new TT_Editor({
            id: this.id+'_antik_editor',
            content: this.textContent,
            container: divEditor,
            background: '#B6CDDD',
            path: ANTIKGUIDE_PATH+'js/TT_Library/TT_Editor'
        });
        this.editor[this.id].create();
        return html;
    },

    tt_saveTextarea: function () {
        if (this.editor!=undefined) {
            var textContent = this.editor[this.id].getContent();
            textContent = textContent.stripScripts();
        } else {var textContent = ''}
        this.divContent.innerHTML = textContent;
    },

    tt_inputFile: function (fieldContainer) {
        var TmpDiv = new Element('div',{});
        TmpDiv.innerHTML = this.textContent;
        this.imgElm = TmpDiv.childNodes[0];
        var html = '<div id="'+this.id+'_img"></div>';
        fieldContainer.innerHTML = html;
        this.tt_showImgBrowser();
    },

    tt_showImgBrowser: function () {
        $(this.id+'_img').innerHTML = '';
        $(this.id+'_img').appendChild(this.imgElm);
        new TT_Finder({
            id: 'ImgField',
            showField: false,
            onSelected: function (v) {
                this.imgElm.src = v;
                $(this.id+'_img').innerHTML = '';
                $(this.id+'_img').appendChild(this.imgElm);
            }.bind(this),
        });
        this.divContent.onclick = this.tt_showImgBrowser.bind(this);
    },

    tt_saveImg: function () {
        this.divContent.innerHTML = '';
        this.divContent.appendChild(this.imgElm);
        if (this.divTemp) this.divTemp.remove();
        var zoom = 'Pages.tt_handleZoomImg("'+this.imgElm.src+'")';
        var aHref = 'javascript:void('+zoom+')';
        if($(this.id+'_zoom')) $(this.id+'_zoom').href = aHref;
        this.imgElm = undefined;
        var _id = this.id.split('_');
        var id = _id[1];
        if($("up_" + id) != null)
        	$("up_" + id).style["display"] = '';
        if($("down_" + id) != null)	
        	$("down_" + id).style["display"] = '';   
        TT_Event.notify(this, 'ok', this.divContent);
    },

	tt_imgGallery: function (fieldContainer){		
		var html = '', imgList = '', times=1, tt13=0;
        var TmpDiv = new Element('div',{});
        TmpDiv.innerHTML = this.textContent;

        var mqElm = TmpDiv.childNodes[0];
        var tblElm = mqElm.childNodes[0];
        var tbodyElm = tblElm.childNodes[0];
        var trElm = tbodyElm.childNodes[0]; 
        var tdElms = trElm.childNodes;

		var arrImg= new Array();
		var arrBigImg=new Array();
		
		if((tdElms[0].childElements()).length!=0){	
	        for (var i=0; i<tdElms.length; i++) {           
	            var aElm = tdElms[i].childNodes[0]; 
			
	            if(aElm.name!=''){
	            	var arr = aElm.name.split('/uploads');				
	                var aimgURL = 'uploads' + arr[1];
	                arrBigImg[i]=aimgURL;
	            }else arrBigImg[i]='';

	            var imgElm = aElm.childNodes[0];
	            if (imgElm) {
	                var arr = imgElm.src.split('/uploads');				
	                var imgURL = 'uploads' + arr[1];
	                arrImg[i]=imgURL; 
	            } else arrImg[i]='';            
	        }
			times=arrImg.length;
			tt13=1;
		}			
		this.i=times+1;

		html+='<table id="galary_table" style="width:60% !important; margin-left:10%;height:auto;">';		
		for(i=1;i<=times;i++)
			html+=	this.tt_GalleryLayout(i);		
		html+='</table>';
		html+='<a id="but_add" style="margin-left:10px;font-weight:normal;"class="tt_button" href="javascript://">Add</a>';
		fieldContainer.innerHTML = html;
			
		for(i=1;i<=times;i++){
			for(j=1;j<3;j++){			
				var dollar='browse'+j+'_'+i;
				this.ImgField = new TT_Finder({
					id: 'ImgField'+j+i,
					container: $(dollar)
				});		
			}
			if(tt13){
				$('ImgField1'+i+'_image').value=arrImg[i-1];
				$('ImgField2'+i+'_image').value=arrBigImg[i-1];
			}
		}
		
		var a = this.tt_addGalleryImage.bindAsEventListener(this);		
        Event.observe($('but_add'), 'click', a, false);	
		return html;
    },

	tt_GalleryLayout: function(i){
		var del='';
		del+="$('tr1_"+i+"').remove();";
		del+="$('tr2_"+i+"').remove();";
		del+="$('tr3_"+i+"').remove();";
			
		var html='';
		html+=	'<tr id="tr1_'+i+'">';
		html+=		'<td style="width:5%">Bild'+i+'</td>';
		html+=	'</tr>';
		html+=	'<tr id="tr2_'+i+'">';
		html+=		'<td></td>';
		html+=		'<td style="height:16px !important;width:5%;">Small</td>';
		html+=		'<td id="browse1_'+i+'"style="width:50%;"></td>'; 
		html+=		'<td style="height:16px !important;width:5%;">'
		html+=			'<div id="but_delete" class="tt_button" style="font-weight:normal;" onclick="'+del+'">Delete</div>'
		html+=		'</td>';
		html+=	'</tr>';
		html+=	'<tr id="tr3_'+i+'">';
		html+=		'<td></td>';
		html+=		'<td style="height:16px !important;width:5%;">Big</td>';
		html+=		'<td id="browse2_'+i+'"></td>';
		html+=	'</tr>';
				
		return html;
	},
	
	tt_addGalleryImage: function(){	
		var temp=this.tt_GalleryLayout(this.i);	
		$('galary_table').childNodes[0].insert(temp);
			
		for(j=1;j<3;j++){			
			var dollar='browse'+j+'_'+this.i;
			this.ImgField = new TT_Finder({
				id: 'ImgField'+j+this.i,
				container: $(dollar)
			});		
		}
		this.i++;
	},
	
	tt_handleAddImg_tt13: function () {
        var imageSmall='', imageBig='';
		var value='',image='',temp=0;
		var a=new Array();
		var kemp=$('galary_table').childNodes[0].childElements();
		var len=kemp.length;

		for(i=0;i<len;i++){
		   	if(i%3!=0){
		   		tt=kemp[i].descendants();
		   		image+=tt[4].value+'\n';
			}	
		}
		return image;
    },
	
	tt_saveGallery: function () {
        var imgStr = this.tt_handleAddImg_tt13();
        var imgList = imgStr.split('\n'), html = '';

		html += '<div style="overflow: hidden;">';	
        html +=    '<table width="100%"><tr id="'+this.id+'_imgs">';

	    if(imgList.length>1){  
			for (var i=0; i<imgList.length-1; i++) {
				if (imgList[i]!='') {
					var zoom = 'Pages.tt_handleZoomImg(\''+ANTIKGUIDE_PATH+imgList[i+1]+'\')';
					var aHref = 'javascript:void('+zoom+')';
					html += '<td valign="top" id="tr2_'+(i+1)+'">';
					if(imgList[i+1]!='')
						html+='<a href="'+aHref+'" name="'+ ANTIKGUIDE_PATH+imgList[i+1] +'">';
					else
						html+='<a name="">';
					html += '<img class="tt_templateImgs" ';
					html +=     'name="gallery_img" width="100"';
					html +=     'alt="Image in Gallery"';
					html +=     'src="' + ANTIKGUIDE_PATH+imgList[i] + '" /></a></td>';
				}
				i++;
			}
		}
		else
			html += '<td>Click here to edit haendler photo gallery</td>';
			
        html += '</tr></table>';
        html += '</div>'; 
        this.divContent.update(html);
        var savedText = imgStr.gsub('\n', TT_SYMBOL);
        this.divContent.galleryString = savedText;
    },
}