-define(['Ajax', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog'], function (Ajax, EventKey, Language, StringUtil, DomUtil, UiDialog) {
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+ if (k2 === undefined) k2 = k;
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+ if (k2 === undefined) k2 = k;
+ o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+ o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+ if (mod && mod.__esModule) return mod;
+ var result = {};
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+ __setModuleDefault(result, mod);
+ return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+ return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+define(["require", "exports", "../../Ajax", "../../Dom/Util", "../../Language", "../../StringUtil", "../Dialog"], function (require, exports, Ajax, Util_1, Language, StringUtil, Dialog_1) {
"use strict";
- if (!COMPILER_TARGET_DEFAULT) {
- var Fake = function () { };
- Fake.prototype = {
- open: function () { },
- _search: function () { },
- _click: function () { },
- _ajaxSuccess: function () { },
- _ajaxSetup: function () { },
- _dialogSetup: function () { }
- };
- return Fake;
- }
- var _callbackSelect, _resultContainer, _resultList, _searchInput = null;
- return {
- open: function (callbackSelect) {
- _callbackSelect = callbackSelect;
- UiDialog.open(this);
- },
- _search: function (event) {
+ Object.defineProperty(exports, "__esModule", { value: true });
+ exports.open = void 0;
+ Ajax = __importStar(Ajax);
+ Util_1 = __importDefault(Util_1);
+ Language = __importStar(Language);
+ StringUtil = __importStar(StringUtil);
+ Dialog_1 = __importDefault(Dialog_1);
+ class UiArticleSearch {
+ constructor() {
+ this.callbackSelect = undefined;
+ this.resultContainer = undefined;
+ this.resultList = undefined;
+ this.searchInput = undefined;
+ }
+ open(callbackSelect) {
+ this.callbackSelect = callbackSelect;
+ Dialog_1.default.open(this);
+ }
+ search(event) {
event.preventDefault();
- var inputContainer = _searchInput.parentNode;
- var value = _searchInput.value.trim();
+ const inputContainer = this.searchInput.parentElement;
+ const value = this.searchInput.value.trim();
if (value.length < 3) {
- elInnerError(inputContainer, Language.get('wcf.article.search.error.tooShort'));
+ Util_1.default.innerError(inputContainer, Language.get('wcf.article.search.error.tooShort'));
return;
}
else {
- elInnerError(inputContainer, false);
+ Util_1.default.innerError(inputContainer, false);
}
Ajax.api(this, {
parameters: {
- searchString: value
- }
+ searchString: value,
+ },
});
- },
- _click: function (event) {
+ }
+ click(event) {
event.preventDefault();
- _callbackSelect(elData(event.currentTarget, 'article-id'));
- UiDialog.close(this);
- },
- _ajaxSuccess: function (data) {
- var html = '', article;
- //noinspection JSUnresolvedVariable
- for (var i = 0, length = data.returnValues.length; i < length; i++) {
- //noinspection JSUnresolvedVariable
- article = data.returnValues[i];
- html += '<li>'
- + '<div class="containerHeadline pointer" data-article-id="' + article.articleID + '">'
- + '<h3>' + StringUtil.escapeHTML(article.name) + '</h3>'
- + '<small>' + StringUtil.escapeHTML(article.displayLink) + '</small>'
- + '</div>'
- + '</li>';
- }
- _resultList.innerHTML = html;
- window[html ? 'elShow' : 'elHide'](_resultContainer);
+ const target = event.currentTarget;
+ this.callbackSelect(+target.dataset.articleId);
+ Dialog_1.default.close(this);
+ }
+ _ajaxSuccess(data) {
+ let html = data.returnValues
+ .map(article => {
+ return `<li>
+ <div class="containerHeadline pointer" data-article-id="${article.articleID}">
+ <h3>${StringUtil.escapeHTML(article.name)}</h3>
+ <small>${StringUtil.escapeHTML(article.displayLink)}</small>
+ </div>
+ </li>`;
+ })
+ .join('');
+ this.resultList.innerHTML = html;
+ Util_1.default[html ? 'show' : 'hide'](this.resultList);
if (html) {
- elBySelAll('.containerHeadline', _resultList, (function (item) {
- item.addEventListener(WCF_CLICK_EVENT, this._click.bind(this));
- }).bind(this));
+ this.resultList.querySelectorAll('.containerHeadline').forEach(item => {
+ item.addEventListener('click', this.click.bind(this));
+ });
}
else {
- elInnerError(_searchInput.parentNode, Language.get('wcf.article.search.error.noResults'));
+ const parent = this.searchInput.parentElement;
+ Util_1.default.innerError(parent, Language.get('wcf.article.search.error.noResults'));
}
- },
- _ajaxSetup: function () {
+ }
+ _ajaxSetup() {
return {
data: {
actionName: 'search',
- className: 'wcf\\data\\article\\ArticleAction'
- }
+ className: 'wcf\\data\\article\\ArticleAction',
+ },
};
- },
- _dialogSetup: function () {
+ }
+ _dialogSetup() {
return {
id: 'wcfUiArticleSearch',
options: {
- onSetup: (function () {
- var callbackSearch = this._search.bind(this);
- _searchInput = elById('wcfUiArticleSearchInput');
- _searchInput.addEventListener('keydown', function (event) {
- if (EventKey.Enter(event)) {
- callbackSearch(event);
+ onSetup: () => {
+ this.searchInput = document.getElementById('wcfUiArticleSearchInput');
+ this.searchInput.addEventListener('keydown', event => {
+ if (event.key === 'Enter') {
+ this.search(event);
}
});
- _searchInput.nextElementSibling.addEventListener(WCF_CLICK_EVENT, callbackSearch);
- _resultContainer = elById('wcfUiArticleSearchResultContainer');
- _resultList = elById('wcfUiArticleSearchResultList');
- }).bind(this),
- onShow: function () {
- _searchInput.focus();
+ const button = this.searchInput.nextElementSibling;
+ button.addEventListener('click', this.search.bind(this));
+ this.resultContainer = document.getElementById('wcfUiArticleSearchResultContainer');
+ this.resultList = document.getElementById('wcfUiArticleSearchResultList');
+ },
+ onShow: () => {
+ this.searchInput.focus();
},
- title: Language.get('wcf.article.search')
+ title: Language.get('wcf.article.search'),
},
- source: '<div class="section">'
- + '<dl>'
- + '<dt><label for="wcfUiArticleSearchInput">' + Language.get('wcf.article.search.name') + '</label></dt>'
- + '<dd>'
- + '<div class="inputAddon">'
- + '<input type="text" id="wcfUiArticleSearchInput" class="long">'
- + '<a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>'
- + '</div>'
- + '</dd>'
- + '</dl>'
- + '</div>'
- + '<section id="wcfUiArticleSearchResultContainer" class="section" style="display: none;">'
- + '<header class="sectionHeader">'
- + '<h2 class="sectionTitle">' + Language.get('wcf.article.search.results') + '</h2>'
- + '</header>'
- + '<ol id="wcfUiArticleSearchResultList" class="containerList"></ol>'
- + '</section>'
+ source: `<div class="section">
+ <dl>
+ <dt>
+ <label for="wcfUiArticleSearchInput">${Language.get('wcf.article.search.name')}</label>
+ </dt>
+ <dd>
+ <div class="inputAddon">
+ <input type="text" id="wcfUiArticleSearchInput" class="long">
+ <a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>
+ </div>
+ </dd>
+ </dl>
+ </div>
+ <section id="wcfUiArticleSearchResultContainer" class="section" style="display: none;">
+ <header class="sectionHeader">
+ <h2 class="sectionTitle">${Language.get('wcf.article.search.results')}</h2>
+ </header>
+ <ol id="wcfUiArticleSearchResultList" class="containerList"></ol>
+ </section>`,
};
}
- };
+ }
+ let uiArticleSearch = undefined;
+ function getUiArticleSearch() {
+ if (!uiArticleSearch) {
+ uiArticleSearch = new UiArticleSearch();
+ }
+ return uiArticleSearch;
+ }
+ function open(callbackSelect) {
+ getUiArticleSearch().open(callbackSelect);
+ }
+ exports.open = open;
});
this.callbackSelect = callbackSelect;
Dialog_1.default.open(this);
}
- _search(event) {
+ search(event) {
event.preventDefault();
const inputContainer = this.searchInput.parentNode;
const value = this.searchInput.value.trim();
- Util_1.default.innerError(inputContainer, value.length < 3 ? Language.get('wcf.page.search.error.tooShort') : false);
+ if (value.length < 3) {
+ Util_1.default.innerError(inputContainer, Language.get('wcf.page.search.error.tooShort'));
+ return;
+ }
+ else {
+ Util_1.default.innerError(inputContainer, false);
+ }
Ajax.api(this, {
parameters: {
searchString: value,
},
});
}
- _click(event) {
+ click(event) {
event.preventDefault();
const page = event.currentTarget;
const pageTitle = page.querySelector('h3');
Util_1.default[html ? 'show' : 'hide'](this.resultContainer);
if (html) {
this.resultList.querySelectorAll('.containerHeadline').forEach(item => {
- item.addEventListener('click', this._click.bind(this));
+ item.addEventListener('click', this.click.bind(this));
});
}
else {
this.searchInput = document.getElementById('wcfUiPageSearchInput');
this.searchInput.addEventListener('keydown', event => {
if (event.key === 'Enter') {
- this._search(event);
+ this.search(event);
}
});
- this.searchInput.nextElementSibling.addEventListener('click', this._search.bind(this));
+ this.searchInput.nextElementSibling.addEventListener('click', this.search.bind(this));
this.resultContainer = document.getElementById('wcfUiPageSearchResultContainer');
this.resultList = document.getElementById('wcfUiPageSearchResultList');
},
+++ /dev/null
-define(['Ajax', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog'], function(Ajax, EventKey, Language, StringUtil, DomUtil, UiDialog) {
- "use strict";
-
- if (!COMPILER_TARGET_DEFAULT) {
- var Fake = function() {};
- Fake.prototype = {
- open: function() {},
- _search: function() {},
- _click: function() {},
- _ajaxSuccess: function() {},
- _ajaxSetup: function() {},
- _dialogSetup: function() {}
- };
- return Fake;
- }
-
- var _callbackSelect, _resultContainer, _resultList, _searchInput = null;
-
- return {
- open: function(callbackSelect) {
- _callbackSelect = callbackSelect;
-
- UiDialog.open(this);
- },
-
- _search: function (event) {
- event.preventDefault();
-
- var inputContainer = _searchInput.parentNode;
-
- var value = _searchInput.value.trim();
- if (value.length < 3) {
- elInnerError(inputContainer, Language.get('wcf.article.search.error.tooShort'));
- return;
- }
- else {
- elInnerError(inputContainer, false);
- }
-
- Ajax.api(this, {
- parameters: {
- searchString: value
- }
- });
- },
-
- _click: function (event) {
- event.preventDefault();
-
- _callbackSelect(elData(event.currentTarget, 'article-id'));
-
- UiDialog.close(this);
- },
-
- _ajaxSuccess: function(data) {
- var html = '', article;
- //noinspection JSUnresolvedVariable
- for (var i = 0, length = data.returnValues.length; i < length; i++) {
- //noinspection JSUnresolvedVariable
- article = data.returnValues[i];
-
- html += '<li>'
- + '<div class="containerHeadline pointer" data-article-id="' + article.articleID + '">'
- + '<h3>' + StringUtil.escapeHTML(article.name) + '</h3>'
- + '<small>' + StringUtil.escapeHTML(article.displayLink) + '</small>'
- + '</div>'
- + '</li>';
- }
-
- _resultList.innerHTML = html;
-
- window[html ? 'elShow' : 'elHide'](_resultContainer);
-
- if (html) {
- elBySelAll('.containerHeadline', _resultList, (function(item) {
- item.addEventListener(WCF_CLICK_EVENT, this._click.bind(this));
- }).bind(this));
- }
- else {
- elInnerError(_searchInput.parentNode, Language.get('wcf.article.search.error.noResults'));
- }
- },
-
- _ajaxSetup: function () {
- return {
- data: {
- actionName: 'search',
- className: 'wcf\\data\\article\\ArticleAction'
- }
- };
- },
-
- _dialogSetup: function() {
- return {
- id: 'wcfUiArticleSearch',
- options: {
- onSetup: (function() {
- var callbackSearch = this._search.bind(this);
-
- _searchInput = elById('wcfUiArticleSearchInput');
- _searchInput.addEventListener('keydown', function(event) {
- if (EventKey.Enter(event)) {
- callbackSearch(event);
- }
- });
-
- _searchInput.nextElementSibling.addEventListener(WCF_CLICK_EVENT, callbackSearch);
-
- _resultContainer = elById('wcfUiArticleSearchResultContainer');
- _resultList = elById('wcfUiArticleSearchResultList');
- }).bind(this),
- onShow: function() {
- _searchInput.focus();
- },
- title: Language.get('wcf.article.search')
- },
- source: '<div class="section">'
- + '<dl>'
- + '<dt><label for="wcfUiArticleSearchInput">' + Language.get('wcf.article.search.name') + '</label></dt>'
- + '<dd>'
- + '<div class="inputAddon">'
- + '<input type="text" id="wcfUiArticleSearchInput" class="long">'
- + '<a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>'
- + '</div>'
- + '</dd>'
- + '</dl>'
- + '</div>'
- + '<section id="wcfUiArticleSearchResultContainer" class="section" style="display: none;">'
- + '<header class="sectionHeader">'
- + '<h2 class="sectionTitle">' + Language.get('wcf.article.search.results') + '</h2>'
- + '</header>'
- + '<ol id="wcfUiArticleSearchResultList" class="containerList"></ol>'
- + '</section>'
- };
- }
- };
-});
--- /dev/null
+import * as Ajax from '../../Ajax';
+import { AjaxCallbackObject, DatabaseObjectActionResponse } from '../../Ajax/Data';
+import { DialogCallbackObject } from '../Dialog/Data';
+import DomUtil from '../../Dom/Util';
+import * as Language from '../../Language';
+import * as StringUtil from '../../StringUtil';
+import UiDialog from '../Dialog';
+
+type CallbackSelect = (articleId: number) => void;
+
+interface SearchResult {
+ articleID: number;
+ displayLink: string;
+ name: string;
+}
+
+interface AjaxResponse extends DatabaseObjectActionResponse {
+ returnValues: SearchResult[];
+}
+
+class UiArticleSearch implements AjaxCallbackObject, DialogCallbackObject {
+ private callbackSelect?: CallbackSelect = undefined;
+ private resultContainer?: HTMLElement = undefined;
+ private resultList?: HTMLOListElement = undefined;
+ private searchInput?: HTMLInputElement = undefined;
+
+ open(callbackSelect: CallbackSelect) {
+ this.callbackSelect = callbackSelect;
+
+ UiDialog.open(this);
+ }
+
+ private search(event: KeyboardEvent): void {
+ event.preventDefault();
+
+ const inputContainer = this.searchInput!.parentElement!;
+
+ const value = this.searchInput!.value.trim();
+ if (value.length < 3) {
+ DomUtil.innerError(inputContainer, Language.get('wcf.article.search.error.tooShort'));
+ return;
+ } else {
+ DomUtil.innerError(inputContainer, false);
+ }
+
+ Ajax.api(this, {
+ parameters: {
+ searchString: value,
+ },
+ });
+ }
+
+ private click(event: MouseEvent): void {
+ event.preventDefault();
+
+ const target = event.currentTarget as HTMLElement;
+ this.callbackSelect!(+target.dataset.articleId!);
+
+ UiDialog.close(this);
+ }
+
+ _ajaxSuccess(data: AjaxResponse): void {
+ let html = data.returnValues
+ .map(article => {
+ return `<li>
+ <div class="containerHeadline pointer" data-article-id="${article.articleID}">
+ <h3>${StringUtil.escapeHTML(article.name)}</h3>
+ <small>${StringUtil.escapeHTML(article.displayLink)}</small>
+ </div>
+ </li>`;
+ })
+ .join('');
+
+ this.resultList!.innerHTML = html;
+
+ DomUtil[html ? 'show' : 'hide'](this.resultList!);
+
+ if (html) {
+ this.resultList!.querySelectorAll('.containerHeadline').forEach(item => {
+ item.addEventListener('click', this.click.bind(this));
+ });
+ } else {
+ const parent = this.searchInput!.parentElement!;
+ DomUtil.innerError(parent, Language.get('wcf.article.search.error.noResults'));
+ }
+ }
+
+ _ajaxSetup() {
+ return {
+ data: {
+ actionName: 'search',
+ className: 'wcf\\data\\article\\ArticleAction',
+ },
+ };
+ }
+
+ _dialogSetup() {
+ return {
+ id: 'wcfUiArticleSearch',
+ options: {
+ onSetup: () => {
+ this.searchInput = document.getElementById('wcfUiArticleSearchInput') as HTMLInputElement;
+ this.searchInput.addEventListener('keydown', event => {
+ if (event.key === 'Enter') {
+ this.search(event);
+ }
+ });
+
+ const button = this.searchInput.nextElementSibling!;
+ button.addEventListener('click', this.search.bind(this));
+
+ this.resultContainer = document.getElementById('wcfUiArticleSearchResultContainer')!;
+ this.resultList = document.getElementById('wcfUiArticleSearchResultList') as HTMLOListElement;
+ },
+ onShow: () => {
+ this.searchInput!.focus();
+ },
+ title: Language.get('wcf.article.search'),
+ },
+ source: `<div class="section">
+ <dl>
+ <dt>
+ <label for="wcfUiArticleSearchInput">${Language.get('wcf.article.search.name')}</label>
+ </dt>
+ <dd>
+ <div class="inputAddon">
+ <input type="text" id="wcfUiArticleSearchInput" class="long">
+ <a href="#" class="inputSuffix"><span class="icon icon16 fa-search"></span></a>
+ </div>
+ </dd>
+ </dl>
+ </div>
+ <section id="wcfUiArticleSearchResultContainer" class="section" style="display: none;">
+ <header class="sectionHeader">
+ <h2 class="sectionTitle">${Language.get('wcf.article.search.results')}</h2>
+ </header>
+ <ol id="wcfUiArticleSearchResultList" class="containerList"></ol>
+ </section>`,
+ };
+ }
+}
+
+let uiArticleSearch: UiArticleSearch | undefined = undefined;
+
+function getUiArticleSearch() {
+ if (!uiArticleSearch) {
+ uiArticleSearch = new UiArticleSearch();
+ }
+
+ return uiArticleSearch;
+}
+
+export function open(callbackSelect) {
+ getUiArticleSearch().open(callbackSelect);
+}
UiDialog.open(this);
}
- _search(event: KeyboardEvent): void {
+ private search(event: KeyboardEvent): void {
event.preventDefault();
const inputContainer = this.searchInput!.parentNode as HTMLElement;
const value = this.searchInput!.value.trim();
- DomUtil.innerError(inputContainer, value.length < 3 ? Language.get('wcf.page.search.error.tooShort') : false);
+ if (value.length < 3) {
+ DomUtil.innerError(inputContainer, Language.get('wcf.page.search.error.tooShort'));
+ return;
+ } else {
+ DomUtil.innerError(inputContainer, false);
+ }
Ajax.api(this, {
parameters: {
});
}
- _click(event: MouseEvent): void {
+ private click(event: MouseEvent): void {
event.preventDefault();
const page = event.currentTarget as HTMLElement;
if (html) {
this.resultList!.querySelectorAll('.containerHeadline').forEach(item => {
- item.addEventListener('click', this._click.bind(this));
+ item.addEventListener('click', this.click.bind(this));
});
} else {
DomUtil.innerError(this.searchInput!.parentElement!, Language.get('wcf.page.search.error.noResults'));
this.searchInput = document.getElementById('wcfUiPageSearchInput') as HTMLInputElement;
this.searchInput.addEventListener('keydown', event => {
if (event.key === 'Enter') {
- this._search(event);
+ this.search(event);
}
});
- this.searchInput.nextElementSibling!.addEventListener('click', this._search.bind(this));
+ this.searchInput.nextElementSibling!.addEventListener('click', this.search.bind(this));
this.resultContainer = document.getElementById('wcfUiPageSearchResultContainer') as HTMLElement;
this.resultList = document.getElementById('wcfUiPageSearchResultList') as HTMLOListElement;