/**
* Frontend category tree stuff
* @version $Id: category.tree.js 31062 2009-11-09 18:27:18Z kt $
*/

///////////////////////////////////////////////////////////////////////////////

jQuery.extend({
	
	/**
	* Category-related routines
	*/
	"category": {

		/**
		* The HTML for the loaded category tree nodes
		* are cached, so if it is once loaded, then it
		* is always used from the cache
		*/
		"cache": [],

		/**
		* A bried set of options for the category tree AJAX handlers
		*/		
		"options": {
				
			/**
			* This is the HTML which is shown while
			* waiting for the AJAX response to return
			* the fetched HTML for the sub-categories
			*/
			"loading_html": '<img style="padding: 4px 0 4px 15px;" src="'
				+ smarty_vars['rel_assets_url']
				+ 'toolkit/autocomplete/loading/7.gif" \/>'
			},

		/**
		* The general onClick handler, which depending
		* on the state of the sub-categories either
		* expands it or collapses it
		*/
		"click": function(category_id, category_template, bullet, o) {
			jQuery.extend(jQuery.category.options, o);

			if (!jQuery('.cat-ajax-' + category_id + ' *').length) {
				jQuery.category.expand(category_id, category_template, bullet);
				} else {
				jQuery.category.collapse(category_id, bullet);
				}
			},

		/**
		* Expand a list of sub-categories: it changes
		* the bullet state, places an AJAX call for the
		* HTML (if not cached), and renders it when fetched 
		*/
		"expand": function(category_id, category_template, bullet) {

			// already cached ?
			//
			if (typeof jQuery.category.cache[category_id] != 'undefined') {
				jQuery(bullet).removeClass('cat-ajax-full').addClass('cat-ajax-active');
				jQuery('.cat-ajax-' + category_id)
					.css('display', '')
					.html(jQuery.category.cache[category_id]);
				return true;
				}

			// not cached, query the server-side
			//
			var _url = smarty_vars['rel_html_url']
				+ 'index.php?page=category_ajax&action=render_categories&id='
				+ category_id + '&template=' + category_template;
			
			jQuery(bullet).removeClass('cat-ajax-full').addClass('cat-ajax-loading');
			jQuery('.cat-ajax-' + category_id)
				.css('display', '')
				.html(jQuery.category.options.loading_html);
			jQuery.ajax({
				"type": "GET",
				"url": _url,
				"dataType": "html",
				"args" : {
					"category_id": category_id,
					"category_template": category_template,
					"bullet": bullet
					},
				"success": function(data, msg) {

					// show it
					//
					jQuery('.cat-ajax-' + this.args.category_id).html(data);
					jQuery(this.args.bullet)
						.removeClass('cat-ajax-loading')
						.addClass('cat-ajax-active');

					// cache it
					//
					jQuery.category.cache[this.args.category_id] =
						jQuery('.cat-ajax-' + this.args.category_id).html() /* + ' .kashed' */;
					},

				"error": function (xhr, msg, err) {
					//alert('error: ' + err);
					}
				});
			},
			
		/**
		* Collapse a set of sub-categories: changes
		* the bullet state, and caches the contents
		* before clearing them
		*/
		"collapse": function(category_id, bullet) {

			// cache current state
			//
			if (typeof jQuery.category.cache[category_id] == 'undefined') {
				jQuery.category.cache[category_id] = jQuery('.cat-ajax-' + category_id).html() /* + ' .cached' */;
				}

			jQuery(bullet).removeClass('cat-ajax-active').addClass('cat-ajax-full');
			jQuery('.cat-ajax-' + category_id)
				.css('display', 'none')
				.html('');
			}

		}

	});

///////////////////////////////////////////////////////////////////////////////
	
