2 <md-content class="chat-online">
3 <div id="toaster"></div>
6 ng-if="vm.fields.length"
9 ng-style="{'font-size': '{{settings.fontSize}}px'}"
12 <div class="form-input-container">
14 ng-repeat="field in vm.fields | orderBy:'index'"
18 <span ng-show="field.type !== 'label'">
19 {{field.props.title + (field.config.required ? '*' : '')}}
23 ng-class="field.props.error ? 'field-description error': 'field-description'"
26 ng-if="vm.checkHTML[$index]"
27 ng-bind-html="field.props.helpText"
30 ng-if="!vm.checkHTML[$index]"
31 ng-bind-html="field.props.error || field.props.helpText | embed:{linkTarget:'_blank'}"
38 ng-repeat="error in vm.errors"
42 <i class="mdi mdi-alert mdi-24px mdi-light"></i>
43 <md-tooltip md-direction="top"
44 >{{error.message || 'Service temporarily unavailable.'}}</md-tooltip
46 <span class="chat-error-message"
47 >{{error.message || 'Service temporarily unavailable.'}}</span
54 ng-switch="field.type"
58 <div ng-switch-when="label">
62 layout-align="center center"
63 data-ng-bind-html="vm.trustAsHtml(field.value)"
69 <!-- START textinput -->
70 <div ng-switch-when="input">
72 name="{{field.props.title}}"
73 ng-model="vm.form[field.props.title]"
74 placeholder="{{field.config.placeholder}}"
75 type="{{field.config.type}}"
76 ng-required="field.config.required"
79 <!-- END textinput -->
81 <!-- START textarea -->
82 <div ng-switch-when="textarea">
84 name="{{field.props.title}}"
85 ng-model="vm.form[field.props.title]"
86 placeholder="{{field.config.placeholder}}"
89 ng-required="field.config.required"
95 <div ng-switch-when="chooseFromList">
97 name="{{field.props.title}}"
98 ng-model="vm.form[field.props.title]"
99 placeholder="{{field.config.placeholder}}"
100 ng-required="field.config.required"
103 ng-repeat="option in field.options"
104 ng-value="option.value"
105 >{{option.value}}</md-option
113 ng-switch-when="multipleChoices"
114 layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
117 name="{{field.props.title}}"
118 ng-model="vm.form[field.props.title]"
119 ng-required="field.config.required"
120 layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
123 ng-repeat="option in field.options"
124 ng-value="option.value"
126 >{{option.value}}</md-radio-button
132 <!-- START checkbox -->
133 <div ng-switch-when="checkboxes">
135 layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
139 aria-label="{{field.props.title}}"
140 ng-repeat="option in field.options"
141 ng-checked="vm.exists(field.props.title, option.value)"
142 ng-disabled="!vm.exists(field.props.title, option.value) && field.config.maxSelections === vm.form[field.props.title].length"
143 ng-click="vm.toggle(field.props.title, option.value)"
150 <!-- END checkbox -->
152 <!-- START agreement -->
154 ng-switch-when="agreement"
155 layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
159 ng-model="vm.form[field.props.title]"
160 aria-label="{{field.props.title}}"
161 ng-required="field.config.required"
163 {{field.options[0].value}}
166 <!-- END agreement -->
168 <!-- START upload -->
169 <div ng-switch-when="upload" layout="column">
170 <div layout="row" class="option-item upload-item">
172 ng-init="vm.initUploadButton($index)"
173 class="md-raised md-accent upload-button"
174 ng-style="{'background-color': '{{settings.color_button}}', 'color': '{{settings.textButtonColor || settings.textColor}}'}"
175 ><md-icon class="material-icons">attach_file</md-icon
176 ><span>{{field.config.uploadFileButtonLabel}}</span></md-button
179 <md-input-container class="md-block" style="margin: 0">
184 ng-init="vm.setupFileInput(field)"
186 <md-input-container flex class="md-block">
192 aria-label="fileName"
194 </md-input-container>
195 </md-input-container>
202 grid-template-columns: 3em auto;
206 ng-repeat="option in field.options"
209 ng-click="vm.removeFileItem(field, $index)"
210 class="md-icon-button"
213 <md-icon class="material-icons">close</md-icon>
216 class="filename-label"
217 ng-init="vm.makeFileOptionsVisible()"
218 >{{option.name}}</span
226 ng-messages="vm.userForm[field.props.title].$error"
227 ng-show="vm.userForm[field.props.title].$touched"
230 <div ng-message="required">
231 <span>Required Field</span>
233 <div ng-message="email">
234 <span>Wrong type field</span>
237 </md-input-container>
240 <div class="offline-button-wrapper">
243 ng-if="(typeField !== 'label')"
244 title="{{settings.offline_chat_button}}"
246 ng-click="vm.submit()"
247 ng-disabled="vm.userForm.$invalid || loading"
248 ng-style="{'background-color': '{{settings.color_button}}', 'color': '{{settings.textButtonColor || settings.textColor}}'}"
250 {{settings.offline_chat_button}}
255 <md-content layout="row" layout-align="center end" class="white-label">
257 ng-bind-html="(settings.custom && !settings.defaultWhiteLabel) ? settings.whiteLabel : 'Powered By XCALLY' | toTrusted"
258 ng-style="{'font-size': '{{settings.fontSize}}px'}"
262 <!-- / CHAT CONTENT -->