define([
		"dojo/Evented",
		"dojo/on",
		"dojo/dom",
		"dojo/_base/declare",
		"dojo/dom-construct",
		"dojo/dom-style",
		"dojo/_base/lang",
		"dojo/dom-class",
		"esri/domUtils",
		"esri/InfoWindowBase",
		"base/utils/GeometryUtil",
		"controls/Queryinfowindow/InfoTemplate"
	],
	function(
		Evented,
		on,
		dom,
		declare,
		domConstruct,
		domStyle,
		lang,
		domClass,
		domUtils,
		InfoWindowBase,
		GeometryUtil,
		InfoTemplate
	) {
		return declare([InfoWindowBase, Evented], {

			isContentShowing: false,
			_location: null,
			_pointerDiv: null,
			_items: [],
			_nextButton: null,
			_preButton: null,
			_countSpan: null,
			titleField: "title",
			contentField: "content",
			_currentGraphic: null,
			_currentIndex: 0,
			_correctButton: null,
			width: 355,
			height: 210,
			infoTemplate: null,
			constructor: function(parameters) {
				var csspath = require.toUrl("controls/Queryinfowindow/InfoWindow.css");
				dojo.create("link", {
						href: csspath,
						type: 'text/css',
						rel: 'stylesheet'
					},
					document.getElementsByTagName('head')[0]);
				lang.mixin(this, parameters);

				this.offsetX = 0;
				this.offsetX = 0;

				domClass.add(this.domNode, "custom-infoWindow");
				this._controlbar = domConstruct.create("div", {
					"class": "custom-infoWindow-controlbar"
				}, this.domNode);
				this._title = domConstruct.create("span", {
					"class": "custom-infoWindow-title"
				}, this._controlbar);
				this._closeButton = domConstruct.create("span", {
					"class": "custom-infoWindow-closebutton",
					"title": "关闭"
				}, this._controlbar);
				domConstruct.create("span", {
					"class": "custom-infoWindow-split"
				}, this._controlbar);
				this._correctButton = domConstruct.create("span", {
					"class": "custom-infoWindow-correctbutton",
					"title": "纠错"
				}, this._controlbar);
				this._content = domConstruct.create("div", {
					"class": "custom-infoWindow-content"
				}, this.domNode);
				this._pointerDiv = domConstruct.create("div", {
					"class": "custom-infoWindow-pointer"
				}, this.domNode);
				this._nextButton = domConstruct.create("span", {
					"class": "custom-infoWindow-nextbutton",
					"title": "下一条"
				}, this._controlbar);
				this._countSpan = domConstruct.create("span", {
					"class": "custom-infoWindow-count",
					"innerHTML": "1/20"
				}, this._controlbar);
				this._preButton = domConstruct.create("span", {
					"class": "custom-infoWindow-prebutton",
					"title": "上一条"
				}, this._controlbar);
				on(this._closeButton, "click", lang.hitch(this, function() {
					this.hide();
				}));
				on(this._preButton, "click", lang.hitch(this, function() {
					if (this._currentIndex > 0) {
						this._currentIndex--;
						this.showItem(this._items[this._currentIndex]);
						this._countSpan.innerHTML = (this._currentIndex + 1) + "/" + this._items.length;
					}
				}));
				on(this._nextButton, "click", lang.hitch(this, function() {
					if (this._currentIndex < this._items.length - 1) {
						this._currentIndex++;
						this.showItem(this._items[this._currentIndex]);
						this._countSpan.innerHTML = (this._currentIndex + 1) + "/" + this._items.length;
					}
				}));
				domUtils.hide(this.domNode);
				this.isShowing = false;
				this.setItems([]);
				this.resize(this.width, this.height);
			},
			setMap: function(map) {
				this.inherited(arguments);
				if (!this.domNode.parentNode) {
					domConstruct.place(this.domNode, dom.byId(map.id));
				}
				this.infoTemplate = new InfoTemplate();
				domConstruct.place(this.infoTemplate.domNode, this._content);
				this.infoTemplate.startup();
				map.on("pan-start", lang.hitch(this, function() {
					//this.hide();
				}));
				map.on("zoom-start", lang.hitch(this, function() {
					//this.hide();
				}));
				map.on("pan", lang.hitch(this, function(evt) {
					if (this.isShowing) {
						this._show(this._location, evt.delta.x, evt.delta.y);
					}
				}));
				map.on("pan-end", lang.hitch(this, function() {
					if (this.isShowing) {
						this._show(this._location);
					}

				}));
				map.on("zoom-end", lang.hitch(this, function() {
					if (this.isShowing) {
						this._show(this._location);
					}
				}));

			},
			setTitle: function(title) {
				var thisWidth = domStyle.get(this.domNode, "width");
				domStyle.set(this._title, "maxWidth", (thisWidth - 40).toString() + "px");
				this.place(title, this._title);

			},
			setContent: function(content, width, height) {
				this.infoTemplate.reset();
				this.infoTemplate.setContent(content);
				if (width !== undefined && height !== undefined) {
					this.resize(width, height);
				} else {
					this.resize(355, 210);
				}
			},
			setTitleAndContent: function(title, content, showTab, width, height) {
				//this.place(content, this._content);

				this.setContent(content, width, height);
				this.setTitle(title);
				if (showTab !== undefined) {
					if (!showTab) {
						this.infoTemplate.hideTab();
					}
				}
			},
			setTab: function(type) {
				this.infoTemplate.switchTab(type);
			},
			setGraphic: function(graphic) {
				this.infoTemplate.setGraphic(graphic);
			},
			getGraphic: function(graphic) {
				return this.infoTemplate.getGraphic();
			},
			show: function(location, offsexX, offsetY) {
				if (offsexX)
					this.offsetX = offsexX;
				else
					this.offsetX = 0;
				if (offsetY)
					this.offsetY = offsetY;
				else
					this.offsetY = 0;
				this._show(location);
			},
			_show: function(location, dx, dy) {
				if (!location) {
					return;
				}
				if (location.type && location.type != "point") {
					location = GeometryUtil.getCenter(location);
				}
				this._location = location;
				if (location.spatialReference) {
					location = this.map.toScreen(location);
				}
				var position = this._getPosition(location.x, location.y)
				if (dx) {
					location.x = location.x + dx;
				}
				if (dy) {
					location.y = location.y + dy
				}
				location.x += this.offsetX;
				location.y += this.offsetY;
				this._positionWindow(position, location)
					//display the info window
				domUtils.show(this.domNode);
				this.isShowing = true;
				this.onShow();
			},
			hide: function() {
				domUtils.hide(this.domNode);
				this.isShowing = false;
				this.onHide();

			},
			resize: function(width, height) {
				this.width = width;
				this.height = height;
				if (!this.domNode) {
					return;
				}
				//          domStyle.set(this._content,{
				//            "width": width + "px"
				//          });
				//          domStyle.set(this._controlbar,{
				//            "width": width + "px"
				//          });
				domStyle.set(this.domNode, {
					"width": width + "px",
					"height": (height + 30).toString() + "px"
				});
				if (this.isShowing) {
					this._show(this._location);
				}

			},
			destroy: function() {
				domConstruct.destroy(this.domNode);
				this._closeButton = this._title = this._content = null;
			},

			_positionWindow: function(arg, location) {
				var thisWidth = domStyle.get(this.domNode, "width");
				var thisHeight = domStyle.get(this.domNode, "height");
				domClass.remove(this._pointerDiv);
				domClass.add(this._pointerDiv, "custom-infoWindow-pointer");
				switch (arg) {
					case "topLeft":
						domStyle.set(this.domNode, {
							"left": (location.x - 12) + "px",
							"top": location.y + 10 + "px"
						});
						domClass.add(this._pointerDiv, "pointer-top");
						domStyle.set(this._pointerDiv, {
							"left": "3px",
							"top": "-9px"
						});
						break;
					case "topRight":
						domStyle.set(this.domNode, {
							"left": (location.x - thisWidth + 11) + "px",
							"top": location.y + 10 + "px"
						});
						domClass.add(this._pointerDiv, "pointer-top");
						domStyle.set(this._pointerDiv, {
							"left": (thisWidth - 19) + "px",
							"top": "-9px"
						});
						break;
					case "top":
						domStyle.set(this.domNode, {
							"left": (location.x - thisWidth / 2) + "px",
							"top": location.y + 10 + "px"
						});
						domClass.add(this._pointerDiv, "pointer-top");
						domStyle.set(this._pointerDiv, {
							"left": (thisWidth / 2 - 8) + "px",
							"top": "-9px"
						});
						break;
					case "left":
						domStyle.set(this.domNode, {
							"left": location.x + 12 + "px",
							"top": (location.y - thisHeight / 2 - 15) + "px"
						});
						domClass.add(this._pointerDiv, "pointer-left");
						domStyle.set(this._pointerDiv, {
							"left": "-10px",
							"top": (thisHeight / 2 + 5) + "px"
						});
						break;
					case "right":
						domStyle.set(this.domNode, {
							"left": (location.x - (thisWidth + 12)) + "px",
							"top": (location.y - thisHeight / 2 - 15) + "px"
						});
						domClass.add(this._pointerDiv, "pointer-right");
						domStyle.set(this._pointerDiv, {
							"left": (thisWidth - 8) + "px",
							"top": (thisHeight / 2 + 5) + "px"
						});
						break;
					case "bottomLeft":
						domStyle.set(this.domNode, {
							"left": (location.x - 12) + "px",
							"top": (location.y - thisHeight - 12) + "px"
						});
						domClass.add(this._pointerDiv, "pointer-bottom");
						domStyle.set(this._pointerDiv, {
							"left": "3px",
							"top": (thisHeight - 8) + "px"
						});
						break;
					case "bottomRight":
						domStyle.set(this.domNode, {
							"left": (location.x - thisWidth + 11) + "px",
							"top": (location.y - thisHeight - 12) + "px"
						});
						domClass.add(this._pointerDiv, "pointer-bottom");
						domStyle.set(this._pointerDiv, {
							"left": (thisWidth - 20) + "px",
							"top": (thisHeight - 8) + "px"
						});
						break;
						//	        	case "bottom":
						//	        		break;
					default:
						//默认pointer显示在下面
						domStyle.set(this.domNode, {
							"left": (location.x - thisWidth / 2) + "px",
							"top": (location.y - thisHeight - 12) + "px"
						});
						domClass.add(this._pointerDiv, "pointer-bottom");
						domStyle.set(this._pointerDiv, {
							"left": (thisWidth / 2 - 10) + "px",
							"top": (thisHeight - 8) + "px"
						});
						break;
				}
			},

			/**
			 * 计算pointer处于的方位，左上、上、右上、左、默认、右、左下、下、右下
			 * @param x 
			 * @param y
			 */
			_getPosition: function(x, y) {

				var widthPer = this.map.width / 4
				var heightPer = this.map.height / 4
				if (y < heightPer) {
					if (x < widthPer) {
						return "topLeft";
					} else if (x > widthPer * 3) {
						return "topRight";
					} else {
						return "top";
					}
				}
				if (y >= heightPer && y < heightPer * 3) {
					if (x < widthPer) {
						return "left";
					} else if (x > widthPer * 3) {
						return "right";
					} else {
						return "default";
					}
				}
				if (y > heightPer * 3) {
					if (x < widthPer) {
						return "bottomLeft";
					} else if (x > widthPer * 3) {
						return "bottomRight";
					} else {
						return "bottom";
					}
				} else {
					return "default";
				}
			},
			setItems: function(items) {
				this._items = items;
				if (!this.domNode)
					return;
				var thisWidth = domStyle.get(this.domNode, "width");
				if (!items || items.length <= 1) {
					//domStyle.set(this._content,"bottom","20px");
					//domStyle.set(this._pageDiv,"display","none");
					domStyle.set(this._title, "maxWidth", (thisWidth - 40).toString() + "px");
					domStyle.set(this._nextButton, "display", "none");
					domStyle.set(this._countSpan, "display", "none");
					domStyle.set(this._preButton, "display", "none");
					_currentIndex = 0;
				} else {
					//有多个graphics
					domStyle.set(this._title, "maxWidth", (thisWidth - 135).toString() + "px");
					this.showItem(items[0]);
					domStyle.set(this._nextButton, "display", "inline-block");
					domStyle.set(this._countSpan, "display", "inline-block");
					domStyle.set(this._preButton, "display", "inline-block");
					this._countSpan.innerHTML = "1/" + this._items.length;
					_currentIndex = 0;
					return;
				}
				if (items.length == 1) {
					//如果只有一个graphic
					this.showItem(items[_currentIndex]);
				}
			},
			showItem: function(item) {
				if (item) {
					if (item[this.titleField]) {
						this._title.innerHTML = item[this.titleField];
					} else {
						this._title.innerHTML = "无标题";
					}
					if (item[this.contentField]) {
						this.setContent(item[this.contentField]);
					} else {
						this.setContent("");
					}
				}
				this._location = item.geometry;
				if (this.isShowing) {
					this._show(this._location);
				}
				//        	var maxWidth = domStyle.get(this._title,"maxWidth");
				//        	if(maxWidth<this._title.offsetWidth)
				//    		{
				//        		this._title.title = graphic.attributes[this.titleField];
				//    		}
				//        	else
				//    		{
				//        		this._title.title = "";
				//    		}
			}

		});

	});