|
1
|
|
|
import sourceAutocomplete from './sourceAutocomplete' |
|
2
|
|
|
import sourceOption from './sourceOption' |
|
3
|
|
|
import { |
|
4
|
|
|
abeExtend |
|
5
|
|
|
,User |
|
6
|
|
|
} from '../../../' |
|
7
|
|
|
|
|
8
|
|
|
export function getAttributes(params) { |
|
9
|
|
|
var attributes = '' |
|
10
|
|
|
if(params.key != null) attributes += `id="${params.key}" data-id="${params.key}"` |
|
|
|
|
|
|
11
|
|
|
if(params.value != null) attributes += ` value="${params.value}"` |
|
|
|
|
|
|
12
|
|
|
if(params['max-length'] != null) attributes += ` data-maxlength="${params['max-length']}"` |
|
|
|
|
|
|
13
|
|
|
if(params.reload != null) attributes += ` reload="${params.reload}"` |
|
|
|
|
|
|
14
|
|
|
if(params.order != null) attributes += ` tabIndex="${params.order}"` |
|
|
|
|
|
|
15
|
|
|
if(params.required != null) attributes += ` data-required="${params.required}"` |
|
|
|
|
|
|
16
|
|
|
if(params.display != null) attributes += ` data-display="${params.display}"` |
|
|
|
|
|
|
17
|
|
|
if(params.visible != null) attributes += ` data-visible="${params.visible}"` |
|
|
|
|
|
|
18
|
|
|
if(params.autocomplete != null) attributes += ` data-autocomplete="${params.autocomplete}"` |
|
|
|
|
|
|
19
|
|
|
if(params.placeholder != null) attributes += ` placeholder="${params.placeholder}"` |
|
|
|
|
|
|
20
|
|
|
if(params.thumbs != null) attributes += ` data-size="${params.thumbs}"` |
|
|
|
|
|
|
21
|
|
|
if(params.multiple != null) attributes += ` ${params.multiple}` |
|
|
|
|
|
|
22
|
|
|
if(params.disabled != null) attributes += ` ${params.disabled}` |
|
|
|
|
|
|
23
|
|
|
return attributes |
|
24
|
|
|
} |
|
25
|
|
|
|
|
26
|
|
|
export function getLabel(params) { |
|
27
|
|
|
var desc = params.desc + ((params.required) ? ' *' : '') |
|
28
|
|
|
return `<label class="control-label" for="${params.key}" > |
|
29
|
|
|
${desc} |
|
30
|
|
|
</label>` |
|
31
|
|
|
} |
|
32
|
|
|
|
|
33
|
|
|
export function createInputSource(attributes, inputClass, params) { |
|
34
|
|
|
var inputSource = '' |
|
35
|
|
|
var lastValues |
|
36
|
|
|
if(params.autocomplete != null && params.autocomplete === 'true') { |
|
37
|
|
|
if(params.sourceString.indexOf('http') === 0) lastValues = params.source |
|
|
|
|
|
|
38
|
|
|
else lastValues = JSON.stringify(params.source).replace(/\'/g, '"e;') |
|
39
|
|
|
inputSource += '<div class="autocomplete-result-wrapper">' |
|
40
|
|
|
if(params.autocomplete != null && params.autocomplete === 'true' && params.prefill === 'true') { |
|
41
|
|
|
inputSource += `<div class="autocomplete-refresh" value='' |
|
42
|
|
|
data-autocomplete-refresh="true" |
|
43
|
|
|
data-autocomplete-refresh-sourcestring="${params.sourceString}" |
|
44
|
|
|
data-autocomplete-refresh-prefill-quantity="${params['prefill-quantity']}" |
|
45
|
|
|
data-autocomplete-refresh-key="${params.key}" |
|
46
|
|
|
data-autocomplete-data-display="${params.display}" > |
|
47
|
|
|
<span class="glyphicon glyphicon-refresh"></span> |
|
48
|
|
|
</div>` |
|
49
|
|
|
} |
|
50
|
|
|
Array.prototype.forEach.call(params.value, (val) => { |
|
51
|
|
|
inputSource += sourceAutocomplete(val, params) |
|
52
|
|
|
}) |
|
53
|
|
|
inputSource += `</div><input value="" type="text" autocomplete="off" data-value='${lastValues}' ${attributes} class="${inputClass}" />` |
|
54
|
|
|
} |
|
55
|
|
|
else { |
|
56
|
|
|
lastValues = JSON.stringify(params.value).replace(/\'/g, '"e;') |
|
57
|
|
|
inputSource += `<select ${attributes} class="${inputClass}" last-values='${lastValues}'>` |
|
58
|
|
|
|
|
59
|
|
|
// if (!params.required) inputSource += '<option value=\'\'></option>' |
|
60
|
|
|
var options = '' |
|
61
|
|
|
if(typeof params.source === 'object' && Object.prototype.toString.call(params.source) === '[object Array]') { |
|
62
|
|
|
Array.prototype.forEach.call(params.source, (val) => { |
|
63
|
|
|
options += sourceOption(val, params) |
|
64
|
|
|
}) |
|
65
|
|
|
}else{ |
|
66
|
|
|
options += sourceOption(params.source, params) |
|
67
|
|
|
} |
|
68
|
|
|
|
|
69
|
|
|
var defaultValueSelected = 'selected=selected' |
|
70
|
|
|
if (options.indexOf('selected') > -1) { |
|
71
|
|
|
defaultValueSelected = '' |
|
72
|
|
|
} |
|
73
|
|
|
if (params.required) inputSource += `<option value=\'\' value="" disabled ${defaultValueSelected}>Select ${params.desc.toLowerCase()}...</option>` |
|
|
|
|
|
|
74
|
|
|
if (!params.required) inputSource += `<option value=\'\' value="" ${defaultValueSelected}></option>` |
|
|
|
|
|
|
75
|
|
|
inputSource += options |
|
76
|
|
|
|
|
77
|
|
|
inputSource += '</select>' |
|
78
|
|
|
} |
|
79
|
|
|
return inputSource |
|
80
|
|
|
} |
|
81
|
|
|
|
|
82
|
|
|
export function createInputRich(attributes, inputClass, params) { |
|
83
|
|
|
return `<div class="wysiwyg-container rich"> |
|
84
|
|
|
<div class="wysiwyg-toolbar wysiwyg-toolbar-top"> |
|
85
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Bold (Ctrl+B)" hotkey="b" data-action="bold" data-param=""> |
|
86
|
|
|
<span class="glyphicon glyphicon-bold"></span> |
|
87
|
|
|
</a> |
|
88
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Italic (Ctrl+I)" hotkey="i" data-action="italic" data-param=""> |
|
89
|
|
|
<span class="glyphicon glyphicon-italic"></span> |
|
90
|
|
|
</a> |
|
91
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Underline (Ctrl+U)" hotkey="u" data-action="underline" data-param=""> |
|
92
|
|
|
<span class="glyphicon underline">U</span> |
|
93
|
|
|
</a> |
|
94
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Text color" data-action="forecolor" data-param="" data-popup="color"> |
|
95
|
|
|
<span class="glyphicon glyphicon-text-color"></span> |
|
96
|
|
|
</a> |
|
97
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Background color" data-action="highlight" data-param="" data-popup="color"> |
|
98
|
|
|
<span class="glyphicon glyphicon-text-background"></span> |
|
99
|
|
|
</a> |
|
100
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Left" data-action="align" data-param="left"> |
|
101
|
|
|
<span class="glyphicon glyphicon-object-align-left"></span> |
|
102
|
|
|
</a> |
|
103
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Center" data-action="align" data-param="center"> |
|
104
|
|
|
<span class="glyphicon glyphicon-object-align-vertical"></span> |
|
105
|
|
|
</a> |
|
106
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Right" data-action="align" data-param="right"> |
|
107
|
|
|
<span class="glyphicon glyphicon-object-align-right"></span> |
|
108
|
|
|
</a> |
|
109
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Justify" data-action="justify" data-param="justify"> |
|
110
|
|
|
<span class="glyphicon glyphicon-menu-hamburger"></span> |
|
111
|
|
|
</a> |
|
112
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Subscript" data-action="subscript" data-param=""> |
|
113
|
|
|
<span class="glyphicon glyphicon-subscript"></span> |
|
114
|
|
|
</a> |
|
115
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Superscript" data-action="superscript" data-param=""> |
|
116
|
|
|
<span class="glyphicon glyphicon-superscript"></span> |
|
117
|
|
|
</a> |
|
118
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Indent" data-action="indent" data-param=""> |
|
119
|
|
|
<span class="glyphicon glyphicon-triangle-right"></span> |
|
120
|
|
|
</a> |
|
121
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Outdent" data-action="indent" data-param="outdent"> |
|
122
|
|
|
<span class="glyphicon glyphicon-triangle-left"></span> |
|
123
|
|
|
</a> |
|
124
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Unordered list" data-action="insertList" data-param=""> |
|
125
|
|
|
<span class="glyphicon glyphicon-th-list"></span> |
|
126
|
|
|
</a> |
|
127
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Remove format" data-action="removeFormat" data-param=""> |
|
128
|
|
|
<span class="glyphicon glyphicon-remove"></span> |
|
129
|
|
|
</a> |
|
130
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Add link" data-action="insertLink" data-popup="link" data-param=""> |
|
131
|
|
|
<span class="glyphicon glyphicon-link"></span> |
|
132
|
|
|
</a> |
|
133
|
|
|
<a class="wysiwyg-toolbar-icon" href="#" title="Code style" data-action="code" data-param=""> |
|
134
|
|
|
<span class="glyphicon glyphicon-console"></span> |
|
135
|
|
|
</a> |
|
136
|
|
|
</div> |
|
137
|
|
|
<textarea class="${inputClass} form-rich" ${attributes} rows="4">${params.value}</textarea> |
|
138
|
|
|
</div>` |
|
139
|
|
|
} |
|
140
|
|
|
|
|
141
|
|
|
export function createInputFile(attributes, inputClass, params) { |
|
142
|
|
|
return `<input class="form-control" ${attributes} name="${params.key}" type="file" /> |
|
143
|
|
|
<span class="percent"></span> |
|
144
|
|
|
<input type="text" ${attributes} class="${inputClass} hidden" />` |
|
145
|
|
|
} |
|
146
|
|
|
|
|
147
|
|
|
export function createInputTextarea(attributes, inputClass, params) { |
|
148
|
|
|
return `<textarea class="${inputClass}" ${attributes} rows="4">${params.value}</textarea>` |
|
149
|
|
|
} |
|
150
|
|
|
|
|
151
|
|
|
export function createInputLink(attributes, inputClass) { |
|
152
|
|
|
return `<div class="input-group"> |
|
153
|
|
|
<div class="input-group-addon link"> |
|
154
|
|
|
<span class="glyphicon glyphicon-link" aria-hidden="true"></span> |
|
155
|
|
|
</div> |
|
156
|
|
|
<input type="text" ${attributes} class="${inputClass}" /> |
|
157
|
|
|
</div>` |
|
158
|
|
|
} |
|
159
|
|
|
|
|
160
|
|
|
export function createInputImage(attributes, inputClass, params) { |
|
161
|
|
|
return `<div class="input-group img-upload"> |
|
162
|
|
|
<div class="input-group-addon image"> |
|
163
|
|
|
<span class="glyphicon glyphicon-picture" aria-hidden="true"></span> |
|
164
|
|
|
</div> |
|
165
|
|
|
<input type="text" ${attributes} class="${inputClass} image-input" /> |
|
166
|
|
|
<div class="upload-wrapper"> |
|
167
|
|
|
<input class="form-control" ${attributes} name="${params.key}" type="file" title="upload an image"/> |
|
168
|
|
|
<span class="percent"> |
|
169
|
|
|
<span class="glyphicon glyphicon-upload" aria-hidden="true"></span> |
|
170
|
|
|
</span> |
|
171
|
|
|
</div> |
|
172
|
|
|
</div> |
|
173
|
|
|
<div class="input-error"></div>` |
|
174
|
|
|
} |
|
175
|
|
|
|
|
176
|
|
|
export function createInputText(attributes, inputClass) { |
|
177
|
|
|
return `<div class="input-group"> |
|
178
|
|
|
<div class="input-group-addon"> |
|
179
|
|
|
<span class="glyphicon glyphicon-font" aria-hidden="true"></span> |
|
180
|
|
|
</div> |
|
181
|
|
|
<input type="text" ${attributes} class="${inputClass}" /> |
|
182
|
|
|
</div>` |
|
183
|
|
|
} |
|
184
|
|
|
|
|
185
|
|
|
/** |
|
186
|
|
|
* Print form input based on input data type {Textarea | text | meta | link | image | ...} |
|
187
|
|
|
* && add appropriate attributs / data-attributs |
|
188
|
|
|
* @return {String|html} input / input group ... |
|
189
|
|
|
*/ |
|
190
|
|
|
export function printInput (params, root) { |
|
191
|
|
|
params = abeExtend.hooks.instance.trigger('beforeEditorInput', params) |
|
192
|
|
|
var userWorkflow = (root.user != null) ? root.user.role.workflow : '' |
|
193
|
|
|
var res = `<div class="form-group" data-precontrib-templates="${params.precontribTemplate}">` |
|
194
|
|
|
var inputClass = 'form-control form-abe' |
|
195
|
|
|
res += getLabel(params) |
|
196
|
|
|
|
|
197
|
|
|
params.placeholder = params.placeholder || '' |
|
198
|
|
|
params.value = params.value || '' |
|
199
|
|
|
|
|
200
|
|
|
if(typeof params.value === 'string') params.value = params.value.replace(/\"/g, '"') |
|
|
|
|
|
|
201
|
|
|
|
|
202
|
|
|
params.disabled = '' |
|
203
|
|
|
if (params.tab !== 'slug' && !User.utils.isUserAllowedOnRoute(userWorkflow, `/abe/operations/edit/${params.status}`)) { |
|
204
|
|
|
params.disabled = 'disabled="disabled"' |
|
205
|
|
|
} |
|
206
|
|
|
var attributes = getAttributes(params) |
|
207
|
|
|
|
|
208
|
|
|
if(params.source != null) { |
|
209
|
|
|
params.multiple = ((params['max-length'] == null || params['max-length'] > 1) && params.source.length > 0) ? 'multiple' : '' |
|
210
|
|
|
params.disabled = (params.source.length <= 0) ? 'disabled' : '' |
|
211
|
|
|
res += createInputSource(getAttributes(params), inputClass, params) |
|
212
|
|
|
} |
|
213
|
|
|
else if (params.type.indexOf('rich') >= 0) res += createInputRich(attributes, inputClass, params) |
|
|
|
|
|
|
214
|
|
|
else if (params.type.indexOf('file') >= 0) res += createInputFile(attributes, inputClass, params) |
|
|
|
|
|
|
215
|
|
|
else if (params.type.indexOf('textarea') >= 0) res += createInputTextarea(attributes, inputClass, params) |
|
|
|
|
|
|
216
|
|
|
else if (params.type.indexOf('link') >= 0) res += createInputLink(attributes, inputClass, params) |
|
|
|
|
|
|
217
|
|
|
else if (params.type.indexOf('image') >= 0) res += createInputImage(attributes, inputClass, params) |
|
|
|
|
|
|
218
|
|
|
else res += createInputText(attributes, inputClass, params) |
|
|
|
|
|
|
219
|
|
|
|
|
220
|
|
|
res += '</div>' |
|
221
|
|
|
res = abeExtend.hooks.instance.trigger('afterEditorInput', res, params) |
|
222
|
|
|
|
|
223
|
|
|
return res |
|
224
|
|
|
} |
AdFabConnect /
abejs
Loading history...
Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.
Consider:
If you or someone else later decides to put another statement in, only the first statement will be executed.
In this case the statement
b = 42will always be executed, while the logging statement will be executed conditionally.ensures that the proper code will be executed conditionally no matter how many statements are added or removed.