/
BaseComponent.ts
100 lines (86 loc) · 2.9 KB
/
BaseComponent.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
import { Assert } from '../../misc/Assert';
import { $$ } from '../../utils/Dom';
import { Logger } from '../../misc/Logger';
declare var Coveo;
export interface IComponentHtmlElement extends HTMLElement {
CoveoBoundComponents?: BaseComponent[];
}
/**
* Every component in the framework ultimately inherits from this base component class.
*/
export class BaseComponent {
/**
* Allows component to log in the dev console.
*/
public logger: Logger;
/**
* A disabled component will not participate in the query, or listen to {@link ComponentEvents}.
* @type {boolean}
*/
public disabled = false;
/**
* The static ID that each component need to be identified.<br/>
* For example, SearchButton -> static ID : SearchButton -> className : CoveoSearchButton
*/
static ID: string;
constructor(public element: HTMLElement, public type: string) {
Assert.exists(element);
Assert.isNonEmptyString(type);
this.logger = new Logger(this);
BaseComponent.bindComponentToElement(element, this);
}
/**
* Return the debug info about this component.
* @returns {any}
*/
public debugInfo() {
var info: any = {};
info[this['constructor']['ID']] = this;
return info;
}
/**
* Disable the component.
* Normally this means that the component will not execute handlers for the framework events (query events, for example).
* Component are enabled by default on creation.
*/
public disable() {
this.disabled = true;
}
/**
* Enable the component.
* Normally this means that the component will execute handlers for the framework events (query events, for example).
* Components are enabled by default on creation.
*/
public enable() {
this.disabled = false;
}
static bindComponentToElement(element: HTMLElement, component: BaseComponent) {
Assert.exists(element);
Assert.exists(component);
Assert.isNonEmptyString(component.type);
element[BaseComponent.computeCssClassNameForType(component.type)] = component;
$$(element).addClass(BaseComponent.computeCssClassNameForType(component.type));
BaseComponent.getBoundComponentsForElement(element).push(component);
}
static computeCssClassName(componentClass: any): string {
return BaseComponent.computeCssClassNameForType(componentClass['ID']);
}
static computeCssClassNameForType(type: string): string {
Assert.isNonEmptyString(type);
return 'Coveo' + type;
}
static computeSelectorForType(type: string): string {
Assert.isNonEmptyString(type);
return '.' + BaseComponent.computeCssClassNameForType(type);
}
static getBoundComponentsForElement(element: IComponentHtmlElement): BaseComponent[] {
Assert.exists(element);
if (element.CoveoBoundComponents == null) {
element.CoveoBoundComponents = [];
}
return element.CoveoBoundComponents;
}
static getComponentRef(component: string): any {
return Coveo[component];
}
}