| New file |
| | |
| | | /** |
| | | * infoWindow的template |
| | | * @author Liuyl |
| | | * @date 2015/11/9 |
| | | */ |
| | | define([ |
| | | "base/BaseControl", "base/AppEvent", |
| | | "dojo", |
| | | "dojo/_base/declare", |
| | | "dojo/_base/array", |
| | | "dojo/text!controls/searchbox/SearchBox.html", |
| | | "dojo/_base/lang", |
| | | "dojo/_base/connect", |
| | | "dojo/query", |
| | | "dojo/dom-construct", |
| | | "dojo/dom-style", |
| | | "dojo/dom-attr", |
| | | "dojo/dom-geometry", |
| | | "dojo/on", |
| | | "dojo/dom-class", |
| | | "dojo/domReady!" |
| | | ], function( |
| | | BaseControl, AppEvent, |
| | | dojo, |
| | | declare, |
| | | arrayUtil, |
| | | template, |
| | | lang, |
| | | connect, |
| | | query, |
| | | domConstruct, |
| | | domStyle, |
| | | domAttr, |
| | | domGeometry, |
| | | on, |
| | | domClass |
| | | ) { |
| | | var Widget = declare("SearchBox", [BaseControl], { |
| | | templateString: template, |
| | | baseClass: "searchbox", |
| | | constructor: function(options, srcRefNode) { |
| | | this.currentKeyword = null; |
| | | if (!this.suggestCount) |
| | | this.suggestCount = 10; |
| | | this.currentStart = 0; |
| | | this.currentCount = 0; |
| | | this.mouseOverSuggest = false; |
| | | }, |
| | | getInputValue: function() { |
| | | return this.inputTextDom.value.trim(); |
| | | }, |
| | | startup: function() { |
| | | on(this.inputButton, "click", lang.hitch(this, function(evt) { |
| | | var value = this.getInputValue(); |
| | | if (value) { |
| | | AppEvent.dispatchAppEvent(AppEvent.SEARCHBOX_QUERY, { |
| | | hockId: this.id, |
| | | type: "search", |
| | | args: { |
| | | keyword: value, |
| | | } |
| | | }); |
| | | } |
| | | this.hideSuggest(); |
| | | })); |
| | | on(this.inputClearDom, "click", lang.hitch(this, function(evt) { |
| | | this.clear(); |
| | | AppEvent.dispatchAppEvent(AppEvent.SEARCHBOX_QUERY, { |
| | | hockId: this.id, |
| | | type: "clear" |
| | | }); |
| | | })); |
| | | on(this.inputTextDom, "input", lang.hitch(this, function(evt) { |
| | | var value = this.getInputValue(); |
| | | domStyle.set(this.inputClearDom, "display", "block"); |
| | | if (!value) { |
| | | domStyle.set(this.inputClearDom, "display", "none"); |
| | | this.hideSuggest(); |
| | | } else if (this._checkChanged(value, 0)) { |
| | | this.querySuggest(value, 0); |
| | | } |
| | | this.currentKeyword = value; |
| | | AppEvent.dispatchAppEvent(AppEvent.SEARCHBOX_QUERY, { |
| | | hockId: this.id, |
| | | type: "input", |
| | | args: { |
| | | keyword: value, |
| | | } |
| | | }); |
| | | })); |
| | | on(this.inputTextDom, "keypress", lang.hitch(this, function(evt) { |
| | | if (evt.keyCode == 13) { |
| | | var value = this.getInputValue(); |
| | | if (value) { |
| | | AppEvent.dispatchAppEvent(AppEvent.SEARCHBOX_QUERY, { |
| | | hockId: this.id, |
| | | type: "search", |
| | | args: { |
| | | keyword: value, |
| | | } |
| | | }); |
| | | } |
| | | this.hideSuggest(); |
| | | } |
| | | })); |
| | | on(this.inputTextDom, "focus", lang.hitch(this, function(evt) { |
| | | //点击菜单项有可能导致触发该事件,未知原因,relatedTarget为空时为正常触发 |
| | | if (evt.relatedTarget) { |
| | | return; |
| | | } |
| | | var value = this.getInputValue(); |
| | | if (!value) { |
| | | this.hideSuggest(); |
| | | } else if (this._checkChanged(value, 0)) { |
| | | this.querySuggest(value, 0); |
| | | } else if (this.currentCount) { |
| | | this.showSuggest(); |
| | | } |
| | | this.currentKeyword = value; |
| | | })); |
| | | on(this.inputTextDom, "blur", lang.hitch(this, function(evt) { |
| | | if (!this.mouseOverSuggest) |
| | | this.hideSuggest(); |
| | | })); |
| | | |
| | | this.suggestDom = domConstruct.create("div", { |
| | | className: "searchbox-suggest-container", |
| | | "data-searchbox": this.id, |
| | | innerHTML: "<div class='searchbox-suggest' ><ul></ul></div>" |
| | | }, document.body); |
| | | this.suggestUlDom = query("ul", this.suggestDom)[0]; |
| | | on(this.suggestDom, "mouseover", lang.hitch(this, function(evt) { |
| | | this.mouseOverSuggest = true; |
| | | })); |
| | | on(this.suggestDom, "mouseleave", lang.hitch(this, function(evt) { |
| | | this.mouseOverSuggest = false; |
| | | })); |
| | | |
| | | AppEvent.addAppEventListener(AppEvent.QUERY_SUCCESS, lang.hitch(this, function(evt) { |
| | | if (evt.hockId == this.id) { |
| | | this.updateSuggest(evt); |
| | | } |
| | | })); |
| | | AppEvent.addAppEventListener(AppEvent.QUERY_ERROR, lang.hitch(this, function(evt) { |
| | | if (evt.hockId == this.id) { |
| | | this.updateSuggest(evt); |
| | | } |
| | | })); |
| | | AppEvent.addAppEventListener(AppEvent.CHANGE_SEARCHBOX_STATE, lang.hitch(this, this.onChangeStateHandler)); |
| | | |
| | | if (this.placeholder) { |
| | | domAttr.set(this.inputTextDom, "placeholder", this.placeholder); |
| | | } |
| | | if (this.disableButton) { |
| | | domStyle.set(this.inputButton, "display", "none"); |
| | | } |
| | | this.inherited(arguments); |
| | | }, |
| | | onChangeStateHandler: function(evt) { |
| | | if (evt.hockId == this.id) { |
| | | if (evt.type == "clear") { |
| | | this.clear(); |
| | | } else if (evt.type == "update") { |
| | | if (evt.data && evt.data.hasOwnProperty("keyword")) { |
| | | domAttr.set(this.inputTextDom, "value", evt.data.keyword.trim()); |
| | | if (evt.data.keyword.trim()) { |
| | | domStyle.set(this.inputClearDom, "display", "block"); |
| | | } |
| | | } |
| | | |
| | | } |
| | | } |
| | | }, |
| | | postCreate: function() { |
| | | this.inherited(arguments); |
| | | }, |
| | | _checkChanged: function(keyword, start) { |
| | | return !(this.currentKeyword == keyword && this.currentStart == start); |
| | | }, |
| | | querySuggest: function(keyword, start) { |
| | | if (!this.disableSuggest) { |
| | | AppEvent.dispatchAppEvent(AppEvent.RUN_SMART_QUERY, { |
| | | hockId: this.id, |
| | | args: { |
| | | keyword: keyword,//encodeURIComponent(keyword), |
| | | start: start, |
| | | count: this.suggestCount |
| | | } |
| | | }); |
| | | } |
| | | |
| | | }, |
| | | updateSuggest: function(evt) { |
| | | if (evt.error) { |
| | | console.log(evt.error); |
| | | } |
| | | if (evt.result) { |
| | | domConstruct.empty(this.suggestUlDom); |
| | | if (evt.result.data.count) |
| | | this.currentCount = parseInt(evt.result.data.count); |
| | | else { |
| | | this.currentCount = 0; |
| | | } |
| | | if (this.currentCount == 0) { |
| | | this.hideSuggest(); |
| | | } else if (this.currentCount == 1) { |
| | | this._buildSuggestItem(evt.result.data.items[0]||evt.result.data.items); |
| | | this.showSuggest(); |
| | | } else { |
| | | arrayUtil.forEach(evt.result.data.items, lang.hitch(this, function(item, index) { |
| | | this._buildSuggestItem(item); |
| | | })); |
| | | this.showSuggest(); |
| | | } |
| | | return; |
| | | } |
| | | this.hideSuggest(); |
| | | }, |
| | | _buildSuggestItem: function(item) { |
| | | var li = domConstruct.create("li", { |
| | | innerHTML: "<a><i class='search'>" + item.name + "</i><em>" + item.adress + "</em></a>", |
| | | className: "searchbox-suggest-item", |
| | | "data-poi-id": item.id, |
| | | "data-poi-type": item.poitype, |
| | | "data-pac": item.pac |
| | | |
| | | }, this.suggestUlDom) |
| | | on(li, "click", lang.hitch(this, function(evt) { |
| | | var value = query("i", evt.currentTarget)[0].innerHTML; |
| | | domAttr.set(this.inputTextDom, "value", value); |
| | | |
| | | var value = this.inputTextDom.value.trim(); |
| | | // AppEvent.dispatchAppEvent(AppEvent.SEARCHBOX_QUERY, { |
| | | // hockId: this.id, |
| | | // type: "suggest", |
| | | // args: { |
| | | // keyword: value, |
| | | // poiId: domAttr.get(evt.currentTarget, "data-poi-id"), |
| | | // poiName: domAttr.get(evt.currentTarget, "data-poi-type"), |
| | | // pac: domAttr.get(evt.currentTarget, "data-pac") |
| | | // } |
| | | // }); |
| | | AppEvent.dispatchAppEvent(AppEvent.SEARCHBOX_QUERY, { |
| | | hockId: this.id, |
| | | type: "search", |
| | | args: { |
| | | keyword: value, |
| | | poiType: null, |
| | | poiName: "全部" |
| | | } |
| | | }); |
| | | |
| | | this.hideSuggest(); |
| | | })); |
| | | }, |
| | | showSuggest: function() { |
| | | if (!this.disableSuggest && $(this.inputDom).is(":visible")) { |
| | | var pos = domGeometry.position(this.inputDom, true); |
| | | domStyle.set(this.suggestDom, "left", pos.x + "px"); |
| | | domStyle.set(this.suggestDom, "top", pos.y + pos.h + "px"); |
| | | domStyle.set(this.suggestDom, "width", (pos.w - 14) + "px"); |
| | | domStyle.set(this.suggestDom, "display", "block"); |
| | | } |
| | | }, |
| | | hideSuggest: function() { |
| | | if (!this.disableSuggest) { |
| | | domStyle.set(this.suggestDom, "display", "none"); |
| | | } |
| | | }, |
| | | clear: function() { |
| | | this.currentKeyword = null; |
| | | this.currentStart = 0; |
| | | this.currentCount = 0; |
| | | this.mouseOverSuggest = false; |
| | | domConstruct.empty(this.suggestUlDom); |
| | | this.hideSuggest(); |
| | | |
| | | domAttr.set(this.inputTextDom, "value", ""); |
| | | domStyle.set(this.inputClearDom, "display", "none"); |
| | | }, |
| | | show: function() { |
| | | domStyle.set(this.domNode, "display", "block"); |
| | | }, |
| | | hide: function() { |
| | | domStyle.set(this.domNode, "display", "none"); |
| | | } |
| | | }); |
| | | return Widget; |
| | | }); |