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
101
102
|
KB.component('submit-buttons', function (containerElement, options) {
var isLoading = false;
var isDisabled = options.disabled || false;
var submitLabel = options.submitLabel;
var formActionElement = null;
function onSubmit() {
isLoading = true;
KB.find('#modal-submit-button').replace(buildButton());
KB.trigger('modal.submit');
}
function onCancel() {
KB.trigger('modal.close');
}
function onStop() {
isLoading = false;
KB.find('#modal-submit-button').replace(buildButton());
}
function onDisable() {
isLoading = false;
isDisabled = true;
KB.find('#modal-submit-button').replace(buildButton());
}
function onEnable() {
isLoading = false;
isDisabled = false;
KB.find('#modal-submit-button').replace(buildButton());
}
function onHide() {
KB.dom(formActionElement).hide();
}
function onUpdateSubmitLabel(eventData) {
submitLabel = eventData.submitLabel;
KB.find('#modal-submit-button').replace(buildButton());
}
function buildButton() {
var button = KB.dom('button')
.attr('id', 'modal-submit-button')
.attr('type', 'submit')
.attr('class', 'btn btn-' + (options.color || 'blue'));
if (KB.modal.isOpen()) {
button.click(onSubmit);
}
if (options.tabindex) {
button.attr('tabindex', options.tabindex);
}
if (isLoading) {
button
.disable()
.add(KB.dom('i').attr('class', 'fa fa-spinner fa-pulse').build())
.text(' ')
;
}
if (isDisabled) {
button.disable();
}
return button
.text(submitLabel)
.build();
}
this.render = function () {
KB.on('modal.stop', onStop);
KB.on('modal.disable', onDisable);
KB.on('modal.enable', onEnable);
KB.on('modal.hide', onHide);
KB.on('modal.submit.label', onUpdateSubmitLabel);
KB.on('modal.close', function () {
KB.removeListener('modal.stop', onStop);
KB.removeListener('modal.disable', onDisable);
KB.removeListener('modal.enable', onEnable);
KB.removeListener('modal.hide', onHide);
KB.removeListener('modal.submit.label', onUpdateSubmitLabel);
});
var formActionElementBuilder = KB.dom('div')
.attr('class', 'form-actions')
.add(buildButton());
if (KB.modal.isOpen()) {
formActionElementBuilder
.text(' ' + options.orLabel + ' ')
.add(KB.dom('a').attr('href', '#').click(onCancel).text(options.cancelLabel).build());
}
formActionElement = formActionElementBuilder.build();
containerElement.appendChild(formActionElement);
};
});
|
