/** 
 * Toggle the visibility of a field
 * 
 * Note: css must contain the following selectors:
 *
 * .visible {
 *     display: block;
 * }
 * .invisible {
 *     display: none;
 * }
 *
 * Example:
 *
 * <a href="#" onclick="toggleVisibility('fieldId')">toggle</a>
 * <div id="fieldId" class="invisible">hello world</div>
 */
function toggleVisibility(myfieldname) 
{
    var myfield = document.getElementById(myfieldname);
    
    if (myfield.className == "invisible") 
	{
        // myfield.className = "visible"; 
        // NOTE: using class "visible" instead of empty quotes will cause table rows to grow horizontally
        myfield.className = "";
    } 
	else 
	{
        myfield.className = "invisible";
    }
    
    return false;
}

/** 
 * Make a hidden field visible
 * 
 * Example:
 *
 * <a href="#" onclick="makeVisible('fieldId')">show</a>
 * <div id="fieldId" class="invisible">hello world</div>
 */
function makeVisible(myfieldname) 
{
    var myfield = document.getElementById(myfieldname);
    
    if (myfield !== null) 
	{ 
        // NOTE: using class "visible" instead of empty quotes will cause table rows to grow horizontally
        myfield.className = "";
    }

    return false;
} 

/** 
 * Make a field invisible
 * 
 * Example:
 *
 * <a href="#" onclick="makeInvisible('fieldId')">hide</a>
 * <div id="fieldId" class="visible">hello world</div>
 */
function makeInvisible(myfieldname) 
{
    var myfield = document.getElementById(myfieldname);
    
    if (myfield !== null) 
	{ 
        myfield.className = "invisible";
    }
    
    return false;
} 

function deleteTag(tagId) 
{
    var myfield = document.getElementById('delete_tag_id');
    
    if (myfield !== null) 
	{ 
		myfield.value = tagId;
		document.delete_tag_form.submit();
    }
    return false;
} 

function selectTag(tagId) 
{
    var myfield = document.getElementById('search_tag_id');
    
    if (myfield !== null) 
	{ 
		myfield.value = tagId;
		document.search_tag_form.submit();
    }
    return false;
} 



/** 
 * Hide the peek section on page load
 */
$(document).ready(
function() 
{
	$('#config').hide();
	$('#config').css("height", "300px");

	$('a#slideout').click(function() 
	{
		$('#config').slideToggle("normal");
		return false;
	});
});