/**
|
* 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;
|
});
|
