зеркало из https://github.com/telerik/docs-seed.git
feat: Knowledge base portal search added.
This commit is contained in:
imtodor
Родитель
071c5418c8
Коммит
13cd1f2656
|
|
@ -0,0 +1,76 @@
|
|||
//= require search-base
|
||||
var DEFAULT_KB_QUERY = "knowledge base";
|
||||
|
||||
function trackSearchResult(link) {
|
||||
trackItem("docs-kb-search-results", searchTerms, link);
|
||||
}
|
||||
|
||||
function getSearchQuery() {
|
||||
return $('input[name="q"]').val() || DEFAULT_KB_QUERY;
|
||||
}
|
||||
|
||||
function attachToEvents() {
|
||||
$('input[name="q"].kb-search').keydown(function (e) {
|
||||
if (e.keyCode == 13) { // Enter
|
||||
var $this = $(this);
|
||||
searchInternal($this);
|
||||
$("#results").data('kendoListView').dataSource.read();
|
||||
return true;
|
||||
}
|
||||
});
|
||||
|
||||
$("div#results").on("click", "a", function (e) {
|
||||
trackSearchResult($(this).attr("href"));
|
||||
});
|
||||
}
|
||||
|
||||
function getSearchCategory() {
|
||||
return "docs-kb-search-terms";
|
||||
}
|
||||
|
||||
function getDataSource() {
|
||||
return new kendo.data.DataSource({
|
||||
transport: {
|
||||
parameterMap: function (data) {
|
||||
return {
|
||||
start: 1 + data.skip,
|
||||
num: data.pageSize,
|
||||
cx: gcsInstance,
|
||||
key: gcsKey,
|
||||
q: getSearchQuery() + searchViewModel.getFilterExpression(),
|
||||
};
|
||||
},
|
||||
read: {
|
||||
url: GCSE_API_URL
|
||||
}
|
||||
},
|
||||
change: function () {
|
||||
var resultsPresent = this.data().length > 0;
|
||||
$("#search-container").toggle(resultsPresent);
|
||||
$("#no-results").toggle(!resultsPresent);
|
||||
|
||||
setSideNavPosition();
|
||||
},
|
||||
serverPaging: true,
|
||||
pageSize: 10,
|
||||
schema: {
|
||||
type: "json",
|
||||
data: function (data) {
|
||||
if (parseInt(data.searchInformation.totalResults) === 0) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return data.items.map(function (item) {
|
||||
return {
|
||||
title: item.htmlTitle,
|
||||
url: item.link,
|
||||
excerpt: item.htmlSnippet
|
||||
};
|
||||
});
|
||||
},
|
||||
total: function (data) {
|
||||
return data.searchInformation.totalResults;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -0,0 +1,177 @@
|
|||
var PAGE_FILTER = " more:pagemap:metatags-restype:";
|
||||
var GCSE_ELEMENT_NAME = "google-search";
|
||||
var GCSE_API_URL = "https://www.googleapis.com/customsearch/v1";
|
||||
var searchTerms = "";
|
||||
var searchItemsStorageKey = "searchItemsStorageKey";
|
||||
var siteHasKbPortal, isKbPage, isKbPortalRoot;
|
||||
|
||||
var searchViewModel = kendo.observable({
|
||||
kb: false,
|
||||
documentation: false,
|
||||
api: false,
|
||||
label: "",
|
||||
filterValues: [],
|
||||
getFilter: function () {
|
||||
var filterExpression = '';
|
||||
for (var i = 0; i < this.filterValues.length; i++) {
|
||||
if (filterExpression !== '') {
|
||||
filterExpression += ',';
|
||||
}
|
||||
|
||||
filterExpression += this.filterValues[i];
|
||||
}
|
||||
|
||||
return filterExpression;
|
||||
},
|
||||
getFilterExpression: function () {
|
||||
var filter = this.getFilter();
|
||||
return filter !== '' ? PAGE_FILTER + filter : '';
|
||||
},
|
||||
updateLabel: function () {
|
||||
var label = "";
|
||||
this.filterValues = [];
|
||||
|
||||
if ((this.kb && this.documentation && this.api) || (!this.kb && !this.documentation && !this.api)) {
|
||||
label = "Search all";
|
||||
} else {
|
||||
if (this.documentation) {
|
||||
label += "DOCS";
|
||||
this.filterValues.push('documentation');
|
||||
}
|
||||
|
||||
if (this.kb) {
|
||||
label += (label ? " / " : "") + "KB";
|
||||
this.filterValues.push('kb');
|
||||
}
|
||||
|
||||
if (this.api) {
|
||||
label += (label ? " / " : "") + "API";
|
||||
this.filterValues.push('api');
|
||||
}
|
||||
|
||||
label = "Search in " + label;
|
||||
}
|
||||
|
||||
this.set("label", label);
|
||||
},
|
||||
update: function () {
|
||||
this.updateLabel();
|
||||
localStorage.setItem(searchItemsStorageKey, JSON.stringify(this.filterValues));
|
||||
updateSearchLayout();
|
||||
|
||||
},
|
||||
init: function () {
|
||||
var propertyNames = false; // JSON.parse(localStorage.getItem(searchItemsStorageKey));
|
||||
if (!propertyNames) {
|
||||
propertyNames = [];
|
||||
|
||||
if (isKbPage || isKbPortalRoot || siteHasKbPortal) {
|
||||
propertyNames.push('kb');
|
||||
} else {
|
||||
propertyNames.push('documentation', 'api');
|
||||
if (siteHasKbPortal) {
|
||||
propertyNames.push('kb');
|
||||
}
|
||||
}
|
||||
|
||||
localStorage.setItem(searchItemsStorageKey, JSON.stringify(propertyNames));
|
||||
}
|
||||
|
||||
for (var i = 0; i < propertyNames.length; i++) {
|
||||
searchViewModel.set(propertyNames[i], true);
|
||||
}
|
||||
|
||||
searchViewModel.updateLabel();
|
||||
}
|
||||
});
|
||||
|
||||
function init() {
|
||||
var popup = $("#refine-search-popup").kendoPopup({
|
||||
anchor: $("#refine-search-container"),
|
||||
origin: "bottom right",
|
||||
position: "top right",
|
||||
}).data("kendoPopup");
|
||||
|
||||
$("#refine-search-button").on("click", function () {
|
||||
popup.toggle();
|
||||
});
|
||||
|
||||
searchViewModel.init();
|
||||
|
||||
kendo.bind($(".search-input-container"), searchViewModel);
|
||||
kendo.bind($("#refine-search-popup"), searchViewModel);
|
||||
|
||||
$(".custom-checkbox input[type='checkbox']").change(function () {
|
||||
searchViewModel.update();
|
||||
});
|
||||
|
||||
attachToEvents();
|
||||
updateSearchLayout();
|
||||
}
|
||||
|
||||
function attachToEvents() { }
|
||||
|
||||
function search(input) {
|
||||
searchTerms = input.val();
|
||||
trackSearchQuery(searchViewModel.getFilterExpression(), searchTerms);
|
||||
}
|
||||
|
||||
function trackSearchQuery(filter, query) {
|
||||
trackItem(getSearchCategory(), filter, query);
|
||||
}
|
||||
|
||||
function getSearchCategory() { }
|
||||
|
||||
function searchInternal(input) {
|
||||
closePopup();
|
||||
search(input);
|
||||
}
|
||||
|
||||
function closePopup() {
|
||||
var popup = $("#refine-search-popup").data("kendoPopup");
|
||||
popup.close();
|
||||
}
|
||||
|
||||
function updateSearchLayout() {
|
||||
$('#local-search').css('padding-right', $('#refine-search-button').outerWidth());
|
||||
}
|
||||
|
||||
function getDataSource() { }
|
||||
|
||||
$(function () {
|
||||
init();
|
||||
|
||||
var ds = getDataSource();
|
||||
|
||||
$("#results").kendoListView({
|
||||
dataSource: ds,
|
||||
template: $("#results-template").html(),
|
||||
dataBound: function () {
|
||||
window.scrollTo(0, 0);
|
||||
setSideNavPosition();
|
||||
}
|
||||
});
|
||||
|
||||
$(".site-pager").kendoPager({
|
||||
dataSource: ds,
|
||||
buttonCount: 5,
|
||||
messages: {
|
||||
previous: "Previous",
|
||||
next: "Next",
|
||||
display: "",
|
||||
empty: ""
|
||||
}
|
||||
});
|
||||
|
||||
$(".results-message").kendoPager({
|
||||
dataSource: ds,
|
||||
numeric: false,
|
||||
previousNext: false,
|
||||
messages: {
|
||||
display: "{0}-{1} of {2} results",
|
||||
empty: "Sorry, there were no results found. Maybe try a broader search."
|
||||
}
|
||||
});
|
||||
|
||||
setSideNavPosition();
|
||||
});
|
||||
|
|
@ -1,128 +1,4 @@
|
|||
var PAGE_FILTER = " more:pagemap:metatags-restype:";
|
||||
var GCSE_ELEMENT_NAME = "google-search";
|
||||
var GCSE_API_URL = "https://www.googleapis.com/customsearch/v1";
|
||||
var searchTerms = "";
|
||||
var searchItemsStorageKey = "searchItemsStorageKey";
|
||||
var siteHasKbPortal, isKbPage, isKbPortalRoot;
|
||||
|
||||
var searchViewModel = kendo.observable({
|
||||
kb: false,
|
||||
documentation: false,
|
||||
api: false,
|
||||
label: "",
|
||||
filterValues: [],
|
||||
getFilter: function () {
|
||||
var filterExpression = '';
|
||||
for (var i = 0; i < this.filterValues.length; i++) {
|
||||
if (filterExpression !== '') {
|
||||
filterExpression += ',';
|
||||
}
|
||||
|
||||
filterExpression += this.filterValues[i];
|
||||
}
|
||||
|
||||
return filterExpression;
|
||||
},
|
||||
getFilterExpression: function() {
|
||||
var filter = this.getFilter();
|
||||
return filter !== '' ? PAGE_FILTER + filter : '';
|
||||
},
|
||||
updateLabel: function() {
|
||||
var label = "";
|
||||
this.filterValues = [];
|
||||
|
||||
if ((this.kb && this.documentation && this.api) || (!this.kb && !this.documentation && !this.api)) {
|
||||
label = "Search all";
|
||||
} else {
|
||||
if (this.documentation) {
|
||||
label += "DOCS";
|
||||
this.filterValues.push('documentation');
|
||||
}
|
||||
|
||||
if (this.kb || isKbPortalRoot) {
|
||||
label += (label ? " / " : "") + "KB";
|
||||
this.filterValues.push('kb');
|
||||
}
|
||||
|
||||
if (this.api) {
|
||||
label += (label ? " / " : "") + "API";
|
||||
this.filterValues.push('api');
|
||||
}
|
||||
|
||||
label = "Search in " + label;
|
||||
}
|
||||
|
||||
this.set("label", label);
|
||||
},
|
||||
update: function () {
|
||||
this.updateLabel();
|
||||
localStorage.setItem(searchItemsStorageKey, JSON.stringify(this.filterValues));
|
||||
updateSearchLayout();
|
||||
|
||||
},
|
||||
init: function () {
|
||||
var propertyNames = false; // JSON.parse(localStorage.getItem(searchItemsStorageKey));
|
||||
if (!propertyNames) {
|
||||
propertyNames = [];
|
||||
|
||||
if (isKbPage) {
|
||||
propertyNames.push('kb');
|
||||
} else {
|
||||
propertyNames.push('documentation', 'api');
|
||||
if (siteHasKbPortal === 'true') {
|
||||
propertyNames.push('kb');
|
||||
}
|
||||
}
|
||||
|
||||
localStorage.setItem(searchItemsStorageKey, JSON.stringify(propertyNames));
|
||||
}
|
||||
|
||||
for (var i = 0; i < propertyNames.length; i++) {
|
||||
searchViewModel.set(propertyNames[i], true);
|
||||
}
|
||||
|
||||
searchViewModel.updateLabel();
|
||||
}
|
||||
});
|
||||
|
||||
function init() {
|
||||
var popup = $("#refine-search-popup").kendoPopup({
|
||||
anchor: $("#refine-search-container"),
|
||||
origin: "bottom right",
|
||||
position: "top right",
|
||||
}).data("kendoPopup");
|
||||
|
||||
$("#refine-search-button").on("click", function () {
|
||||
popup.toggle();
|
||||
});
|
||||
|
||||
searchViewModel.init();
|
||||
|
||||
kendo.bind($(".search-input-container"), searchViewModel);
|
||||
kendo.bind($("#refine-search-popup"), searchViewModel);
|
||||
|
||||
$(".custom-checkbox input[type='checkbox']").change(function () {
|
||||
searchViewModel.update();
|
||||
});
|
||||
|
||||
attachToEvents();
|
||||
updateSearchLayout();
|
||||
}
|
||||
|
||||
function search(input) {
|
||||
searchTerms = input.val();
|
||||
trackSearchQuery(searchViewModel.getFilterExpression(), searchTerms);
|
||||
}
|
||||
|
||||
function closePopup() {
|
||||
var popup = $("#refine-search-popup").data("kendoPopup");
|
||||
popup.close();
|
||||
}
|
||||
|
||||
function searchInternal(input) {
|
||||
closePopup();
|
||||
search(input);
|
||||
}
|
||||
//= require search-base
|
||||
|
||||
function attachToEvents() {
|
||||
$('form input[name="q"]').keydown(function (e) {
|
||||
|
|
@ -139,32 +15,26 @@ function attachToEvents() {
|
|||
});
|
||||
}
|
||||
|
||||
function trackSearchQuery(filter, query) {
|
||||
trackItem("docs-search-terms", filter, query);
|
||||
function getSearchCategory() {
|
||||
return "docs-search-terms";
|
||||
}
|
||||
|
||||
function trackSearchResult(link) {
|
||||
trackItem("docs-search-results", searchTerms, link);
|
||||
}
|
||||
|
||||
function updateSearchLayout() {
|
||||
$('#local-search').css('padding-right', $('#refine-search-button').outerWidth());
|
||||
function toKV(n) {
|
||||
n = n.split("=");
|
||||
this[n[0]] = n[1];
|
||||
return this;
|
||||
}
|
||||
|
||||
$(function () {
|
||||
init();
|
||||
|
||||
function toKV(n) {
|
||||
n = n.split("=");
|
||||
this[n[0]] = n[1];
|
||||
return this;
|
||||
}
|
||||
|
||||
function getDataSource() {
|
||||
var params = location.search.replace(/(^\?)/, '').split("&").map(toKV.bind({}))[0];
|
||||
searchTerms = decodeURIComponent(params.q ? params.q.replace(/\+/g,' ') : '');
|
||||
$("[name=q]").val(searchTerms);
|
||||
|
||||
var ds = new kendo.data.DataSource({
|
||||
return new kendo.data.DataSource({
|
||||
transport: {
|
||||
parameterMap: function (data) {
|
||||
return {
|
||||
|
|
@ -208,36 +78,4 @@ $(function () {
|
|||
}
|
||||
}
|
||||
});
|
||||
|
||||
$("#results").kendoListView({
|
||||
dataSource: ds,
|
||||
template: $("#results-template").html(),
|
||||
dataBound: function () {
|
||||
window.scrollTo(0, 0);
|
||||
setSideNavPosition();
|
||||
}
|
||||
});
|
||||
|
||||
$(".site-pager").kendoPager({
|
||||
dataSource: ds,
|
||||
buttonCount: 5,
|
||||
messages: {
|
||||
previous: "Previous",
|
||||
next: "Next",
|
||||
display: "",
|
||||
empty: ""
|
||||
}
|
||||
});
|
||||
|
||||
$(".results-message").kendoPager({
|
||||
dataSource: ds,
|
||||
numeric: false,
|
||||
previousNext: false,
|
||||
messages: {
|
||||
display: "{0}-{1} of {2} results",
|
||||
empty: "Sorry, there were no results found. Maybe try a broader search."
|
||||
}
|
||||
});
|
||||
|
||||
setSideNavPosition();
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,10 +26,10 @@
|
|||
</form>
|
||||
|
||||
<script>
|
||||
var gcsInstance = {% if page.slug == 'knowledge_base' %} '{{site.gcs_kb_engine}}' {% else %} '{{site.gcs_engine}}' {% endif %};
|
||||
var gcsInstance = '{{site.gcs_engine}}';
|
||||
var gcsKey = '{{site.gcs_api_key}}';
|
||||
isKbPage = {% if page.res_type == 'kb' %} true {% else %} false {% endif %};
|
||||
siteHasKbPortal = '{{ site.has_kb_portal }}';
|
||||
siteHasKbPortal = '{{ site.has_kb_portal }}'
|
||||
</script>
|
||||
|
||||
{% javascript "search-results" %}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,38 @@ res_type: kb
|
|||
<article>
|
||||
<h1>{{ page.heading }}</h1>
|
||||
<div class="local-search mt-20">
|
||||
{% include search.html %}
|
||||
<div class="search-input-container">
|
||||
<input id="local-search" placeholder="Search for …" name="q" class="kb-search"/>
|
||||
<div id='refine-search-container'>
|
||||
<div id='refine-search-button' class='unselectable'>
|
||||
<span id='refine-search-label' data-bind='text: label'></span>
|
||||
<span class='k-icon k-i-arrow-chevron-down'></span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="refine-search-popup" style="display: none">
|
||||
<ul>
|
||||
<li>
|
||||
<label class="custom-checkbox unselectable"><input type="checkbox" {% if page.res_type != 'kb' and page.res_type != 'api' %} disabled="true" {% endif %} data-bind="checked: documentation" /><span class="k-icon k-i-check"></span>Search in Documentation</label>
|
||||
</li>
|
||||
<li>
|
||||
<label class="custom-checkbox unselectable"><input type="checkbox" {% if page.res_type == 'kb' %} disabled="true" {% endif %} data-bind="checked: kb" /><span class="k-icon k-i-check"></span>Search in Knowledge Base</label>
|
||||
</li>
|
||||
<li>
|
||||
<label class="custom-checkbox unselectable"><input type="checkbox" {% if page.res_type == 'api' %} disabled="true" {% endif %} data-bind="checked: api" /><span class="k-icon k-i-check"></span>Search in API Reference</label>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var gcsInstance = '{{site.gcs_engine}}';
|
||||
var gcsKey = '{{site.gcs_api_key}}';
|
||||
siteHasKbPortal = true;
|
||||
isKbPortalRoot = true;
|
||||
isKbPage = true;
|
||||
</script>
|
||||
|
||||
{% javascript "knowledge-base" %}
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
|
@ -29,10 +60,6 @@ res_type: kb
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
isKbPortalRoot = true;
|
||||
</script>
|
||||
|
||||
<div class="container-fluid mt-30 mb-80">
|
||||
<div class="row">
|
||||
<div class="col-sm-10 col-sm-offset-1 col-lg-offset-2">
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче