// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults

var collections_counter = 0;
var text_areas_counters = new Array();
var images_counters = new Array();
var attachments_counters = new Array();


function initEveryThing()
{
	collections_counter = 0;
	text_areas_counters = new Array();
	images_counters = new Array();
	attachments_counters = new Array();
}

initEveryThing();
/**
 * The method is used while editing
 * @param {Object} collections_counter
 * @param {Object} text_areas
 * @param {Object} images
 * @param {Object} attachments
 */
function initCounters(collections_counter, text_areas, images, attachments)
{
	text_areas_counters[collections_counter] = text_areas;
	images_counters[collections_counter] = images;
	attachments_counters[collections_counter] = attachments;
}
/**
 * The method is used while editing
 * @param {Object} collections_length
 */
function initCollectionsCounter(collections_length)
{
	collections_counter = collections_length;
}

function addItem(item_type, collections_counter){
	
    var counters_array = new Array();
    if (item_type == 'text_areas') {
        counters_array = text_areas_counters;
    }
    else 
        if (item_type == 'images') {
            counters_array = images_counters;
        }
        else 
            if (item_type == 'attachments') {
                counters_array = attachments_counters;
            }
    
    var item_counter = counters_array[collections_counter]

	item_id = getItemId(item_type, collections_counter, item_counter);
	item_name = getItemName(item_type, collections_counter, item_counter);
    
    var new_item = Builder.node('div', {
		className: "added_item",
        id: item_id
//        name: getItemName(item_type, collections_counter, item_counter)
    });
    
    if (item_type == 'text_areas') {
        // text_area_attributes	
		// header
        new_item.appendChild(Builder.node('input', {
            className: "hinted_input",
            id: item_id + '_header',
            name: item_name + '[header]',
            type: 'text',
            size: '30px',
			value: 'Text Area Header',
			onsubmit: 'this.hide()',
			onfocus: 'clickClear(this, "Text Area Header")',
			onblur: 'clickInit(this, "Text Area Header")'
        }));
        new_item.appendChild(Builder.node('br'));
		// content
        new_item.appendChild(Builder.node('textarea', {
            className: "hinted_input",
			id: item_id + '_content',
            name: item_name + '[content]',
            size: '30px',
            cols: '24',
            rows: '5',
			onfocus: 'clickClear(this, "Text Area Content")',
			onblur: 'clickInit(this, "Text Area Content")',
        }, "Text Area Content"));
//        new_item.appendChild(Builder.node('label', "Text Item " + item_counter + " is added"));
    }
    else 
        if (item_type == 'images') {
            // image_attributes
			// header
            new_item.appendChild(Builder.node('input', {
	            className: "hinted_input",
                id: item_id + '_header',
                name: item_name + '[header]',
                size: '30',
                type: 'text',
				value: 'Image Header',
				onfocus: 'clickClear(this, "Image Header")',
				onblur: 'clickInit(this, "Image Header")'
            }));
			// src_file
            new_item.appendChild(Builder.node('input', {
                id: item_id + '_src_file',
                name: item_name + '[src_file]',
                type: 'file'
            }));            
            new_item.appendChild(Builder.node('br'));
            // comment
            new_item.appendChild(Builder.node('textarea', {
	            className: "hinted_input",
                id: item_id + '_comment',
                name: item_name + '[comment]',
                cols: '24',
                rows: '5',
				onfocus: 'clickClear(this, "Your comment on image")',
				onblur: 'clickInit(this, "Your comment on image")'
            }, 'Your comment on image'));
//            new_item.appendChild(Builder.node('label', "Image Item " + item_counter + " is added"));
        }
        else 
            if (item_type == 'attachments') {
                // attachment_attributes 
				// name
                new_item.appendChild(Builder.node('input', {
                    className: "hinted_input",
					id: item_id + '_name',
                    name: item_name + '[name]',
                    size: '30',
                    type: 'text',
					value: 'Attachment Name',
					onfocus: 'clickClear(this, "Attachment Name")',
					onblur: 'clickInit(this, "Attachment Name")'
                }));
                // src_file
                new_item.appendChild(Builder.node('input', {
                    id: item_id + '_src_file',
                    name: item_name + '[src_file]',
					type: 'file'
                }));
                new_item.appendChild(Builder.node('br'));
				// comment
//                new_item.appendChild(Builder.node('label', 'Your Comment on Attachment'));
                new_item.appendChild(Builder.node('textarea', {
		            className: "hinted_input",
					id: item_id + '_comment',
                    name: item_name + '[comment]',
                    cols: '24',
                    rows: '5',
					onfocus: 'clickClear(this, "Your Comment on Attachment")',
					onblur: 'clickInit(this, "Your Comment on Attachment")'
                }, 'Your Comment on Attachment'));
                
//                new_item.appendChild(Builder.node('label', "Attachment Item " + item_counter + " is added"));
            }
    var order_label = Builder.node('label', {className: 'option'}, 'Item Order');
    var order_integer = Builder.node('input', {
		className: 'option',
        id: item_id + '_order',
        name: item_name + '[order]',
        type: 'text',
        size: '5',
        value: allItemsCounter(collections_counter)
    });
    
    var delete_button = Builder.node('div', {
        className: 'remove_button remove_item',
		id: item_id + '_remove_button',
    },[Builder.node('a', {
        onclick: 'removeItem("' + item_type + '", ' + collections_counter + ', ' + item_counter + ')'
    }, Builder.node('img',{
		src: '/images/remove_item_0.gif'
	}))]);
    
    new_item.appendChild(Builder.node('br'));
	
    new_item.appendChild(order_integer);
    new_item.appendChild(order_label);

    new_item.appendChild(Builder.node('br'));
    new_item.appendChild(Builder.node('br'));
    
	new_item.appendChild(delete_button);
    
	incrementItemsCounter(item_type, collections_counter);
	
	collection = $(getCollectionId(collections_counter));
    collection.insertBefore(new_item, $('options_' + collections_counter));

//	initHTMLEditor();
}

function removeCollection(collection_index)
{
	$(getCollectionId(collection_index)).remove();
}

function addCollection()
{
	collection_id = getCollectionId(collections_counter);
	collection_name = getCollectionName(collections_counter);
	
    var new_collection = Builder.node('fieldset', {
        id: collection_id,
		className: 'collection'
//        name: getCollectionName(collections_counter)
    });
    
		// header
		collection_header = Builder.node('legend',{
		},Builder.node('input', {
            className: 'hinted_input',
			id: collection_id + '_header',
            name: collection_name + '[header]',
            type: 'text',
            size: '30',
			value: 'Collection Header',
			onfocus: 'clickClear(this, "Collection Header")',
			onblur: 'clickInit(this, "Collection Header")'
        }
		));
		
        new_collection.appendChild(collection_header);
//        new_collection.appendChild(Builder.node('input', {
//            className: 'hinted_input',
//			id: collection_id + '_header',
//            name: collection_name + '[header]',
//            type: 'text',
//            size: '30',
//			value: 'Collection Header',
//			onclick: 'clickClear(this, "Collection Header")',
//			onblur: 'clickInit(this, "Collection Header")'
//        }));
        
		
    var add_text_area_button = Builder.node('div', {
        className: 'button',
		id: 'add_text_area_button'
    }, [Builder.node('a', {
		onclick: 'addItem(\'text_areas\' ,' + collections_counter + ')',
	}, Builder.node('img',{
		src: '/images/add_text_3.gif'
	}))]);
    
    var add_image_button = Builder.node('div', {
        className: 'button',
		id: 'add_image_button'
    }, [Builder.node('a', {
        onclick: 'addItem(\'images\' ,' + collections_counter + ')'
    }, Builder.node('img',{
		src: '/images/add_image_3.gif'
	}))]);
    
    var add_attachment_button = Builder.node('div', {
        className: 'button',
		id: 'add_attachment_button'
    }, [Builder.node('a', {
        onclick: 'addItem(\'attachments\' ,' + collections_counter + ')'
    }, Builder.node('img',{
		src: '/images/add_att_0.gif'
	}))]);
    
    var visibility_label = Builder.node('label', {className: 'option'},'Visibility');
	
    var visibility_select = Builder.node('select', {
        className: 'option',
        name: collection_name +
        '[visibility]', selected: 'all'
    }, [Builder.node('option', {
        value: 'all', selected: "true"
    }, "All"), Builder.node('option', {
        value: 'batch_and_older'
    }, "Batch and Older"), Builder.node('option', {
        value: 'batch_only'
    }, "Batch Only"), Builder.node('option', {
        value: 'team_only'
    }, "Team Only")]);
    
    var order_label = Builder.node('label', {className: 'option'},'Order');
    var order_integer = Builder.node('input', {
        className: 'option',
		id: collection_id + '_order',
        name: collection_name + '[order]',
        type: 'text',
        size: '5',
        value: collections_counter
    });
    
	var delete_button = Builder.node('div', {
		className: 'remove_button remove_collection',
//        id: collection_id + '_remove_button',
        // TODO Check this
		id: 'collection_remove_button'
    }, [Builder.node('a', {
        onclick: 'removeCollection(' + collections_counter + ')'
    }, Builder.node('img',{
		src: '/images/remove_collection_2.gif'
	}))]);


	var options = Builder.node('div', {id: 'options_' + collections_counter})
	
    options.appendChild(order_integer);
    options.appendChild(order_label);
    options.appendChild(visibility_select);
    options.appendChild(visibility_label);
    options.appendChild(Builder.node('br'));
    options.appendChild(Builder.node('br'));
    options.appendChild(delete_button);
    options.appendChild(add_text_area_button);
    options.appendChild(add_image_button);
    options.appendChild(add_attachment_button);
    
    new_collection.appendChild(options);
	
    $('collections').appendChild(new_collection);
    
    text_areas_counters[collections_counter] = 0;
    images_counters[collections_counter] = 0;
    attachments_counters[collections_counter] = 0;
    
    collections_counter++;
}
function removeItem(item_type, collections_counter, item_counter)
{
    item_id = getItemId(item_type, collections_counter, item_counter);
    // decrease the counter of item_types, this will adjust orders also
    current_items_counter = decrementItemsCounter(item_type, collections_counter);
	item_order_value = $(item_id + "_order").value
	$(item_id).remove();
	
	for (var i = item_counter + 1; i <= current_items_counter; i++)
	{
		// TODO decrement order values also
		item_id = getItemId(item_type, collections_counter, i);
   		$(item_id + "_remove_button").setAttribute("onclick", 'removeItem("' + item_type + '", ' + collections_counter + ', ' + (i - 1) + ')');
		updateAttributesNames(item_type, collections_counter, i);
		// finally change its id
		$(item_id).id = getItemId(item_type, collections_counter, i - 1);
	};
	decrementOrders(item_order_value, collections_counter);
}

function updateAttributesNames(item_type, collections_counter, item_counter)
{
	
	updateAttributeName(item_type, collections_counter, item_counter, "order");
	updateAttributeName(item_type, collections_counter, item_counter, "remove_button");
	
	if (item_type == 'text_areas') 
	{
		updateAttributeName(item_type, collections_counter, item_counter, "header");
		updateAttributeName(item_type, collections_counter, item_counter, "content");
	}
    else 
        if (item_type == 'images') 
		{
			updateAttributeName(item_type, collections_counter, item_counter, "header");
			updateAttributeName(item_type, collections_counter, item_counter, "comment");
			updateAttributeName(item_type, collections_counter, item_counter, "src_file");
        }
        else 
            if (item_type == 'attachments') 
			{
				updateAttributeName(item_type, collections_counter, item_counter, "name");
				updateAttributeName(item_type, collections_counter, item_counter, "comment");
				updateAttributeName(item_type, collections_counter, item_counter, "src_file");
            }
}

function decrementOrders(order_value, collections_counter)
{
	for(var i = 0; i < text_areas_counters[collections_counter]; i++)
	{
		item_order = $(getItemId("text_areas", collections_counter, i) + "_order");
		if(item_order.value > order_value)
		{
			item_order.value  -= 1;
		}
	};
	for(var i = 0; i < images_counters[collections_counter]; i++)
	{
		item_order = $(getItemId("images", collections_counter, i) + "_order");
		if(item_order.value > order_value)
		{
			item_order.value -= 1;
		}
	};
	for(var i = 0; i < attachments_counters[collections_counter]; i++)
	{
		item_order = $(getItemId("attachments", collections_counter, i) + "_order");
		if(item_order.value > order_value)
		{
			item_order.value -= 1;
		}
	};
}

function updateAttributeName(item_type, collections_counter, item_counter, attribute_name)
{
	item = $(getItemId(item_type, collections_counter, item_counter) + "_" + attribute_name);
    item.name = getItemName(item_type, collections_counter, item_counter - 1) + "[" + attribute_name + "]";
    item.id = getItemId(item_type, collections_counter, item_counter - 1) + "_" + attribute_name;
}

function incrementItemsCounter(item_type, collections_counter){
    if (item_type == 'text_areas') {
        return ++text_areas_counters[collections_counter];
    }
    else
        if (item_type == 'images') {
            return ++images_counters[collections_counter];
        }
        else 
            if (item_type == 'attachments') {
                return ++attachments_counters[collections_counter];
            }
}

function decrementItemsCounter(item_type, collections_counter)
{
    if (item_type == 'text_areas') 
	{
        return --text_areas_counters[collections_counter];
    }
    else 
        if (item_type == 'images') 
		{
            return --images_counters[collections_counter];
        }
        else 
            if (item_type == 'attachments') 
			{
                return --attachments_counters[collections_counter];
            }
}

function getCollectionId(collections_counter)
{
    return 'collections_' + collections_counter;
}

function getCollectionName(collections_counter)
{
    return 'collections[' + collections_counter + ']';
}

function getItemId(item_type, collections_counter, text_area_counter)
{
    return 'collections_' + collections_counter + '_' + item_type + '_' + text_area_counter;
}

function getItemName(item_type, collections_counter, text_area_counter)
{
    return 'collections[' + collections_counter + '][' + item_type + '][' + text_area_counter + ']';
}

function allItemsCounter(collections_counter)
{
    return text_areas_counters[collections_counter] + images_counters[collections_counter] + attachments_counters[collections_counter];
}