/**

JavaScript that toggles content for articles in phonelist tile.
Initially only article headers are visible in list, but when clicking on
one article header the articles content is toggled.

@author: Marit Osbakk Sommer

*/

document.observe("dom:loaded", function() {
    
    
    $$('.phonelist-articlelist div.letter-container').each( function(element) {
	    
	    // Add a click observer to each toggle link, used to trigger toggling.
        element.select('a.toggle').each (function(toggleLink) {
            
            toggleLink.observe('click', function(event) {

                // Stop the click event, as we don't want the UA to query the server
                event.stop();
                
                var clickedArticleID = '';
                var closeElementId = '';
                var openElementId = '';
                
                if(toggleLink.hasClassName('open')) {
                    clickedArticleID = toggleLink.up('.collapsed-info').identify();
                    
                    closeElementId = clickedArticleID;
                    openElementId = clickedArticleID.replace('phonelist-collapsed-article-','phonelist-article-');
                    
                }
                else if(toggleLink.hasClassName('close')) {
                    clickedArticleID = toggleLink.up('.expanded-info').identify();
                    
                    closeElementId = clickedArticleID;
                    openElementId = clickedArticleID.replace('phonelist-article-', 'phonelist-collapsed-article-');
                }
               
                // Hide and close elements
		        $(closeElementId).hide();
		        $(openElementId).show();
            });
        });
	    
	});
    
   
});