{{IsExistingCustomer ? PluginTextConfig.PreChatFormExistingCustomerHeading : PluginTextConfig.PreChatFormGuestCustomerHeading}}

<div class="uf-radio-btn-holder" data-ng-if="(preform.CONTROLTYPE | uppercase) == 'RADIOBTN'" data-ng-init="RadioBtnList = ParseJson(preform.CONTROLPARAMETER)">
                    <p class="uf-radiobtn-head-msg" data-ng-init="PreChatFormValue[preform.ATTRIBUTEMAPPING] = preform.DEFAULTVALUE">{{ParseJson(preform.PLACEHOLDER)}}</p>
                    <div class="uf-clear"></div>
                    <label class="uf-radio-container" data-ng-repeat="rbtn in RadioBtnList">
                        {{rbtn.Key}}
                        <input type="radio" name={{preform.CONTROLNAME}} value={{rbtn.Value}} data-ng-model="PreChatFormValue[preform.ATTRIBUTEMAPPING]">
                        <span class="uf-checkmark"></span>
                    </label>
                </div>
                
                <div class="uf-checkbox-holder" data-ng-if="(preform.CONTROLTYPE | uppercase) == 'CHECKBOX'" data-ng-init="CheckBoxList = (ParseJson(preform.CONTROLPARAMETER))">
                    <p class="uf-checkox-head-msg">{{ParseJson(preform.PLACEHOLDER)}}</p>
                    <div class="uf-clear"></div>
                    <label class="uf-check-container" data-ng-repeat="chkbox in CheckBoxList">
                        {{chkbox.Key}}
                        <input type="checkbox" name="{{preform.CONTROLNAME}}" value="{{chkbox.Value}}" data-ng-model="IsCheckBoxSelected" data-ng-change="SetCheckBoxValue(preform , IsCheckBoxSelected, chkbox.Value, PreChatForm, 'PRECHAT')"
                               data-ng-required="(IsExistingCustomer ? preform.ISEXISTINGMANDATORY : preform.ISGUESTMANDATORY) && (PreChatFormValue[preform.ATTRIBUTEMAPPING].length == 0)">
                        <span class="uf-check-checkmark"></span>
                    </label>
                </div>
                
                
                
                
                
                
                
                <div class="uf-select">
                    <select data-ng-if="(preform.CONTROLTYPE | uppercase) == 'DROPDOWN' && (preform.CONTROLNAME | uppercase) != 'NAMESUFFIX'"
                            data-ng-init="data=RenderPreChatDyanamicDropDown(preform.CONTROLPARAMETER,preform.DEFAULTVALUE,preform.CONTROLNAME,preform.ATTRIBUTEMAPPING)"
                            data-ng-class="((PreChatForm.{{preform.CONTROLNAME}}.$touched && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (PreChatForm.{{preform.CONTROLNAME}}.$error.pattern) || (IsPrechatFromValidationFailed && PreChatForm.{{preform.CONTROLNAME}}.$error.required)) ? 'uf-form-select uf-input-error' : 'uf-form-select'"
                            name={{preform.CONTROLNAME}} class="uf-form-select"
                            data-ng-change="updateLaguage(PreChatFormValue[preform.ATTRIBUTEMAPPING]);"
                            data-ng-model="PreChatFormValue[preform.ATTRIBUTEMAPPING]"
                            data-ng-required="IsExistingCustomer ? preform.ISEXISTINGMANDATORY : preform.ISGUESTMANDATORY"
                            data-ng-style="PreChatFormValue[preform.ATTRIBUTEMAPPING] == '' ? DropdownInitialCss : ''">
                        <option class="uf-option" data-ng-repeat="opt in data" value="{{opt.Value}}"> {{opt.Key}} </option>
                    </select>
                </div>
                
                <input type="text" data-ng-if="(preform.CONTROLTYPE | uppercase) == 'AUTOCOMPLETE'" data-ng-class="((PreChatForm.{{preform.CONTROLNAME}}.$touched && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (PreChatForm.{{preform.CONTROLNAME}}.$error.pattern) || (IsPrechatFromValidationFailed && PreChatForm.{{preform.CONTROLNAME}}.$error.required)) ? 'uf-form-input uf-input-error' : 'uf-form-input'"
                       name={{preform.CONTROLNAME}} placeholder={{ParseJson(preform.PLACEHOLDER)}} data-ng-model="PreChatFormValue[preform.ATTRIBUTEMAPPING]" data-ng-required="IsExistingCustomer ? preform.ISEXISTINGMANDATORY : preform.ISGUESTMANDATORY"
                       data-ng-keyup="BotInputAutoComplete(PreChatFormValue[preform.ATTRIBUTEMAPPING] , preform.CONTROLPARAMETER)" data-ng-focus="BotDropdownFocus(preform.CONTROLNAME)" data-ng-blur="BotDropdownBlur(PreChatFormValue[preform.ATTRIBUTEMAPPING], preform.CONTROLPARAMETER, preform)" />
                <ul class="uf-bot-dropdown-container" data-ng-if="preform.CONTROLTYPE == 'AUTOCOMPLETE'" data-ng-show="CurrentControlId == preform.CONTROLNAME">
                    <li class="uf-bot-select-dropdown" ng-repeat="BotAutoCompleteData in DropdownList" data-ng-click="AutoFillTextBox(BotAutoCompleteData.Key, preform)">{{BotAutoCompleteData.Key}}</li>
                </ul>

<div class="uf-caution-tooltip uf-pull-left" data-ng-if="(preform.CONTROLTYPE | uppercase) == 'TEXTBOX' && (preform.CONTROLNAME | uppercase) != 'COUNTRYCODEONE'" data-ng-click="ClearCustAttr(preform.ATTRIBUTEMAPPING, preform.CONTROLTYPE)" data-ng-show="((PreChatForm.{{preform.CONTROLNAME}}.$touched && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (PreChatForm.{{preform.CONTROLNAME}}.$error.pattern)  || (IsPrechatFromValidationFailed && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (preform.CONTROLTYPE == 'TEXTAREA' && (IsBotTextAreaValidationFailed || (IsPrechatFromValidationFailed && PreChatFormValue[preform.ATTRIBUTEMAPPING] == ''))))">
                    <div class="uf-tooltiptext uf-tooltip-left uf-error-msg" data-ng-show="(PreChatForm.{{preform.CONTROLNAME}}.$touched && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (IsPrechatFromValidationFailed && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (preform.CONTROLTYPE == 'TEXTAREA' && (IsBotTextAreaValidationFailed || (IsPrechatFromValidationFailed && PreChatFormValue[preform.ATTRIBUTEMAPPING] == '')))">{{ParseJson(preform.MANDATORYMESSAGE)}}</div>
                    <div class="uf-tooltiptext uf-tooltip-left uf-error-msg" data-ng-show="PreChatForm.{{preform.CONTROLNAME}}.$error.pattern">{{ParseJson(preform.ERRORMESSAGE)}}</div>
                </div>

<div class="uf-caution-tooltip uf-pull-left" data-ng-if="(preform.CONTROLTYPE | uppercase) == 'TEXTBOX' && (preform.CONTROLNAME | uppercase) == 'COUNTRYCODEONE'" data-ng-click="ClearCustAttr(preform.ATTRIBUTEMAPPING, preform.CONTROLTYPE)" data-ng-show="((PreChatForm.{{preform.CONTROLNAME}}.$touched && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (PreChatForm.{{preform.CONTROLNAME}}.$error.pattern)  || (IsPrechatFromValidationFailed && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (preform.CONTROLTYPE == 'TEXTAREA' && (IsBotTextAreaValidationFailed || (IsPrechatFromValidationFailed && PreChatFormValue[preform.ATTRIBUTEMAPPING] == ''))))">
                    <div class="uf-tooltiptext uf-tooltip-right uf-error-msg" data-ng-show="(PreChatForm.{{preform.CONTROLNAME}}.$touched && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (IsPrechatFromValidationFailed && PreChatForm.{{preform.CONTROLNAME}}.$error.required) || (preform.CONTROLTYPE == 'TEXTAREA' && (IsBotTextAreaValidationFailed || (IsPrechatFromValidationFailed && PreChatFormValue[preform.ATTRIBUTEMAPPING] == '')))">{{ParseJson(preform.MANDATORYMESSAGE)}}</div>
                    <div class="uf-tooltiptext uf-tooltip-right uf-error-msg" data-ng-show="PreChatForm.{{preform.CONTROLNAME}}.$error.pattern">{{ParseJson(preform.ERRORMESSAGE)}}</div>
                </div>

<div class="uf-caution-tooltip uf-pull-left" data-ng-show="(preform.CONTROLTYPE | uppercase) == 'DROPDOWN'&& (preform.CONTROLNAME | uppercase) == 'NAMESUFFIX' && (lang == 'en' || lang == 'ar') && NAMESUFFIXFLAG" data-ng-click="ClearCustAttr(preform.ATTRIBUTEMAPPING, preform.CONTROLTYPE)">
                    <div class="uf-tooltiptext uf-tooltip-right uf-error-msg" data-ng-show="NAMESUFFIXFLAG">{{ParseJson(preform.MANDATORYMESSAGE)}}</div>
                </div>
                
            </div>

</div>
    <div class="uf-clear"></div>
    <button id="UnfydPreChatLoginBtn" type="submit" class="uf-yes-btn uf-margin uf-start uf-transition" data-ng-click="UnfydChatLogin(PreChatForm.$valid,'','')">{{ButtonNameConfig.StartChatButtonTitle}}</button>
    <button type="button" class="uf-yes-btn uf-transition" data-ng-click="BackToExistingDiv()" data-ng-show="IsExistingDivVisible">{{ButtonNameConfig.CancelButtonTitle}}</button>
    </form>
</div>
<div class="uf-clear"></div>
</div>
<div class="uf-clear"></div>

<div data-ng-show='Maintenance'>
    <div class="maintenance-img" /><br />
    <div class="maintenance-txt">
        Dear customer, we are upgrading our chat services to serve you better.
        <div class="uf-clear05"></div>
        Therefore services will not be available for the moment.<div class="uf-clear05"></div>we apologies for the inconvenience caused.
    </div>
</div>