(function ($) {
	$.fn.selectbox = function (value, editable) {
    	return this.each(function () {
    		
    		var original = $(this);
    		var id = original.attr('id');
    		var name = original.attr('name');
    		//original.hide();
    		
    		var container0 = $('<span></span>');
    		
    		if (editable) {
    			original.replaceWith(container0);
    		} else {
    			original.hide();
    			container0.insertAfter(original);
    		}
    		
    		//container0.insertAfter(original);
    		//original.replaceWith(container0);
    		
    		var container = $('<div class="select_container"></div>');
    		container0.append(container);
    		
    		var select = $('<input type="text" class="select"/>');
    		select.attr('value', value);
    		if (editable) {
    			select.attr('id', id);
    			select.attr('name', name);
    		} else {
    			select.attr('readonly', 'readonly');
    		}
    		container.append(select);
    		
    		var choicesContainer = $('<div class="choices_container" style="position: relative; width: 100%;"></div>');
    		choicesContainer.insertAfter(select);
    		
    		var choices = $('<div class="choices" style="display: none; position: absolute; width: 100%;"></div>');
    		choicesContainer.append(choices);
    		
    		select.click(function() {
    			choices.toggle();
    		});
    		
    		var inside = false;
    		container.mouseenter(function() {
    			inside = true;
    		});
    		container.mouseleave(function() {
    			inside = false;
    		});
    		
    		select.blur(function() {
    			if (!inside)
    				choices.hide();
    		});
    		
    		$(this).find('option').each(function(index, element) {
			    var choice = $('<div class="choice" style="width: 100%;">' + $(this).text() + '</div>');
			    var value = $(this).val();
			    var text = $(this).text();
			    choice.click(function() {
			    	try {
			    		original.val(value);
			    	} catch(err) {
			    	}
			    	select.val(text);
			    	choices.hide();
			    	if (text == 'other') {
			    		select.select();
			    	}
			    });
			    choices.append(choice);
			    if ($(this).attr('selected')) {
			    	if ($(this).val() != "") {
			    		select.val($(this).text());
			    	}
			    }
			});
			
    	});
    };
})(jQuery);

(function ($) {
	$.fn.animateCloud = function (duration) {
    	return this.each(function () {
    		//var original = $(this);
    		
    		var parent_width = $(this).parent().width();
    		var position = $(this).position().left;
    		var relative_duration = (parent_width - position) / parent_width * duration;

    		$(this).animate({left: '100%'}, relative_duration, 'linear').animate({left: -$(this).width()}, 0, function() {
    			$(this).animateCloud(duration);
    		});
    	});
    };
})(jQuery);

(function ($) {
	$.fn.addClouds = function (class_names, count, min_duration, max_duration) {
    	return this.each(function () {
    		for (var i = 0; i < count; i++) {
    			var class_name = class_names[Math.floor(Math.random() * class_names.length)];
    			var element = $('<div class="' + class_name + '"></div>');
    			var parent_width = $(this).parent().width();
    			var parent_height = $(this).parent().height();
    			element.css('left', Math.floor(Math.random() * parent_width));
    			element.css('top', Math.floor(Math.random() * parent_height));
    			$(this).append(element);
    			var duration = min_duration + Math.floor(Math.random() * (max_duration - min_duration));
    			element.animateCloud(duration);
    		}
    	});
    };
})(jQuery);