/*
 Usage: $('.wwTreeDemo').wwTree( options )

 Options:  script         - location of the serverside AJAX file to use; default = wwTree.php
           rootID         - ID of the ROOT element; default = 1
           multiSelect    - If true enabled the multi selection; default = true
           checkboxName	  - name of the checkbox. if set display checkboxes before elements; default = ''
           valuePathList  - list to the already checked elements ( open tree ); default = {}
           folderEvent    - event to trigger expand/collapse; default = click
           loadMessage    - Message to display while initial tree loads (can be HTML); default = 'Loading...'
           animationSpeed - Default animation speed; default = 500 (ms); use -1 for no animation
           disabled       - Disable the checkboxes; default = false


Response: ({
           "child_list": [
           {
             "id": "1",
             "icon" : "xls",
             "name" : "blablabla",
             "haschild" : true / false
           },
           { ... }]
          })

*/

if( jQuery ) ( function( $ ) {
	
	$.extend( $.fn, {
		wwTree: function( options ) {
			if( ! options ) var options = {};
			if( options.script == undefined ) options.script = 'wwTree.php';
			if( options.rootID == undefined ) options.rootID = 1;
			if( options.multiSelect == undefined ) options.multiSelect = true;
			if( options.checkboxName == undefined ) options.checkboxName = '';
			if( options.valuePathList == undefined ) options.valuePathList = [];
			if( options.folderEvent == undefined ) options.folderEvent = 'click';
			if( options.animationSpeed == undefined ) options.animationSpeed = 500;
			if( options.loadMessage == undefined ) options.loadMessage = 'Loading...';
			if( options.disabled == undefined ) options.disabled = false;
		
			options.prefix = $( this ).attr( 'id' ) + '-';
			options.$this = $( this );
			
			$( this ).each( function() {
	
				function showLoading( $ul ) {
					$ul.addClass( 'loading' );
				}
				
				function hideLoading( $ul ) {
					$ul.removeClass( 'loading' );
				}

				function multiSelectVerify() {
					var $input = $( this );

					if( ! options.multiSelect && $input.attr( 'checked' ) ) {
						options.$this.find( 'input:checkbox' ).each( function() {
							$inp = $( this );
							if( $inp.attr( 'checked' ) && $inp.attr( 'id' ) != $input.attr( 'id' ) ) {
								$inp.removeAttr( 'checked' );
							}
						} );
					}
				}
				
				function addChild( $ul, child ) {

					var child_id = options.prefix + child.id;
					
					if( options.disabled ) {
						var disabled = 'disabled="disabled"';
					} else {
						var disabled = '';
					} 
									
					if( options.checkboxName.length ) {
						var input = '<input id="' + child_id + '_input" type="checkbox" name="' + options.checkboxName + '[]" value="' + child.id + '" ' +  disabled + '/>';
					} else {
						var input = '<input id="' + child_id + '_input" type="hidden" name="' + options.checkboxName + '[]" value="' + child.id + '" ' + disabled + ' />';
					}
					
					$ul.append( '<li id="' + child_id + '">' + input + '<a id="' + child_id + '_a" class="' + child.icon + '" >' + child.name + '</a></li>' );
					var $li = $ul.find( '#' + child_id );

					var $a = $li.find( '#' + child_id + '_a' );					
					if( child.haschild ) {
						$li.append( '<ul id="' + child_id + '_ul"></ul>' );
						var $child_ul = $li.find( '#' + child_id + '_ul' ).hide();
						var callback = function( event ) { toggleChild( $child_ul ) };
					
						$a.bind( options.folderEvent, callback );
					}
					if( options.folderEvent.toLowerCase != 'click' ) {
						$a.bind( 'click', function( event ) {
							return false;
						} );
					}
					
					var $input = $li.find( '#' + child_id + '_input' );
					$input.click( multiSelectVerify );
					
					$.each( options.valuePathList, function( index, path ) {
						if( index == child.id ) { 
							$input.attr( 'checked', true ) 
						};
						if( $.inArray( child.id, path ) != -1 && child.id != options.rootID && child.haschild ) { 
							toggleChild( $child_ul );
						};
					} );
				}
				
				function addChildList( $ul ) {
				
					var parent_id = $ul.parent().find( 'input:first' ).attr( 'value' ); 
					if( typeof( parent_id ) == 'undefined' ) {
						parent_id = options.rootID;
					}
					
					showLoading( $ul );
					$.getJSON( options.script + '/' + parent_id, {}, function( response ) {
						$.each( response.child_list, function( index, child ) {
							addChild( $ul, child );
						} );

						hideLoading( $ul );
						$ul.addClass( 'expanded' ).slideDown( options.animationSpeed );
					} );
				}
				
				function toggleChild( $ul ) {
				
					if( ! $ul.hasClass( 'expanded' ) && ! $ul.hasClass( 'collapsed' ) ) {
						addChildList( $ul );
					}
					
					if( $ul.hasClass( 'expanded' ) ) {
						$ul.removeClass( 'expanded' ).addClass( 'collapsed' ).slideUp( options.animationSpeed );
					} else if( $ul.hasClass( 'collapsed' ) ) {
						$ul.removeClass( 'collapsed' ).addClass( 'expanded' ).slideDown( options.animationSpeed );
					}
				}

				$( this ).html( '' ).append( '<ul></ul>' );
				$ul = $( this ).find( 'ul:first' ).addClass( 'expanded' );
				
				addChild( $ul, { "id": options.rootID, "icon": "root", "name": "ROOT", "haschild": true } );
				toggleChild( $ul.find( 'ul:first' ) );
			});
		}
	});
})( jQuery );