treatment = new Treatment();
window.onload = new Function("xhtml.init(); treatment.init();");


function Treatment() {
    // Step 1. Define Properties

    this.initialized = false;
    var _treatmentMenus = new Array('treatmentMenuFace', 'treatmentMenuSkin', 'treatmentMenuBody', 'treatmentMenuBreast');


    // Step 2. Define Methods

    /**
    * Sets up the initial page state and event handlers
    */
    this.init = function() {
        this.expandableListsInit();
        this.initialized = true;
    }


    /**
    * Adds expand/collapse event handler to FAQ lists
    */
    this.expandableListsInit = function() {
        var lists = document.getElementsByTagName('ul');
        for (var x = 0; x < lists.length; x++) {
            if (lists[x].className.indexOf('expandable') != -1) {
                var listItems = lists[x].getElementsByTagName('li');
                for (var y = 0; y < listItems.length; y++) {
                    listItems[y].onclick = function() {
                        switch (this.className) {
                            case 'expanded':
                                this.className = 'collapsed';
                                this.getElementsByTagName('span')[0].style.display = 'none';
                                break;

                            case 'collapsed':
                            default:
                                this.getElementsByTagName('span')[0].style.display = 'block';
                                this.className = 'expanded';
                                break;
                        }
                    }
                }
            }
        }
    }


    /**
    * Expands all the list items in an expandable list
    *
    * @param		id			The of the list to expand
    */
    this.expandList = function(id) {
        // Mark the list items as expanded
        var listItems = document.getElementById(id).getElementsByTagName('li');
        for (var x = 0; x < listItems.length; x++) {
            listItems[x].className = 'expanded';
        }

        // Make the content visible
        var spans = document.getElementById(id).getElementsByTagName('span');
        for (var x = 0; x < spans.length; x++) {
            spans[x].style.display = 'block';
        }
    }


    /**
    * Displays the next treatment gallery photo
    */
    this.galleryNext = function() {
        // Find the current image and the total number of images
        var current = document.getElementById('treatmentBodyGalleryImage').className.split('|')[0];
        var total = document.getElementById('treatmentBodyGalleryImage').className.split('|')[1];

        // Calculate the new image index
        current++;
        if (total < current) {
            current = 1;
        }

        // Update the current index in the image object
        document.getElementById('treatmentBodyGalleryImage').className = current + '|' + total;

        // Generate the new filename and path
        var filenameIndex = '' + (current < 100 ? '0' : '') + (current < 10 ? '0' : '') + current;
        var url = document.getElementById('treatmentBodyGalleryImage').src.replace(/\d{3}\.(jpg|gif|png)/, filenameIndex + '.$1');

        // Update the image
        document.getElementById('treatmentBodyGalleryImage').src = url;
    }


    /**
    * Displays the specified treatments list
    *
    * @param		area			The area to display treatments for
    */
    this.displayMenu = function(area) {
        // Hide menus
        for (var x = 0; x < _treatmentMenus.length; x++) {
            document.getElementById(_treatmentMenus[x]).style.display = 'none';
        }

        // Reset the tabs
        var tabs = document.getElementById('treatmentMenuTabs').getElementsByTagName('a');
        for (var x = 0; x < tabs.length; x++) {
            tabs[x].className = '';
        }

        // Display selected menu and make the tab active
        switch (area) {
            case 'face':
                document.getElementById('treatmentMenuFace').style.display = 'block';
                document.getElementById('treatmentMenuTabsFace').className = 'active';
                break;

            case 'skin':
                document.getElementById('treatmentMenuSkin').style.display = 'block';
                document.getElementById('treatmentMenuTabsSkin').className = 'active';
                break;

            case 'body':
                document.getElementById('treatmentMenuBody').style.display = 'block';
                document.getElementById('treatmentMenuTabsBody').className = 'active';
                break;

            case 'breast':
                document.getElementById('treatmentMenuBreast').style.display = 'block';
                document.getElementById('treatmentMenuTabsBreast').className = 'active';
                break;
        }
    }

     /**
    * Displays the specified treatments list
    *
    * @param		title						The treatment title
    * @param		prefix					The treatment images filename prefix
    * @param		start 					The image to start on
    * @param		total						The total images in the gallery
    */
    this.popupGallery = function(title, prefix, start, total) {
        var leftOffset = parseInt(window.screen.width) ? ((parseInt(window.screen.width) / 2) - 223) : 40;
        var topOffset = parseInt(window.screen.height) ? ((parseInt(window.screen.height) / 2) - 129) : 40;
        filename = 'treatment-popup-gallery.aspx?title=' + escape(title) + '&prefix=' + escape(prefix) + '&start=' + escape(start) + '&total=' + escape(total);
        window.open(filename, 'avosantgallery', 'toolbar=no,location=no,directories=no,status=no,scrollbars=no,resizable=no,copyhistory=no,width=447,height=259,top=' + topOffset + ',left=' + leftOffset);
    }
}