ajaxtags_tags.js

这是AJAX的一个HTML实现！ HTML标签AJAX的实现！

							this.options.preFunction();
						}
						// preFunction can cancelExecution set
						// this.cancelExecution =
					// true;
					if (this.options.cancelExecution) {
						this.cancelExecution = false;
						this.stopIndicator();
						return;
					}
					// parse parameters and do replacements
					var params = buildParameterString(this.options.defaultParams);
					if (Object.isString(params) && params.length > 0) {
						this.options.parameters += '&' + params;
					}
					// / don't write code a secend time
					// call
					this.getUpdatedChoices0();
				},
				onComplete : function(request) {
					var parser = this.options.parser;
					parser.load(request);
					this.updateChoices(parser.content);
				}

				});
// XXX Autocompleter
AjaxJspTag.Autocomplete = Class.create(AjaxJspTag.Base, {
	initialize : function(url, options) {
		this.url = url;
		this.setOptions(options);
		// create DIV
		new Insertion.After(this.options.source, '<div id="'
				+ this.options.divElement + '" class="'
				+ this.options.className + '"></div>');
		this.execute();
	},
	setOptions : function(options) {
		this.options = Object.extend( {
			divElement :"ajaxAuto_" + options.source,
			indicator :options.indicator || '',
			parameters :options.parameters || '',
			parser :options.parser ? options.parser
					: new ResponseXmlToHtmlListParser()
		}, options || {});
	},

	execute : function(e) {
		// preFunction moved bevor request now
	var obj = this; // required because 'this' conflict with Ajax.Request
	var aj = new AjaxJspTag.XmlToHtmlAutocompleter(this.options.source,
			this.options.divElement, this.url, {
				minChars :obj.options.minChars,
				tokens :obj.options.appendSeparator,
				indicator :obj.options.indicator,
				parameters :obj.options.parameters,
				evalScripts :true,
				preFunction :obj.options.preFunction,
				parser :obj.options.parser,
				afterUpdateElement : function(inputField, selectedItem) {
					obj.handler( {
						selectedItem :selectedItem,
						tokens :obj.options.appendSeparator,
						target :obj.options.target,
						inputField :inputField,
						postFunction :obj.options.postFunction,
						list :obj.options.parser.content,
						options :obj.options,
						autocomplete :aj
					});
				}
			});
},

handler : function(options) {
	if (options.target) {
		if (options.tokens) {
			if ($(options.target).value.length > 0) {
				$(options.target).value += options.tokens;
			}
			$(options.target).value += options.selectedItem.id;
		} else {
			$(options.target).value = options.selectedItem.id;
		}
	}
	options.selectedIndex = options.autocomplete.index;
	options.selectedObject = options.list[options.autocomplete.index];

	if (Object.isFunction(options.postFunction)) {
		// Disable onupdate event handler of input field
	// because, postFunction can change the content of
	// input field and get into eternal loop.
	var onupdateHandler = $(options.inputField).onupdate;
	$(options.inputField).onupdate = '';

	options.postFunction();
	// Enable onupdate event handler of input field
	$(options.inputField).onupdate = onupdateHandler;
}
}

});

/**
 * TOGGLE TAG
 */
AjaxJspTag.Toggle = Class.create( AjaxJspTag.Base,
				{
					initialize : function(url, options) {
						this.url = url;
						this.setOptions(options);

						// create message DIV
						if (this.options.messageClass) {
							this.messageContainer = new Insertion.Top(
									$(this.options.source), '<div id="'
											+ this.options.source
											+ '_message" class="'
											+ this.options.messageClass
											+ '"></div>');
						}

						this.setListeners();
						addAjaxListener(this);
					}, 

					setOptions : function(options) {
						this.options = Object
								.extend(
										{
											parameters :options.parameters || 'rating={ajaxParameter}',
											parser :options.parser ? options.parser
													: new DefaultResponseParser(
															"text"),
											handler :options.handler ? options.handler
													: this.handler,
											updateFunction :options.updateFunction
													|| null
										}, options || {});
						this.ratingParameter = AJAX_DEFAULT_PARAMETER;
					},

					setListeners : function() {
						// attach events to anchors
						var elements = $(this.options.source)
								.getElementsByTagName('a');
						for ( var j = 0; j < elements.length; j++) {
							elements[j].onmouseover = this.raterMouseOver
									.bindAsEventListener(this);
							elements[j].onmouseout = this.raterMouseOut
									.bindAsEventListener(this);
							elements[j].onclick = this.raterClick
									.bindAsEventListener(this);
						}
					},

					getCurrentRating : function(list) {
						var selectedIndex = -1;
						for ( var i = 0; i < list.length; i++) {
							if (Element.hasClassName(list[i],
									this.options.selectedClass)) {
								selectedIndex = i;
							}
						}
						return selectedIndex;
					},

					getCurrentIndex : function(list, elem) {
						var currentIndex = 0;
						for ( var i = 0; i < list.length; i++) {
							if (elem == list[i]) {
								currentIndex = i;
							}
						}
						return currentIndex;
					},

					raterMouseOver : function(e) {
						// get containing div
					var container = Event.findElement(e, 'div');

					// get list of all anchors
					var elements = container.getElementsByTagName('a');

					// find the current rating
					var selectedIndex = this.getCurrentRating(elements);

					// find the index of the 'hovered' element
					var currentIndex = this.getCurrentIndex(elements, Event
							.element(e));

					// set message
					if (this.options.messageClass) {
						$(container.id + '_message').innerHTML = Event
								.element(e).title;
					}

					// iterate over each anchor and apply styles
					for ( var i = 0; i < elements.length; i++) {
						if (selectedIndex > -1) {
							if (i <= selectedIndex && i <= currentIndex)
								Element.addClassName(elements[i],
										this.options.selectedOverClass);
							else if (i <= selectedIndex && i > currentIndex)
								Element.addClassName(elements[i],
										this.options.selectedLessClass);
							else if (i > selectedIndex && i <= currentIndex)
								Element.addClassName(elements[i],
										this.options.overClass);
						} else {
							if (i <= currentIndex)
								Element.addClassName(elements[i],
										this.options.overClass);
						}
					}
				},

				raterMouseOut : function(e) {
					// get containing div
					var container = Event.findElement(e, 'div');

					// get list of all anchors
					var elements = container.getElementsByTagName('a');

					// clear message
					if (this.options.messageClass) {
						$(container.id + '_message').innerHTML = '';
					}

					// iterate over each anchor and apply styles
					for ( var i = 0; i < elements.length; i++) {
						Element.removeClassName(elements[i],
								this.options.selectedOverClass);
						Element.removeClassName(elements[i],
								this.options.selectedLessClass);
						Element.removeClassName(elements[i],
								this.options.overClass);
					}
				},

				raterClick : function(e) {
					// get containing div
					var container = Event.findElement(e, 'div');

					// get list of all anchors
					var elements = container.getElementsByTagName('a');

					// find the index of the 'hovered' element
					var currentIndex = this.getCurrentIndex(elements, Event
							.element(e));

					// update styles
					for ( var i = 0; i < elements.length; i++) {
						Element.removeClassName(elements[i],
								this.options.selectedOverClass);
						Element.removeClassName(elements[i],
								this.options.selectedLessClass);
						Element.removeClassName(elements[i],
								this.options.overClass);
						if (i <= currentIndex) {
							if (Element.hasClassName(container, 'onoff')
									&& Element.hasClassName(elements[i],
											this.options.selectedClass)) {
								Element.removeClassName(elements[i],
										this.options.selectedClass);
							} else {
								Element.addClassName(elements[i],
										this.options.selectedClass);
							}
						} else if (i > currentIndex) {
							Element.removeClassName(elements[i],
									this.options.selectedClass);
						}
					}

					// send AJAX
					var ratingToSend = elements[currentIndex].title;
					if (Element.hasClassName(container, 'onoff')) {
						// send opposite of what was selected
						var ratings = this.options.ratings.split(',');
						if (ratings[0] == ratingToSend)
							ratingToSend = ratings[1];
						else
							ratingToSend = ratings[0];
						elements[currentIndex].title = ratingToSend;
					}
					this.execute(ratingToSend);

					// set field (if defined)
					if (this.options.state) {
						$(this.options.state).value = ratingToSend;
					}
				},

				execute : function(ratingValue) {
					if (Object.isFunction(this.options.preFunction)) {
						this.options.preFunction();
					}
					if (this.options.cancelExecution) {
						this.cancelExecution = false;
						return;
					}
					// parse parameters and do replacements
					var ajaxParameters = this.options.parameters || '';
					var re = new RegExp("(\\{" + this.ratingParameter + "\\})",
							'g');
					ajaxParameters = ajaxParameters.replace(re, ratingValue);
					var params = buildParameterString(ajaxParameters);

					var obj = this; // required because 'this' conflict with
					// Ajax.Request
					var toggleStateFunc = this.getToggleStateValue;
					var aj = new Ajax.Request(this.url, {
						asynchronous :true,
						method : this.getMethod(),
						evalScripts :true,
						parameters :params,
						onSuccess : function(request) {
							obj.options.parser.load(request);
							obj.options.handler(request, {
								items :obj.options.parser.content
							});
						},
						onFailure : function(request) {
							if (Object.isFunction(obj.options.errorFunction)) {
								obj.options.errorFunction();
							}
						},
						onComplete : function(request) {
							if (Object.isFunction(obj.options.postFunction)) {
								obj.options.postFunction();
							}
						}
					});
				},

				handler : function(request, roptions) {
					// daten in items
					var erg = roptions.items[0][0]; // on/off / 1,2,3
					if (Object.isFunction(this.updateFunction)) {
						this.updateFunction(erg); // ??? XXX do we need this!
					}
				},

				getToggleStateValue : function(name, results) {
					for ( var i = 0; i < results.length; i++) {
						if (results[i][0] == name) {
							return results[i][1];
						}
					}
					return "";
				}

				});

/**
 * CALLOUT TAG
 */
AjaxJspTag.Callout = Class.create(AjaxJspTag.Base , {

	initialize : function(url, options) {
		this.url = url;
		this.setOptions(options);
		this.setListeners();
		addAjaxListener(this);
	}, 

	setOptions : function(options) {
		this.options = Object.extend( {
			parameters :options.parameters || '',
			overlib :options.overlib || AJAX_CALLOUT_OVERLIB_DEFAULT,
			parser :options.parser ? options.parser
					: new ResponseXmlToHtmlParser(),
			openEvent :options.openEvent ? options.openEvent : "mouseover",
			closeEvent :options.closeEvent ? options.closeEvent : "mouseout"
		}, options || {});
	},

	setListeners : function() {
		if (this.options.sourceClass) {
			var elemList = document
					.getElementsByClassName(this.options.sourceClass);
			for ( var i = 0; i < elemList.length; i++) {
				elemList[i]["on" + this.options.openEvent ] =  this.calloutOpen.bindAsEventListener(this);
				elemList[i]["on" + this.options.closeEvent ] = this.calloutClose.bindAsEventListener(this);
			}
		}
	},

	calloutOpen : function(e) {
		this.execute(e);
	},

	calloutClose : function(e) {
		nd();
	},

	execute : function(e) {
		if (Object.isFunction(this.options.preFunction)) {
			this.options.preFunction();
		}
		if (this.options.cancelExecution) {
			this.cancelExecution = false;
			return;
		}
		// parse parameters and do replacements
		var ajaxParameters = this.options.parameters || '';
		var re = new RegExp("(\\{" + AJAX_DEFAULT_PARAMETER+ "\\})", 'g');
		var elem = Event.element(e);
		if (elem.type) {
			ajaxParameters = ajaxParameters.replace(re, $F(elem));
		} else {
			ajaxParameters = ajaxParameters.replace(re, elem.innerHTML);
		}
		var params = buildParameterString(ajaxParameters);

		var obj = this; // required because 'this' conflict with Ajax.Request
		var aj = new Ajax.Request(this.url, {
			asynchronous :true,
			method : this.getMethod(),
			evalScripts :true,
			parameters :params,
			onSuccess : function(request) {
				obj.options.parser.load(request);
				obj.handler(obj.options.parser.content, {
					title :obj.options.title,
					overlib :obj.options.overlib
				});
			},
			onFailure : function(request) {
				if (Object.isFunction(obj.options.errorFunction)) {
					obj.options.errorFunction();
				}
			},
			onComplete : function(request) {
				if (Object.isFunction(obj.options.postFunction)) {
					obj.options.postFunction();
				}
			}
		});
	},

	handler : function(content, options) {
		if (content != "") { // #4
			if (options.overlib) {
				if (options.title) {
					return overlib(content,CAPTION,options.title,options.overlib);
				} else {
					return overlib(content,options.overlib);
				}
			} else {
				if (options.title) {
					return overlib(content, CAPTION, options.title);
				} else {
					return overlib(content);
				}
			}
		}
	}
});